:root{--accent: #ff9bc4;--accent2: #ffd6a5;--ink: #514a63;--ink-soft: #7a7390;--glass: rgba(255, 255, 255, .74);--glass-strong: rgba(255, 255, 255, .88);--glass-border: rgba(255, 255, 255, .8);--shadow: 0 10px 30px rgba(120, 110, 150, .18);--radius: 20px;font-family:Quicksand,system-ui,sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{margin:0;height:100%;width:100%;overflow:hidden;overscroll-behavior:none;touch-action:none;background:#e9d8f0;color:var(--ink)}canvas{display:block;touch-action:none}.title-font{font-family:"Baloo 2",Quicksand,sans-serif}.vignette{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:5;background:radial-gradient(125% 100% at 50% 40%,transparent 52%,rgba(70,50,95,.26) 100%)}.ui-root{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:10;font-size:clamp(14px,2.4vw,17px)}.ui-root>*{pointer-events:auto}.safe{padding:max(14px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left))}.glass{background:var(--glass);border:1px solid var(--glass-border);box-shadow:var(--shadow);border-radius:var(--radius)}.hud-top{position:fixed;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:flex-start;gap:10px;pointer-events:none}.hud-top>*{pointer-events:auto}.planet-card{padding:10px 16px;border-radius:999px;display:flex;align-items:center;gap:10px;max-width:70vw}.planet-card .badge{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:700;background:var(--accent);box-shadow:0 4px 12px #00000014;flex:none}.planet-card .meta{display:flex;flex-direction:column;line-height:1.1;overflow:hidden}.planet-card .name{font-weight:700;font-size:1.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.planet-card .sub{font-size:.78em;color:var(--ink-soft)}.btn-row{display:flex;gap:8px}.icon-btn{width:46px;height:46px;border-radius:50%;border:1px solid var(--glass-border);background:var(--glass);color:var(--ink);font-size:1.05em;display:grid;place-items:center;cursor:pointer;box-shadow:var(--shadow);transition:transform .12s ease,background .2s ease}.icon-btn:hover{background:var(--glass-strong)}.icon-btn:active{transform:scale(.92)}.icon-btn.on{background:var(--accent);color:#fff;border-color:transparent}.quests{position:fixed;left:50%;bottom:max(18px,env(safe-area-inset-bottom));transform:translate(-50%);width:min(440px,92vw);padding:12px 14px;display:flex;flex-direction:column;gap:9px}.quest-active{display:flex;align-items:center;gap:12px}.quest-active .q-icon{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;color:#fff;font-size:1.15em;flex:none;box-shadow:0 5px 14px #0000001f}.quest-active .q-body{flex:1;min-width:0}.quest-active .q-title{font-weight:700;font-size:1em;display:flex;justify-content:space-between;gap:8px}.quest-active .q-count{color:var(--ink-soft);font-variant-numeric:tabular-nums;font-weight:600}.q-bar{margin-top:6px;height:8px;border-radius:999px;background:#786e9629;overflow:hidden}.q-bar>i{display:block;height:100%;border-radius:999px;transition:width .4s cubic-bezier(.2,.9,.2,1)}.q-hint{font-size:.8em;color:var(--ink-soft);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.q-dots{display:flex;gap:7px;justify-content:center}.q-dot{flex:1;height:34px;border-radius:11px;border:1px solid var(--glass-border);background:#fff6;display:grid;place-items:center;font-size:.92em;color:var(--ink-soft);cursor:pointer;position:relative;transition:transform .1s ease}.q-dot:active{transform:scale(.94)}.q-dot.active{outline:2px solid var(--accent);outline-offset:1px}.q-dot.done{color:#fff}.q-dot .check{position:absolute;right:-3px;top:-3px;width:16px;height:16px;border-radius:50%;background:#6dd6a0;color:#fff;font-size:.62em;display:grid;place-items:center;box-shadow:0 2px 5px #00000026}.scrim{position:fixed;top:0;right:0;bottom:0;left:0;background:#50466e6b;display:grid;place-items:center;padding:20px;z-index:60;animation:fade .25s ease}@keyframes fade{0%{opacity:0}}.panel{width:min(440px,94vw);padding:24px;border-radius:26px;max-height:90vh;overflow:auto;animation:pop .3s cubic-bezier(.2,1.1,.3,1)}@keyframes pop{0%{transform:scale(.9) translateY(10px);opacity:0}}.panel h2{font-family:"Baloo 2",sans-serif;margin:0 0 4px;font-size:1.5em}.panel p.lead{margin:0 0 18px;color:var(--ink-soft)}.field-label{font-weight:700;font-size:.86em;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);margin-bottom:6px}.code-display{font-family:"Baloo 2",monospace;font-size:2em;font-weight:700;letter-spacing:.12em;text-align:center;padding:14px;border-radius:16px;background:#ffffff8c;border:1px dashed var(--accent);color:var(--ink);-webkit-user-select:all;user-select:all}.row{display:flex;gap:10px;align-items:center}input.code-input{flex:1;font-family:"Baloo 2",monospace;font-size:1.3em;letter-spacing:.1em;text-transform:uppercase;text-align:center;padding:12px;border-radius:14px;border:1.5px solid var(--glass-border);background:#ffffffb3;color:var(--ink);outline:none;min-width:0}input.code-input:focus{border-color:var(--accent)}.btn{border:none;cursor:pointer;font-family:inherit;font-weight:700;border-radius:14px;padding:13px 20px;font-size:1em;display:inline-flex;align-items:center;gap:8px;justify-content:center;transition:transform .12s ease,filter .2s ease}.btn:active{transform:scale(.96)}.btn-primary{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff;box-shadow:0 8px 20px #00000024}.btn-primary:hover{filter:brightness(1.04)}.btn-ghost{background:#ffffff80;color:var(--ink);border:1px solid var(--glass-border)}.btn-full{width:100%}.muted-note{font-size:.82em;color:var(--ink-soft);text-align:center;margin-top:10px}.spacer{height:14px}.hues{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.hue-chip{width:40px;height:40px;border-radius:50%;border:2px solid #fff;cursor:pointer;box-shadow:0 4px 10px #0000001f;transition:transform .12s ease}.hue-chip:active{transform:scale(.9)}.hue-chip.sel{outline:3px solid var(--accent);outline-offset:2px}.start{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;z-index:30;padding:24px;background:radial-gradient(120% 90% at 50% 10%,#ffffff40,#7864a040)}.start-card{width:min(460px,94vw);padding:30px 26px;text-align:center;border-radius:30px}.start-card .logo{font-family:"Baloo 2",sans-serif;font-size:2.6em;font-weight:800;line-height:1;background:linear-gradient(120deg,#ff9bc4,#b69bff 50%,#8fd5ff);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:6px}.start-card .tag{color:var(--ink-soft);margin-bottom:22px}.controls-hint{display:flex;gap:18px;justify-content:center;margin:18px 0 22px;color:var(--ink-soft);font-size:.86em;flex-wrap:wrap}.controls-hint b{color:var(--ink)}.toast{position:fixed;top:76px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:12px;padding:12px 18px;border-radius:999px;z-index:25;animation:toastIn .35s cubic-bezier(.2,1.1,.3,1);max-width:92vw}@keyframes toastIn{0%{transform:translate(-50%) translateY(-14px);opacity:0}}.toast .t-icon{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:#fff;flex:none}.toast .t-text{font-weight:700;line-height:1.15}.toast .t-sub{font-size:.8em;color:var(--ink-soft);font-weight:600}.warp{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;pointer-events:none;background:radial-gradient(circle at 50% 55%,#fffffff2,#ffebfa99 40%,#beaaff00 75%);animation:warp 1.7s ease-in-out forwards}@keyframes warp{0%{opacity:0;transform:scale(.6)}35%{opacity:1;transform:scale(1.1)}to{opacity:0;transform:scale(1.4)}}.warp-label{position:fixed;top:0;right:0;bottom:0;left:0;z-index:41;display:grid;place-items:center;pointer-events:none;color:var(--ink);font-family:"Baloo 2",sans-serif;font-weight:800;font-size:1.4em;text-shadow:0 2px 10px rgba(255,255,255,.8);animation:fade .6s ease}.desktop-hint{position:fixed;right:max(14px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));font-size:.78em;color:var(--ink-soft);background:var(--glass);border:1px solid var(--glass-border);padding:8px 12px;border-radius:12px;pointer-events:none;opacity:.85}@media(max-width:760px){.desktop-hint{display:none}}.compass{position:fixed;right:16px;top:40%;display:flex;flex-direction:column;align-items:center;gap:6px;z-index:25;pointer-events:none;opacity:0;transition:opacity .3s ease,transform .3s ease}.compass-dial{position:relative;width:60px;height:60px;border-radius:50%;display:grid;place-items:center}.compass-rot{position:absolute;top:0;right:0;bottom:0;left:0;transition:transform .12s linear}.compass-arrow{position:absolute;top:4px;left:50%;font-size:19px;transform:translate(-50%) rotate(-45deg);filter:drop-shadow(0 1px 2px rgba(60,50,80,.3))}.compass-icon{font-size:14px;opacity:.92;filter:drop-shadow(0 1px 1px rgba(60,50,80,.25))}.compass-dist{font-size:12px;font-weight:700;color:var(--ink);background:var(--glass);border:1px solid var(--glass-border);padding:1px 9px;border-radius:10px;min-height:16px}