:root{--bg:#08090c;--surface:#101217;--surface-2:#151820;--line:#252933;--line-hi:#3a404d;--text:#f4f5f7;--muted:#898f9d;--dim:#5b606b;--lime:#c9ff3d;--lime-ink:#121806;--orange:#ff6a3d;--font:"Bahnschrift","Segoe UI","Microsoft YaHei",sans-serif;--mono:"Cascadia Code",Consolas,monospace}
*{box-sizing:border-box}html{color-scheme:dark}body{margin:0;min-height:100vh;background:var(--bg);color:var(--text);font:14px/1.5 var(--font);background-image:radial-gradient(circle at 14% 0,rgba(201,255,61,.055),transparent 27%),linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:auto,64px 64px,64px 64px}button,select,input{font:inherit}button{color:inherit}.topbar{height:72px;padding:0 36px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #1b1e24;background:rgba(8,9,12,.88);backdrop-filter:blur(18px);position:sticky;top:0;z-index:20}.brand{display:flex;align-items:center;gap:10px;color:var(--text);text-decoration:none;font-weight:700;font-size:17px;letter-spacing:.03em}.brandmark{width:30px;height:30px;display:grid;place-items:center;background:var(--lime);color:var(--lime-ink);font:700 15px var(--mono)}.brand-slash{color:var(--lime)}.brand small{font:500 9px var(--mono);letter-spacing:.17em;color:var(--dim);margin-left:7px}.connection{display:flex;align-items:center;gap:11px;color:var(--muted);font-size:12px}.connection #statusDot{width:7px;height:7px;border-radius:50%;background:#555b66}.connection.connected #statusDot{background:var(--lime);box-shadow:0 0 13px rgba(201,255,61,.65)}button{border:0;cursor:pointer}.outline-button{padding:9px 15px;background:transparent;border:1px solid var(--line-hi);margin-left:6px}.outline-button:hover{border-color:var(--lime);color:var(--lime)}
.device-gate{position:fixed;z-index:18;inset:72px 0 0;background:#08090c;overflow:hidden}.boot-sequence{position:absolute;inset:0;display:grid;place-content:center;text-align:center}.boot-word{display:flex;align-items:center;justify-content:center;gap:18px;overflow:hidden;font:700 clamp(54px,9vw,126px)/1 var(--font);letter-spacing:-.08em}.boot-word i{width:8px;height:.82em;background:var(--lime);transform:skew(-14deg);font-size:0}.boot-track{width:min(420px,65vw);height:1px;background:#22262e;margin:28px auto 13px;overflow:hidden}.boot-track b{display:block;width:100%;height:100%;background:var(--lime);transform:scaleX(0);transform-origin:left}.boot-sequence small{font:500 9px var(--mono);letter-spacing:.35em;color:var(--dim)}.connect-stage{position:absolute;inset:0;opacity:0;display:grid;grid-template-columns:minmax(420px,.8fr) minmax(520px,1.2fr);align-items:center;max-width:1500px;margin:auto;padding:40px 6vw 70px}.connect-stage::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 72% 48%,rgba(201,255,61,.08),transparent 28%);pointer-events:none}.gate-copy{position:relative;z-index:3;max-width:560px}.gate-copy h1{font-size:clamp(46px,5.4vw,82px);line-height:.98;letter-spacing:-.065em;margin:14px 0 22px}.gate-copy h1 em{font-style:normal;color:var(--lime)}.gate-copy p{max-width:440px;color:var(--muted);font-size:14px;line-height:1.8}.gate-connect{width:270px;margin-top:34px;padding:15px 17px;display:flex;align-items:center;justify-content:space-between;background:var(--text);color:#101115;font-weight:700}.gate-connect:hover{background:var(--lime)}.gate-connect:disabled{opacity:.55}.gate-connect b{font-size:18px}.gate-copy>small{display:block;color:var(--dim);font-size:10px;margin-top:12px}.gate-device{height:min(69vh,690px);position:relative;display:grid;place-items:center}.gate-device::before{content:"PDS / ACTIVE HARDWARE";position:absolute;right:5%;top:5%;font:500 9px var(--mono);letter-spacing:.16em;color:var(--dim)}.gate-device img{z-index:2;max-width:68%;max-height:74%;object-fit:contain;filter:drop-shadow(0 45px 45px rgba(0,0,0,.8))}.gate-cable{position:absolute;z-index:4;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.cable-line{fill:none;stroke:#23262d;stroke-width:22;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;filter:drop-shadow(0 8px 8px rgba(0,0,0,.65))}.cable-plug rect{fill:#171a20;stroke:#3a404a;stroke-width:2}.cable-plug .plug-metal{fill:#8d929a;stroke:#c8cbd0}.cable-plug path{fill:none;stroke:#3d424a;stroke-width:2}.plug-flash{fill:var(--lime);opacity:0;filter:drop-shadow(0 0 12px var(--lime))}.gate-orbit{position:absolute;border:1px solid #242933;border-radius:50%}.orbit-one{width:min(48vw,590px);height:min(48vw,590px)}.orbit-two{width:min(36vw,430px);height:min(36vw,430px);border-style:dashed}.gate-scan{position:absolute;width:76%;height:1px;top:18%;z-index:3;background:linear-gradient(90deg,transparent,var(--lime),transparent);box-shadow:0 0 15px rgba(201,255,61,.55);animation:gateScan 4s ease-in-out infinite}.gate-index{position:absolute;left:6vw;right:6vw;bottom:27px;display:flex;align-items:center;gap:9px;color:var(--dim);font:500 9px var(--mono);letter-spacing:.12em}.gate-index span{color:var(--lime)}.gate-index i{height:1px;flex:1;background:#242830}.app-shell,body:not(.device-connected) footer{visibility:hidden;opacity:0}.device-connected .app-shell,.device-connected footer{visibility:visible;opacity:1}@keyframes gateScan{0%,100%{transform:translateY(0);opacity:0}15%{opacity:1}82%{transform:translateY(430px);opacity:.6}95%{opacity:0}}
.app-shell{max-width:1580px;margin:auto;padding:38px 36px 122px}.command-bar{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:24px}.eyebrow{font:600 10px var(--mono);letter-spacing:.16em;color:var(--lime)}h1,h2,p{margin:0}.command-bar h1{font-size:30px;letter-spacing:-.04em;margin-top:5px}.profiles{display:flex;align-items:center;gap:14px}.profiles>span{font:500 10px var(--mono);color:var(--dim);letter-spacing:.1em}.profiles>div{display:flex;background:#0d0f13;border:1px solid var(--line);padding:3px}.profiles button{min-width:80px;padding:9px 13px;background:transparent;color:var(--muted);font-size:12px}.profiles button.active{background:var(--text);color:#0b0c0f}.studio-grid{display:grid;grid-template-columns:minmax(440px,.82fr) minmax(650px,1.18fr);gap:18px}.visual-column,.config-column{display:flex;flex-direction:column;gap:18px}.surface,.device-view{background:rgba(16,18,23,.94);border:1px solid var(--line)}
.device-view{height:520px;padding:24px;position:relative;display:grid;grid-template-rows:auto 1fr auto;overflow:hidden}.device-view::after{content:"";position:absolute;width:150px;height:3px;right:24px;top:0;background:var(--lime)}.device-heading,.section-title{display:flex;align-items:flex-start;justify-content:space-between}.device-heading h2{font-size:35px;letter-spacing:-.045em;margin-top:2px}.ready-state{font:600 10px var(--mono);letter-spacing:.12em;color:var(--muted);display:flex;align-items:center;gap:8px}.ready-state i{width:6px;height:6px;background:var(--lime);box-shadow:0 0 10px var(--lime)}.mouse-canvas{min-height:0;position:relative;display:grid;place-items:center;margin:4px 0}.mouse-canvas::before{content:"";position:absolute;width:270px;height:270px;border:1px solid #20242c;border-radius:50%}.mouse-canvas::after{content:"";position:absolute;width:190px;height:190px;border:1px dashed #2a2f39;border-radius:50%}.axis{position:absolute;background:#242933}.axis-x{width:82%;height:1px}.axis-y{height:86%;width:1px}.mouse-canvas img{position:relative;z-index:2;width:auto;height:auto;max-width:72%;max-height:310px;object-fit:contain;filter:drop-shadow(0 22px 24px rgba(0,0,0,.7));will-change:transform,opacity}.model-switch{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}.model-switch button{background:transparent;color:var(--muted);padding:14px 10px;border-right:1px solid var(--line);text-align:left;font-weight:600}.model-switch button:last-child{border-right:0}.model-switch button small{font:500 9px var(--mono);color:var(--dim);margin-right:9px}.model-switch button.active{color:var(--text);box-shadow:inset 0 -2px var(--lime)}.model-switch button.active small{color:var(--lime)}
.performance-card,.assignment-card,.firmware-card{padding:22px}.section-title{margin-bottom:17px}.section-title h2,.firmware-copy h2{font-size:19px;letter-spacing:-.02em;margin-top:3px}.section-title>span{font-size:11px;color:var(--dim)}.dpi-list{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}.dpi-item{border:1px solid var(--line);background:#0c0e12;padding:11px}.dpi-item.active{border-color:#667d31;background:rgba(201,255,61,.035)}.dpi-item header{display:flex;justify-content:space-between;font:500 9px var(--mono);color:var(--dim);margin-bottom:6px}.dpi-item input[type=checkbox]{accent-color:var(--lime)}.dpi-item input[type=number]{width:100%;background:none;border:0;outline:0;color:var(--text);font:600 17px var(--mono)}.sensor-row{display:grid;grid-template-columns:1fr 1fr 1.35fr;gap:10px;margin-top:14px}.sensor-row label>span{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;margin-bottom:7px}.sensor-row select,.function-select,.detail-select,.macro-row select{width:100%;height:38px;padding:0 32px 0 11px;color:var(--text);background:#0c0e12;border:1px solid var(--line);outline:none;appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--dim) 50%),linear-gradient(135deg,var(--dim) 50%,transparent 50%);background-position:calc(100% - 14px) 16px,calc(100% - 10px) 16px;background-size:4px 4px;background-repeat:no-repeat}.sensor-row select:focus,.function-select:focus,.detail-select:focus,.macro-row select:focus{border-color:var(--lime)}.debounce-field input{width:100%;accent-color:var(--lime)}#debounceOut{color:var(--text);font:500 10px var(--mono)}
.assignment-card{min-height:686px}.matrix-head{display:grid;grid-template-columns:104px 150px 1fr;gap:12px;padding:8px 12px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font:500 9px var(--mono);letter-spacing:.12em;color:var(--dim)}.button-rows{display:flex;flex-direction:column}.button-row{display:grid;grid-template-columns:104px 150px minmax(0,1fr);gap:12px;align-items:center;min-height:72px;padding:10px 12px;border-bottom:1px solid #20232a;transition:background .16s}.button-row:hover{background:#13161c}.button-id{display:flex;align-items:center;gap:12px}.button-id strong{width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--line-hi);font:600 13px var(--mono);background:#0a0c0f}.button-id span{font-size:12px;color:var(--muted)}.detail-empty{font-size:11px;color:var(--dim)}.macro-row{display:grid;grid-template-columns:.78fr 1.35fr .82fr;gap:6px}.macro-row select{height:38px;font-size:11px;padding-left:8px}.macro-loading{color:var(--lime);font:500 10px var(--mono)}
.firmware-card{display:flex;align-items:center;justify-content:space-between;gap:24px}.firmware-copy p{font-size:11px;color:var(--muted);margin-top:6px}.firmware-actions{display:flex;gap:8px}.file-button{min-width:132px;text-align:left;padding:10px 13px;background:#0c0e12;border:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.file-button span{font-size:10px;color:var(--muted)}.file-button b{font-size:11px}.file-button:hover{border-color:var(--lime)}
footer{position:fixed;z-index:15;bottom:0;left:0;right:0;height:84px;padding:0 36px;display:flex;align-items:center;justify-content:space-between;background:rgba(8,9,12,.92);backdrop-filter:blur(18px);border-top:1px solid var(--line)}.notice{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:11px}.notice>span{width:22px;height:22px;border:1px solid var(--line-hi);display:grid;place-items:center;font:600 10px var(--mono);color:var(--lime)}.actions{display:flex;gap:8px}.text-button{background:transparent;color:var(--muted);padding:12px 18px}.apply-button{min-width:180px;padding:13px 15px;background:var(--lime);color:var(--lime-ink);font-weight:700;display:flex;align-items:center;justify-content:space-between}.apply-button b{font-size:18px}.apply-button:disabled{opacity:.45;cursor:wait}.legacy-hooks{display:none!important}#toast{position:fixed;z-index:40;top:88px;left:50%;transform:translate(-50%,-8px);opacity:0;pointer-events:none;padding:12px 18px;background:#f4f5f7;color:#111317;font-weight:600;font-size:12px;transition:.2s}#toast.show{opacity:1;transform:translate(-50%,0)}dialog{width:min(460px,calc(100% - 28px));padding:28px;background:#111318;color:var(--text);border:1px solid var(--line-hi)}dialog::backdrop{background:rgba(0,0,0,.75);backdrop-filter:blur(5px)}dialog h3{font-size:21px;margin:8px 0}dialog p{color:var(--muted);font-size:12px;line-height:1.7;margin-bottom:22px}dialog>div{display:flex;justify-content:flex-end}
@media(max-width:1180px){.studio-grid{grid-template-columns:1fr}.assignment-card{min-height:0}.device-view{height:500px}}@media(max-width:760px){.topbar,.app-shell,footer{padding-left:14px;padding-right:14px}.brand small,.profiles>span,.notice{display:none}.command-bar{display:block}.profiles{margin-top:18px}.profiles>div{width:100%}.profiles button{min-width:0;flex:1}.device-view{height:430px;padding:16px}.mouse-canvas img{max-width:76%;max-height:240px}.matrix-head{display:none}.button-row{grid-template-columns:72px 1fr}.row-details{grid-column:1/-1}.macro-row{grid-template-columns:1fr}.sensor-row{grid-template-columns:1fr}.dpi-list{grid-template-columns:repeat(3,1fr)}.firmware-card{display:block}.firmware-actions{margin-top:16px}.file-button{flex:1}.actions{margin-left:auto}.text-button{display:none}}
@media(max-width:820px){.connect-stage{grid-template-columns:1fr;text-align:center;padding:36px 22px}.gate-copy{margin:auto}.gate-copy p{margin:auto}.gate-connect{margin:28px auto 0}.gate-device{position:absolute;inset:0;opacity:.22;height:auto}.gate-device img{max-width:70%;max-height:55%}.gate-index{display:none}.gate-copy h1{font-size:44px}.connection #statusText{display:none}}
.cinematic-device{overflow:hidden}.cinematic-device img{position:absolute;inset:0;width:100%;height:100%;max-width:none;max-height:none;object-fit:cover;object-position:center;opacity:.94}.cinematic-device .gate-scan{z-index:5;opacity:.28}.cinematic-device .gate-cable{z-index:6}
@media(max-width:820px){.cinematic-device{opacity:.3}.cinematic-device img{max-width:none;max-height:none;width:100%;height:100%;object-fit:cover}}
.cable-stage{display:block;max-width:none;padding:0;background:radial-gradient(ellipse at 54% 38%,#16191f 0,#0c0e12 38%,#08090c 70%)}.cable-art{position:absolute;inset:0 0 110px;overflow:hidden}.hero-cable{width:100%;height:100%;overflow:visible}.cable-shadow{fill:none;stroke:#000;stroke-width:34;stroke-linecap:round;opacity:.75;transform:translateY(12px);filter:blur(9px)}.hero-cable .cable-line{stroke:#24272e;stroke-width:26;filter:none}.hero-cable .cable-plug>path{fill:#202329;stroke:#424750;stroke-width:2}.hero-cable .plug-metal{fill:#a7abb1;stroke:#d9dcdf;stroke-width:2}.hero-cable .plug-core{fill:#202329;stroke:#737982}.hero-cable .plug-detail{fill:none;stroke:#8e949c;stroke-width:2}.cable-particles circle{fill:#c9ccd1;filter:drop-shadow(0 0 4px rgba(255,255,255,.45))}.cable-stage .gate-copy{position:absolute;z-index:8;left:50%;bottom:62px;transform:translateX(-50%);max-width:none;text-align:center}.cable-stage .gate-copy h1{font-size:30px;line-height:1.1;letter-spacing:-.035em;margin:7px 0 8px}.cable-stage .gate-copy p{font-size:12px;line-height:1.5;color:var(--muted)}.cable-stage .gate-connect{margin:20px auto 0;width:240px;padding:13px 16px;background:#f3f4f5}.cable-stage .gate-copy>small{margin-top:9px}.cable-stage .gate-index{z-index:8;bottom:18px}.cable-stage::before{display:none}
@media(max-width:820px){.cable-stage .gate-copy{left:20px;right:20px;bottom:80px;transform:none}.cable-art{inset:0 0 170px}.hero-cable{width:150%;transform:translateX(-25%)}.cable-stage .gate-copy h1{font-size:28px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}