:root{--bg: #1a1410;--bg-2: #241c16;--ink: #f4e6d0;--ink-dim: #b8a48a;--line: #3a2e24;--vermillion: #c23a22;--vermillion-2: #e85a3a;--indigo: #3d4fa8;--indigo-2: #6b7fd6;--gold: #d4a017;--gold-2: #f0c14b;--wood: #6b4423;--wood-2: #8a5a32;--seal: #2a221c;--win: #7cb87c;--shadow: 0 18px 40px rgba(0, 0, 0, .45);--radius: 18px;--font: "Outfit", system-ui, sans-serif;--display: "Fraunces", Georgia, serif}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:radial-gradient(1200px 800px at 20% -10%,#3a2418 0%,var(--bg) 55%);color:var(--ink);font-family:var(--font);overflow:hidden}#grain{pointer-events:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:8;opacity:.07;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}#app{min-height:100dvh;display:grid;place-items:stretch}button{font-family:inherit;cursor:pointer;border:0;background:none;color:inherit}h1,h2,h3{font-family:var(--display);font-weight:700;margin:0}.screen{display:flex;flex-direction:column;min-height:100dvh;padding:22px 20px 28px;gap:18px;max-width:920px;margin:0 auto;width:100%;overflow:auto}.hero{display:flex;flex-direction:column;gap:8px;padding-top:18px}.kicker{letter-spacing:.28em;text-transform:uppercase;font-size:11px;color:var(--gold-2)}.hero h1{font-size:clamp(42px,8vw,72px);line-height:.95}.lede{color:var(--ink-dim);max-width:38ch;line-height:1.5;font-size:15px}.menu-actions{display:grid;gap:12px;margin-top:8px}.btn{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-radius:14px;background:linear-gradient(180deg,#2e231c,#231a15);box-shadow:inset 0 1px #ffffff0f,var(--shadow);border:1px solid #4a382c;transition:transform .12s ease,filter .12s ease}.btn:hover{filter:brightness(1.08)}.btn:active{transform:translateY(1px)}.btn.primary{background:linear-gradient(180deg,#c23a22,#9a2b18);border-color:#e07a62}.btn .sub{color:var(--ink-dim);font-size:12px}.btn.primary .sub{color:#f7cfc4}.how{margin-top:auto;padding:16px;border:1px dashed #4a382c;border-radius:14px;color:var(--ink-dim);font-size:13px;line-height:1.55}.how strong{color:var(--ink)}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px}.icon-btn{width:42px;height:42px;border-radius:12px;background:#2a211b;border:1px solid #4a382c;display:grid;place-items:center;font-size:16px}.title-block{text-align:center}.title-block .kicker{font-size:10px}.title-block h2{font-size:22px}.levels{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:10px}.level-card{text-align:left;padding:14px;border-radius:14px;background:#241c16;border:1px solid #3a2e24;min-height:108px;display:flex;flex-direction:column;gap:6px}.level-card.locked{opacity:.42;cursor:not-allowed}.level-card .num{font-size:11px;letter-spacing:.16em;color:var(--gold-2)}.stars{margin-top:auto;color:var(--gold-2);letter-spacing:2px}.play{gap:12px}.hud{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px}.hud-stat{font-size:12px;color:var(--ink-dim)}.hud-stat b{color:var(--ink);font-size:16px;font-family:var(--display)}.board-wrap{display:grid;place-items:center;flex:1;min-height:0}.board{display:grid;gap:6px;padding:10px;background:linear-gradient(180deg,#3a2a20,#2a1d16);border-radius:20px;border:1px solid #5a4334;box-shadow:var(--shadow);touch-action:manipulation}.cell{width:var(--cell, 56px);height:var(--cell, 56px);border-radius:12px;background:#1c1612;border:1px solid #31251d;position:relative;display:grid;place-items:center;overflow:visible}.cell.arrow{cursor:pointer}.cell.empty{background:repeating-linear-gradient(45deg,#1a1410,#1a1410 6px,#1e1813 6px,#1e1813 12px)}.cell.hint{box-shadow:0 0 0 2px var(--gold-2),0 0 18px #f0c14b73}.cell.wake-path{background:#2a2218}.cell.path-air:before{content:"";width:8px;height:8px;border-radius:99px;background:#f0c14b59}.cell.path-flock{box-shadow:inset 0 0 0 2px #e85a3ab3}.cell.path-wake{box-shadow:inset 0 0 0 2px #6b7fd6b3}.cell.path-guard{box-shadow:inset 0 0 0 2px #f4e6d080}.cell.path-origin{box-shadow:0 0 0 2px var(--vermillion-2)}.cell.path-beacon{box-shadow:inset 0 0 0 2px var(--gold-2)}.quill{width:78%;height:78%;transition:transform .28s cubic-bezier(.22,1.2,.32,1);filter:drop-shadow(0 6px 8px rgba(0,0,0,.35))}.quill.dir-0{transform:rotate(0)}.quill.dir-1{transform:rotate(90deg)}.quill.dir-2{transform:rotate(180deg)}.quill.dir-3{transform:rotate(270deg)}.quill.fly{animation:fly .42s ease-in forwards;transform-origin:50% 50%}.quill.spin{animation:spin .38s ease-out}.quill.pop{animation:pop .28s ease-out}@keyframes fly{0%{opacity:1}to{transform:var(--to, translateY(-24px) scale(.35));opacity:0}}@keyframes spin{0%{transform:rotate(var(--from-deg))}to{transform:rotate(var(--to-deg))}}@keyframes pop{0%{transform:scale(.4)}70%{transform:scale(1.08)}to{transform:scale(1)}}.sealed:after{content:"";position:absolute;top:10%;right:10%;bottom:10%;left:10%;border:2px dashed #8a6a4a;border-radius:10px;pointer-events:none}.beacon{width:70%;height:70%}.toolbar{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.tool{min-width:88px;padding:12px 14px;border-radius:12px;background:#2a211b;border:1px solid #4a382c;font-size:13px}.legend{display:flex;gap:14px;justify-content:center;color:var(--ink-dim);font-size:11px;flex-wrap:wrap}.swatch{display:inline-flex;align-items:center;gap:6px}.dot{width:8px;height:8px;border-radius:99px}.dot.vermillion{background:var(--vermillion-2)}.dot.indigo{background:var(--indigo-2)}.dot.gold{background:var(--gold-2)}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0a0705b8;display:grid;place-items:center;z-index:9;padding:20px}.modal{width:min(420px,100%);background:#241c16;border:1px solid #5a4334;border-radius:20px;padding:22px;box-shadow:var(--shadow);display:grid;gap:12px}.modal h2{font-size:28px}.star-row{font-size:28px;color:var(--gold-2);letter-spacing:6px}.help-grid{display:grid;gap:10px;font-size:14px;color:var(--ink-dim);line-height:1.5}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%);background:#2a211b;border:1px solid #5a4334;padding:10px 14px;border-radius:999px;z-index:10;font-size:13px}.chapter{margin:8px 0 4px;color:var(--gold-2);letter-spacing:.2em;text-transform:uppercase;font-size:11px}@media(max-width:520px){.screen{padding:14px 12px 18px}.board{gap:4px;padding:8px}}