:root{--ink:#12211e;--muted:#687873;--line:#dce5e2;--paper:#f4f7f6;--white:#fff;--green:#0c9f7c;--green-soft:#e3f5f0;--blue:#225be8;--amber:#e69b1d;--red:#c84d4d;--shadow:0 24px 70px rgba(24,50,44,.10);--display:"Avenir Next","DIN Alternate","PingFang SC",sans-serif;--body:"PingFang SC","Microsoft YaHei",sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);min-width:320px}.ambient-grid{position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(rgba(32,72,62,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(32,72,62,.035) 1px,transparent 1px);background-size:38px 38px;mask-image:linear-gradient(to bottom,#000,transparent 80%)}.shell{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:248px;background:#142824;color:#e8f3f0;padding:26px 18px;z-index:20;display:flex;flex-direction:column}.brand{display:flex;align-items:center;gap:12px;padding:0 8px 32px}.brand-mark{width:42px;height:42px;display:grid;place-items:center;background:#d9f6ed;color:#0a6e58;font:900 14px var(--display);border-radius:6px;box-shadow:8px 8px 0 #25443d}.brand strong{display:block;font:800 18px var(--display);letter-spacing:.04em}.brand small{font:600 8px var(--display);letter-spacing:.16em;color:#8da9a2}.sidebar nav{display:grid;gap:6px}.nav-item{color:#8fa9a3;text-decoration:none;display:flex;align-items:center;gap:14px;padding:13px 14px;border-radius:5px;font-size:13px;transition:.18s}.nav-item span{font:700 9px var(--display);color:#5f7d75}.nav-item:hover,.nav-item.active{background:#203b35;color:#fff;transform:translateX(3px)}.nav-item.active span{color:#72e3c4}.sidebar-foot{margin-top:auto;border-top:1px solid #2e4943;padding:20px 8px 0;display:flex;align-items:center;gap:10px}.sidebar-foot>i{width:9px;height:9px;background:#d9aa4e;border-radius:50%;box-shadow:0 0 0 5px rgba(217,170,78,.12)}.sidebar-foot b,.sidebar-foot small{display:block}.sidebar-foot b{font-size:12px}.sidebar-foot small{font:600 8px var(--display);color:#7f9a94;letter-spacing:.12em;margin-top:3px}main{grid-column:2;min-width:0}.topbar{height:72px;background:rgba(255,255,255,.88);backdrop-filter:blur(18px);border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 34px;position:sticky;top:0;z-index:12}.menu-button{display:none}.mode-switch{display:flex;background:#edf2f0;padding:4px;border-radius:7px;gap:3px}.mode-switch button{border:0;background:transparent;color:#71817d;padding:8px 14px;display:flex;align-items:center;gap:7px;border-radius:5px;cursor:pointer}.mode-switch button b{font:800 9px var(--display);border:1px solid currentColor;padding:2px 4px;border-radius:3px}.mode-switch button.active{background:#fff;color:var(--ink);box-shadow:0 4px 14px rgba(29,54,48,.08)}.top-actions{margin-left:auto;display:flex;align-items:center;gap:16px}.path-pill{display:flex;align-items:center;gap:8px;color:#63746f;font-size:11px;border:1px solid var(--line);padding:8px 12px;border-radius:99px;background:#fff}.path-pill i{width:7px;height:7px;border-radius:50%;background:#a7b3af}.path-pill.connected i{background:#1eb58d;box-shadow:0 0 0 4px rgba(30,181,141,.12)}.avatar{width:36px;height:36px;border-radius:50%;border:0;background:var(--ink);color:#fff;font-size:20px;cursor:pointer}.page{padding:46px clamp(22px,5vw,72px) 70px;max-width:1500px;margin:auto}.eyebrow{font:800 10px var(--display);letter-spacing:.19em;color:var(--green);text-transform:uppercase}.hero{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin:12px 0 34px}.hero h1,.secondary h1{font:800 clamp(34px,4vw,58px)/1 var(--display);letter-spacing:-.045em;margin:0}.hero p{max-width:680px;color:var(--muted);font-size:14px;line-height:1.8;margin:14px 0 0}.hero-actions{display:flex;gap:10px;flex-shrink:0}.button{border:1px solid var(--line);padding:12px 17px;border-radius:5px;background:#fff;color:var(--ink);font-weight:700;cursor:pointer}.button.primary{background:var(--blue);border-color:var(--blue);color:#fff;box-shadow:0 10px 24px rgba(34,91,232,.22)}.button:hover{transform:translateY(-1px)}.status-ribbon{display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);margin-bottom:20px}.status-ribbon article{padding:20px 22px;border-right:1px solid var(--line);min-width:0}.status-ribbon article:last-child{border-right:0}.status-ribbon span,.status-ribbon strong,.status-ribbon small{display:block}.status-ribbon span{font:700 9px var(--display);letter-spacing:.12em;color:#82908c}.status-ribbon strong{font:800 17px var(--display);margin:7px 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.status-ribbon small{font-size:10px;color:#8b9794;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(330px,.65fr);gap:20px}.panel{background:#fff;border:1px solid var(--line);box-shadow:0 15px 44px rgba(29,55,49,.06);padding:25px}.device-panel{grid-row:span 2}.panel-heading{display:flex;align-items:center;justify-content:space-between}.panel-heading span{font:800 9px var(--display);letter-spacing:.15em;color:#8b9995}.panel-heading h2{font:800 20px var(--display);margin:5px 0}.text-button{border:0;background:none;color:var(--blue);font-weight:700;cursor:pointer}.television-stage{display:grid;place-items:center;padding:30px 20px 18px}.tv-screen{width:min(100%,540px);aspect-ratio:16/9;border:10px solid #1b2926;border-radius:8px;background:linear-gradient(135deg,#e9f1ef,#f9fbfa);box-shadow:0 22px 46px rgba(26,47,42,.18),inset 0 0 0 1px #cbd8d4;display:grid;place-items:center;color:#71817d;font-size:12px;text-align:center}.tv-stand{width:100px;height:16px;border-bottom:5px solid #1b2926;position:relative}.tv-stand:before{content:"";position:absolute;width:5px;height:16px;background:#1b2926;left:48px}.facts{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);margin:16px 0 0}.facts div{padding:15px;border-bottom:1px solid var(--line)}.facts div:nth-child(odd){border-right:1px solid var(--line)}.facts dt{font-size:10px;color:#879590}.facts dd{margin:5px 0 0;font:700 12px var(--display)}.signal-bars{display:flex;gap:3px;align-items:flex-end}.signal-bars i{display:block;width:4px;background:#d2dcd9}.signal-bars i:nth-child(1){height:5px}.signal-bars i:nth-child(2){height:9px}.signal-bars i:nth-child(3){height:13px}.signal-bars i:nth-child(4){height:17px}.route-list{list-style:none;padding:7px 0 0;margin:0}.route-list li{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid #edf1f0;color:#87938f}.route-list li>b{font:800 9px var(--display);width:26px;height:26px;border:1px solid #ccd8d5;border-radius:50%;display:grid;place-items:center}.route-list strong,.route-list small{display:block}.route-list strong{font-size:12px;color:#50605b}.route-list small{font-size:9px;margin-top:4px}.route-list li.done>b,.route-list li.active>b{background:var(--green);border-color:var(--green);color:#fff}.route-list li.done strong,.route-list li.active strong{color:var(--ink)}.notice{margin-top:18px;padding:13px;background:#f5f8f7;border-left:3px solid var(--amber);font-size:11px;line-height:1.6;color:#65736f}.permission-list{display:flex;flex-wrap:wrap;gap:7px;margin:16px 0}.permission-list span{font-size:10px;border:1px solid #cfe5df;background:var(--green-soft);color:#0a755d;padding:7px 9px;border-radius:3px}.permission-panel p{color:#7b8985;font-size:10px;line-height:1.7}.secondary{display:none;min-height:calc(100vh - 72px)}.secondary:target{display:block}.secondary:target~*{display:none}.empty-state,.trace{margin-top:30px;background:#fff;border:1px dashed #cdd9d5;padding:40px;color:#74827e}.trace{font:11px/1.7 ui-monospace,SFMono-Regular,monospace;max-height:480px;overflow:auto}dialog{border:0;padding:0;background:transparent;width:min(620px,calc(100% - 28px))}dialog::backdrop{background:rgba(12,27,23,.62);backdrop-filter:blur(6px)}.dialog-card{position:relative;background:#fff;padding:34px;box-shadow:0 30px 90px rgba(0,0,0,.25)}.dialog-card h2{font:800 28px var(--display);margin:8px 0}.dialog-card p{font-size:12px;color:var(--muted);line-height:1.7}.dialog-close{position:absolute;right:18px;top:16px;border:0;background:none;font-size:25px;cursor:pointer}.dialog-card video{display:none;width:100%;aspect-ratio:4/3;background:#10211e;margin:15px 0;object-fit:cover}.dialog-card textarea{width:100%;min-height:130px;border:1px solid var(--line);padding:13px;resize:vertical;font:11px/1.6 ui-monospace,monospace}.dialog-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:12px}@media(max-width:980px){.shell{grid-template-columns:1fr}.sidebar{transform:translateX(-100%);transition:.2s}.sidebar.open{transform:none}.topbar{padding:0 17px}.menu-button{display:block;border:0;background:none;font-size:20px;margin-right:10px}.dashboard-grid{grid-template-columns:1fr}.device-panel{grid-row:auto}.status-ribbon{grid-template-columns:1fr 1fr}.status-ribbon article:nth-child(2){border-right:0}.status-ribbon article:nth-child(-n+2){border-bottom:1px solid var(--line)}main{grid-column:1}}@media(max-width:640px){.page{padding:30px 14px 60px}.hero{display:block}.hero-actions{margin-top:20px}.hero-actions .button{flex:1}.status-ribbon{grid-template-columns:1fr}.status-ribbon article{border-right:0;border-bottom:1px solid var(--line)!important}.mode-switch button{padding:7px 9px}.mode-switch button b{display:none}.path-pill{display:none}.panel{padding:18px}.facts{grid-template-columns:1fr}.facts div:nth-child(odd){border-right:0}.dialog-card{padding:28px 18px}.dialog-actions{display:grid}}
.dialog-card .camera-help{display:none;margin:12px 0;padding:10px 12px;background:#fff7e7;border-left:3px solid var(--amber);color:#6e5a32}.dialog-card .camera-help.visible{display:block}.dialog-card .camera-help.error{background:#fff0f0;border-left-color:var(--red);color:#7d3d3d}
.secondary{display:none!important}.secondary.route-active{display:block!important}.page.route-hidden{display:none!important}
.tv-screen{overflow:hidden}.tv-screen img{width:100%;height:100%;object-fit:contain;background:#000}.control-grid{display:grid;grid-template-columns:minmax(320px,.8fr) minmax(320px,1.2fr);gap:20px;margin-top:28px}.remote-pad{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:22px auto;max-width:420px}.remote-pad button{min-height:58px;border:1px solid var(--line);background:#f7faf9;border-radius:7px;color:var(--ink);font-weight:800;cursor:pointer}.remote-pad button.ok{background:var(--blue);color:#fff;border-color:var(--blue)}.text-control{display:flex;gap:8px}.text-control input{flex:1;min-width:0;border:1px solid var(--line);padding:12px}.app-list{display:grid;gap:8px;margin-top:18px;max-height:520px;overflow:auto}.app-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;border:1px solid var(--line);background:#fafcfb}.app-row span{min-width:0}.app-row b,.app-row small{display:block;overflow:hidden;text-overflow:ellipsis}.app-row small{color:var(--muted);margin-top:3px}.history-actions{display:flex;gap:9px;flex-wrap:wrap;margin:24px 0}.history-list{background:#fff;border:1px solid var(--line);padding:18px;overflow:auto}.history-row{display:grid;grid-template-columns:180px 1fr 1fr;gap:14px;padding:12px 0;border-bottom:1px solid var(--line);font-size:12px}.history-row:last-child{border-bottom:0}@media(max-width:900px){.control-grid{grid-template-columns:1fr}}@media(max-width:640px){.history-row{grid-template-columns:1fr;gap:4px}.text-control{display:grid}}