*{margin:0;padding:0;box-sizing:border-box}html,body,#app{width:100%;height:100%;overflow:hidden}body{font-family:PingFang SC,Microsoft YaHei,Segoe UI,Helvetica Neue,Arial,sans-serif;background:#041c2e;color:#dff4ff;-webkit-font-smoothing:antialiased}.app-root{width:100%;height:100%}.stage{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0}.stage canvas{display:block}.panel{position:fixed;left:22px;top:50%;transform:translateY(-50%);width:270px;max-height:calc(100vh - 90px);overflow-y:auto;padding:18px 18px 14px;z-index:10;-webkit-user-select:none;user-select:none;border-radius:18px;background:linear-gradient(160deg,#0a304c9e,#041a2c8c);backdrop-filter:blur(14px) saturate(1.35);-webkit-backdrop-filter:blur(14px) saturate(1.35);border:1px solid rgba(110,215,255,.28);box-shadow:0 12px 40px #000a1473,inset 0 1px #a0e6ff2e}.panel-title{display:flex;align-items:center;gap:8px;font-size:17px;font-weight:700;letter-spacing:1px;color:#eaffff;text-shadow:0 0 12px rgba(80,200,255,.6)}.panel-sub{font-size:11px;color:#aadcf58c;margin:4px 0 12px;letter-spacing:.5px}.divider{height:1px;background:linear-gradient(90deg,transparent,rgba(110,215,255,.3),transparent);margin:12px 0}.section-title{font-size:12px;color:#8cd2f0a6;letter-spacing:2px;margin:2px 0 10px}.ctl{margin:14px 0}.ctl-head{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:#bfe6f8;margin-bottom:8px}.ctl-value{font-size:12px;color:#53e0ff;font-variant-numeric:tabular-nums;background:#53e0ff14;border:1px solid rgba(83,224,255,.22);padding:1px 8px;border-radius:20px}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:6px;border-radius:3px;outline:none;cursor:pointer;background:linear-gradient(90deg,#2ee6ff var(--fill, 50%),rgba(90,140,170,.28) var(--fill, 50%))}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#d9faff,#2ec5ff 60%,#0f9fd0);border:2px solid rgba(255,255,255,.85);box-shadow:0 0 10px #2ec5ffcc;cursor:grab}input[type=range]::-webkit-slider-thumb:active{cursor:grabbing}input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#d9faff,#2ec5ff 60%,#0f9fd0);border:2px solid rgba(255,255,255,.85);box-shadow:0 0 10px #2ec5ffcc;cursor:grab}input[type=range]::-moz-range-track{height:6px;border-radius:3px;background:#5a8caa47}.switch{position:relative;display:inline-block;width:46px;height:24px;flex:none;cursor:pointer}.switch input{display:none}.switch .track{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:12px;background:#5a8caa4d;border:1px solid rgba(120,200,235,.25);transition:all .25s ease}.switch .track:after{content:"";position:absolute;left:3px;top:50%;transform:translateY(-50%);width:18px;height:18px;border-radius:50%;background:#7c98a8;transition:all .25s ease}.switch input:checked+.track{background:linear-gradient(90deg,#0f9fd0,#2ee6ff);box-shadow:0 0 12px #2ee6ff8c}.switch input:checked+.track:after{left:25px;background:#fff}.btn{width:100%;padding:10px 12px;border:none;border-radius:12px;font-size:14px;font-weight:600;font-family:inherit;color:#04222f;cursor:pointer;background:linear-gradient(135deg,#3ce0ff,#2e8fff);box-shadow:0 6px 18px #2e8fff59;transition:transform .15s ease,box-shadow .15s ease,filter .15s ease}.btn:hover:not(:disabled){transform:translateY(-1px);filter:brightness(1.08)}.btn:active:not(:disabled){transform:translateY(0) scale(.98)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.ghost{background:#78c8f01f;color:#cfeeff;border:1px solid rgba(120,200,240,.35);box-shadow:none}.btn+.btn{margin-top:10px}.hints{list-style:none;font-size:12px;color:#bee1f5bf;line-height:2}.panel::-webkit-scrollbar{width:6px}.panel::-webkit-scrollbar-thumb{background:#78c8f04d;border-radius:3px}.panel::-webkit-scrollbar-track{background:transparent}.footer{position:fixed;left:0;right:0;bottom:10px;text-align:center;font-size:12px;letter-spacing:2px;color:#bee1f580;z-index:5;pointer-events:none;text-shadow:0 1px 4px rgba(0,0,0,.4)}@media (max-width: 768px){.panel{left:12px;width:232px;padding:14px}.footer{font-size:10px;letter-spacing:1px}}