.Button{background-color:var(--primary-color);color:var(--text-color-light);font-family:var(--regular-font);border-radius:var(--border-radius);transition:background-color var(--transition-duration);cursor:pointer;border:none;align-self:center;padding:10px 20px;font-size:2em;font-weight:700}.Button--shadow{box-shadow:2px 2px 4px var(--shadow-color)}.Button--fadeIn{animation:var(--transition-duration) buttonPopIn ease-out}@keyframes buttonPopIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.Button--primary{background-color:var(--primary-color)}.Button--secondary{background-color:var(--secondary-color)}.Button--transparent{background-color:#0000}.Button--primary:hover{background-color:var(--primary-hover-color)}.Button--secondary:hover{background-color:var(--secondary-hover-color)}.HamburgerMenu{position:relative}.HamburgerMenuDropdown{border-radius:var(--border-radius);background:var(--primary-color);border:var(--outline-width) solid var(--primary-hover-color);z-index:1000;box-shadow:4px 4px 8px var(--shadow-color);transform-origin:100% 0;transition:opacity var(--transition-duration) ease-out, transform var(--transition-duration) ease-out;opacity:0;pointer-events:none;flex-direction:column;align-items:stretch;width:max-content;display:flex;position:absolute;top:100%;right:0;transform:translateY(-8px)scaleY(.9)}.HamburgerMenuDropdown--open{opacity:1;pointer-events:auto;transform:translateY(0)scaleY(1)}.HamburgerMenuDropdownRow{display:flex}.HamburgerMenuDropdownRow>*{flex:1}.TextBlock{color:var(--text-color-light);font-family:var(--regular-font);font-size:1.6em}.TextBlock--1{font-size:3.6em}.TextBlock--2{font-size:3.2em}.TextBlock--3{font-size:2.8em}.TextBlock--4{font-size:2.4em}.TextBlock--5{font-size:2em}.TextBlock--6{font-size:1.6em}.HeaderBarContainer{background:linear-gradient(90deg, var(--surface-color) 0%, var(--primary-color) 100%);box-shadow:4px 4px 8px var(--shadow-color);flex-direction:row;align-items:center;column-gap:20px;padding:15px 20px;display:flex}.HeaderBarRight{margin-left:auto}.HeaderBarLeft{flex-direction:column;justify-content:center;align-items:flex-start;display:flex}.HeaderBar{color:var(--text-color-light);font-family:var(--regular-font)}.TableContainer{font-family:var(--regular-font);color:var(--text-color-light);background-color:var(--primary-color);border-radius:var(--border-radius);border-top:var(--outline-width) solid var(--primary-hover-color);border-bottom:var(--outline-width) solid var(--primary-hover-color);box-shadow:4px 4px 8px var(--shadow-color);animation:tablePopIn var(--transition-duration) ease-out;flex-direction:column;display:flex;overflow:hidden}@keyframes tablePopIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.TableHeader{border-top:1px solid var(--primary-hover-color);flex-direction:row;padding:10px;font-size:2em;font-weight:700;display:flex}.TableRow{border-top:1px solid var(--primary-hover-color);flex-direction:row;padding:10px;font-size:1.6em;display:flex}.TableCell{text-align:center;flex:1}.AlertContainer{border-radius:var(--border-radius);border-top:var(--outline-width) solid var(--primary-hover-color);border-bottom:var(--outline-width) solid var(--primary-hover-color);box-shadow:4px 4px 8px var(--shadow-color);padding:10px;animation:.5s ease-out alertPopIn}@keyframes alertPopIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.Alert--success{background-color:var(--success-color)}.Alert--warning{background-color:var(--warning-color)}.Alert--error{background-color:var(--error-color)}.HomePageRow{flex-direction:row;justify-content:center;column-gap:1.6em;display:flex}.GameTextInput{color:var(--text-color-dark);border-radius:var(--border-radius);text-align:center;outline:var(--outline-width) solid var(--primary-hover-color);box-shadow:4px 4px 8px var(--shadow-color);font-size:1.6em;font-family:var(--regular-font);border:none;padding:10px}.PopUpContainer{background-color:var(--surface-color);outline:var(--outline-width) solid var(--primary-hover-color);border-radius:var(--border-radius);box-shadow:4px 4px 8px var(--shadow-color);flex-direction:column;padding:10px;animation:.5s ease-out popUpPopIn;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}@keyframes popUpPopIn{0%{opacity:0;transform:translate(-50%,-50%)scale(.95)}to{opacity:1;transform:translate(-50%,-50%)scale(1)}}.PopUpRow{flex-direction:row;flex:1;justify-content:center;column-gap:10px;padding:5px;display:flex}.WordGrid{outline:var(--outline-width) solid var(--primary-hover-color);border-radius:var(--border-radius);box-shadow:4px 4px 8px var(--shadow-color);animation:.5s ease-out wordGridPopIn;position:relative;overflow:hidden}@keyframes wordGridPopIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.ControlRow{flex-direction:row;justify-content:center;column-gap:10px;display:flex}.GameRow{color:var(--text-color-light);font-family:var(--regular-font);flex-direction:row;font-size:1.6em;display:flex}.WordCell{text-align:center;background-color:var(--primary-color);width:20%;transition:background-color var(--transition-duration);padding:10px}.WordCell--guessed{background-color:var(--secondary-color);font-weight:700}.WordCell--incorrect{background-color:var(--error-color);font-weight:700}.DefinitionCell{background-color:var(--primary-color);border-left:var(--outline-width) solid var(--primary-hover-color);text-wrap:nowrap;text-overflow:ellipsis;width:100%;padding:10px;overflow:hidden}.TextInput{font-family:var(--regular-font);border-radius:var(--border-radius);outline:var(--outline-width) solid var(--primary-hover-color);box-shadow:4px 4px 4px var(--shadow-color);border:none;width:100%;padding:10px;font-size:1.6em}.TextInput--password{padding-right:45px}.TextInputContainer{display:flex;position:relative}.TextInputContainer .Button{padding:3px 5px 0;position:absolute;inset:0 0 0 auto}.TextInputContainer .Button img{width:30px;height:30px}.FormContainer{background:var(--primary-color);border:var(--outline-width) solid var(--primary-hover-color);border-radius:var(--border-radius);font-family:var(--regular-font);box-shadow:4px 4px 8px var(--shadow-color);animation:var(--transition-duration) authFormPopIn ease-out;flex-direction:column;align-items:center;padding:0 5vw;display:flex;overflow:hidden}@keyframes authFormPopIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.FormContents{width:100%}.FormHeader{border-bottom:var(--outline-width) solid var(--primary-hover-color);padding:10px}.FormRow{color:var(--text-color-light);flex-direction:row;justify-content:center;align-items:center;padding:10px;display:flex}.FormRow>*{flex:1}.App{flex-direction:column;display:flex}.PageContent{flex-direction:column;gap:16px;margin:16px 5vw;display:flex}body{background:var(--background-color);margin:0;font-size:62.5%}:root{--background-color:#061c33;--surface-color:#0c3966;--primary-color:#1563b2;--primary-hover-color:#63a5e8;--secondary-color:#15b266;--secondary-hover-color:#63e8a8;--success-color:#3e842e;--warning-color:#84802e;--error-color:#842e39;--text-color-light:#fff;--text-color-dark:#000;--shadow-color:#000c;--transition-duration:.5s;--border-radius:10px;--outline-width:3px;--regular-font:"Verdana"}
