:root{
  --night:#14100D; --bark:#181613; --line:#2C2924;
  --moss:#8A9788; --bone:#E8E3D4; --ochre:#CE9D63; --gate:#62D6EC;
  --red:#C8382F;
  --pad: env(safe-area-inset-bottom, 0px);
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html,body{height:100%;overflow:hidden}
body{
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--bone);
  background:radial-gradient(120% 90% at 50% -10%,#1B2523 0%,#0D0B09 62%),var(--night);
  user-select:none;position:fixed;inset:0;
}
#app{position:absolute;inset:0;display:flex;flex-direction:column;padding:calc(10px + env(safe-area-inset-top,0px)) 12px calc(10px + var(--pad));gap:10px}
#bar{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.homeLink{display:flex;align-items:center;justify-content:center;width:34px;height:34px;flex:0 0 34px;border:1px solid rgba(98,214,236,.35);border-radius:10px;color:var(--gate);text-decoration:none;background:rgba(20,16,13,.72);font-weight:900;font-size:18px}
.homeLink:hover,.homeLink:focus-visible{border-color:var(--gate);background:rgba(98,214,236,.10);outline:none}
.brand{font-weight:700;letter-spacing:.16em;text-transform:uppercase;font-size:12px;color:var(--ochre);line-height:1.3;white-space:nowrap}
.brand small{display:block;color:var(--moss);font-size:9px;letter-spacing:.24em}
.brand small.mode{color:var(--gate);font-size:8px;letter-spacing:.18em;margin-top:1px}
#meta{margin-left:auto;display:flex;align-items:center;gap:14px}.stat{text-align:right}
.stat b{display:block;font-family:"Courier New",ui-monospace,monospace;font-weight:700;font-size:clamp(18px,4.2vw,26px);line-height:1;font-variant-numeric:tabular-nums}
.stat i{font-style:normal;font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--moss)}#clock.stopped b{color:var(--gate)}
#hintBtn{all:unset;cursor:pointer;padding:9px 12px;border-radius:9px;border:1px solid var(--line);background:rgba(18,32,27,.7);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#9BAF9C;white-space:nowrap}
#hintBtn:active{border-color:var(--ochre);color:var(--ochre)}#hintBtn[disabled]{opacity:.35;cursor:default}
#play{flex:1 1 auto;min-height:0;display:flex;gap:12px}@media (max-width:860px){#play{flex-direction:column}}
#gridWrap{flex:1 1 auto;display:flex;align-items:center;justify-content:center;min-height:0;min-width:0}
#grid{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:10px;padding:1px;touch-action:none}
.c{display:flex;align-items:center;justify-content:center;background:#181613;color:#CFD8C9;font-family:"Courier New",ui-monospace,monospace;font-weight:700;line-height:1;transition:background .1s,color .1s}
.c.sel{background:var(--ochre);color:#1A1206}.c.f{color:var(--bone)}
.c.f0{background:rgba(98,214,236,.30)}.c.f1{background:rgba(206,157,99,.28)}.c.f2{background:rgba(200,56,47,.28)}.c.f3{background:rgba(120,160,215,.28)}.c.f4{background:rgba(95,125,90,.42)}.c.f5{background:rgba(198,120,200,.26)}
.c.hint{outline:2px solid var(--ochre);outline-offset:-2px;animation:blink 1s ease-in-out 3}@keyframes blink{50%{background:rgba(206,157,99,.5)}}
#panel{flex:1 1 auto;min-height:0;min-width:0;display:flex;flex-direction:column;gap:8px}@media (min-width:861px){#panel{flex:0 0 268px}}
@media (max-width:860px){#panel{flex:0 0 auto;max-height:40vh}#gridWrap{min-height:38vh}}
#panelHead{display:flex;justify-content:space-between;align-items:baseline;font-size:9.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--moss)}
#panelHead b{font-family:"Courier New",ui-monospace,monospace;color:var(--bone);letter-spacing:0;font-size:12px}
#words{flex:1 1 auto;min-height:0;overflow-y:auto;display:grid;gap:5px;align-content:start;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));-webkit-overflow-scrolling:touch}
@media (max-width:860px){#words{max-height:27vh;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:4px}.w{padding:6px 7px;font-size:11.5px;gap:5px}}
.w{padding:7px 9px;border:1px solid var(--line);border-radius:7px;background:rgba(18,32,27,.55);font-size:12.5px;letter-spacing:.06em;display:flex;align-items:center;gap:7px}.w.done{opacity:.42;text-decoration:line-through;border-color:transparent;background:transparent}
.w s{text-decoration:none}.w u{text-decoration:none;color:var(--ochre);font-family:"Courier New",ui-monospace,monospace;font-size:10px}.w.tapme{cursor:pointer;border-style:dashed;border-color:#31493D}.w.tapme:active{border-color:var(--ochre)}
.w .num{font-family:"Courier New",ui-monospace,monospace;font-weight:700;font-size:15px;color:var(--ochre)}.w .part{font-family:"Courier New",ui-monospace,monospace;letter-spacing:.08em;color:var(--bone)}
#toast{flex:0 0 auto;min-height:34px;display:flex;align-items:center;font-size:12px;color:#9BAF9C;line-height:1.4;border-left:2px solid var(--line);padding-left:10px}#toast.on{border-color:var(--gate);color:var(--bone)}#toast b{color:var(--gate);font-weight:600;margin-right:6px}
#fx{position:absolute;inset:0;z-index:5;pointer-events:none;display:block}
#veil{position:absolute;inset:0;z-index:10;overflow-y:auto;background:radial-gradient(120% 90% at 50% 30%,rgba(12,30,26,.94),rgba(5,12,10,.98));display:flex;align-items:center;justify-content:center;padding:24px 18px calc(24px + var(--pad))}#veil.hidden{display:none}
.card{width:100%;max-width:440px;animation:rise .26s ease-out}@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.kicker{font-size:9.5px;letter-spacing:.34em;text-transform:uppercase;color:var(--moss);margin-bottom:8px;text-align:center}
h1{font-size:clamp(30px,8.5vw,44px);line-height:.94;font-weight:700;text-transform:uppercase;text-align:center;margin-bottom:6px}h1 em{font-style:normal;color:var(--gate);text-shadow:0 0 26px rgba(98,214,236,.35)}
.sub{font-size:13px;color:#9BAF9C;line-height:1.5;text-align:center;margin-bottom:20px}.sub b{color:var(--ochre);font-weight:600}
.field{margin-bottom:16px}.lab{font-size:9.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--moss);margin-bottom:7px;display:flex;justify-content:space-between}.lab span{color:var(--bone);letter-spacing:.06em;font-size:11px}
.opts{display:grid;gap:6px;grid-template-columns:repeat(auto-fit,minmax(0,1fr))}.opt{all:unset;cursor:pointer;text-align:center;padding:11px 4px;border-radius:8px;border:1px solid var(--line);background:rgba(18,32,27,.55);font-size:12px;letter-spacing:.08em;color:#9BAF9C}.opt small{display:block;font-size:9px;color:#5C6E5C;margin-top:3px;letter-spacing:.04em}.opt.on{border-color:var(--gate);color:var(--bone);background:rgba(14,42,38,.75)}.opt.on small{color:var(--gate)}.note{font-size:10.5px;color:#6A7C6A;margin-top:7px;line-height:1.55}.opt:focus-visible{outline:2px solid var(--bone);outline-offset:2px}
.btn{all:unset;display:block;width:100%;text-align:center;cursor:pointer;padding:15px;border-radius:10px;font-weight:700;font-size:14.5px;text-transform:uppercase;letter-spacing:.18em;background:var(--gate);color:#052420}.btn:active{transform:translateY(1px)}.btn.ghost{background:transparent;border:1px solid var(--line);color:#8FA490;margin-top:9px;font-size:11.5px;padding:11px;letter-spacing:.16em}.tiny{font-size:10px;color:#4A5B4A;margin-top:15px;line-height:1.6;text-align:center}
.bigtime{font-family:"Courier New",ui-monospace,monospace;font-weight:700;color:var(--gate);font-size:clamp(38px,11vw,54px);line-height:1;text-align:center;margin:4px 0 6px;font-variant-numeric:tabular-nums;letter-spacing:-.03em}
.runstats{display:flex;gap:8px;margin:14px 0 18px}.runstats div{flex:1;padding:9px 6px;border:1px solid var(--line);border-radius:9px;background:rgba(18,32,27,.6);text-align:center}.runstats span{display:block;font-family:"Courier New",ui-monospace,monospace;font-weight:700;font-size:17px}.runstats i{font-style:normal;font-size:8.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--moss)}
.board-title{font-size:9.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--moss);margin-bottom:8px;display:flex;justify-content:space-between}ol.scores{list-style:none;margin-bottom:18px}ol.scores li{display:flex;align-items:baseline;gap:11px;padding:9px 12px;border:1px solid var(--line);border-radius:9px;margin-bottom:6px;background:rgba(18,32,27,.7)}
ol.scores li .rk{font-family:"Courier New",ui-monospace,monospace;font-size:11px;color:var(--moss);width:16px}ol.scores li .nm{flex:1;font-size:14.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ol.scores li .tm{font-family:"Courier New",ui-monospace,monospace;font-weight:700;font-size:15px;font-variant-numeric:tabular-nums}ol.scores li.gold{border-color:rgba(206,157,99,.55);background:rgba(35,28,16,.7)}ol.scores li.gold .rk,ol.scores li.gold .tm{color:var(--ochre)}ol.scores li.fresh{border-color:var(--gate);background:rgba(14,42,38,.8)}ol.scores li.fresh .rk,ol.scores li.fresh .tm{color:var(--gate)}
.empty{font-size:12.5px;color:#5C6E5C;padding:8px 0 16px;line-height:1.5}input[type=text]{width:100%;padding:13px 12px;margin-bottom:10px;background:rgba(18,32,27,.8);border:1px solid #2D4238;border-radius:9px;color:var(--bone);font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-size:16px;text-align:center;letter-spacing:.06em}input[type=text]:focus{outline:none;border-color:var(--gate)}
@media(max-width:560px){#bar{gap:7px}.homeLink{width:30px;height:30px;flex-basis:30px}.brand{font-size:10px;letter-spacing:.12em}.brand small{font-size:7px;letter-spacing:.15em}#meta{gap:7px}#hintBtn{padding:7px 8px;font-size:9px}.stat i{font-size:7px}.stat b{font-size:18px}}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important}}