:root{--ink: #eef0ff;--ink-dim: rgba(238, 240, 255, .72);--violet: #a78bfa;--glass: rgba(20, 16, 48, .55);--glass-border: rgba(196, 181, 253, .28);font-size:16px}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{font-family:PingFang SC,Hiragino Sans GB,Microsoft YaHei,system-ui,-apple-system,sans-serif;color:var(--ink);overflow:hidden;line-height:1.6;background:radial-gradient(60% 80% at 78% 40%,rgba(64,120,255,.28),transparent 60%),radial-gradient(50% 60% at 12% 88%,rgba(168,85,247,.3),transparent 65%),radial-gradient(40% 50% at 85% 85%,rgba(34,211,238,.16),transparent 60%),linear-gradient(160deg,#171034,#0e0b26 45%,#241249)}#app{position:fixed;inset:0}#scene{position:absolute;inset:0;width:100%;height:100%}#vignette{position:absolute;inset:0;pointer-events:none;background:radial-gradient(120% 90% at 50% 42%,transparent 55%,rgba(11,10,31,.5) 100%)}.pill{position:absolute;padding:10px 18px;border-radius:999px;background:var(--glass);border:1px solid var(--glass-border);backdrop-filter:blur(14px);font-size:.9rem;color:var(--ink-dim);white-space:nowrap}.hint{top:clamp(20px,4vh,40px);left:50%;transform:translate(-50%);max-width:calc(100vw - 40px);white-space:normal;text-align:center;transition:opacity .9s ease}.hint.fade{opacity:0;pointer-events:none}.toast{bottom:clamp(24px,5vh,48px);left:50%;transform:translate(-50%);animation:toast-in .3s ease}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,8px)}}.gear-btn{position:absolute;right:clamp(16px,3vw,40px);bottom:clamp(16px,4vh,36px);width:46px;height:46px;display:grid;place-items:center;color:var(--ink-dim);background:var(--glass);border:1px solid var(--glass-border);border-radius:50%;backdrop-filter:blur(14px);cursor:pointer;transition:color .18s ease,transform .3s ease,border-color .18s ease}.gear-btn svg{width:22px;height:22px}.gear-btn:hover{color:#fff;border-color:var(--violet);transform:rotate(40deg)}.gear-btn:focus-visible{outline:2px solid var(--violet);outline-offset:3px}.settings-panel{position:absolute;right:clamp(16px,3vw,40px);bottom:clamp(76px,12vh,96px);width:min(320px,calc(100vw - 32px));padding:20px 22px;border-radius:20px;background:var(--glass);border:1px solid var(--glass-border);backdrop-filter:blur(20px);box-shadow:0 18px 60px #0503148c}.settings-panel h2{font-size:1rem;font-weight:600;margin-bottom:12px}.settings-panel .row{display:flex;flex-direction:column;gap:6px;padding:8px 0;font-size:.88rem;color:var(--ink-dim);border-top:1px solid rgba(196,181,253,.12)}.settings-panel .row:first-of-type{border-top:none}.settings-panel .row>span{display:flex;justify-content:space-between;align-items:center}.settings-panel .row b{color:var(--ink);font-weight:500}.settings-panel .row.dim{opacity:.45}.settings-panel .row:has(input[type=checkbox]),.settings-panel .row:has(select){flex-direction:row;justify-content:space-between;align-items:center}.settings-panel input[type=range]{width:100%;accent-color:var(--violet);cursor:pointer}.settings-panel input[type=checkbox]{width:18px;height:18px;accent-color:var(--violet);cursor:pointer}.settings-panel select{font:inherit;font-size:.85rem;color:var(--ink);background:#1e1646e6;border:1px solid var(--glass-border);border-radius:8px;padding:4px 8px;cursor:pointer}.settings-panel .actions{display:flex;gap:10px;margin-top:14px}.settings-panel .actions button{flex:1;font:inherit;font-size:.85rem;color:var(--ink-dim);padding:9px 0;background:#6d4ae02e;border:1px solid var(--glass-border);border-radius:999px;cursor:pointer;transition:color .16s ease,background .16s ease}.settings-panel .actions button:hover{color:#fff;background:#6d4ae066}.overlay-panel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(420px,calc(100vw - 48px));padding:32px;text-align:center;border-radius:24px;background:var(--glass);border:1px solid var(--glass-border);backdrop-filter:blur(20px)}.overlay-panel h2{margin-bottom:8px}.overlay-panel p{color:var(--ink-dim);font-size:.95rem}@media (prefers-reduced-motion: reduce){.gear-btn{transition:none}.hint{transition-duration:1ms}@keyframes toast-in{0%{opacity:0;transform:translate(-50%)}}}
