:root{--bg: #07131d;--panel: rgba(13, 33, 48, .82);--panel-2: rgba(18, 45, 65, .82);--line: rgba(132, 188, 230, .16);--text: #f3f8fc;--muted: rgba(243, 248, 252, .62);--blue: #2d9cff;--orange: #ff9800;--green: #39ff14;font-family:Aptos,Segoe UI,sans-serif}*{box-sizing:border-box}body{margin:0;min-height:100vh;color:var(--text);background:radial-gradient(circle at 20% 10%,rgba(255,152,0,.22),transparent 28rem),radial-gradient(circle at 80% 0%,rgba(45,156,255,.22),transparent 24rem),linear-gradient(135deg,#06111a,#0b2233 55%,#091722)}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:.22;background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);background-size:44px 44px}button,select{font:inherit}.app-shell{position:relative;z-index:1;width:min(1180px,calc(100% - 28px));margin:0 auto;padding:22px 0 46px}.app-header{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px;border:1px solid var(--line);border-radius:22px;background:#04121cad;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.brand{display:flex;align-items:center;gap:12px}.brand-mark{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:linear-gradient(135deg,var(--orange),#ffbd5b);color:#132130;font-weight:900}.brand strong,.brand span{display:block}.brand span,.eyebrow,small{color:var(--muted)}select,button,input{border:1px solid var(--line);border-radius:14px;color:var(--text);background:#102b40e6;padding:10px 14px}button{cursor:pointer}.tabs{display:flex;gap:10px;margin:18px 0;overflow-x:auto}.header-controls{display:flex;align-items:end;gap:10px}.api-base-field{display:grid;gap:4px}.api-base-field span{color:var(--muted);font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.api-base-field input{width:min(280px,42vw)}.tabs button.active{border-color:#ff9800b3;background:#ff980029}.grid,.device-grid,.settings-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.hero-card,.summary-card,.device-card,.table-card,.remote-card,.form-card,.success-banner,.error-banner{border:1px solid var(--line);border-radius:24px;background:var(--panel);box-shadow:0 28px 70px #0000003d;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.hero-card{grid-column:span 3;padding:28px}.hero-card h1,.remote-card h1{margin:8px 0 10px;font-size:clamp(28px,6vw,60px)}.summary-card{padding:22px}.summary-card span,.summary-card strong{display:block}.summary-card strong{margin-top:10px;color:var(--orange);font-size:38px}.device-card{padding:18px}.device-card strong,.device-card small{display:block}.device-card button{width:100%;margin-top:16px;color:#07131d;border:0;background:linear-gradient(135deg,var(--blue),#86c9ff);font-weight:800}.device-meta{display:flex;gap:8px;margin-top:14px}.device-meta span{flex:1;padding:8px;border-radius:12px;background:#2d9cff1f;color:#cfeaff;font-size:12px}.dot{display:inline-block;width:9px;height:9px;margin-right:8px;border-radius:99px;background:#888}.dot.online{background:var(--green);box-shadow:0 0 18px #39ff1499}.table-card,.remote-card{padding:20px}table{width:100%;border-collapse:collapse}th,td{padding:12px;border-bottom:1px solid var(--line);text-align:left}.remote-card{display:flex;justify-content:space-between;gap:20px;align-items:center}.form-card{display:grid;gap:12px;padding:20px}.form-card button,.header-controls button{color:#07131d;border:0;background:linear-gradient(135deg,var(--blue),#86c9ff);font-weight:900}.ghost-button{color:var(--text)!important;border:1px solid var(--line)!important;background:#2d9cff29!important}.pairing-code{display:block;padding:18px;border-radius:18px;color:#07131d;background:linear-gradient(135deg,var(--orange),#ffd28a);font-size:32px;letter-spacing:.12em;text-align:center}.remote-card button{color:#07131d;background:linear-gradient(135deg,var(--orange),#ffd28a);font-weight:900}.error-banner{margin-bottom:16px;padding:14px 16px;color:#ffdada;border-color:#ff5a5a6b;background:#78141459}.success-banner{margin-bottom:16px;padding:14px 16px;color:#d9ffe2;border-color:#39ff1452;background:#14642d47}@media (max-width: 760px){.app-header,.remote-card,.header-controls{flex-direction:column;align-items:stretch}.api-base-field input{width:100%}.grid,.device-grid,.settings-grid{grid-template-columns:1fr}.hero-card{grid-column:span 1}}
