:root{--bg:#faf8f3;--fg:#1f1d1a;--muted:#77726a;--line:#e2ddd2;--tile-border:#d3cdc0;--tile-filled:#8c8579;--key:#e4dfd4;--key-fg:#1f1d1a;--correct:#3d8b5a;--present:#d4a033;--absent:#8a857c;--on-mark:#fff;--sheet:#fff;--shadow:0 10px 40px #0000002e;--toast-bg:#1f1d1a;--toast-fg:#faf8f3;--tile-size:min(62px, calc((100vw - 48px) / 5), calc((100dvh - 330px) / 6));--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}:root[data-theme=dark]{--bg:#141518;--fg:#ece9e2;--muted:#9a958c;--line:#2b2c31;--tile-border:#393a40;--tile-filled:#66676e;--key:#4a4b52;--key-fg:#ece9e2;--correct:#489a64;--present:#c3922c;--absent:#36373c;--sheet:#1d1e22;--toast-bg:#ece9e2;--toast-fg:#141518;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}:root[data-contrast=true]{--correct:#f0782a;--present:#3d9ce0}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--fg);-webkit-tap-highlight-color:transparent;flex-direction:column;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,sans-serif;display:flex}button{font:inherit;color:inherit}.topbar{border-bottom:1px solid var(--line);grid-template-columns:1fr auto 1fr;align-items:center;height:56px;padding:0 12px;display:grid}.topbar-right{justify-self:end;gap:4px;display:flex}.brand{letter-spacing:.02em;margin:0;font-family:Iowan Old Style,Palatino Linotype,Palatino,Georgia,serif;font-size:30px;font-weight:700}.icon-btn{color:inherit;cursor:pointer;background:0 0;border:0;border-radius:10px;place-items:center;width:40px;height:40px;display:grid}.brand-mode{letter-spacing:.08em;text-transform:uppercase;vertical-align:middle;background:var(--present);color:var(--on-mark);border-radius:999px;margin-left:8px;padding:3px 7px;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:12px;font-weight:700;display:none}:root[data-mode=unlimited] .brand-mode{display:inline-block}.icon-btn .to-daily,:root[data-mode=unlimited] .icon-btn .to-unlimited{display:none}:root[data-mode=unlimited] .icon-btn .to-daily{display:block}.icon-btn:hover{background:var(--line)}.icon-btn svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:24px;height:24px}.icon-btn svg .dot{fill:currentColor}.game{flex-direction:column;flex:1;justify-content:space-between;align-items:center;width:100%;max-width:500px;min-height:0;margin:0 auto;padding:16px 8px 8px;display:flex}.board{flex:1;align-content:center;gap:6px;display:grid}.row{grid-template-columns:repeat(5, var(--tile-size));gap:6px;display:grid}.tile{width:var(--tile-size);height:var(--tile-size);border:2px solid var(--tile-border);font-size:calc(var(--tile-size) * .52);text-transform:uppercase;-webkit-user-select:none;user-select:none;border-radius:6px;place-items:center;font-weight:700;display:grid}.tile[data-state=tbd]{border-color:var(--tile-filled);animation:.1s ease-out pop}.tile[data-state=correct],.tile[data-state=present],.tile[data-state=absent]{color:var(--on-mark);border-color:#0000}.tile[data-state=correct]{background:var(--correct)}.tile[data-state=present]{background:var(--present)}.tile[data-state=absent]{background:var(--absent)}.tile.flip{animation:.5s ease-in-out both flip}.row.shake{animation:.5s shake}.tile.bounce{animation:.9s ease-in-out bounce}@keyframes pop{50%{transform:scale(1.1)}}@keyframes flip{50%{transform:rotateX(90deg)}}@keyframes shake{10%,90%{transform:translate(-2px)}20%,80%{transform:translate(4px)}30%,50%,70%{transform:translate(-6px)}40%,60%{transform:translate(6px)}}@keyframes bounce{0%,20%,60%,to{transform:translateY(0)}40%{transform:translateY(-24px)}80%{transform:translateY(-8px)}}.keyboard{-webkit-user-select:none;user-select:none;gap:8px;width:100%;padding-top:12px;display:grid}.key-row{justify-content:center;gap:6px;display:flex}.key{background:var(--key);max-width:44px;height:56px;color:var(--key-fg);text-transform:uppercase;cursor:pointer;touch-action:manipulation;border:0;border-radius:6px;flex:1;font-size:15px;font-weight:700;transition:background-color .15s}.key.wide{flex:1.5;max-width:68px;font-size:12px}.key svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linejoin:round;vertical-align:middle;width:22px;height:22px}.key[data-state=correct],.key[data-state=present],.key[data-state=absent]{color:var(--on-mark)}.key[data-state=correct]{background:var(--correct)}.key[data-state=present]{background:var(--present)}.key[data-state=absent]{background:var(--absent)}.toasts{pointer-events:none;z-index:10;background:0 0;border:0;justify-items:center;gap:8px;margin:0;padding:0;display:grid;position:fixed;inset:72px auto auto 50%;overflow:visible;transform:translate(-50%)}.toast{background:var(--toast-bg);color:var(--toast-fg);text-align:center;border-radius:8px;max-width:calc(100vw - 32px);padding:12px 16px;font-size:14px;font-weight:700;transition:opacity .3s}.toast.hide{opacity:0}.sheet{background:var(--sheet);width:min(480px,100vw - 32px);max-height:calc(100dvh - 48px);color:var(--fg);box-shadow:var(--shadow);border:0;border-radius:12px;padding:24px 24px 28px}.sheet::backdrop{background:#00000073}.sheet[open]{animation:.2s ease-out rise}@keyframes rise{0%{opacity:0;transform:translateY(24px)}}.sheet h2{margin:0 0 16px;font-family:Iowan Old Style,Palatino Linotype,Palatino,Georgia,serif;font-size:26px}.sheet h3{margin:20px 0 8px;font-size:15px}.sheet .lead{font-size:18px}.sheet ul{padding-left:20px;line-height:1.5}.sheet .muted{color:var(--muted);border-top:1px solid var(--line);margin-top:20px;padding-top:16px}.close{cursor:pointer;background:0 0;border:0;border-radius:8px;width:36px;height:36px;font-size:26px;line-height:1;position:absolute;top:12px;right:12px}.close:hover{background:var(--line)}.example{--tile-size:40px;grid-template-columns:repeat(5, var(--tile-size));gap:4px;margin-top:12px;display:grid}.example+p{margin:8px 0 0}.stat-row{text-align:center;grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.stat-row strong{font-size:34px;font-weight:600;display:block}.stat-row span{color:var(--muted);font-size:12px}.dist{gap:4px;display:grid}.dist-row{grid-template-columns:14px 1fr;align-items:center;gap:8px;font-size:14px;font-weight:600;display:grid}.dist-bar{background:var(--absent);min-width:28px;color:var(--on-mark);text-align:right;border-radius:3px;padding:2px 8px}.dist-bar.current{background:var(--correct)}.stats-footer{border-top:1px solid var(--line);justify-content:space-between;align-items:center;gap:16px;margin-top:24px;padding-top:20px;display:flex}.countdown span{color:var(--muted);font-size:13px;display:block}.countdown strong{font-variant-numeric:tabular-nums;font-size:28px}.share-btn{background:var(--correct);color:var(--on-mark);cursor:pointer;border:0;border-radius:999px;padding:14px 28px;font-size:16px;font-weight:700}.share-btn.secondary{color:var(--fg);box-shadow:inset 0 0 0 2px var(--tile-border);background:0 0}.answer-reveal{text-align:center;color:var(--muted);margin:-4px 0 20px}.answer-reveal strong{color:var(--fg);letter-spacing:.15em;text-transform:uppercase}.setting{border-bottom:1px solid var(--line);cursor:pointer;justify-content:space-between;align-items:center;gap:16px;padding:14px 0;display:flex}.setting small{color:var(--muted);margin-top:2px;font-size:13px;display:block}.setting input{appearance:none;background:var(--tile-border);cursor:pointer;border-radius:999px;flex:none;width:44px;height:26px;transition:background-color .15s;position:relative}.setting input:after{content:"";background:#fff;border-radius:50%;width:20px;height:20px;transition:transform .15s;position:absolute;top:3px;left:3px}.setting input:checked{background:var(--correct)}.setting input:checked:after{transform:translate(18px)}.setting input:disabled{opacity:.5}:focus-visible{outline:2px solid var(--present);outline-offset:2px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:1ms!important;animation-duration:1ms!important}}@media (height<=640px){.key{height:48px}}.dist-bar.lost{background:var(--present)}.sheet{overflow-y:auto}.score-row{border-top:1px solid var(--line);grid-template-columns:repeat(3,1fr);margin-top:16px;padding-top:16px}.score-row strong{font-size:26px}.breakdown{gap:4px;font-size:14px;display:grid}.breakdown-row{grid-template-columns:28px 1fr auto;align-items:center;gap:8px;display:grid}.breakdown-row>span:first-child{color:var(--muted);font-weight:600}.breakdown-row>span:nth-child(2){align-items:center;gap:10px;display:flex}.breakdown-row small{color:var(--muted);font-size:12px}.breakdown-row.bonus,.breakdown-row.total{border-top:1px solid var(--line);padding-top:6px}.breakdown-row.total{font-size:15px}.mini-tiles{gap:2px;display:inline-flex}.mini{text-transform:uppercase;width:20px;height:20px;color:var(--on-mark);background:var(--absent);border-radius:3px;place-items:center;font-size:11px;font-weight:700;display:grid}.mini.correct{background:var(--correct)}.mini.present{background:var(--present)}.score-help{color:var(--muted);margin:8px 0 0;font-size:12px}.breakdown-row small{align-items:center;gap:3px;display:inline-flex}.dot{border-radius:2px;width:9px;height:9px;margin-right:5px}.dot.correct{background:var(--correct)}.dot.present{background:var(--present)}.topbar-side{gap:2px;display:flex}.topbar-right{justify-self:end}.icon-btn{width:38px;height:38px;position:relative}.icon-btn[hidden],.brand-mode .short{display:none}@media (width<=440px){.topbar{padding:0 6px}.icon-btn{width:34px}.brand{font-size:24px}.brand-mode{margin-left:4px}.brand-mode .long{display:none}.brand-mode .short{display:inline}}.signed-in-dot{background:var(--correct);width:8px;height:8px;box-shadow:0 0 0 2px var(--bg);border-radius:50%;display:none;position:absolute;top:7px;right:6px}:root[data-signed-in=true] .signed-in-dot{display:block}.muted-text{color:var(--muted)}.small{font-size:12px}.tabs{background:var(--line);border-radius:10px;gap:4px;margin-bottom:16px;padding:4px;display:flex}.tab{cursor:pointer;background:0 0;border:0;border-radius:7px;flex:1;padding:8px;font-weight:600}.tab[aria-selected=true]{background:var(--sheet);box-shadow:0 1px 3px #00000026}.account-form{gap:12px;display:grid}.field{gap:4px;font-size:13px;font-weight:600;display:grid}.field input{font:inherit;border:1px solid var(--tile-border);background:var(--bg);color:var(--fg);border-radius:8px;padding:10px 12px;font-size:16px;font-weight:400}.field input:focus{outline:2px solid var(--correct);outline-offset:-1px}.hint{color:var(--muted);font-weight:400}.hint.ok{color:var(--correct)}.hint.bad,.form-message{color:#c2410c}.form-message{margin:0;font-size:14px}.form-message.ok{color:var(--correct)}.wide-btn{width:100%}.button-row{justify-content:flex-end;gap:8px;margin-top:16px;display:flex}.danger-zone{border-top:1px solid var(--line);margin-top:24px;padding-top:16px;font-size:14px}.link-btn{cursor:pointer;background:0 0;border:0;padding:0;text-decoration:underline}.danger{color:#c2410c}.danger-btn{background:#c2410c}.share-btn:disabled{opacity:.6;cursor:progress}.ranking{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%;font-size:14px}.ranking th{text-align:left;color:var(--muted);border-bottom:1px solid var(--line);padding:6px 4px;font-size:12px;font-weight:600}.ranking td{border-bottom:1px solid var(--line);padding:7px 4px}.ranking th:nth-child(n+3),.ranking td:nth-child(n+3){text-align:right}.ranking td:nth-child(2){overflow-wrap:anywhere;font-weight:600}.ranking tr.me td{background:color-mix(in srgb, var(--correct) 18%, transparent)}
