:root{--bg: #ffffff;--fg: #213547;--link: #646cff;--link-hover: #535bf2;color-scheme:light dark}html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}body{margin:0;font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color:var(--fg);background:var(--bg);min-width:320px}a{color:var(--link);text-decoration:none}a:hover{color:var(--link-hover)}button{font-family:inherit}@media(prefers-color-scheme:dark){:root{--bg: #242424;--fg: rgba(255,255,255,.87);--link: #646cff;--link-hover: #747bff}}:root{--color-bg: #0b1020;--color-bg-elev: #0f1428;--color-panel: #96b0e8;--color-text: #000000;--color-muted: #9ca3af;--color-border: #243045;--color-primary: #7b74f2;--color-primary-hover: #6a63e8;--color-success: #10b981;--color-danger: #ef4444;--ring: 0 0 0 3px rgba(79,70,229,.3);--shadow-sm: 0 1px 2px rgba(0,0,0,.25);--shadow-md: 0 6px 18px rgba(0,0,0,.35);--radius: 10px;--radius-sm: 8px;--radius-lg: 14px;--header-height: 64px;--footer-height: 54px;--container-max-width: 1100px}*{box-sizing:border-box}html,body,#root{height:100%}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;background:radial-gradient(1200px 600px at 10% -10%,rgba(79,70,229,.18),transparent 60%),radial-gradient(1200px 800px at 110% -20%,rgba(16,185,129,.12),transparent 60%),linear-gradient(180deg,#0a0f1f,#0b1020);color:var(--color-text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,Apple Color Emoji,Segoe UI Emoji;line-height:1.55}#root{display:block}.app-layout{height:100vh;padding-top:var(--header-height);padding-bottom:var(--footer-height);overflow:hidden}.container{max-width:var(--container-max-width);margin:0 auto;padding:0 20px}.header{position:fixed;top:0;left:0;right:0;height:var(--header-height);-webkit-backdrop-filter:saturate(140%) blur(8px);backdrop-filter:saturate(140%) blur(8px);background:color-mix(in oklab,var(--color-bg) 70%,transparent);border-bottom:1px solid var(--color-border);z-index:1000;display:flex;align-items:center}.site-title{margin:0;font-weight:600;letter-spacing:.2px;font-size:1.15rem;color:#fff}.main{min-height:calc(100vh - var(--header-height) - var(--footer-height));display:block;background:#fff}.footer{position:fixed;bottom:0;left:0;right:0;height:var(--footer-height);-webkit-backdrop-filter:saturate(140%) blur(8px);backdrop-filter:saturate(140%) blur(8px);background:color-mix(in oklab,var(--color-bg) 70%,transparent);border-top:1px solid var(--color-border);display:flex;align-items:center}.footer small{color:var(--color-muted)}.card{padding:28px 0 44px}.card-title-row{display:flex;align-items:center;gap:10px}.card-title{margin:0;font-size:1.35rem;font-weight:600}.add-device-row{margin-top:10px}.input{height:38px;border-radius:var(--radius-sm);border:1px solid var(--color-border);background:#fff;color:var(--color-text);padding:0 12px;outline:none;transition:border-color .15s ease,box-shadow .15s ease,background .15s ease}.input::placeholder{color:color-mix(in oklab,var(--color-muted) 80%,#fff 0%)}.input:focus{border-color:var(--color-primary);box-shadow:var(--ring)}.btn{display:inline-flex;align-items:center;justify-content:center;height:38px;padding:0 14px;border-radius:var(--radius-sm);border:1px solid transparent;font-size:.95rem;font-weight:500;cursor:pointer;-webkit-user-select:none;user-select:none;transition:background .15s ease,border-color .15s ease,color .15s ease,transform .06s ease}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover:not(:disabled){background:var(--color-primary-hover)}.btn-secondary{color:var(--color-text);border-color:var(--color-border)}.btn-secondary:hover:not(:disabled){background:#1f2a52}.icon-btn{width:34px;height:34px;padding:0;border-radius:8px;border:1px solid var(--color-border);background:#18203d;color:var(--color-muted);display:inline-flex;align-items:flex;align-items:center;justify-content:center;transition:background .15s ease,color .15s ease,border-color .15s ease}.icon-btn:hover{background:#1f2a52;color:#e5e7eb}.icon-btn:focus-visible{outline:none;box-shadow:var(--ring);border-color:var(--color-primary)}.delete-btn{color:#f08c8c}.delete-btn:hover{color:#faa;border-color:color-mix(in oklab,var(--color-danger) 40%,var(--color-border))}.refresh-btn{width:34px;height:34px;border-radius:8px;border:1px solid var(--color-border);color:var(--color-text)}.refresh-btn:hover:not(:disabled){background:#1f2a52}.refresh-btn:disabled{opacity:.6}.refresh-btn svg{display:block}.refresh-btn.spinning svg{animation:spin .9s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.device-list{list-style:none;margin:14px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}.device-item{background:var(--color-panel);border:1px solid var(--color-border);border-radius:var(--radius);padding:12px;box-shadow:var(--shadow-sm);transition:box-shadow .15s ease,transform .06s ease,border-color .15s ease}.device-item:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}.device-item.active{border-color:color-mix(in oklab,var(--color-primary) 55%,var(--color-border));box-shadow:0 0 0 3px #4f46e540,var(--shadow-md)}.device-button{width:100%;text-align:left;background:transparent;border:none;padding:8px 6px;font-size:.98rem;color:var(--color-text);cursor:pointer;border-radius:8px}.device-button:hover{background:#ffffff08}.device-item.active .device-button{font-weight:600}.debug-editor{margin-top:10px}.payload-textarea{width:100%;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:.92rem;line-height:1.45;color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:10px;resize:vertical;min-height:140px}.payload-textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:var(--ring)}.editor-actions{margin-top:10px;display:flex;gap:10px}.error{color:#000}.success{color:#6ee7b7}:focus-visible{outline:none;box-shadow:var(--ring)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}