:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--page:#121213;--panel:#1a1a1b;--text:#f8f8f8;--muted:#818384;--disabled:#565758;--line:#3a3a3c;--tile-border:#3a3a3c;--tile-filled:#565758;--key:#818384;--absent:#3a3a3c;--present:#b59f3b;--correct:#538d4e;--focus:#6aaa64;--focus-glow:#6aaa6438;--toast-bg:#f8f8f8;--toast-text:#121213;color:var(--text);background:var(--page);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Helvetica Neue,Arial,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%}body{background:var(--page);margin:0}button,input,select{font-family:inherit}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.app{min-height:100svh;color:var(--text);background:var(--page)}.topbar{border-bottom:1px solid var(--line);box-sizing:border-box;grid-template-columns:1fr auto 1fr;align-items:center;height:50px;padding:0 16px;display:grid}.topbar h1{color:var(--text);letter-spacing:0;text-align:center;margin:0;font-family:Georgia,Times New Roman,serif;font-size:2rem;font-weight:700;line-height:1}.topbar-side{align-items:center;gap:4px;display:flex}.topbar-side-left{justify-content:flex-start}.topbar-side-right{justify-content:flex-end}.icon-button{width:36px;height:36px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:4px;place-items:center;transition:color .12s,background-color .12s;display:inline-grid}.icon-button svg{width:22px;height:22px;display:block}.icon-button:hover{color:var(--text);background:var(--key)}.icon-button:focus-visible{outline:2px solid var(--text);outline-offset:2px}.icon-button:disabled{color:var(--disabled);cursor:default;background:0 0}.centered-state{text-align:center;place-content:center;justify-items:center;gap:14px;width:min(100%,420px);min-height:100svh;margin:0 auto;padding:24px;display:grid}.centered-state h1,.centered-state p{margin:0}.centered-state h1{font-family:Georgia,Times New Roman,serif;font-size:2rem}.centered-state p{color:var(--muted);font-size:.95rem;font-weight:700;line-height:1.4}.primary-action{color:#fff;text-transform:uppercase;cursor:pointer;background:#5865f2;border:0;border-radius:4px;height:42px;padding:0 16px;font-size:.88rem;font-weight:900}.game{box-sizing:border-box;grid-template-rows:auto 1fr auto auto;align-items:center;width:min(100%,520px);min-height:calc(100svh - 50px);margin:0 auto;padding:8px 14px 16px;display:grid}.puzzle-meta{min-height:28px;color:var(--muted);text-transform:uppercase;justify-content:center;align-items:center;gap:12px;font-size:.78rem;font-weight:700;display:flex}.puzzle-meta-tag{border:1px solid var(--line);color:var(--muted);letter-spacing:.06em;background:0 0;border-radius:4px;padding:1px 6px;font-size:.64rem;font-weight:700}.toast{z-index:10;min-width:148px;max-width:calc(100vw - 32px);color:var(--toast-text);background:var(--toast-bg);text-align:center;opacity:0;pointer-events:none;border-radius:4px;padding:13px 18px;font-weight:700;transition:opacity .16s,transform .16s;position:fixed;top:68px;left:50%;transform:translate(-50%,-8px)}.toast.visible{opacity:1;transform:translate(-50%)}.board{gap:5px;width:min(350px,100vw - 32px);margin:0 auto;display:grid}.board-row{grid-template-columns:repeat(5,1fr);gap:5px;display:grid}.board-row.shake{animation:.5s shake}.tile{aspect-ratio:1;box-sizing:border-box;text-transform:uppercase;transform-style:preserve-3d;-webkit-user-select:none;user-select:none;font-size:2rem;font-weight:800;line-height:1;position:relative}.tile-face{backface-visibility:hidden;transition:transform .8s ease-in-out;transition-delay:var(--reveal-delay);place-items:center;display:grid;position:absolute;inset:0}.tile-front{border:2px solid var(--tile-border);color:var(--text);background:var(--page);transform:rotateX(0)}.tile-back{color:#fff;background:var(--absent);border:2px solid #0000;transform:rotateX(180deg)}.tile.filled.empty{animation:.1s ease-in pop}.tile.filled.empty .tile-front{border-color:var(--tile-filled)}.tile.absent .tile-back{background:var(--absent)}.tile.present .tile-back{background:var(--present)}.tile.correct .tile-back{background:var(--correct)}.board-row.complete .tile-front{transform:rotateX(180deg)}.board-row.complete .tile-back{transform:rotateX(0)}.board-row.win .tile{animation:bounce .7s ease var(--bounce-delay) both}.keyboard{touch-action:manipulation;gap:8px;width:min(100%,500px);margin:18px auto 0;display:grid}.keyboard-row{justify-content:center;gap:6px;display:flex}.key{color:#fff;background:var(--key);cursor:pointer;-webkit-user-select:none;user-select:none;border:0;border-radius:4px;flex:1 1 0;justify-content:center;align-items:center;min-width:0;max-width:43px;height:58px;padding:0;transition:background-color .24s ease-in-out;display:inline-flex}.key-label{text-transform:uppercase;font-size:1.2rem;font-weight:700;line-height:1}.key-action-label{letter-spacing:.05em;text-transform:uppercase;font-size:.8125rem;font-weight:700;line-height:1}.key.wide{flex:1.5 1 0;max-width:65px}.backspace-icon{width:22px;height:22px;display:block}.key.absent,.key.present,.key.correct{color:#fff}.key.absent{background:var(--absent)}.key.present{background:var(--present)}.key.correct{background:var(--correct)}.peer-rail{z-index:5;gap:10px;width:108px;display:grid;position:fixed;top:64px;left:14px}.peer-rail.peer-rail-empty{display:none}.peer{border:2px solid var(--line);background:#121213eb;border-radius:6px;justify-items:center;gap:6px;min-width:0;padding:8px 7px;transition:border-color .2s;display:grid;position:relative;box-shadow:0 8px 24px #00000038}.peer-playing{border-color:var(--line)}.peer-won{border-color:var(--correct)}.peer-lost{border-color:var(--present)}.peer-header{justify-content:center;align-items:center;gap:4px;min-width:0;max-width:94px;display:flex}.peer-rank{color:#fff;background:var(--correct);letter-spacing:.02em;pointer-events:none;border-radius:999px;place-items:center;min-width:20px;height:20px;padding:0 6px;font-size:.62rem;font-weight:900;display:inline-grid;position:absolute;top:-8px;right:-8px;box-shadow:0 2px 6px #00000059}.peer-name,.peer-status{min-width:0;max-width:94px;color:var(--muted);text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap;font-size:.72rem;font-weight:800;overflow:hidden}.peer-won .peer-status{color:var(--correct)}.peer-lost .peer-status{color:var(--present)}.leaderboard{flex-direction:column;flex:1;min-height:0;display:flex}.leaderboard-tabs{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}.leaderboard-tabs button{border:1px solid var(--line);height:34px;color:var(--muted);background:var(--panel);text-transform:uppercase;cursor:pointer;border-radius:4px;font-size:.76rem;font-weight:900}.leaderboard-tabs button.active{border-color:var(--correct);color:var(--text)}.leaderboard-head{color:var(--muted);letter-spacing:.14em;text-transform:uppercase;border-bottom:1px solid var(--line);margin-top:14px;padding:0 12px 6px;font-size:.62rem;font-weight:900}.leaderboard-list{gap:4px;margin-top:6px;display:grid;overflow-y:auto}.leaderboard-row-daily,.leaderboard-row-all{align-items:center;column-gap:8px;display:grid}.leaderboard-row-daily{grid-template-columns:24px 1fr 64px}.leaderboard-row-all{grid-template-columns:24px 1fr 28px 40px 36px 52px}.leaderboard-row,.empty-row{min-height:36px;color:var(--muted);background:var(--panel);text-transform:uppercase;border-radius:6px;padding:0 12px;font-size:.78rem;font-weight:800}.leaderboard-row{align-items:center}.leaderboard-row strong{min-width:0;color:var(--text);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.leaderboard-row span:not(:first-child),.leaderboard-head span:not(:nth-child(2)){text-align:right}.leaderboard-head span:first-child,.leaderboard-row span:first-child{text-align:left}.empty-row{grid-template-columns:1fr;place-items:center;display:grid}.mini-board{gap:2px;display:grid}.mini-row{grid-template-columns:repeat(5,11px);gap:2px;display:grid}.mini-tile{background:var(--tile-border);width:11px;height:11px}.mini-tile.absent{background:var(--absent)}.mini-tile.present{background:var(--present)}.mini-tile.correct{background:var(--correct)}.mini-tile.filled{background:var(--tile-filled,var(--text))}.mini-row.shake{animation:.4s shake-mini}.spectate-row.shake{animation:.5s shake}.spectate-tile.filled{border:1px solid var(--tile-filled,var(--text));color:var(--text);background:0 0}.dialog-card.dialog-card-spectate{gap:18px;width:min(100%,960px);max-height:min(86svh,760px);padding:22px 26px 26px}.spectate-grid{flex:1;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:22px 18px;min-height:0;padding-right:4px;display:grid;overflow-y:auto}.spectate-player{flex-direction:column;gap:6px;display:flex}.spectate-player-header{justify-content:space-between;align-items:baseline;gap:8px;font-size:.8rem;display:flex}.spectate-name{text-overflow:ellipsis;white-space:nowrap;color:var(--text);font-weight:700;overflow:hidden}.spectate-status{color:var(--text-muted,#888);flex-shrink:0;font-size:.72rem;font-weight:600}.spectate-player-won .spectate-status{color:var(--correct)}.spectate-board{gap:3px;display:grid}.spectate-row{grid-template-columns:repeat(5,1fr);gap:3px;display:grid}.spectate-tile{aspect-ratio:1;color:#fff;background:var(--tile-border);text-transform:uppercase;border-radius:2px;place-items:center;font-size:.82rem;font-weight:800;display:grid}.spectate-tile.empty{border:1px solid var(--tile-border);background:0 0}.spectate-tile.absent{background:var(--absent)}.spectate-tile.present{background:var(--present)}.spectate-tile.correct{background:var(--correct)}.archive-actions{flex-shrink:0;grid-template-columns:repeat(2,1fr);gap:8px;display:grid}.archive-actions button{height:40px;color:var(--text);background:var(--key);letter-spacing:.05em;text-transform:uppercase;cursor:pointer;border:0;border-radius:4px;font-size:.78rem;font-weight:900;transition:filter .12s}.archive-actions button:hover{filter:brightness(1.1)}.archive-search{border:1px solid var(--line);width:100%;min-height:48px;color:var(--text);background:var(--panel);appearance:none;border-radius:4px;flex-shrink:0;padding:0 14px;font-size:1rem;font-weight:400;line-height:normal;transition:border-color .12s,box-shadow .12s}.archive-search::-webkit-search-decoration{appearance:none}.archive-search::-webkit-search-cancel-button{appearance:none}.archive-search::placeholder{color:var(--muted);font-weight:400}.archive-search:focus{border-color:var(--focus);box-shadow:0 0 0 2px var(--focus-glow);outline:none}.archive-search-hint{color:var(--muted);flex-shrink:0;margin:0;font-size:.72rem;font-weight:600;line-height:1.4}.archive-list-wrap{flex:1;width:calc(100% + 12px);min-height:0;margin-right:-12px;overflow:hidden}.archive-list-scroll{box-sizing:content-box;scrollbar-width:thin;scrollbar-color:color-mix(in srgb, var(--muted) 80%, transparent) transparent;width:calc(100% - 12px);height:100%;padding-right:12px;overflow:hidden auto}.archive-list-scroll:hover{scrollbar-color:var(--muted) transparent}.archive-list-scroll::-webkit-scrollbar{width:10px}.archive-list-scroll::-webkit-scrollbar-track{background:0 0}.archive-list-scroll::-webkit-scrollbar-thumb{background-color:color-mix(in srgb, var(--muted) 80%, transparent);background-clip:padding-box;border:2px solid #0000;border-radius:999px}.archive-list-scroll::-webkit-scrollbar-thumb:hover{background-color:var(--muted);background-clip:padding-box}.archive-list-scroll::-webkit-scrollbar-thumb:active{background-color:var(--muted);background-clip:padding-box}.archive-list{box-sizing:border-box;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));align-content:start;gap:6px;width:100%;padding:4px 0;display:grid}.archive-item{border:1px solid var(--line);height:60px;color:var(--text);background:var(--panel);font:inherit;cursor:pointer;border-radius:6px;flex-direction:column;justify-content:center;align-items:center;gap:2px;padding:4px 6px;transition:border-color .12s,transform .12s;display:flex}.archive-item:hover{border-color:var(--correct);transform:translateY(-1px)}.archive-item.selected{border-color:var(--correct);background:color-mix(in srgb, var(--correct) 14%, var(--panel))}.archive-num{font-size:.9rem;font-weight:900}.archive-date{letter-spacing:.02em;color:var(--muted);text-align:center;font-size:.6rem;font-weight:700}.archive-empty{color:var(--muted);text-align:center;grid-column:1/-1;margin:0;padding:28px 12px;font-size:.82rem;font-weight:600;line-height:1.45}.dialog-layer{z-index:30;opacity:0;pointer-events:none;place-items:center;padding:16px;transition:opacity .2s;display:grid;position:fixed;inset:0}.dialog-layer.open{opacity:1;pointer-events:auto}.dialog-backdrop{cursor:pointer;background:#0000008c;border:0;position:absolute;inset:0}.dialog-card{border:1px solid var(--line);width:min(100%,460px);max-height:min(82svh,640px);color:var(--text);background:var(--page);will-change:transform;border-radius:12px;flex-direction:column;gap:14px;padding:18px 20px 20px;transition:transform .22s cubic-bezier(.2,.8,.2,1);display:flex;position:relative;overflow:hidden;transform:translateY(8px)scale(.98);box-shadow:0 24px 60px #00000073}.dialog-card-wide{width:min(100%,540px);height:min(82svh,640px)}.dialog-card-confirm{width:min(100%,380px);max-height:none}.dialog-layer.open .dialog-card{transform:translateY(0)scale(1)}.dialog-header{flex-shrink:0;justify-content:space-between;align-items:center;gap:12px;display:flex}.dialog-header h2{letter-spacing:.18em;text-transform:uppercase;margin:0;font-size:.78rem;font-weight:900}.dialog-close{width:32px;height:32px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:4px;place-items:center;transition:color .12s,background-color .12s;display:inline-grid}.dialog-close svg{width:18px;height:18px}.dialog-close:hover{color:var(--text);background:var(--key)}.dialog-body{color:var(--muted);margin:0;font-size:.92rem;line-height:1.45}.dialog-actions{grid-template-columns:1fr 1fr;gap:10px;margin-top:4px;display:grid}.dialog-secondary,.dialog-primary{height:42px;font:inherit;letter-spacing:.05em;text-transform:uppercase;cursor:pointer;border:0;border-radius:6px;font-size:.82rem;font-weight:900;transition:filter .12s,background-color .12s}.dialog-secondary{color:var(--text);background:var(--key)}.dialog-secondary:hover{background:var(--line)}.dialog-primary{color:#fff;background:var(--correct)}.dialog-primary:hover{filter:brightness(1.08)}@keyframes pop{0%{opacity:.85;transform:scale(.82)}50%{transform:scale(1.08)}to{opacity:1;transform:scale(1)}}@keyframes bounce{0%,20%{transform:translateY(0)}40%{transform:translateY(-26px)}50%{transform:translateY(4px)}60%{transform:translateY(-12px)}80%{transform:translateY(2px)}to{transform:translateY(0)}}@keyframes shake{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-4px)}40%,60%{transform:translate(4px)}}@keyframes shake-mini{25%{transform:translate(-1px)}50%{transform:translate(1px)}75%{transform:translate(-1px)}}@media (width<=420px){.topbar{grid-template-columns:1fr auto 1fr;padding:0 8px}.topbar h1{font-size:1.48rem}.topbar-side{gap:2px}.icon-button{width:34px;height:34px}.icon-button svg{width:20px;height:20px}.game{padding-inline:8px}.tile{font-size:1.75rem}.keyboard-row{gap:5px}.key{max-width:36px;height:52px}.key-label{font-size:1.05rem}.key-action-label{letter-spacing:.04em;font-size:.72rem}.key.wide{max-width:54px}.backspace-icon{width:18px;height:18px}}@media (width>=761px){.game{width:min(100%,clamp(520px,50vw,760px));padding-bottom:clamp(16px,2.6vw,48px)}.board{gap:clamp(5px,.5vw,8px);width:min(100vw - 32px,clamp(350px,38vw,520px),64svh)}.board-row{gap:clamp(5px,.5vw,8px)}.tile{font-size:clamp(2rem,2.4vw,3rem)}.tile-front,.tile-back{border-width:clamp(2px,.2vw,3px)}.keyboard{gap:clamp(8px,.85vw,12px);width:min(100%,clamp(500px,48vw,720px));margin-top:clamp(18px,1.8vw,28px)}.keyboard-row{gap:clamp(6px,.6vw,10px)}.key{border-radius:clamp(4px,.4vw,6px);max-width:clamp(43px,4.4vw,62px);height:clamp(58px,5.4vw,84px)}.key.wide{max-width:clamp(65px,6.6vw,92px)}.key-label{font-size:clamp(1.2rem,1.4vw,1.75rem)}.key-action-label{font-size:clamp(.8125rem,1vw,1.1rem)}.topbar{height:clamp(50px,4.2vw,64px)}.topbar h1{font-size:clamp(2rem,2.4vw,2.6rem)}.puzzle-meta{font-size:clamp(.78rem,.9vw,.95rem)}.icon-button{width:clamp(36px,2.8vw,44px);height:clamp(36px,2.8vw,44px)}.icon-button svg{width:clamp(22px,1.7vw,26px);height:clamp(22px,1.7vw,26px)}.dialog-card{border-radius:clamp(12px,1vw,16px);gap:clamp(14px,1.2vw,18px);width:min(100%,clamp(460px,38vw,600px));max-height:min(82svh,clamp(640px,70svh,800px));padding:clamp(18px,1.6vw,24px) clamp(20px,1.8vw,28px)}.dialog-card.dialog-card-wide{width:min(100%,clamp(540px,44vw,700px));height:min(82svh,clamp(640px,70svh,800px))}.dialog-card.dialog-card-confirm{width:min(100%,clamp(380px,30vw,480px))}.dialog-header h2{font-size:clamp(.78rem,.88vw,.95rem)}.dialog-close{width:clamp(32px,2.4vw,40px);height:clamp(32px,2.4vw,40px)}.dialog-close svg{width:clamp(18px,1.3vw,22px);height:clamp(18px,1.3vw,22px)}.dialog-body{font-size:clamp(.92rem,1vw,1.05rem)}.dialog-secondary,.dialog-primary{height:clamp(42px,3.4vw,52px);font-size:clamp(.82rem,.95vw,1rem)}.leaderboard-tabs button{height:clamp(34px,2.8vw,42px);font-size:clamp(.76rem,.85vw,.92rem)}.leaderboard-head{font-size:clamp(.62rem,.7vw,.74rem)}.leaderboard-row,.empty-row{min-height:clamp(36px,2.8vw,44px);font-size:clamp(.78rem,.88vw,.94rem)}.archive-actions button{height:clamp(40px,3.2vw,48px);font-size:clamp(.78rem,.88vw,.92rem)}.archive-search{font-size:clamp(1rem,1vw,1.1rem)}.archive-item{font-size:clamp(.78rem,.88vw,.94rem)}.archive-num{font-size:clamp(.74rem,.82vw,.88rem)}.spectate-name{font-size:clamp(.9rem,1vw,1.05rem)}.spectate-status{font-size:clamp(.75rem,.85vw,.9rem)}.spectate-tile{font-size:clamp(.82rem,1.1vw,1.1rem)}}@media (width<=760px){.app{flex-direction:column;height:100svh;min-height:0;display:flex;overflow:hidden}.topbar{flex-shrink:0}.peer-rail{flex-wrap:wrap;flex-shrink:0;justify-content:center;align-items:center;gap:6px;width:min(360px,100vw - 24px);min-height:86px;margin:12px auto 0;padding:0;display:flex;position:static}.peer-rail.peer-rail-empty{display:flex}.peer{box-sizing:border-box;width:70px;box-shadow:none;flex:0 0 70px;gap:3px;padding:4px 5px}.peer-header{gap:3px;max-width:60px}.peer-name{max-width:60px;font-size:.58rem}.peer-status{display:none}.peer-rank{min-width:16px;height:16px;padding:0 4px;font-size:.55rem;top:-6px;right:-6px}.mini-row{grid-template-columns:repeat(5,7px);gap:1.5px}.mini-tile{width:7px;height:7px}.puzzle-meta{display:none}.game{flex:1;grid-template-rows:auto 1fr auto;align-items:stretch;min-height:0;padding:10px 14px 14px}.board{grid-row:1;justify-self:center}.keyboard{grid-row:3;margin-top:0}.dialog-layer:has(.dialog-card-spectate){place-items:end stretch;padding:0}.dialog-card.dialog-card-spectate{border-radius:16px 16px 0 0;width:100%;max-width:none;max-height:86svh;padding:16px 14px 20px;transform:translateY(100%)scale(1)}.dialog-layer.open .dialog-card.dialog-card-spectate{transform:translateY(0)scale(1)}.spectate-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:14px 10px}}
