.hud{border:1px solid var(--border);background:color-mix(in srgb, var(--bg) 80%, transparent);backdrop-filter:blur(10px);border-radius:1.25rem;flex-wrap:wrap;align-items:center;gap:1rem 1.5rem;padding:1rem 1.25rem;display:flex}.xpbar{background:var(--bg-elevated);border-radius:999px;height:10px;overflow:hidden}.xpbar span{border-radius:inherit;background:linear-gradient(90deg, var(--accent-cyan), var(--accent-blue), var(--accent-violet));width:0;height:100%;transition:width .8s cubic-bezier(.2,.8,.2,1);display:block}.stat{border:1px solid var(--border);color:var(--text-muted);border-radius:999px;padding:.35rem .85rem;font-size:.82rem}.stat b{color:var(--text)}.quest{grid-template-columns:repeat(2,minmax(0,1fr));gap:2.25rem 1rem;padding:1.5rem .5rem 2rem;display:grid;position:relative}@media (width>=768px){.quest{grid-template-columns:repeat(4,minmax(0,1fr));gap:3rem 1.5rem}}.quest-svg{pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.q-base{fill:none;stroke:var(--border);stroke-width:3px;stroke-dasharray:2 10;stroke-linecap:round}.q-prog{fill:none;stroke:url(#qgrad);stroke-width:5px;stroke-linecap:round;filter:drop-shadow(0 0 6px color-mix(in srgb, var(--accent-violet) 60%, transparent));transition:stroke-dashoffset 1.2s cubic-bezier(.2,.8,.2,1)}.node{z-index:1;grid-row:var(--r2);grid-column:var(--c2);text-align:center;opacity:0;animation:.55s cubic-bezier(.2,.8,.2,1) forwards node-in;animation-delay:calc(var(--i) * 60ms);border-radius:1rem;flex-direction:column;align-items:center;padding:.25rem;display:flex;position:relative;transform:translateY(14px)scale(.96)}@media (width>=768px){.node{grid-row:var(--r4);grid-column:var(--c4)}}@keyframes node-in{to{opacity:1;transform:none}}.orb{border:2px solid var(--border);background:var(--bg);border-radius:50%;place-items:center;width:76px;height:76px;font-size:1.9rem;transition:transform .25s,border-color .25s,box-shadow .25s;display:grid;position:relative}.node:hover .orb{transform:translateY(-3px)scale(1.04)}.orb-check,.orb-lock{border-radius:50%;place-items:center;width:26px;height:26px;font-size:.8rem;display:none;position:absolute;bottom:-4px;right:-4px}.orb-check{background:linear-gradient(135deg, var(--accent-cyan), var(--accent-violet));color:#fff;font-weight:700}.orb-lock{background:var(--bg-elevated);border:1px solid var(--border)}.node-title{color:var(--text);margin-top:.15rem;font-size:.95rem;font-weight:600;line-height:1.25}.node.is-done .orb{background:linear-gradient(var(--bg), var(--bg)) padding-box, linear-gradient(135deg, var(--accent-cyan), var(--accent-violet)) border-box;border:3px solid #0000}.node.is-done .orb-check{display:grid}.node.is-current .orb{border-color:var(--accent-violet);box-shadow:0 0 0 0 color-mix(in srgb, var(--accent-violet) 55%, transparent);animation:2s infinite pulse}.node.is-locked .orb{filter:grayscale();opacity:.55}.node.is-locked .orb-lock{display:grid}.node.is-locked .node-title{color:var(--text-muted)}.node[aria-current=step] .orb{outline:2px solid var(--accent-cyan);outline-offset:4px;transform:scale(1.08)}@keyframes pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--accent-violet) 55%, transparent)}70%{box-shadow:0 0 0 16px #0000}to{box-shadow:0 0 #0000}}.stage-panel{border:1px solid var(--border);background:var(--bg);border-radius:1.5rem;padding:1.5rem;animation:.4s both panel-in}@media (width>=768px){.stage-panel{padding:2.25rem}}@keyframes panel-in{0%{opacity:0;transform:translateY(10px)}}.goal{border-left:3px solid var(--accent-violet);padding:.25rem 0 .25rem 1rem}.box{border:1px solid var(--border);background:color-mix(in srgb, var(--bg-elevated) 45%, transparent);border-radius:1.1rem;padding:1.15rem 1.25rem}.box-h{font-family:var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--accent-cyan);font-size:.75rem}.steps{counter-reset:st;gap:.75rem;display:grid}.steps li{counter-increment:st;color:var(--text);padding-left:2.25rem;position:relative}.steps li:before{content:counter(st);color:#fff;background:linear-gradient(135deg, var(--accent-blue), var(--accent-violet));border-radius:50%;place-items:center;width:1.5rem;height:1.5rem;font-size:.75rem;font-weight:600;display:grid;position:absolute;top:.05rem;left:0}.ck{border:1px solid var(--border);cursor:pointer;border-radius:.75rem;align-items:flex-start;gap:.65rem;padding:.6rem .75rem;transition:border-color .2s,background .2s;display:flex}.ck input{accent-color:var(--accent-violet);width:1rem;height:1rem;margin-top:.25rem}.ck:has(input:checked){border-color:color-mix(in srgb, var(--accent-violet) 60%, transparent);background:color-mix(in srgb, var(--accent-violet) 8%, transparent)}.ck:has(input:checked) span{color:var(--text-muted);text-decoration:line-through}.ck:has(input:disabled){cursor:not-allowed;opacity:.55}.lock-note,.done-note{border-radius:.9rem;padding:.7rem 1rem;font-size:.92rem;display:none}.lock-note{border:1px dashed var(--border);color:var(--text-muted)}.stage-panel.is-locked .lock-note{display:block}.done-note{border:1px solid color-mix(in srgb, var(--accent-cyan) 50%, transparent);color:var(--text)}.checklist.is-done .done-note{display:block}.mini-chip{font-family:var(--font-mono);border:1px solid var(--border);color:var(--text);border-radius:999px;padding:.15rem .6rem;font-size:.75rem}.copy-chip{border:1px solid var(--border);background:var(--bg-soft);font-family:var(--font-mono);color:var(--text);border-radius:8px;padding:.2rem .55rem;font-size:.85rem;transition:border-color .2s;display:inline-block}.copy-chip:hover{border-color:var(--accent-blue)}.copy-chip[data-copied]:after{content:"  ✓";color:var(--accent-cyan)}.toast{z-index:60;color:#fff;background:linear-gradient(90deg, var(--accent-blue), var(--accent-violet));border-radius:999px;padding:.75rem 1.25rem;font-weight:600;animation:.35s both panel-in;position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%);box-shadow:0 20px 40px -15px #00000080}.confetti{z-index:59;pointer-events:none;border-radius:2px;width:8px;height:14px;animation:linear forwards fall;position:fixed;top:-12px}@keyframes fall{to{transform:translate3d(var(--dx), 105vh, 0) rotate(var(--rot));opacity:.9}}@media (prefers-reduced-motion:reduce){.node,.stage-panel,.node.is-current .orb{opacity:1;transform:none;animation:none!important}.q-prog,.xpbar span{transition:none}}
