:root{--bg: #15171a;--bg-elev: #1d2024;--bg-input: #25282d;--border: #34383e;--text: #e8eaed;--text-dim: #9aa0a6;--accent: #ff7a18;--accent-strong: #ff8c33;--accent-weak: #3a2410;--danger: #ff5c5c;--ok: #4caf7d;--radius: 6px;--radius-sm: 4px;font-family:system-ui,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans SC,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text)}button{font:inherit;color:inherit;cursor:pointer}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.app{max-width:980px;margin:0 auto;padding:24px 20px 64px}.app-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:16px;border-bottom:1px solid var(--border)}.app-title{font-size:18px;font-weight:600;letter-spacing:.2px}.app-title span{color:var(--accent)}.header-actions{display:flex;align-items:center;gap:10px}.tabs{display:flex;gap:4px;margin:20px 0;flex-wrap:wrap}.panel-grid{display:grid;gap:16px}.card{background:var(--bg-elev);border:1px solid var(--border);border-radius:var(--radius)}.card-head{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--border)}.card-title{margin:0;font-size:14px;font-weight:600}.card-actions{display:flex;gap:8px}.card-body{padding:16px;display:grid;gap:14px}.btn{border:1px solid var(--border);background:var(--bg-input);border-radius:var(--radius-sm);padding:7px 14px;font-size:13px}.btn[data-hovered]{border-color:var(--accent)}.btn[data-disabled]{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--accent);border-color:var(--accent);color:#1a1205;font-weight:600}.btn-primary[data-hovered]{background:var(--accent-strong)}.btn-danger{color:var(--danger)}.field{display:grid;gap:6px}.field-label{font-size:12px;color:var(--text-dim)}.select-trigger,.numberfield-group,.numberfield-input{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);padding:7px 10px;font-size:13px;min-width:120px;display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--text)}.numberfield-input{width:100%;border:none;padding:0;background:transparent}.numberfield-group{padding:0 10px}.popover{background:var(--bg-elev);border:1px solid var(--border);border-radius:var(--radius-sm)}.listbox{padding:4px;outline:none}.listbox-item{padding:6px 10px;border-radius:var(--radius-sm);font-size:13px;outline:none;cursor:pointer}.listbox-item[data-focused],.listbox-item[data-selected]{background:var(--accent-weak);color:var(--accent-strong)}.switch{display:inline-flex;align-items:center;gap:8px;font-size:13px}.switch-indicator{width:34px;height:18px;border-radius:9px;background:var(--bg-input);border:1px solid var(--border);position:relative;transition:background .12s}.switch-indicator:after{content:"";position:absolute;top:1px;left:1px;width:14px;height:14px;border-radius:7px;background:var(--text-dim);transition:transform .12s,background .12s}.switch[data-selected] .switch-indicator{background:var(--accent-weak);border-color:var(--accent)}.switch[data-selected] .switch-indicator:after{transform:translate(16px);background:var(--accent)}.tab{padding:8px 14px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-elev);font-size:13px;cursor:pointer}.tab[data-selected]{border-color:var(--accent);color:var(--accent-strong)}.colorfield{display:grid;gap:6px}.colorfield-row{display:flex;align-items:center;gap:10px}.colorfield-native{width:36px;height:28px;padding:0;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-input)}.colorfield-presets{display:flex;gap:6px;flex-wrap:wrap}.swatch{width:22px;height:22px;border:1px solid var(--border);border-radius:var(--radius-sm)}.swatch[data-hovered],.swatch:hover{border-color:var(--accent)}.mouse{display:flex;justify-content:center;padding:8px}.mouse-body{position:relative;width:130px;height:210px;background:var(--bg-input);border:1px solid var(--border);border-radius:65px 65px 40px 40px;overflow:hidden}.mouse-zone{position:absolute;top:0;z-index:1;height:96px;width:50%;background:transparent;border:none;border-bottom:1px solid var(--border)}.mouse-left{left:0;border-right:1px solid var(--border);border-radius:64px 0 0}.mouse-right{right:0;border-radius:0 64px 0 0}.mouse-middle{left:50%;transform:translate(-50%);top:18px;width:22px;height:54px;border:1px solid var(--border);border-radius:11px;display:flex;align-items:center;justify-content:center}.mouse-wheel{width:12px;height:40px;border-radius:6px;background:var(--text-dim)}.mouse-dpi-light{position:absolute;z-index:2;left:-2px;top:64px;width:6px;height:14px;border-radius:999px;pointer-events:none;background:var(--dpi-indicator-color);box-shadow:0 0 8px var(--dpi-indicator-color),0 0 18px var(--dpi-indicator-color)}.mouse-side{position:absolute;left:-1px;width:10px;height:34px;background:var(--bg-elev);border:1px solid var(--border)}.mouse-forward{top:96px;border-radius:0 4px 4px 0}.mouse-back{top:134px;border-radius:0 4px 4px 0}.mouse-zone.is-active,.mouse-side.is-active{background:var(--accent-weak);border-color:var(--accent)}.mouse-zone[data-hovered],.mouse-zone:hover,.mouse-side:hover{background:var(--accent-weak)}.banner{padding:10px 14px;border-radius:var(--radius-sm);font-size:13px;border:1px solid var(--border)}.banner-wake{background:var(--accent-weak);border-color:var(--accent);color:var(--accent-strong)}.banner-error{border-color:var(--danger);color:var(--danger)}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%);z-index:50;padding:10px 16px;border-radius:var(--radius-sm);font-size:13px;border:1px solid var(--border);background:var(--bg-elev)}.toast-ok{border-color:var(--ok);color:var(--ok)}.toast-error{border-color:var(--danger);color:var(--danger)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:60;padding:20px}.modal{background:var(--bg-elev);border:1px solid var(--border);border-radius:var(--radius);max-width:380px;width:100%}.dialog{padding:18px;outline:none;display:grid;gap:12px}.dialog-title{margin:0;font-size:15px;font-weight:600}.dialog-body{margin:0;font-size:13px;color:var(--text-dim);line-height:1.5}.dialog-actions{display:flex;justify-content:flex-end;gap:8px}.raw{margin-top:20px}.raw-log{max-height:220px;overflow:auto;background:var(--bg-elev);border:1px solid var(--border);border-radius:var(--radius-sm);padding:10px;font-size:12px}.raw-tx{color:var(--accent-strong)}.raw-rx{color:var(--text-dim)}.conn-dot{width:9px;height:9px;border-radius:50%;background:var(--text-dim)}.conn-connected{background:var(--ok)}.conn-error{background:var(--danger)}.conn-label{font-size:13px;color:var(--text-dim)}.kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:0}.kv dt{font-size:12px;color:var(--text-dim)}.kv dd{margin:4px 0 0;font-size:14px}.muted{color:var(--text-dim);font-size:13px}.device-hid{font-family:ui-monospace,monospace;font-size:12px;word-break:break-all}.battery{display:inline-flex;align-items:center;gap:8px}.battery-track{width:80px;height:10px;background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);overflow:hidden}.battery-fill{display:block;height:100%;background:var(--accent)}.battery-pct{font-size:12px;color:var(--text-dim)}.dpi-grid{grid-template-columns:1fr 220px;align-items:start}.dpi-stages{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}.dpi-stage{display:grid;gap:10px;padding:12px;border:1px solid var(--border);border-radius:var(--radius-sm)}@media (max-width: 720px){.dpi-grid{grid-template-columns:1fr}}.keys-grid{grid-template-columns:220px 1fr;align-items:start}.slot-list{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:4px}.slot-row{display:flex;justify-content:space-between;padding:8px 10px;border:1px solid var(--border);border-radius:var(--radius-sm);font-size:13px;cursor:pointer}.slot-row.is-active{border-color:var(--accent)}.slot-action{color:var(--text-dim)}.fire-row{display:flex;gap:10px;align-items:end;flex-wrap:wrap}@media (max-width: 720px){.keys-grid{grid-template-columns:1fr}}.macro-controls{display:flex;gap:12px;align-items:end;flex-wrap:wrap}.text-input{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);padding:7px 10px;font-size:13px;color:var(--text);min-width:120px}.macro-events{max-height:160px;overflow:auto;font-size:12px;color:var(--text-dim);padding-left:20px}.macro-list{list-style:none;padding:0;display:grid;gap:6px}.macro-row{display:flex;justify-content:space-between;align-items:center;padding:8px 10px;border:1px solid var(--border);border-radius:var(--radius-sm)}