:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{margin:0;padding:0}:root{--bg:#090c13;--bg-gradient:#151d33;--surface:#131826;--surface-2:#171e2e;--border:#ffffff14;--border-soft:#ffffff0d;--text:#edf1f8;--text-dim:#8b96ac;--text-faint:#5b6579;--brand:#6d8bff;--brand-soft:#6d8bff29;--green:#34d399;--amber:#fbbf24;--cyan:#38bdf8;--orange:#fb923c;--purple:#a78bfa;--blue:#60a5fa;--red:#f87171}:root[data-theme=light]{--bg:#f3f4f8;--bg-gradient:#e6eaf7;--surface:#fff;--surface-2:#f1f3f9;--border:#0f172a17;--border-soft:#0f172a0d;--text:#12151c;--text-dim:#5b6579;--text-faint:#8b96ac;--brand:#4f6df5;--brand-soft:#4f6df51f;--green:#0f9d70;--amber:#b45309;--cyan:#0891b2;--orange:#c2410c;--purple:#7c3aed;--blue:#2563eb;--red:#dc2626}*{box-sizing:border-box}body{background:radial-gradient(ellipse 1200px 800px at 20% -10%, var(--bg-gradient) 0%, var(--bg) 55%);color:var(--text);-webkit-font-smoothing:antialiased;margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;transition:background-color .2s,color .2s}#root{min-height:100vh}button{font-family:inherit}.login-card,.dashboard-header,.stat-card,.group-card,.room-section,.tile,.tile-icon,.icon-btn,.btn-chip,.login-form input{transition:background-color .2s,border-color .2s,color .2s}.toast-stack{z-index:1000;flex-direction:column;gap:.5rem;max-width:320px;display:flex;position:fixed;top:1rem;right:1rem}.toast{color:#ffd7dc;cursor:pointer;background:#341c20;border:1px solid #7a2f3a;border-radius:10px;padding:.65rem .9rem;font-size:.85rem;animation:.15s ease-out toast-in;box-shadow:0 8px 24px #0006}@keyframes toast-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.center-msg{height:100vh;color:var(--text-dim);flex-direction:column;justify-content:center;align-items:center;gap:.9rem;font-size:1.05rem;display:flex}.center-msg.error{color:var(--red)}.spinner{border:3px solid var(--border);border-top-color:var(--brand);border-radius:50%;width:28px;height:28px;animation:.8s linear infinite spin}.spinner--sm{border-width:2px;width:14px;height:14px}.connecting-banner{z-index:900;color:var(--amber);background:linear-gradient(#fbbf242e,#fbbf241a);border-bottom:1px solid #fbbf2459;justify-content:center;align-items:center;gap:.55rem;margin:-1.5rem -1.5rem 1rem;padding:.55rem 1rem;font-size:.85rem;font-weight:600;display:flex;position:sticky;top:0}.login-screen{justify-content:center;align-items:center;min-height:100vh;padding:1.5rem;display:flex;position:relative}.theme-toggle--floating{position:absolute;top:1.25rem;right:1.25rem}.login-card{background:var(--surface);border:1px solid var(--border);text-align:center;border-radius:20px;width:100%;max-width:380px;padding:2.25rem 2rem;box-shadow:0 24px 60px #00000059}.brand-mark{background:var(--brand-soft);width:52px;height:52px;color:var(--brand);border-radius:16px;justify-content:center;align-items:center;margin:0 auto 1rem;display:flex}.login-card h1{letter-spacing:-.02em;margin:0 0 .2rem;font-size:1.6rem}.subtitle{color:var(--text-dim);margin:0 0 1.75rem;font-size:.9rem}.login-form{text-align:left;flex-direction:column;gap:.6rem;display:flex}.field-label{color:var(--text-dim);margin-top:.4rem;margin-bottom:-.15rem;font-size:.75rem}.login-form input{border:1px solid var(--border);background:var(--surface-2);color:var(--text);border-radius:10px;padding:.8rem 1rem;font-size:1rem}.login-form input:focus{border-color:var(--brand);outline:none}.btn-primary{background:var(--brand);color:#fff;cursor:pointer;border:none;border-radius:10px;margin-top:.5rem;padding:.85rem 1rem;font-size:.98rem;font-weight:600;transition:filter .15s}.btn-primary:hover{filter:brightness(1.08)}.btn-primary:disabled{opacity:.55;cursor:default}.login-form .link-btn{color:var(--text-dim);cursor:pointer;background:0 0;border:none;padding:.25rem 0;font-size:.85rem;text-decoration:underline}.error{color:var(--red);font-size:.85rem}.dashboard{max-width:1180px;margin:0 auto;padding:1.5rem 1.5rem 7.5rem}.dashboard-header{justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.25rem;display:flex}.brand-block{align-items:center;gap:.75rem;display:flex}.brand-mark--sm{border-radius:12px;width:40px;height:40px;margin:0}.dashboard-header h1{letter-spacing:-.01em;margin:0;font-size:1.25rem}.conn-row{align-items:center;gap:.4rem;margin-top:.15rem;display:flex}.status-dot{border-radius:50%;flex-shrink:0;width:8px;height:8px}.status-dot.online{background:var(--green);box-shadow:0 0 8px var(--green)}.status-dot.offline{background:var(--orange);animation:1.2s infinite pulse-dot}@keyframes pulse-dot{0%,to{opacity:1}50%{opacity:.35}}.status-text{color:var(--text-dim);font-size:.8rem}.header-actions{gap:.5rem;display:flex}.icon-btn{border:1px solid var(--border);background:var(--surface);width:38px;height:38px;color:var(--text-dim);cursor:pointer;border-radius:10px;justify-content:center;align-items:center;transition:color .15s,border-color .15s;display:flex}.icon-btn:hover{color:var(--text);border-color:var(--brand)}.icon-btn--listening{color:var(--red);border-color:var(--red);animation:1.1s ease-in-out infinite mic-pulse}@keyframes mic-pulse{0%,to{box-shadow:0 0 #ef444459}50%{box-shadow:0 0 0 8px #ef444400}}.stats-row{gap:.75rem;margin-bottom:1.75rem;display:flex}.stat-card{background:var(--surface);border:1px solid var(--border);text-align:left;border-radius:14px;flex:1;align-items:center;gap:.75rem;padding:.85rem 1rem;display:flex}.stat-card--toggle{font:inherit;color:inherit;cursor:pointer;transition:border-color .15s,background .15s}.stat-card--toggle:hover{border-color:var(--brand)}.stat-card--active{border-color:var(--brand);background:var(--brand-soft)}.stat-card--active .stat-icon{background:var(--brand);color:#fff}.stat-icon{background:var(--brand-soft);width:36px;height:36px;color:var(--brand);border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.stat-value{font-size:1.15rem;font-weight:700;line-height:1.1}.stat-label{color:var(--text-dim);margin-top:.15rem;font-size:.75rem}.group-row{z-index:500;max-width:1180px;padding:.75rem 1.5rem calc(.75rem + env(safe-area-inset-bottom));background:var(--bg);border-top:1px solid var(--border);grid-template-columns:repeat(3,1fr);gap:.75rem;margin:0 auto;display:grid;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -16px 32px #00000047}.group-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;flex-direction:column;gap:.45rem;min-width:0;padding:.55rem .6rem;display:flex}.group-card-top{align-items:center;gap:.5rem;min-width:0;display:flex}.group-icon{background:var(--brand-soft);width:26px;height:26px;color:var(--brand);border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.group-info{flex:1;min-width:0;line-height:1.2}.group-title{text-overflow:ellipsis;white-space:nowrap;font-size:.8rem;font-weight:700;overflow:hidden}.group-subtitle{color:var(--text-dim);font-size:.7rem}.group-actions{gap:.4rem;display:flex}.btn-icon-chip{border:1px solid var(--border);background:var(--surface-2);cursor:pointer;border-radius:8px;flex:1;justify-content:center;align-items:center;gap:.3rem;height:28px;font-size:.72rem;font-weight:600;transition:border-color .15s,background .15s,color .15s;display:flex}.btn-icon-chip--on{color:var(--green)}.btn-icon-chip--on:hover{border-color:var(--green);background:#34d3991f}.btn-icon-chip--off{color:var(--red)}.btn-icon-chip--off:hover{border-color:var(--red);background:#f871711f}.btn-icon-chip:disabled{opacity:.35;cursor:default}.room-list{flex-direction:column;gap:1.25rem;display:flex}.room-list-empty{text-align:center;color:var(--text-dim);border:1px dashed var(--border);border-radius:16px;padding:2rem 1rem;font-size:.9rem}.room-section{background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:1.25rem}.room-section--empty{opacity:.6}.room-section-head{flex-wrap:nowrap;justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:1rem;display:flex}.room-section-head>div:first-child{flex:1;min-width:0}.room-title-row{min-width:0}.room-title,.room-subtitle{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.room-title{letter-spacing:-.01em;font-size:1.05rem;font-weight:700}.room-title-row{align-items:center;gap:.4rem;display:flex}.room-active-dot{background:var(--green);width:7px;height:7px;box-shadow:0 0 6px var(--green);border-radius:50%;flex-shrink:0}.room-rename-btn{width:22px;height:22px;color:var(--text-faint);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:7px;flex-shrink:0;justify-content:center;align-items:center;transition:color .15s,border-color .15s,background .15s;display:flex}.room-rename-btn:hover{color:var(--brand);border-color:var(--border);background:var(--surface-2)}.room-title-input{letter-spacing:-.01em;color:var(--text);background:var(--surface-2);border:1px solid var(--brand);border-radius:8px;width:12rem;max-width:60vw;padding:.15rem .5rem;font-family:inherit;font-size:1.05rem;font-weight:700}.room-title-input:focus{outline:none}.room-subtitle{color:var(--text-faint);margin-top:.15rem;font-size:.75rem}.room-status--offline{color:var(--orange);background:#fb923c1f;border-radius:999px;height:fit-content;padding:.25rem .6rem;font-size:.75rem}.room-empty-msg{color:var(--text-dim);font-size:.85rem}.room-actions{gap:.5rem;display:flex}.btn-chip{border:1px solid var(--border);background:var(--surface-2);color:var(--text-dim);cursor:pointer;border-radius:999px;padding:.4rem .75rem;font-size:.78rem;transition:color .15s,border-color .15s}.btn-chip:hover{color:var(--text);border-color:var(--brand)}.btn-chip:disabled{opacity:.4;cursor:not-allowed}.btn-chip:disabled:hover{color:var(--text-dim);border-color:var(--border)}.tile-grid{grid-template-columns:repeat(auto-fill,minmax(108px,1fr));gap:.65rem;display:grid}.tile{border:1px solid var(--border);background:var(--surface-2);color:var(--text-dim);cursor:pointer;border-radius:16px;flex-direction:column;align-items:center;gap:.35rem;padding:.9rem .5rem .7rem;transition:transform .1s,border-color .15s,background .15s,color .15s;display:flex;position:relative}.tile:active{transform:scale(.96)}.tile:disabled{opacity:.5;cursor:not-allowed}.tile:disabled:active{transform:none}.tile-icon{width:40px;height:40px;color:inherit;background:#ffffff0a;border-radius:12px;justify-content:center;align-items:center;display:flex}.tile-name{text-transform:capitalize;color:var(--text);text-align:center;font-size:.8rem;line-height:1.2}.tile-state{color:var(--text-faint);font-size:.68rem}.tile-pending-dot{background:var(--brand);border-radius:50%;width:7px;height:7px;animation:.9s infinite pulse-dot;position:absolute;top:.55rem;right:.55rem}.tile-icon--spin{animation:1.6s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.tile--light.tile--on{border-color:var(--amber);background:#fbbf241f}.tile--light.tile--on .tile-icon{color:var(--amber);background:#fbbf242e}.tile--light.tile--on .tile-state{color:var(--amber)}.tile--fan.tile--on{border-color:var(--cyan);background:#38bdf81f}.tile--fan.tile--on .tile-icon{color:var(--cyan);background:#38bdf82e}.tile--fan.tile--on .tile-state{color:var(--cyan)}.tile--spot.tile--on{border-color:var(--orange);background:#fb923c1f}.tile--spot.tile--on .tile-icon{color:var(--orange);background:#fb923c2e}.tile--spot.tile--on .tile-state{color:var(--orange)}.tile--door.tile--on{border-color:var(--purple);background:#a78bfa1f}.tile--door.tile--on .tile-icon{color:var(--purple);background:#a78bfa2e}.tile--door.tile--on .tile-state{color:var(--purple)}.tile--water.tile--on{border-color:var(--blue);background:#60a5fa1f}.tile--water.tile--on .tile-icon{color:var(--blue);background:#60a5fa2e}.tile--water.tile--on .tile-state{color:var(--blue)}.tile--switch.tile--on,.tile--other.tile--on{border-color:var(--green);background:#34d3991f}.tile--switch.tile--on .tile-icon,.tile--other.tile--on .tile-icon{color:var(--green);background:#34d3992e}.tile--switch.tile--on .tile-state,.tile--other.tile--on .tile-state{color:var(--green)}.tile--on .tile-name{color:var(--text)}@media (width<=640px){.dashboard{padding:.65rem .55rem 5.5rem}.connecting-banner{margin:-.65rem -.55rem .65rem;padding:.45rem .75rem;font-size:.75rem}.dashboard-header{gap:.5rem;margin-bottom:.75rem}.brand-block{gap:.5rem}.brand-mark--sm{border-radius:10px;width:32px;height:32px}.dashboard-header h1{font-size:.95rem}.status-text{font-size:.72rem}.header-actions{gap:.35rem}.icon-btn{border-radius:9px;width:32px;height:32px}.icon-btn svg{width:15px;height:15px}.stats-row{gap:.4rem;margin-bottom:.75rem}.stat-card{border-radius:12px;gap:.5rem;padding:.5rem .6rem}.stat-icon{border-radius:8px;width:28px;height:28px}.stat-icon svg{width:14px;height:14px}.stat-value{font-size:.9rem}.stat-label{margin-top:.05rem;font-size:.65rem}.group-row{padding:.5rem .55rem calc(.5rem + env(safe-area-inset-bottom));gap:.4rem}.group-card{border-radius:10px;gap:.3rem;padding:.4rem .35rem}.group-card-top{gap:.35rem}.group-icon{border-radius:6px;width:18px;height:18px}.group-icon svg{width:10px;height:10px}.group-title{font-size:.62rem}.group-subtitle{font-size:.56rem}.group-actions{gap:.25rem}.btn-icon-chip{border-radius:6px;gap:.2rem;height:22px;font-size:.6rem}.btn-icon-chip svg{width:9px;height:9px}.room-list{gap:.55rem}.room-section{border-radius:13px;padding:.65rem .6rem}.room-section-head{gap:.4rem;margin-bottom:.5rem}.room-title{font-size:.85rem}.room-rename-btn{width:18px;height:18px}.room-rename-btn svg{width:10px;height:10px}.room-title-input{width:8.5rem;padding:.1rem .4rem;font-size:.85rem}.room-subtitle{font-size:.65rem}.room-status--offline{padding:.15rem .45rem;font-size:.65rem}.room-actions{flex-shrink:0;gap:.3rem}.btn-chip{text-align:center;padding:.3rem .6rem;font-size:.68rem}.room-section--empty{padding:.55rem .6rem}.room-section--empty .room-section-head{margin-bottom:0}.room-empty-msg{display:none}.tile-grid{grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:.35rem}.tile{border-radius:12px;gap:.2rem;padding:.5rem .25rem .4rem}.tile-icon{border-radius:9px;width:28px;height:28px}.tile-icon svg{width:15px;height:15px}.tile-name{font-size:.68rem;line-height:1.1}.tile-state{font-size:.58rem}.toast-stack{max-width:none;top:.75rem;left:.75rem;right:.75rem}.login-card{padding:1.75rem 1.5rem}}