:root{--bg: #05050d;--bg2: #0d0d1a;--panel: #10101e;--line: #262645;--line-strong: #3f3f6b;--ink: #f5ecda;--clue: #93c1ec;--accent: #ffb454;--accent-dim: rgba(255, 180, 84, .14);--danger: #ff6b81;--cell: min(10.2vw, 52px);--font-display: "Michroma", "Space Grotesk", sans-serif;--font-ui: "Space Grotesk", system-ui, sans-serif;--font-digit: "IBM Plex Mono", ui-monospace, monospace;font-family:var(--font-ui);color-scheme:dark}*{box-sizing:border-box;margin:0}html,body,#root{height:100%}body{background:var(--bg);color:var(--ink);overflow-x:hidden}.app{min-height:100%;display:flex;flex-direction:column;align-items:center;position:relative}.sky{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden}.nebula{position:absolute;top:-20%;right:-20%;bottom:-20%;left:-20%;background:radial-gradient(ellipse 55% 40% at 75% 20%,rgba(42,30,77,.55),transparent 70%),radial-gradient(ellipse 60% 45% at 15% 80%,rgba(24,34,68,.6),transparent 70%),radial-gradient(ellipse 30% 25% at 60% 65%,rgba(120,60,40,.12),transparent 70%)}.starfield{position:absolute;inset:calc(-30% - 560px);background-image:radial-gradient(1px 1px at 12% 22%,rgba(255,255,255,.8) 50%,transparent 51%),radial-gradient(1px 1px at 68% 8%,rgba(255,255,255,.5) 50%,transparent 51%),radial-gradient(1.6px 1.6px at 84% 42%,rgba(200,220,255,.7) 50%,transparent 51%),radial-gradient(1px 1px at 32% 68%,rgba(255,255,255,.45) 50%,transparent 51%),radial-gradient(1px 1px at 54% 88%,rgba(255,255,255,.6) 50%,transparent 51%),radial-gradient(1.4px 1.4px at 92% 78%,rgba(255,230,200,.55) 50%,transparent 51%),radial-gradient(1px 1px at 6% 92%,rgba(255,255,255,.5) 50%,transparent 51%),radial-gradient(1px 1px at 44% 12%,rgba(200,220,255,.55) 50%,transparent 51%);background-size:520px 520px}.spacetime{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none}.drift-a{animation:drift-a 240s linear infinite;will-change:transform}.drift-b{opacity:.5;animation:drift-b 420s linear infinite;will-change:transform}@keyframes drift-a{0%{transform:translate(0)}to{transform:translate(520px,260px)}}@keyframes drift-b{0%{transform:scale(1.6) translate(0)}to{transform:scale(1.6) translate(-325px,-162.5px)}}.title{font-family:var(--font-display);font-size:clamp(1.5rem,6vw,2.2rem);font-weight:400;letter-spacing:.18em;text-transform:uppercase;color:var(--ink)}.title span{color:var(--accent)}.title.small{font-size:1.1rem;letter-spacing:.22em}.tagline{color:#8d8daf;font-size:.95rem;max-width:34ch;line-height:1.5}.menu{margin:auto;padding:24px;display:flex;flex-direction:column;gap:22px;align-items:center;text-align:center;max-width:440px;z-index:1}.tier-buttons{display:flex;flex-direction:column;gap:12px;width:100%}.tier-btn{background:linear-gradient(160deg,var(--panel),#0b0b17);border:1px solid var(--line);border-radius:14px;color:var(--ink);padding:14px 18px;min-height:44px;display:flex;align-items:center;gap:16px;text-align:left;cursor:pointer;transition:border-color .18s,box-shadow .18s,transform .18s}.tier-btn:hover{border-color:var(--accent);box-shadow:0 0 24px #ffb4541f;transform:translateY(-1px)}.tier-btn.compact{padding:10px 16px;justify-content:center}.tier-text{display:flex;flex-direction:column;gap:2px}.tier-name{font-family:var(--font-display);font-size:.95rem;letter-spacing:.14em;text-transform:uppercase}.tier-meta{font-size:.8rem;color:#8d8daf}.tier-best{font-size:.78rem;color:var(--accent);font-family:var(--font-digit)}.orbit-glyph{color:var(--accent);flex-shrink:0}.tier-btn:hover .orbit-glyph{animation:spin 9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.menu-links{display:flex;gap:10px}.ghost-btn{background:none;border:1px solid var(--line);color:#a9a9c6;border-radius:10px;padding:10px 16px;min-height:44px;cursor:pointer;font-family:var(--font-ui)}.ghost-btn:hover{border-color:var(--line-strong);color:var(--ink)}.ghost-btn.small{min-height:36px;padding:4px 12px;font-size:.9rem}.primary-btn{background:var(--accent);color:#1c1408;border:none;border-radius:10px;padding:12px 22px;min-height:44px;font-size:1rem;font-family:var(--font-ui);font-weight:600;letter-spacing:.02em;cursor:pointer;box-shadow:0 0 24px #ffb45440}.settings{display:flex;flex-direction:column;gap:8px;font-size:.85rem;color:#8d8daf}.settings label{display:flex;gap:8px;align-items:center;cursor:pointer}.game{width:100%;max-width:520px;padding:10px 8px calc(16px + env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;gap:12px;z-index:1}.hud{display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap;width:100%;padding:6px 0}.hud-stat{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:6px 12px;font-size:.88rem;font-family:var(--font-digit);font-variant-numeric:tabular-nums}.gravity-indicator{border-color:var(--accent);color:var(--accent)}.gravity-arrow{font-size:1.05rem;display:inline-block}.board-frame{position:relative;padding:12px;border-radius:18px;background:var(--bg2);border:1px solid var(--line);box-shadow:0 0 0 4px #10101ecc,0 0 80px #3c3c8c2e inset,0 12px 50px #0000008c;overflow:hidden}.board-frame:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(120,140,220,.05) 0 1px,transparent 1px 26px),repeating-linear-gradient(90deg,rgba(120,140,220,.05) 0 1px,transparent 1px 26px);transition:opacity .4s}.board-frame:after{content:"";position:absolute;pointer-events:none;width:160%;height:160%;border-radius:50%;background:radial-gradient(circle,rgba(255,180,84,.16) 0%,rgba(255,180,84,.05) 35%,transparent 62%);transition:top .45s ease,left .45s ease,transform .45s ease;animation:horizon 5s ease-in-out infinite}@keyframes horizon{50%{opacity:.65}}.gravity-down.board-frame:after{top:55%;left:-30%}.gravity-up.board-frame:after{top:-115%;left:-30%}.gravity-left.board-frame:after{top:-30%;left:-115%}.gravity-right.board-frame:after{top:-30%;left:55%}.gravity-wall{position:absolute;border-radius:18px;pointer-events:none;transition:all .35s ease;z-index:1}.gravity-down .gravity-wall{left:0;right:0;bottom:0;height:10px;box-shadow:0 5px 26px 5px var(--accent);background:linear-gradient(to top,var(--accent-dim),transparent)}.gravity-up .gravity-wall{left:0;right:0;top:0;height:10px;box-shadow:0 -5px 26px 5px var(--accent);background:linear-gradient(to bottom,var(--accent-dim),transparent)}.gravity-left .gravity-wall{top:0;bottom:0;left:0;width:10px;box-shadow:-5px 0 26px 5px var(--accent);background:linear-gradient(to right,var(--accent-dim),transparent)}.gravity-right .gravity-wall{top:0;bottom:0;right:0;width:10px;box-shadow:5px 0 26px 5px var(--accent);background:linear-gradient(to left,var(--accent-dim),transparent)}.board{position:relative;z-index:2;display:grid;grid-template-columns:repeat(9,var(--cell));grid-template-rows:repeat(9,var(--cell))}.board-tilt{animation:tilt .35s ease}@keyframes tilt{0%{transform:rotate(0)}30%{transform:rotate(1.6deg) scale(.995)}to{transform:rotate(0)}}.cell{position:relative;width:var(--cell);height:var(--cell);background:none;border:none;border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:0;cursor:pointer;color:var(--ink);overflow:visible}.cell.bt{border-top:2px solid var(--line-strong)}.cell.bl{border-left:2px solid var(--line-strong)}.cell.bb{border-bottom:2px solid var(--line-strong)}.cell.br{border-right:2px solid var(--line-strong)}.cell.cursor{outline:2px solid var(--accent);outline-offset:-2px;border-radius:4px;z-index:2}.cell:focus-visible{outline:2px solid var(--clue);outline-offset:-2px}.cell.reject{animation:shake .35s ease}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-3px)}50%{transform:translate(3px)}75%{transform:translate(-2px)}}.glyph{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-family:var(--font-digit);font-size:calc(var(--cell) * .5);font-weight:300;z-index:1}.glyph.given{color:var(--clue);font-weight:600}.glyph.player{color:var(--ink)}.glyph.same-digit{text-shadow:0 0 10px currentColor}.glyph.locked{font-weight:600}.glyph.locked.lock-down{text-shadow:0 5px 9px rgba(255,180,84,.5)}.glyph.locked.lock-up{text-shadow:0 -5px 9px rgba(255,180,84,.5)}.glyph.locked.lock-left{text-shadow:-5px 0 9px rgba(255,180,84,.5)}.glyph.locked.lock-right{text-shadow:5px 0 9px rgba(255,180,84,.5)}.glyph.anim-drop{animation:drop .32s cubic-bezier(.5,0,.7,1) backwards}@keyframes drop{0%{transform:translate(calc(var(--dx) * var(--cell)),calc(var(--dy) * var(--cell)))}78%{transform:translate(0) scale(1)}88%{transform:scale(1.12,.88)}to{transform:scale(1)}}.pencil{position:absolute;top:3px;right:3px;bottom:3px;left:3px;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);pointer-events:none}.pencil i{font-style:normal;font-family:var(--font-digit);font-size:calc(var(--cell) * .22);color:#7d7da0;display:flex;align-items:center;justify-content:center}.controls{display:flex;flex-direction:column;gap:10px;width:100%;align-items:center}.digit-pad{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}.digit-btn{width:max(44px,calc(var(--cell) * .92));height:max(44px,calc(var(--cell) * .92));border-radius:10px;background:var(--panel);border:1px solid var(--line);color:var(--ink);font-size:1.2rem;font-family:var(--font-digit);cursor:pointer;transition:border-color .12s,background .12s,box-shadow .12s}.digit-btn.selected{border-color:var(--accent);background:var(--accent-dim);color:var(--accent);box-shadow:0 0 14px #ffb45440}.action-row{display:flex;gap:8px;justify-content:center}.action-btn{min-width:52px;min-height:44px;border-radius:10px;background:var(--panel);border:1px solid var(--line);color:var(--ink);font-size:1.2rem;cursor:pointer}.action-btn.rotate{border-color:var(--accent);color:var(--accent)}.action-btn:disabled{opacity:.35;cursor:default}.action-btn.selected{background:var(--accent-dim);border-color:var(--accent);color:var(--accent)}.win-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#04040cc7;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;z-index:10;animation:fadein .3s ease}@keyframes fadein{0%{opacity:0}}.win-card{background:var(--panel);border:1px solid var(--accent);border-radius:16px;padding:28px 32px;text-align:center;display:flex;flex-direction:column;gap:10px;box-shadow:0 0 60px #ffb4542e}.win-card h2{font-family:var(--font-display);font-weight:400;font-size:1.1rem;letter-spacing:.18em;text-transform:uppercase}.win-score{font-size:1.7rem;color:var(--accent);font-family:var(--font-digit);font-weight:600}.win-meta{color:#8d8daf;font-size:.9rem}.win-best{color:var(--accent)}.win-actions{display:flex;gap:10px;justify-content:center;margin-top:8px}.win-actions button{background:var(--accent);color:#1c1408;border:none;border-radius:10px;padding:10px 18px;min-height:44px;font-size:1rem;font-family:var(--font-ui);cursor:pointer}.win-actions .ghost-btn{background:none;color:#a9a9c6}.tutorial-panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px 16px;max-width:480px;display:flex;flex-direction:column;gap:8px}.tutorial-panel h3{color:var(--accent);font-family:var(--font-display);font-weight:400;font-size:.85rem;letter-spacing:.12em;text-transform:uppercase}.tutorial-panel p{font-size:.92rem;line-height:1.5;color:#ccd}.tutorial-hint{font-size:.85rem;color:#8d8daf;font-style:italic}.tutorial-panel .skip{align-self:flex-end}@media (max-width: 600px){.game.tutorial{--cell: min(8.3vw, 40px);gap:8px;padding-top:4px}.game.tutorial .hud{display:none}.game.tutorial .board-frame{padding:8px}.game.tutorial .tutorial-panel{padding:10px 12px;gap:5px}.game.tutorial .tutorial-panel p{font-size:.82rem;line-height:1.4}.game.tutorial .tutorial-panel .skip{min-height:30px;padding:2px 10px;font-size:.8rem}.game.tutorial .tier-btn.compact{padding:7px 14px;min-height:38px}.game.tutorial .digit-btn{width:40px;height:40px;font-size:1.05rem}.game.tutorial .action-btn{min-width:44px;min-height:40px}.game.tutorial .controls{gap:6px}}.intro-overlay{margin:auto;z-index:1;padding:20px;display:flex;align-items:center;justify-content:center}.intro-card{background:linear-gradient(170deg,var(--panel),#0a0a15);border:1px solid var(--line);border-radius:20px;padding:26px 26px 22px;max-width:400px;width:100%;display:flex;flex-direction:column;align-items:center;gap:16px;box-shadow:0 20px 70px #00000080,0 0 50px #3c3c8c1f inset;animation:fadein .4s ease}.intro-demo{--dc: 58px;position:relative;width:calc(var(--dc) * 3 + 20px);height:calc(var(--dc) * 3 + 20px);padding:10px;border-radius:14px;background:var(--bg2);border:1px solid var(--line);overflow:visible}.demo-grid{position:relative;display:grid;grid-template-columns:repeat(3,var(--dc));grid-template-rows:repeat(3,var(--dc))}.demo-cell{border:1px solid var(--line)}.demo-tile{position:absolute;top:0;left:0;width:var(--dc);height:var(--dc);display:flex;align-items:center;justify-content:center;font-family:var(--font-digit);font-size:1.6rem;color:var(--ink);transition:transform .38s cubic-bezier(.45,0,.6,1.25),opacity .3s}.demo-tile.given{color:var(--clue);font-weight:600}.demo-tile.locked{font-weight:600;text-shadow:0 5px 9px rgba(255,180,84,.5)}.demo-tile.ghost{transition:transform .45s ease,opacity .45s}.demo-tile.shake{animation:shake .4s ease;font-weight:600;text-shadow:0 5px 9px rgba(255,180,84,.5)}.demo-wall{position:absolute;border-radius:14px;pointer-events:none;transition:all .4s ease}.demo-gravity-down .demo-wall{left:0;right:0;bottom:0;height:8px;box-shadow:0 4px 18px 3px var(--accent)}.demo-gravity-left .demo-wall{top:0;bottom:0;left:0;width:8px;box-shadow:-4px 0 18px 3px var(--accent)}.demo-arrow{position:absolute;color:var(--accent);font-size:1rem;transition:transform .4s ease,top .4s ease,left .4s ease,right .4s ease,bottom .4s ease}.arrow-down{bottom:-26px;left:50%;transform:translate(-50%) rotate(90deg)}.arrow-left{left:-26px;top:50%;transform:translateY(-50%) rotate(180deg)}.intro-caption{text-align:center;min-height:84px;animation:fadein .35s ease}.intro-caption h3{font-family:var(--font-display);font-weight:400;font-size:.9rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:6px}.intro-caption p{font-size:.9rem;line-height:1.5;color:#ccd;max-width:32ch;margin:0 auto}.intro-dots{display:flex;gap:8px}.dot{width:10px;height:10px;border-radius:50%;border:1px solid var(--line-strong);background:none;padding:0;cursor:pointer}.dot.active{background:var(--accent);border-color:var(--accent)}.intro-actions{display:flex;gap:10px}@media (prefers-reduced-motion: reduce){.glyph.anim-drop,.board-tilt,.cell.reject,.demo-tile.shake,.drift-a,.drift-b,.board-frame:after,.orbit-glyph{animation:none!important}.demo-tile,*{transition:none!important}}@media (min-width: 900px){:root{--cell: 56px}}