:root{--bg:#2a2419;--ink:#f3ead6;--muted:#f3ead699;--accent:#8fb339;--accent-ink:#1b1710;--btn:#3a3226;--btn-ink:#f3ead6;--good:#8fb339;--bad:#e2583e;--tile:#e9d9b4;--tile-ink:#2a2419;--tile-edge:#b59a68;--rot:#6f8a2a;--rot-ink:#e9f2c8;--sel:#f1b53b;--key:#3a3226;--key-ink:#f3ead6;--panel:#1f1a12;--panel-ink:#f3ead6;--scrim:#0009;--radius:14px;--tile-radius:12px;--display:system-ui, sans-serif;--text:system-ui, sans-serif;--fuse:1}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--ink);font-family:var(--text);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;overscroll-behavior:none;font-size:16px;line-height:1.35;overflow:hidden}#app{max-width:520px;height:100dvh;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);margin:0 auto;position:relative}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--sel);outline-offset:3px}.btn{border-radius:var(--radius);background:var(--btn);width:100%;min-height:54px;color:var(--btn-ink);font-family:var(--display);border:0;justify-items:center;gap:2px;padding:10px 18px;font-size:20px;transition:transform 80ms;display:grid}.btn:active{transform:translateY(2px)scale(.99)}.btn--primary{background:var(--accent);color:var(--accent-ink)}.btn--quiet{color:var(--muted);min-height:44px;font-family:var(--text);background:0 0;font-size:16px}.btn:disabled{opacity:.4}.btn__sub{font-family:var(--text);opacity:.75;font-size:13px}.icon-btn{width:44px;height:44px;color:var(--ink);background:0 0;border:0;border-radius:50%;place-items:center;display:grid}.row{justify-content:center;gap:var(--tile-gap,10px);display:flex}.tile{--size:min(19vw, 84px);width:var(--size);height:calc(var(--size) * 1.12);border-radius:var(--tile-radius);background:var(--tile);color:var(--tile-ink);font-family:var(--display);font-size:calc(var(--size) * .62);border:0;place-items:center;padding:0;line-height:1;transition:background .3s,color .3s,transform .12s;display:grid;position:relative;overflow:hidden}.word[data-len="5"] .tile{--size:min(16vw, 74px)}.tile__ch{z-index:1;position:relative}.tile__mould{opacity:0;pointer-events:none;transition:opacity .4s;position:absolute;inset:0}.tile.sel{box-shadow:0 0 0 3px var(--sel);transform:translateY(-6px)}.tile.rotten{background:var(--rot);color:var(--rot-ink)}.tile.rotten .tile__mould{opacity:1}.tile.rotting{animation:.38s ease-in-out wobble}.tile.fresh{animation:.35s ease-out pop}.tile.shake{animation:.36s shake}.tile.hinted{animation:.9s ease-in-out 3 pulse}.row.hidden .tile__ch{visibility:hidden}.home{grid-template-rows:auto 1fr auto auto;place-items:center;height:100%;padding:12px 24px 28px;display:grid}.home__settings{justify-self:end}.logo{justify-items:center;gap:10px;margin:0;display:grid}.logo__kicker{font-family:var(--display);font-size:30px;font-weight:inherit;letter-spacing:.3em;color:var(--muted);margin-right:-.3em}.logo__tiles{gap:10px;display:flex}.logo .tile{--size:min(24vw, 104px);pointer-events:none;animation:.5s backwards drop}.logo .tile:nth-child(2){animation-delay:80ms}.logo .tile:nth-child(3){animation-delay:.16s}.home__tag{color:var(--muted);margin:0 0 28px;font-size:18px}.home__menu{gap:12px;width:100%;max-width:360px;display:grid}.play{grid-template-rows:auto 1fr auto;height:100%;display:grid}.bar{grid-template-columns:44px 1fr auto;align-items:center;gap:8px;padding:8px 14px 0 6px;display:grid}.bar h2{text-align:center;font-family:var(--display);margin:0;font-weight:400}.lives{justify-content:center;gap:6px;display:flex}.life{background:var(--accent);border-radius:50%;width:14px;height:14px;transition:background .3s}.life--lost{background:var(--rot);opacity:.6}.score{font-family:var(--display);text-align:right;min-width:80px;font-size:24px}.score__label{font-family:var(--text);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-size:11px;display:block}.stage{align-content:center;justify-items:center;gap:18px;padding:0 16px;display:grid}.status{font-family:var(--display);min-height:1.3em;margin:0;font-size:22px}.fuse{background:var(--btn);border-radius:4px;width:min(100%,380px);height:8px;overflow:hidden}.fuse i{height:100%;width:calc(var(--fuse) * 100%);background:var(--accent);border-radius:inherit;display:block}.urgent .fuse i{background:var(--bad)}.urgent .word .tile:not(.rotten){animation:.25s infinite tremble}.note{min-height:1.4em;color:var(--muted);text-align:center;margin:0}.note.bad{color:var(--bad)}.note.good{color:var(--good);font-family:var(--display);font-size:22px;animation:.5s ease-out up}.hint{justify-content:center;align-items:center;gap:6px;width:auto;font-size:14px;display:flex}.hint svg{width:18px;height:18px}.keys{gap:8px;padding:8px 6px 12px;display:grid}.keys__row{justify-content:center;gap:5px;display:flex}.key{background:var(--key);height:52px;color:var(--key-ink);font-family:var(--display);border:0;border-radius:7px;flex:0 38px;padding:0;font-size:21px}.key:active{background:var(--sel);color:var(--tile-ink)}.over{text-align:center;align-content:center;justify-items:center;gap:10px;height:100%;padding:24px;display:grid}.over__title{font-family:var(--display);color:var(--rot-title,var(--ink));margin:0;font-size:54px;font-weight:400}.over__kicker{letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0;font-size:13px}.chain .chain__miss{color:var(--bad);padding:0 2px}.over__score{color:var(--muted);margin:0;font-size:18px}.over__score b{font-family:var(--display);color:var(--ink);font-size:64px;font-weight:400;line-height:1}.over__sub{color:var(--muted);margin:0 0 6px}.over__menu{gap:10px;width:100%;max-width:340px;margin-top:12px;display:grid}.over__toast{min-height:1.3em;color:var(--muted);margin:0}.marks{flex-wrap:wrap;justify-content:center;gap:4px;max-width:280px;display:flex}.mark{border-radius:4px;width:18px;height:18px}.mark--fast{background:var(--good)}.mark--slow{background:var(--sel)}.mark--miss{background:var(--bad)}.chain{max-width:360px;max-height:120px;font-family:var(--display);letter-spacing:.04em;flex-wrap:wrap;justify-content:center;align-items:center;gap:4px 6px;font-size:15px;display:flex;overflow-y:auto}.chain i{color:var(--muted);font-style:normal}.sheet{z-index:50;background:var(--scrim);place-items:center;padding:20px;animation:.2s fade;display:grid;position:fixed;inset:0}.sheet__card{background:var(--panel);width:100%;max-width:380px;color:var(--panel-ink);text-align:center;border-radius:20px;justify-items:center;gap:12px;padding:24px 20px 18px;animation:.25s ease-out rise;display:grid}.sheet__card h2{font-family:var(--display);margin:0;font-size:30px;font-weight:400}.sheet__sub{color:var(--muted);margin:0}.howto__step{justify-items:center;gap:6px;display:grid}.howto__step p{margin:0}.howto .tile{--size:46px;pointer-events:none}.howto .tile.fresh{box-shadow:0 0 0 3px var(--good);animation:none}.howto__small{color:var(--muted);margin:4px 0;font-size:14px}.settings{height:100%;padding:0 18px 24px;overflow-y:auto}.settings .bar{padding:8px 0 0}.settings h3{letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:22px 0 10px;font-size:13px}.looks{gap:10px;display:grid}.look{border-radius:var(--radius);background:var(--btn);color:var(--btn-ink);text-align:left;border:2px solid #0000;grid-template-rows:auto auto;grid-template-columns:auto 1fr;align-items:center;column-gap:14px;padding:12px 14px;display:grid}.look--on{border-color:var(--accent)}.look__sw{grid-row:span 2;display:flex}.look__sw i{width:18px;height:36px}.look__sw i:first-child{border-radius:6px 0 0 6px}.look__sw i:last-child{border-radius:0 6px 6px 0}.look__name{font-family:var(--display);font-size:19px}.look__blurb{opacity:.7;font-size:13px}.toggle{justify-content:space-between;align-items:center;padding:12px 2px;font-size:17px;display:flex}.toggle input{opacity:0;position:absolute}.toggle i{background:var(--btn);border-radius:15px;width:50px;height:30px;transition:background .2s;position:relative}.toggle i:after{content:"";background:var(--ink);border-radius:50%;width:24px;height:24px;transition:transform .2s;position:absolute;top:3px;left:3px}.toggle input:checked+i{background:var(--accent)}.toggle input:checked+i:after{transform:translate(20px)}.credits{color:var(--muted);text-align:center;margin-top:24px;font-size:13px}.credits a{color:inherit}.mock-ad{z-index:100;background:#000000d9;place-items:center;display:grid;position:fixed;inset:0}.mock-ad__card{color:#222;text-align:center;background:#fff;border-radius:16px;gap:16px;padding:28px;font:16px system-ui,sans-serif;display:grid}.mock-ad__tag{color:#888;font-size:12px}.mock-ad__body{font-size:28px}.mock-ad__close{color:#fff;background:#222;border:0;border-radius:8px;padding:10px 20px}.mock-ad__close:disabled{opacity:.5}@keyframes wobble{25%{transform:rotate(-7deg)scale(.96)}50%{transform:rotate(6deg)scale(.92)}75%{transform:rotate(-3deg)scale(.97)}}@keyframes pop{40%{transform:scale(1.12)}}@keyframes shake{20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}@keyframes tremble{50%{transform:translate(.5px,-1px)rotate(.6deg)}}@keyframes pulse{50%{box-shadow:0 0 0 6px var(--sel)}}@keyframes drop{0%{opacity:0;transform:translateY(-40px)}}@keyframes up{0%{opacity:0;transform:translateY(8px)}}@keyframes rise{0%{opacity:0;transform:translateY(20px)}}@keyframes fade{0%{opacity:0}}@media (prefers-reduced-motion:reduce){*,:before,:after{animation-duration:.01ms!important;animation-iteration-count:1!important}}@font-face{font-family:Fraunces;src:url(/games/letter-rot/play/fonts/fraunces-800.woff2)format("woff2");font-weight:800;font-display:swap}@font-face{font-family:Rubik;src:url(/games/letter-rot/play/fonts/rubik-500.woff2)format("woff2");font-weight:500;font-display:swap}@font-face{font-family:VT323;src:url(/games/letter-rot/play/fonts/vt323-400.woff2)format("woff2");font-display:swap}@font-face{font-family:Space Mono;src:url(/games/letter-rot/play/fonts/spacemono-700.woff2)format("woff2");font-weight:700;font-display:swap}@font-face{font-family:Abril Fatface;src:url(/games/letter-rot/play/fonts/abril-400.woff2)format("woff2");font-display:swap}@font-face{font-family:Libre Franklin;src:url(/games/letter-rot/play/fonts/franklin-500.woff2)format("woff2");font-weight:500;font-display:swap}.word .tile:not(.rotten) .tile__mould{opacity:calc((1 - var(--fuse)) * .55);transition:none}[data-theme=compost]{--bg:#2a2419;--ink:#f3ead6;--muted:#f3ead699;--accent:#8fb339;--accent-ink:#1b1710;--btn:#3d3427;--btn-ink:#f3ead6;--good:#a5c94a;--bad:#e2583e;--tile:linear-gradient(170deg, #f1e3c0 0%, #e4d0a3 60%, #d9c08d 100%);--tile-ink:#3a2a14;--rot:linear-gradient(170deg, #7f8f3a, #56652a);--rot-ink:#eef4cf;--rot-title:#a5c94a;--sel:#f1b53b;--key:#3d3427;--key-ink:#f3ead6;--panel:#231e15;--display:"Fraunces", Georgia, serif;--text:"Rubik", system-ui, sans-serif;--tile-radius:12px}[data-theme=compost] body{background:radial-gradient(circle at 20% 10%,#8fb33914,#0000 40%),radial-gradient(circle at 85% 90%,#78501e40,#0000 50%),#2a2419}[data-theme=compost] .tile{font-weight:800;box-shadow:inset 0 -5px #78562873,0 3px #15110b}[data-theme=compost] .tile.sel{box-shadow:inset 0 -5px 0 #78562873, 0 0 0 3px var(--sel)}[data-theme=compost] .tile__mould{filter:blur(.6px);background:radial-gradient(circle at 22% 30%,#d6e8a0bf 0 7%,#0000 15%),radial-gradient(circle at 70% 22%,#a6c94acc 0 9%,#0000 18%),radial-gradient(circle at 60% 78%,#dcecb4b3 0 6%,#0000 14%),radial-gradient(circle at 18% 80%,#82a032d9 0 10%,#0000 20%),radial-gradient(circle at 88% 60%,#c8e18c99 0 5%,#0000 12%)}[data-theme=compost] .tile.rotten .tile__ch{text-shadow:0 2px #00000040;transform:rotate(-6deg)translateY(2px)}[data-theme=compost] .fuse{background:#3d3427;height:10px}[data-theme=compost] .fuse i{background:linear-gradient(90deg,#6f8a2a,#a5c94a)}[data-theme=compost] .key{font-weight:800;box-shadow:0 2px #15110b}[data-theme=compost] .btn{font-weight:800;box-shadow:0 3px #15110b}[data-theme=compost] .btn--quiet{box-shadow:none;font-weight:500}[data-theme=bitrot]{--bg:#0b0f0c;--ink:#9dffb4;--muted:#7dff9b8c;--accent:#7dff9b;--accent-ink:#04140a;--btn:#102016;--btn-ink:#9dffb4;--good:#7dff9b;--bad:#ff3df2;--tile:#0f1d14;--tile-ink:#b4ffc6;--rot:#1d0820;--rot-ink:#ff6af5;--rot-title:#ff3df2;--sel:#f5ff6a;--key:#0f1d14;--key-ink:#9dffb4;--panel:#07100a;--panel-ink:#9dffb4;--display:"VT323", ui-monospace, monospace;--text:"Space Mono", ui-monospace, monospace;--tile-radius:4px;--radius:6px}[data-theme=bitrot] body{text-shadow:0 0 6px #7dff9b73;background:radial-gradient(#10201a 0%,#0b0f0c 70%,#050706 100%)}[data-theme=bitrot] body:before{content:"";z-index:40;pointer-events:none;background:repeating-linear-gradient(0deg,#00000038 0 1px,#0000 1px 3px),radial-gradient(#0000 60%,#0000008c);position:fixed;inset:0}[data-theme=bitrot] .tile{font-size:calc(var(--size) * .86);border:2px solid #7dff9b99;box-shadow:0 0 12px #7dff9b40,inset 0 0 14px #7dff9b1f}[data-theme=bitrot] .tile.sel{border-color:var(--sel);color:var(--sel);box-shadow:0 0 16px #f5ff6a80}[data-theme=bitrot] .tile.rotten{border-color:#ff3df2;box-shadow:0 0 16px #ff3df280}[data-theme=bitrot] .tile.rotten .tile__ch{text-shadow:-3px 0 #00e5ff,3px 0 #ff3df2;animation:1.2s steps(2,end) infinite glitch}[data-theme=bitrot] .tile__mould{mix-blend-mode:screen;background:repeating-linear-gradient(0deg,#ff3df259 0 2px,#0000 2px 7px),linear-gradient(90deg,#0000 0 30%,#00e5ff40 30% 42%,#0000 42% 70%,#ff3df24d 70% 78%,#0000 78%)}[data-theme=bitrot] .fuse{background:0 0;border:2px solid #7dff9b99;border-radius:0;height:14px;padding:2px}[data-theme=bitrot] .fuse i{background:repeating-linear-gradient(90deg, var(--accent) 0 8px, transparent 8px 10px);border-radius:0}[data-theme=bitrot] .urgent .fuse i{background:repeating-linear-gradient(90deg, var(--bad) 0 8px, transparent 8px 10px)}[data-theme=bitrot] .key,[data-theme=bitrot] .btn:not(.btn--quiet),[data-theme=bitrot] .look{border:1px solid #7dff9b73}[data-theme=bitrot] .key{font-size:26px}[data-theme=bitrot] .btn--primary{text-shadow:none}[data-theme=bitrot] .btn:not(.btn--quiet){font-size:26px}[data-theme=bitrot] .status,[data-theme=bitrot] .over__title{text-transform:uppercase}[data-theme=bitrot] .status:after{content:"_";animation:1s step-end infinite blink}[data-theme=ink]{--bg:#f2ede1;--ink:#141414;--muted:#14141494;--accent:#141414;--accent-ink:#f2ede1;--btn:#e3dccb;--btn-ink:#141414;--good:#1f7a4a;--bad:#d6331f;--tile:#fbf8f0;--tile-ink:#141414;--rot:#141414;--rot-ink:#f2ede1;--rot-title:#d6331f;--sel:#d6331f;--key:#fbf8f0;--key-ink:#141414;--panel:#fbf8f0;--panel-ink:#141414;--scrim:#28221473;--display:"Abril Fatface", "Times New Roman", serif;--text:"Libre Franklin", system-ui, sans-serif;--tile-radius:2px;--radius:4px}[data-theme=ink] body{background:radial-gradient(circle at 30% 20%,#ffffff80,#0000 50%),repeating-linear-gradient(0deg,#00000005 0 1px,#0000 1px 4px),#f2ede1}[data-theme=ink] .tile{border:2px solid #141414;box-shadow:4px 4px #141414}[data-theme=ink] .tile.sel{box-shadow:4px 4px 0 var(--sel);border-color:var(--sel)}[data-theme=ink] .tile.rotten .tile__ch{filter:blur(.4px)}[data-theme=ink] .tile__mould{filter:blur(.3px);background:radial-gradient(40% 30% at 30% 35%,#141414 60%,#0000 62%),radial-gradient(30% 40% at 68% 62%,#141414 60%,#0000 62%),radial-gradient(circle at 80% 20%,#141414 0 6%,#0000 7%),radial-gradient(circle at 15% 78%,#141414 0 5%,#0000 6%),radial-gradient(circle,#141414 0 30%,#0000 31%)}[data-theme=ink] .tile.rotten .tile__mould{opacity:.35;mix-blend-mode:screen}[data-theme=ink] .word .tile:not(.rotten) .tile__mould{opacity:calc((1 - var(--fuse)) * .3)}[data-theme=ink] .fuse{background:0 0;border-top:1px solid #141414;border-bottom:1px solid #141414;border-radius:0;height:10px}[data-theme=ink] .fuse i{background:#141414;border-radius:0}[data-theme=ink] .life{background:#141414;border:2px solid #141414}[data-theme=ink] .life--lost{background:0 0}[data-theme=ink] .key{border:1.5px solid #141414;box-shadow:2px 2px #141414}[data-theme=ink] .btn:not(.btn--quiet){border:2px solid #141414;box-shadow:4px 4px #141414}[data-theme=ink] .btn--primary{box-shadow:4px 4px 0 var(--sel)}[data-theme=ink] .home__tag,[data-theme=ink] .status{font-style:italic}[data-theme=ink] .logo{border-top:4px double #141414;border-bottom:4px double #141414;padding:10px 0 14px}[data-theme=ink] .look{border:2px solid #141414}[data-theme=ink] .look--on{border-color:var(--sel);box-shadow:3px 3px 0 var(--sel)}@keyframes glitch{0%{transform:translate(0)}50%{transform:translate(-2px,1px)skew(-8deg)}}@keyframes blink{50%{opacity:0}}