:root{font-family:Inter,SF Pro Display,PingFang SC,Noto Sans SC,system-ui,sans-serif;color:#eaf5ff;background:#030711;font-synthesis:none;color-scheme:dark}*{box-sizing:border-box}html,body,#stage,#app{margin:0;width:100%;height:100%;overflow:hidden}body{background:radial-gradient(circle at 50% 40%,#0b213c,#030711 60%)}button,input,select{font:inherit}button{color:inherit}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #73c9ff;outline-offset:3px}#stage{position:fixed;inset:0;display:block;touch-action:none}#app:before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 48%,transparent 28%,rgba(2,6,14,.12) 68%,rgba(1,3,8,.58) 100%)}.brand{position:fixed;z-index:5;top:max(28px,env(safe-area-inset-top));left:max(32px,env(safe-area-inset-left));display:flex;gap:11px;align-items:center;opacity:.78}.brand-mark{width:16px;height:16px;border:1px solid rgba(119,211,255,.75);transform:rotate(45deg);box-shadow:0 0 16px #2c9aff80;position:relative}.brand-mark:after{content:"";position:absolute;inset:4px;background:#a1e6ff;box-shadow:0 0 9px #6cd3ffd9}.brand b{display:block;letter-spacing:.23em;font-size:10px;font-weight:600}.brand small{display:block;margin-top:4px;color:#607b8f;font-size:8px;letter-spacing:.14em}.top-actions{position:fixed;z-index:12;top:max(20px,env(safe-area-inset-top));right:max(24px,env(safe-area-inset-right));display:flex;padding:4px;gap:2px;border:1px solid rgba(120,191,235,.16);border-radius:15px;background:#050d178a;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 12px 34px #0000002e}.icon-btn,.close-btn{border:1px solid transparent;background:transparent;cursor:pointer;transition:border-color .2s,background .2s,color .2s}.icon-btn{min-width:58px;height:39px;padding:0 10px;border-radius:11px;color:#8da5b7;display:flex;align-items:center;justify-content:center;gap:7px}.icon-btn span{color:#cbeeff;font-size:14px;line-height:1}.icon-btn small{font-size:9px;letter-spacing:.08em}.icon-btn:hover,.icon-btn[aria-expanded=true],.icon-btn[aria-pressed=true]{border-color:#63caff40;background:#2978aa29;color:#e4f7ff}.close-btn{width:36px;height:36px;border-radius:10px;font-size:22px;color:#8295a6}.close-btn:hover{border-color:#63caff4d;background:#1e5a872e;color:#dff6ff}.video-preview{position:fixed;z-index:7;right:28px;bottom:84px;width:176px;aspect-ratio:4/3;border:1px solid rgba(93,181,230,.25);border-radius:12px;overflow:hidden;background:#07111e;opacity:0;transform:translateY(10px);pointer-events:none;transition:.3s;box-shadow:0 18px 50px #00000038}.video-preview.visible{opacity:1;transform:none}.video-preview video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1);filter:saturate(.65) contrast(1.1) brightness(.7)}.video-preview span{position:absolute;left:9px;bottom:8px;font-size:8px;letter-spacing:.18em;color:#79d9ff}.studio{position:fixed;z-index:20;right:16px;top:16px;bottom:16px;width:min(360px,calc(100vw - 32px));padding:24px;border:1px solid rgba(112,186,229,.16);border-radius:18px;background:#040b14e8;-webkit-backdrop-filter:blur(28px);backdrop-filter:blur(28px);box-shadow:0 24px 80px #0000006b;transform:translate(calc(100% + 40px));transition:.35s cubic-bezier(.2,.8,.2,1);overflow:auto;scrollbar-width:thin;scrollbar-color:#26445a transparent}.studio.open{transform:none}.studio-head{display:flex;justify-content:space-between;align-items:start;margin-bottom:22px}.studio-head small,.eyebrow{font-size:8px;letter-spacing:.22em;color:#4baeea}.studio h2{margin:7px 0 0;font-size:20px;font-weight:500}.close-btn{font-size:24px;color:#8295a6}.preset-switcher{position:fixed;z-index:15;top:74px;right:24px;width:min(510px,calc(100vw - 40px));max-height:calc(100vh - 104px);padding:16px;border:1px solid rgba(108,184,230,.16);border-radius:17px;background:#040c16e6;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);box-shadow:0 24px 70px #00000057;opacity:0;transform:translateY(-8px) scale(.985);transform-origin:top right;pointer-events:none;transition:.22s;overflow:hidden}.preset-switcher.open{opacity:1;transform:none;pointer-events:auto}.preset-switcher-head{height:27px;padding:0 3px 10px;display:flex;align-items:start;justify-content:space-between;color:#bdd7e8;font-size:10px;letter-spacing:.1em}.preset-switcher-head small{color:#4f7187;font-size:7px;letter-spacing:.16em}.preset-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;max-height:calc(100vh - 158px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#26445a transparent}.preset-card{position:relative;min-height:94px;text-align:left;padding:13px 14px;border:1px solid rgba(99,174,218,.13);border-radius:11px;background:#0b19269e;cursor:pointer;overflow:hidden;transition:border-color .2s,background .2s,transform .2s}.preset-card:after{content:"";position:absolute;left:0;top:13px;bottom:13px;width:1px;background:transparent}.preset-card:hover{border-color:#67c7f859;background:#11283ab8;transform:translateY(-1px)}.preset-card.active{border-color:#69cfff80;background:linear-gradient(120deg,#1f689142,#081927bd);box-shadow:0 0 24px #34a4e514}.preset-card.active:after{background:#78d8ff;box-shadow:0 0 10px #4bbbf2}.preset-card small{display:block;color:#4f8eaf;font-size:7px;letter-spacing:.14em}.preset-card b{display:block;margin:7px 0 5px;font-size:12px;font-weight:500;letter-spacing:.03em}.preset-card span{display:-webkit-box;color:#6f899c;font-size:8px;line-height:1.5;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.common-controls{margin-top:28px;padding-top:4px;border-top:1px solid #172b3c}.studio-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:22px}.studio-actions button{padding:9px;border:1px solid #26465d;border-radius:9px;background:#0a1b29;color:#8fc9eb;cursor:pointer}.studio-actions button:first-child{grid-column:1/-1}.studio-actions button:hover{border-color:#58bde9}.field output{font-variant-numeric:tabular-nums}.field{display:block;margin:25px 0;color:#9fb1c0;font-size:11px}.field>span{display:flex;justify-content:space-between;margin-bottom:12px}.field output{color:#67c8ff}.field input[type=range]{width:100%;accent-color:#52bfff}.field input[type=color]{width:100%;height:35px;border:0;border-radius:7px;background:#0c1a29}.field select{width:100%;padding:10px;border:1px solid #243c50;border-radius:8px;color:#d9efff;background:#0b1724}.switch{display:flex;gap:10px;align-items:center;margin:16px 0;color:#9fb1c0;font-size:11px}.switch input{accent-color:#51bdff}.perf{margin-top:30px;padding-top:18px;border-top:1px solid #172b3c;display:flex;justify-content:space-between;font-size:9px;color:#637b8f}.perf b{color:#80d9ff;font-weight:500}.guide{position:fixed;z-index:10;left:50%;top:50%;width:min(400px,calc(100vw - 38px));padding:4px 22px;transform:translate(-50%,-50%);text-align:center;transition:.4s;filter:drop-shadow(0 20px 45px rgba(0,0,0,.9))}.guide.hidden{opacity:0;pointer-events:none;transform:translate(-50%,-47%);visibility:hidden}.guide h1{font-size:clamp(32px,4.2vw,48px);font-weight:400;letter-spacing:.14em;margin:11px 0 12px}.guide p{color:#849cac;font-size:11px;line-height:1.7;margin:0 auto;max-width:340px}.gesture-demo{height:38px;margin:19px auto 17px;display:flex;align-items:center;justify-content:center;gap:12px}.gesture-demo span{font-size:27px;color:#a5e7ff;text-shadow:0 0 24px rgba(53,153,255,.85)}.gesture-demo i{width:30px;height:1px;background:linear-gradient(90deg,transparent,#3d93c4)}.gesture-demo i:nth-of-type(2){transform:scaleX(-1)}.gesture-demo strong,.gesture-demo em{font-style:normal;font-size:8px;font-weight:500;letter-spacing:.14em;color:#607f94}.primary{display:block;width:230px;margin:0 auto 8px;padding:12px 18px;border:1px solid rgba(108,207,255,.75);border-radius:12px;background:linear-gradient(110deg,#1960969e,#2a84b385);box-shadow:0 10px 30px #1968a629;cursor:pointer;font-size:11px;letter-spacing:.08em;transition:.2s}.primary:hover{border-color:#a8e9ff;background:#257fbaad;box-shadow:0 12px 36px #309ce03d}.primary:disabled{opacity:.6}.text-btn{border:0;background:none;color:#6f899b;cursor:pointer;font-size:9px;padding:8px}.text-btn:hover{color:#b4d2e4}.guide>small{display:block;color:#3f586a;font-size:8px;margin-top:10px}.retry-btn{display:block;width:250px;margin:0 auto 8px;padding:10px 16px;border:1px solid #d19550;border-radius:24px;background:#7445143d;color:#ffd19a;cursor:pointer;font-size:11px}.retry-btn[hidden]{display:none}.status-pill{position:fixed;z-index:8;left:max(28px,env(safe-area-inset-left));bottom:max(24px,env(safe-area-inset-bottom));height:48px;border:1px solid rgba(101,179,225,.14);border-radius:14px;background:#050d1785;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);display:flex;align-items:center;padding:0 16px;gap:10px;box-shadow:0 12px 36px #0003}.status-pill small{display:block;color:#506d80;font-size:6px;letter-spacing:.16em;text-transform:uppercase}.status-pill b{display:block;margin-top:3px;font-size:9px;font-weight:500;min-width:72px;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.status-pill>i{width:1px;height:21px;background:#3e66814d}.signal{width:6px;height:6px;border-radius:50%;background:#425867;box-shadow:0 0 0 3px #4b667814}.signal.active{background:#79dcff;box-shadow:0 0 10px #3eaeeacc}.expansion-state b{min-width:30px}.meter{width:54px;height:2px;background:#284d678c;overflow:hidden}.meter span{display:block;width:0;height:100%;background:#7cdaff;box-shadow:0 0 7px #4cbaf1;transition:width .12s}.hint{position:fixed;z-index:4;right:max(29px,env(safe-area-inset-right));bottom:max(29px,env(safe-area-inset-bottom));font-size:7px;color:#2f4a5e;letter-spacing:.13em;white-space:nowrap}.toast{position:fixed;z-index:30;top:82px;left:50%;transform:translate(-50%,-10px);padding:9px 16px;border:1px solid rgba(64,128,166,.7);border-radius:12px;background:#05121de6;font-size:9px;color:#9bddff;opacity:0;pointer-events:none;transition:.25s;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.toast.visible{opacity:1;transform:translate(-50%)}.toast.warning{color:#ffc47a;border-color:#815a28}@media(max-width:650px){.brand{top:20px;left:20px}.brand small{display:none}.top-actions{top:13px;right:13px}.icon-btn{min-width:41px;padding:0 8px}.icon-btn small{display:none}.video-preview{width:125px;right:14px;bottom:82px}.studio{inset:auto 10px 10px;width:auto;max-height:72vh;border-radius:18px;transform:translateY(calc(100% + 30px))}.preset-switcher{top:66px;right:12px;width:calc(100vw - 24px);max-height:calc(100vh - 84px);padding:13px}.preset-grid{grid-template-columns:1fr;max-height:calc(100vh - 137px)}.preset-card{min-height:78px}.status-pill{left:12px;right:12px;width:auto;bottom:max(14px,env(safe-area-inset-bottom));padding:0 12px;gap:7px}.status-pill b{min-width:45px;max-width:72px}.status-pill>i:nth-of-type(2){display:none}.meter{flex:1}.hint{display:none}.guide{top:47%;padding:0 12px}.guide h1{font-size:34px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}