:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:#17212b;background:#eef2f6;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{background:linear-gradient(#25d3661c,#eef2f600 260px),#eef2f6;min-width:320px;margin:0}button,input,textarea{font:inherit}button{color:#17212b;cursor:pointer;background:#fff;border:1px solid #cfd8e3;border-radius:8px;justify-content:center;align-items:center;gap:8px;min-height:42px;font-weight:700;transition:border-color .15s,transform .15s,background .15s;display:inline-flex}button:hover{border-color:#25d366;transform:translateY(-1px)}button:disabled{cursor:wait;opacity:.65;transform:none}input,textarea{color:#17212b;background:#fbfcfe;border:1px solid #cfd8e3;border-radius:8px;outline:none;width:100%;padding:11px 12px}input:focus,textarea:focus{border-color:#25d366;box-shadow:0 0 0 3px #25d36624}label{color:#425466;gap:7px;font-size:.9rem;font-weight:700;display:grid}.app-shell{width:min(1180px,100% - 32px);margin:0 auto;padding:28px 0 40px}.topbar{justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px;display:flex}.eyebrow{color:#0c8d48;text-transform:uppercase;margin:0 0 4px;font-size:.8rem;font-weight:800}h1,h2{letter-spacing:0;margin:0}h1{font-size:clamp(2rem,6vw,3.2rem);line-height:1}h2{font-size:1.04rem}.notice{color:#425466;background:#fff;border:1px solid #cfd8e3;border-radius:8px;align-items:center;gap:10px;min-height:48px;margin-bottom:18px;padding:12px 14px;font-weight:700;display:flex}.notice[data-type=success]{color:#0c8d48;border-color:#25d36673}.notice[data-type=error]{color:#b42318;border-color:#dc354573}.mode-switch{grid-template-columns:1fr 1fr;gap:10px;margin-bottom:18px;display:grid}.mode-switch button{background:#fff}.mode-switch button[data-active=true]{color:#0c8d48;background:#ecfff4;border-color:#25d366}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.panel,.devices-list{background:#fff;border:1px solid #d8e0ea;border-radius:8px;padding:18px;box-shadow:0 10px 24px #0f172a0f}.panel{align-content:start;gap:14px;display:grid}.panel-title,.section-heading{justify-content:space-between;align-items:center;gap:12px;display:flex}.panel-title{color:#17212b;justify-content:flex-start}.button-row{grid-template-columns:1fr 1fr;gap:10px;display:grid}.primary-action{color:#062b16;background:#25d366;border-color:#25d366}.icon-button{width:42px;padding:0}.code-block{color:#d5ffe5;background:#111827;border-radius:8px;margin:0;padding:12px;font-size:.85rem;overflow:auto}.connection-state{color:#b42318;background:#fff7f7;border:1px solid #f1b8b8;border-radius:8px;justify-content:center;align-items:center;min-height:42px;font-weight:900;display:flex}.connection-state[data-connected=true]{color:#0c8d48;background:#ecfff4;border-color:#25d36673}.qr-output{background:#f7fafc;border:1px dashed #9fb0c3;border-radius:8px;justify-items:center;gap:10px;padding:14px;display:grid}.qr-output img{aspect-ratio:1;object-fit:contain;background:#fff;border:8px solid #fff;border-radius:8px;width:min(260px,100%)}.qr-output a{color:#0c8d48;align-items:center;gap:6px;font-weight:800;text-decoration:none;display:inline-flex}.timer-bar{background:#d8e0ea;border-radius:999px;width:min(320px,100%);height:8px;overflow:hidden}.timer-bar div{border-radius:inherit;background:#25d366;height:100%;transition:width .2s linear}.connected-card{color:#0c8d48;text-align:center;background:#ecfff4;border:1px solid #25d36673;border-radius:8px;justify-items:center;gap:8px;padding:20px;display:grid}.connected-card strong{font-size:1.25rem}.connected-card span{color:#425466;font-weight:700}.pairing-box{grid-template-columns:1fr auto;align-items:end;gap:10px;display:grid}.pairing-code{color:#d5ffe5;letter-spacing:0;overflow-wrap:anywhere;background:#111827;border-radius:8px;grid-column:1/-1;justify-content:center;align-items:center;min-height:52px;font-size:clamp(1.4rem,5vw,2.4rem);font-weight:900;display:flex}.devices-list{margin-top:16px}.device-table{gap:8px;margin-top:12px;display:grid}.device-row{text-align:left;justify-content:space-between;width:100%;padding:10px 12px}.device-row span{overflow-wrap:anywhere}.device-row strong{color:#0c8d48;white-space:nowrap}.admin-layout{gap:16px;display:grid}.admin-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;display:grid}.stat-card{background:#fff;border:1px solid #d8e0ea;border-radius:8px;align-content:center;gap:6px;min-height:96px;padding:18px;display:grid;box-shadow:0 10px 24px #0f172a0f}.stat-card span{color:#425466;font-weight:800}.stat-card strong{color:#0c8d48;font-size:2rem;line-height:1}.admin-table{gap:8px;display:grid}.admin-row{background:#fbfcfe;border:1px solid #d8e0ea;border-radius:8px;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;padding:11px 12px;display:grid}.admin-row span,.admin-row small{overflow-wrap:anywhere}.admin-row strong{color:#0c8d48}.admin-device-row{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) auto auto auto}.admin-device-row em{color:#425466;font-style:normal;font-weight:900}.admin-client-row{grid-template-columns:minmax(0,1fr) auto auto minmax(220px,auto)}.admin-client-row span{gap:4px;display:grid}.admin-client-row small{color:#425466;font-weight:700}.admin-client-row em{color:#425466;font-style:normal;font-weight:900}.admin-actions{grid-template-columns:1fr 1fr;gap:8px;display:grid}.admin-actions button{min-height:36px;padding:0 10px;font-size:.9rem}.api-key-box{background:#ecfff4;border:1px solid #25d36673;border-radius:8px;gap:8px;padding:14px;display:grid}.api-key-box span,.api-key-box small{color:#425466;font-weight:800}.api-key-box code{color:#d5ffe5;overflow-wrap:anywhere;background:#111827;border-radius:8px;padding:10px;font-size:.95rem}@media (width<=820px){.app-shell{width:min(100% - 20px,1180px);padding-top:18px}.grid,.button-row,.pairing-box,.admin-cards,.admin-device-row,.admin-client-row,.admin-actions{grid-template-columns:1fr}.device-row{flex-direction:column;align-items:flex-start}}.admin-client-keys{flex-direction:column;gap:4px;display:flex}.api-key-badge{background:var(--bg-modifier-hover);color:var(--text-muted);-webkit-user-select:all;user-select:all;white-space:nowrap;text-overflow:ellipsis;border-radius:4px;max-width:250px;padding:4px 8px;font-size:11px;overflow:hidden}.api-key-item{align-items:center;gap:4px;display:flex}.delete-key-btn{color:#ff4d4f;background:0 0;border-radius:4px;padding:0 4px;font-size:16px;line-height:1}.delete-key-btn:hover{color:#ff4d4f;background:#ff4d4f1a}