:root{--bg-0: #0c0818;--bg-1: #140f27;--bg-2: #1f1740;--panel: rgba(25, 18, 50, .72);--panel-border: rgba(255, 255, 255, .13);--text: #f5f4ff;--muted: #baaed7;--accent: #ff8a2b;--accent-strong: #ff9f4d;--ok: #61d79c;--warn: #ffbe73;--danger: #ff6a6a;--shadow: 0 28px 70px rgba(0, 0, 0, .45);--radius-xl: 34px;--radius-lg: 24px;--radius-md: 16px;color-scheme:dark}*,*:before,*:after{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;color:var(--text);font-family:SF Pro Display,Avenir Next,Manrope,Segoe UI,sans-serif;background:radial-gradient(72rem 42rem at 12% -12%,#2f205e 0%,transparent 55%),radial-gradient(48rem 32rem at 95% 6%,#2a1750 0%,transparent 58%),linear-gradient(135deg,var(--bg-0) 0%,var(--bg-1) 50%,#120d26 100%);line-height:1.35;-webkit-font-smoothing:antialiased}img{max-width:100%;display:block}button,input,select{font:inherit;color:inherit}button{-webkit-tap-highlight-color:transparent}.screen{min-height:100dvh;padding:1.25rem}.panel{background:var(--panel);border:1px solid var(--panel-border);border-radius:var(--radius-xl);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.connect-screen{display:grid;place-items:center}.connect-card{width:min(560px,100%);padding:1.5rem;animation:rise-in .38s ease both}.section-head h1,.section-head h2,.section-head p{margin:0}.section-head h1{font-size:clamp(1.45rem,1.2rem + 1.4vw,2rem);letter-spacing:.01em}.section-head h2{font-size:1rem;text-transform:uppercase;letter-spacing:.08em;color:#d3c8ec}.subtext{margin-top:.5rem;color:var(--muted);font-size:.95rem}.connect-method{margin-top:1rem;display:grid;gap:.85rem}.method-toggle{width:100%;border:1px solid rgba(255,255,255,.16);background:#ffffff0a;border-radius:18px;padding:.8rem .95rem;display:flex;align-items:center;justify-content:center;gap:.5rem;cursor:pointer;transition:all .22s ease}.method-toggle:hover,.method-toggle.active{border-color:#ff8a2bb3;background:#ff8a2b1f}.scanner-wrap{display:grid;gap:.85rem}.scanner-label{display:inline-flex;align-items:center;gap:.45rem;width:fit-content;max-width:100%;padding:.52rem .78rem;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:#ffffff0a;font-size:.82rem;color:#d4caec}.scanner-label-idle{color:#d4caec}.scanner-label-pending{color:#ffe1be;background:#ffbe731f;border-color:#ffbe7357}.scanner-label-ready{color:#fff2e2;background:#ff8a2b1f;border-color:#ff8a2b57}.scanner-label-success{color:#d8ffea;background:#61d79c1f;border-color:#61d79c57}.scanner-label-warn{color:#ffe2c1;background:#ff9b4d1f;border-color:#ff9b4d5c}.scanner-label-error{color:#ffd5d5;background:#ff6a6a1f;border-color:#ff6a6a57}.is-spinning{animation:spin 1s linear infinite}.scanner-shell{position:relative;min-height:320px;border-radius:28px;overflow:hidden;border:1px solid rgba(255,255,255,.14);background:radial-gradient(80% 120% at 50% 0%,rgba(255,138,43,.1) 0%,transparent 60%),linear-gradient(180deg,#16102bf0,#080612f5);box-shadow:inset 0 1px #ffffff0f,0 18px 40px #0000003d}.scanner-shell.is-live{border-color:#ff8a2b5c}.qr-region{position:relative;min-height:320px;background:#0c0918f2}.qr-region>div{width:100%;height:100%}.qr-region video,.qr-region canvas,.qr-region img{width:100%!important;height:100%!important;object-fit:cover}.scanner-overlay{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;display:grid;place-items:center;background:linear-gradient(180deg,#07050f26,#07050f52)}.scan-window{position:relative;width:min(72vw,252px);max-width:72%;aspect-ratio:1;border-radius:32px;box-shadow:0 0 0 999px #04040a6b}.scan-window:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;border:1px solid rgba(255,255,255,.14);background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.08),transparent 68%)}.scan-corner{position:absolute;width:32px;height:32px;border-color:#ff8a2bf2;border-style:solid;border-width:4px;filter:drop-shadow(0 0 14px rgba(255,138,43,.36))}.scan-corner-tl{top:-1px;left:-1px;border-right:0;border-bottom:0;border-top-left-radius:18px}.scan-corner-tr{top:-1px;right:-1px;border-left:0;border-bottom:0;border-top-right-radius:18px}.scan-corner-bl{left:-1px;bottom:-1px;border-right:0;border-top:0;border-bottom-left-radius:18px}.scan-corner-br{right:-1px;bottom:-1px;border-left:0;border-top:0;border-bottom-right-radius:18px}.scan-beam{position:absolute;left:14px;right:14px;top:18px;height:2px;border-radius:999px;background:linear-gradient(90deg,#ff8a2b00,#ffe9d4fa,#ff8a2b00);box-shadow:0 0 16px #ff8a2b7a;animation:scan-beam 2.2s ease-in-out infinite}.scanner-shell:not(.is-live) .scan-beam{animation:none;opacity:.4;top:50%}.scanner-footer{display:grid;gap:.75rem}.scanner-hint{margin:0;color:#d3c9ea;font-size:.84rem;line-height:1.45}.scanner-controls{display:flex;flex-wrap:wrap;align-items:flex-end;gap:.55rem}.scanner-action{border:1px solid rgba(255,255,255,.16);background:#ffffff0a;border-radius:16px;padding:.7rem .85rem;display:inline-flex;align-items:center;justify-content:center;gap:.45rem;color:#f7f1ff;cursor:pointer;transition:transform .18s ease,border-color .18s ease,background .18s ease}.scanner-action:hover:enabled{border-color:#ff8a2b8a;background:#ff8a2b1a}.scanner-action:active:enabled{transform:scale(.98)}.scanner-action:disabled{opacity:.5;cursor:not-allowed}.scanner-action.is-active{border-color:#ff8a2b8a;background:#ff8a2b24}.scanner-select-wrap{min-width:min(100%,220px);display:grid;gap:.35rem;color:#d4caec;font-size:.76rem}.scanner-select{min-width:220px;padding-top:.68rem;padding-bottom:.68rem}.scanner-zoom{display:grid;gap:.45rem;padding:.78rem .88rem;border-radius:18px;border:1px solid rgba(255,255,255,.12);background:#ffffff0a}.scanner-zoom span,.scanner-zoom strong{font-size:.8rem}.scanner-zoom input{width:100%;accent-color:var(--accent-strong)}.scanner-zoom strong{justify-self:end;color:#fff1e2;font-variant-numeric:tabular-nums}.manual-form{margin-top:1rem;display:grid;gap:.8rem}.row-label{display:inline-flex;align-items:center;gap:.45rem;color:#d8cfee;font-size:.86rem;font-weight:600}.field-label{display:grid;gap:.45rem;color:#d4caec;font-size:.84rem}.glass-input,.glass-select{width:100%;border:1px solid rgba(255,255,255,.16);background:#ffffff0d;border-radius:16px;padding:.72rem .82rem;outline:none;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}.glass-select{appearance:none;-webkit-appearance:none;-moz-appearance:none;cursor:pointer;color-scheme:dark;padding-right:2.5rem;background-image:linear-gradient(45deg,transparent 50%,#d8cfee 50%),linear-gradient(135deg,#d8cfee 50%,transparent 50%),linear-gradient(to right,#fff3,#ffffff0f);background-position:calc(100% - 18px) calc(50% + 1px),calc(100% - 12px) calc(50% + 1px),calc(100% - 2.25rem) 50%;background-size:6px 6px,6px 6px,1px 55%;background-repeat:no-repeat}.glass-select option,.glass-select optgroup{background:#1a1430;color:#f5f4ff}.glass-select::-ms-expand{display:none}.glass-input::placeholder{color:#dcd2f585}.glass-input:focus,.glass-select:focus{border-color:#ff8a2be0;box-shadow:0 0 0 3px #ff8a2b3d;background:#ffffff12}.code-input{letter-spacing:.22em;font-variant-numeric:tabular-nums}.connect-btn{margin-top:1rem;width:100%;border:none;border-radius:18px;padding:.82rem 1rem;font-weight:650;color:#fff8f0;background:linear-gradient(140deg,var(--accent-strong),var(--accent));cursor:pointer;box-shadow:0 18px 34px #ff8a2b52;transition:transform .2s ease,box-shadow .2s ease,opacity .2s ease}.connect-btn:hover:enabled{transform:translateY(-1px);box-shadow:0 22px 40px #ff8a2b6b}.connect-btn:disabled{opacity:.45;cursor:not-allowed}.error-text{margin:.85rem 0 0;color:#ffb3b3;font-size:.86rem}.connect-success{text-align:center;display:grid;gap:.65rem;justify-items:center;color:#d9fce9;padding:1.6rem .8rem;animation:pop-in .46s ease both}.connect-success svg{color:var(--ok)}.connect-success h1{margin:0;font-size:clamp(1.3rem,1rem + 1.2vw,1.85rem)}.connect-success p{margin:0;color:#caedd9}.control-screen{padding-bottom:5rem}.control-shell{width:min(930px,100%);margin:0 auto;display:grid;gap:.9rem}.top-header{padding:.86rem .95rem;border-radius:24px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:.72rem}.brand-mark{width:32px;height:32px;border-radius:11px;display:block;object-fit:cover;box-shadow:0 10px 18px #0000003d}.brand-title{margin:0;font-size:1rem;font-weight:700}.brand-subtitle{margin:.1rem 0 0;color:#c4b9e0;font-size:.75rem}.status-pill{border-radius:999px;font-size:.78rem;font-weight:700;padding:.28rem .7rem;border:1px solid transparent}.status-pill.ok{color:#d5ffe8;background:#61d79c2b;border-color:#61d79c73}.status-pill.warn{color:#ffe4bf;background:#ffbe7329;border-color:#ffbe736b}.section-card{padding:1rem;border-radius:26px}.master-grid{margin-top:.8rem;display:grid;gap:.78rem}.slider-row{display:flex;align-items:center;justify-content:space-between}.value-chip{border-radius:999px;border:1px solid rgba(255,255,255,.16);background:#ffffff0f;padding:.23rem .6rem;font-size:.82rem}.range-slider{width:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:10px;border-radius:999px;background:linear-gradient(90deg,#ff8a2bcc,#ff8a2b66 38%,#ffffff24);outline:none}.range-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:19px;height:19px;border-radius:999px;background:#fff6ec;box-shadow:0 0 0 4px #ff8a2b4d;cursor:pointer}.range-slider::-moz-range-thumb{width:19px;height:19px;border:none;border-radius:999px;background:#fff6ec;box-shadow:0 0 0 4px #ff8a2b4d;cursor:pointer}.action-btn,.app-action-btn,.route-btn,.mini-toggle{border:1px solid rgba(255,255,255,.16);background:#ffffff0a;color:#f4efff;cursor:pointer;transition:transform .17s ease,border-color .19s ease,background .19s ease,box-shadow .19s ease}.action-btn:active,.app-action-btn:active,.route-btn:active,.mini-toggle:active{transform:scale(.97)}.master-actions{display:grid;gap:.55rem}.action-btn{border-radius:14px;padding:.6rem .78rem;display:inline-flex;align-items:center;justify-content:center;gap:.4rem;font-size:.84rem;font-weight:550}.compact-btn{margin-top:.08rem}.action-btn.is-muted,.mini-toggle.is-muted{border-color:#ff8a2bad;background:#ff8a2b26}.app-list{margin-top:.72rem;display:grid;gap:.72rem}.app-card{--app-accent-rgb: 255, 138, 43;padding:.82rem;border-radius:19px;border:1px solid rgba(var(--app-accent-rgb),.42);background:radial-gradient(130% 120% at -8% -30%,rgba(var(--app-accent-rgb),.34),rgba(var(--app-accent-rgb),.1) 44%,#100c1f94),linear-gradient(165deg,#100c1fd1,#090712cc);box-shadow:inset 0 1px #ffffff0f,0 8px 18px rgba(var(--app-accent-rgb),.18);display:grid;gap:.65rem}.app-header{display:flex;justify-content:space-between;gap:.8rem}.app-meta{display:flex;align-items:center;gap:.66rem;min-width:0}.app-icon{width:34px;height:34px;border-radius:11px;object-fit:cover;border:1px solid rgba(var(--app-accent-rgb),.48);background:rgba(var(--app-accent-rgb),.18)}.app-icon-fallback{display:grid;place-items:center;font-size:.72rem;font-weight:700;background:linear-gradient(160deg,rgba(var(--app-accent-rgb),.74),rgba(var(--app-accent-rgb),.36))}.app-name{margin:0;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:210px}.app-vol-label{margin:.18rem 0 0;color:#bfb2dc;font-size:.75rem}.mini-toggle{width:34px;height:34px;border-radius:11px;display:grid;place-items:center}.audio-meter{height:7px;border-radius:999px;background:#ffffff1f;overflow:hidden}.audio-meter-fill{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,rgba(var(--app-accent-rgb),.95),rgba(var(--app-accent-rgb),.45));transition:width .11s linear}.app-card .mini-toggle.is-muted{border-color:rgba(var(--app-accent-rgb),.68);background:rgba(var(--app-accent-rgb),.2)}.app-slider{height:8px}.inline-actions{display:grid}.app-action-btn{border-radius:12px;padding:.46rem .64rem;display:inline-flex;justify-content:center;align-items:center;gap:.36rem;font-size:.78rem}.app-route-grid{display:grid;gap:.55rem}.route-row{display:grid;gap:.42rem;grid-template-columns:1fr auto}.compact-select{border-radius:12px;padding:.52rem .66rem;min-width:0}.route-btn{border-radius:12px;padding:.45rem .58rem;font-size:.72rem;display:inline-flex;align-items:center;gap:.24rem}.is-pulsing{animation:cmd-pulse .43s ease both}.empty-state{margin:.72rem 0 0;color:#bbb0d5;font-size:.88rem}.device-grid{margin-top:.75rem;display:grid;gap:.72rem}.toast{position:fixed;left:50%;transform:translate(-50%);bottom:1.2rem;max-width:calc(100vw - 2rem);border-radius:14px;border:1px solid transparent;background:#0a0814f0;color:#f7f4ff;padding:.56rem .8rem;font-size:.82rem;z-index:50;animation:toast-in .21s ease both}.toast-ok{border-color:#61d79c73}.toast-warn{border-color:#ffb15f73}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,6px)}to{opacity:1;transform:translate(-50%)}}@keyframes rise-in{0%{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes pop-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes cmd-pulse{0%{box-shadow:0 0 #ff8a2b73}65%{box-shadow:0 0 0 10px #ff8a2b00}to{box-shadow:0 0 #ff8a2b00}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes scan-beam{0%{top:18px;opacity:.18}18%{opacity:.95}to{top:calc(100% - 18px);opacity:.2}}@media (min-width: 840px){.control-shell{gap:1rem}.section-card{padding:1.05rem 1.15rem}.device-grid{grid-template-columns:1fr 1fr}}@media (min-width: 560px){.master-actions{grid-template-columns:1fr 1fr}}@media (max-width: 540px){.scanner-shell,.qr-region{min-height:280px}.scan-window{width:min(78vw,230px);max-width:78%}.scanner-controls{display:grid}.scanner-action,.scanner-select,.scanner-select-wrap{width:100%}.scanner-select{min-width:0}}