:root{color-scheme:dark;--sait: var(--discord-safe-area-inset-top, env(safe-area-inset-top, 0px));--saib: var(--discord-safe-area-inset-bottom, env(safe-area-inset-bottom, 0px));--sail: var(--discord-safe-area-inset-left, env(safe-area-inset-left, 0px));--sair: var(--discord-safe-area-inset-right, env(safe-area-inset-right, 0px));--brand-cell-size: clamp(22px, 6vmin, 32px);--bg: #121213;--surface: #1a1a1b;--border: #3a3a3c;--text: #ffffff;--muted: #818384;--correct: #3eaa42;--partial: #cd8729;--incorrect: #3a3a3c;--key: #818384;--key-text: #ffffff;--gap: clamp(3px, 1vmin, 6px);--chrome: 150px;--cell-size: max( 20px, min( 56px, calc((100vh - var(--chrome) - 5 * var(--gap)) / 8.7), calc((100vw - 24px - 4 * var(--gap)) / 5) ) );--key-height: min(52px, calc(var(--cell-size) * .92));--key-min-width: max(22px, calc(var(--cell-size) * .58));font-family:Segoe UI,system-ui,sans-serif}@supports (height: 100dvh){:root{--cell-size: max( 20px, min( 56px, calc((100dvh - var(--chrome) - 5 * var(--gap)) / 8.7), calc((100vw - 24px - 4 * var(--gap)) / 5) ) )}}*{box-sizing:border-box}html{height:100%}body{margin:0;min-height:100vh;min-height:100dvh;background:var(--bg);color:var(--text);display:flex;justify-content:center;overflow-y:auto}#app{width:min(100%,520px);min-height:100vh;min-height:100dvh;padding-top:max(clamp(8px,2vmin,16px),var(--sait));padding-right:max(12px,var(--sair));padding-bottom:max(clamp(12px,3vmin,24px),var(--saib));padding-left:max(12px,var(--sail));display:grid;grid-template-rows:auto auto 1fr auto auto 1fr auto;align-items:center;justify-items:center;gap:clamp(4px,1.5vmin,12px)}.header{grid-row:1;text-align:center}.status{grid-row:2;flex-shrink:0}.grid{grid-row:4;display:flex;flex-direction:column;gap:var(--gap);margin-top:clamp(2px,1vmin,8px);flex-shrink:0;min-height:calc(6 * var(--cell-size) + 5 * var(--gap))}.message{grid-row:5;min-height:1.2em;font-weight:600;font-size:clamp(.75rem,2.5vmin,1rem)}.message[hidden]{display:block;visibility:hidden}.keyboard{grid-row:7;width:100%;display:flex;flex-direction:column;gap:var(--gap);align-self:stretch}.row{display:flex;gap:var(--gap)}.cell{width:var(--cell-size);height:var(--cell-size);perspective:600px}.cell-inner{position:relative;width:100%;height:100%;transform-style:preserve-3d}.cell.revealed .cell-inner{transform:rotateX(180deg)}.cell.flip .cell-inner{animation:flip-reveal .5s ease forwards;animation-delay:var(--flip-delay, 0ms)}.cell-face{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;backface-visibility:hidden;border:2px solid var(--border);font-size:clamp(.9rem,calc(var(--cell-size) * .55),1.6rem);font-weight:700;text-transform:uppercase}.cell-front{transform:rotateX(0)}.cell-back{transform:rotateX(180deg)}.cell.filled .cell-front{border-color:#565758;animation:pop .08s ease}.cell-back.correct{background:var(--correct);border-color:var(--correct);color:#fff}.cell-back.partial{background:var(--partial);border-color:var(--partial);color:#fff}.cell-back.incorrect{background:var(--incorrect);border-color:var(--incorrect);color:#fff}@keyframes pop{0%{transform:scale(1)}50%{transform:scale(1.08)}to{transform:scale(1)}}@keyframes flip-reveal{0%{transform:rotateX(0)}50%{transform:rotateX(-90deg)}to{transform:rotateX(-180deg)}}.message.error{color:#ff6b6b}.message.success{color:var(--correct)}.brand-grid{display:flex;gap:var(--gap);justify-content:center}.brand-cell{width:var(--brand-cell-size);height:var(--brand-cell-size);display:grid;place-items:center;border:2px solid var(--border);font-size:clamp(.7rem,calc(var(--brand-cell-size) * .55),1.2rem);font-weight:700}.header p,.status{margin:4px 0 0;color:var(--muted);font-size:clamp(.75rem,2.5vmin,.9rem)}.kb-row{display:flex;justify-content:center;gap:var(--gap);flex-wrap:nowrap}.key{-webkit-appearance:none;-moz-appearance:none;appearance:none;touch-action:manipulation;min-width:var(--key-min-width);height:var(--key-height);padding:0 clamp(4px,1vmin,10px);border:none;border-radius:4px;background:var(--key);color:var(--key-text);font-size:clamp(.6rem,calc(var(--cell-size) * .24),.85rem);font-weight:700;cursor:pointer;text-transform:uppercase}.key.wide{min-width:max(44px,calc(var(--cell-size) * 1.4));font-size:clamp(.55rem,calc(var(--cell-size) * .2),.75rem)}.key.correct{background:var(--correct)}.key.partial{background:var(--partial)}.key.incorrect{background:var(--incorrect);color:#fffa}.key:disabled{opacity:.45;cursor:not-allowed}body.discord-mobile.discord-embedded:not(.layout-compact) #app{padding-top:max(48px,var(--sait))}body.discord-embedded.discord-mobile:not(.layout-compact){overflow:hidden;--chrome: 198px;--cell-size: max( 20px, min( 50px, calc((100dvh - var(--chrome) - 5 * var(--gap)) / 8.7), calc((100vw - 24px - 4 * var(--gap)) / 5) ) )}body.discord-embedded.discord-mobile:not(.layout-compact) #app{min-height:0;height:100%;grid-template-rows:auto auto minmax(0,1fr) auto auto;gap:4px;padding-bottom:max(8px,var(--saib))}body.discord-embedded.discord-mobile:not(.layout-compact) .header{grid-row:1}body.discord-embedded.discord-mobile:not(.layout-compact) .status{grid-row:2}body.discord-embedded.discord-mobile:not(.layout-compact) .grid{grid-row:3;margin-top:0;align-self:center}body.discord-embedded.discord-mobile:not(.layout-compact) .message{grid-row:4}body.discord-embedded.discord-mobile:not(.layout-compact) .keyboard{grid-row:5;align-self:stretch}html.discord-embedded,body.discord-embedded{height:100%}body.discord-embedded:not(.discord-mobile){overflow:hidden;--chrome: 132px;--brand-cell-size: clamp(20px, 5vmin, 28px);--cell-size: max( 20px, min( 50px, calc((100dvh - var(--chrome) - 5 * var(--gap)) / 8.7), calc((100vw - 24px - 4 * var(--gap)) / 5) ) )}body.discord-embedded:not(.discord-mobile) #app{min-height:0;height:100%;grid-template-rows:auto auto auto auto auto;gap:4px;padding-top:clamp(8px,2vmin,16px);padding-bottom:8px}body.discord-embedded:not(.discord-mobile) .header p{display:none}body.discord-embedded:not(.discord-mobile) .header{grid-row:1}body.discord-embedded:not(.discord-mobile) .status{grid-row:2}body.discord-embedded:not(.discord-mobile) .grid{grid-row:3;margin-top:0}body.discord-embedded:not(.discord-mobile) .message{grid-row:4}body.discord-embedded:not(.discord-mobile) .keyboard{grid-row:5}@media(max-width:520px){#app{gap:8px}}@media(max-height:520px){:root{--chrome: 100px}.header p{display:none}}@media(max-height:400px){:root{--chrome: 72px}:root{--brand-cell-size: 22px}.status{font-size:.7rem}}body.layout-compact .header,body.layout-compact .status,body.layout-compact #keyboard,body.layout-compact #message{display:none}body.layout-compact .cell-face{color:transparent}body.layout-compact .grid{min-height:0;margin-top:0}body.layout-compact.discord-embedded{overflow:hidden;min-height:0!important;height:100%}html.discord-embedded:has(body.layout-compact){height:100%;min-height:0!important;overflow:hidden}body.layout-compact.discord-embedded #app{height:100%;min-height:0!important;width:100%;max-width:none;grid-template-rows:1fr;align-items:center;justify-items:center;padding:4px 8px;gap:0}body.layout-compact.discord-embedded .grid{grid-row:1;align-self:center}body.layout-compact:not(.discord-embedded) #app{height:100dvh;min-height:0!important;grid-template-rows:1fr;align-items:center;justify-items:center;padding:4px 8px;gap:0}body.layout-compact:not(.discord-embedded) .grid{grid-row:1}body.is-booting #app{visibility:hidden}.boot{--boot-cell-size: max( 20px, min(56px, calc((100vw - 48px - 4 * var(--gap)) / 5)) );position:fixed;top:0;right:0;bottom:0;left:0;z-index:10;display:grid;place-items:center;background:var(--bg);padding:max(clamp(12px,3vmin,24px),var(--sait)) max(16px,var(--sair)) max(clamp(12px,3vmin,24px),var(--saib)) max(16px,var(--sail));opacity:1;transition:opacity .3s ease}.boot.is-leaving{opacity:0;pointer-events:none}.boot-inner{width:min(100%,360px);display:flex;flex-direction:column;align-items:center;gap:clamp(16px,4vmin,28px);text-align:center}.boot-grid{display:flex;gap:var(--gap)}.boot-cell{width:var(--boot-cell-size);height:var(--boot-cell-size);display:grid;place-items:center;border:2px solid var(--border);font-size:clamp(1rem,calc(var(--boot-cell-size) * .55),1.75rem);font-weight:700}.boot-cell span{opacity:.3;animation:boot-letter 1.4s ease-in-out infinite;animation-delay:calc(var(--i) * .14s)}.boot-message{margin:0;color:var(--muted);font-size:clamp(.8rem,2.5vmin,.95rem)}.boot-message-error{color:#ff6b6b}@keyframes boot-letter{0%,to{opacity:.3;transform:scale(.96)}50%{opacity:1;transform:scale(1.06)}}body.layout-compact .boot{--boot-cell-size: max( 20px, min(44px, calc((100vw - 32px - 4 * var(--gap)) / 5)) )}@media(max-height:520px){.boot-inner{gap:clamp(10px,3vmin,16px)}}