:root{color:#102027;background:radial-gradient(circle at 18% 12%,rgba(22,163,74,.2),transparent 28%),radial-gradient(circle at 84% 18%,rgba(14,116,144,.18),transparent 30%),radial-gradient(circle at 52% 88%,rgba(15,23,42,.08),transparent 36%),linear-gradient(180deg,#f8fbfd,#edf4f8);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{margin:0;min-height:100vh;overflow-x:hidden}body:before{background-image:linear-gradient(rgba(15,23,42,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(15,23,42,.035) 1px,transparent 1px);background-size:42px 42px;content:"";top:0;right:0;bottom:0;left:0;-webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.75),transparent 74%);mask-image:linear-gradient(to bottom,rgba(0,0,0,.75),transparent 74%);pointer-events:none;position:fixed;z-index:-1}#app{min-height:100vh}button{border:0;border-radius:18px;background:#0f766e;color:#fff;cursor:pointer;font:inherit;font-weight:700;min-height:48px;padding:0 18px;transition:background .15s ease,box-shadow .15s ease,transform .15s ease}button:hover{background:#0b5f59;transform:translateY(-1px)}button:disabled{cursor:wait;opacity:.55}button.danger{background:#c93c4a}button.danger:hover{background:#a92f3b}button.secondary{background:#fff;box-shadow:inset 0 0 0 1px #1e6f832e;color:#1e6f83}button.secondary:hover{background:#eef2f3}.shell{margin:0 auto;max-width:98vw;min-height:100vh;padding:26px 18px 40px}.topbar{align-items:center;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffffc7;border:1px solid rgba(255,255,255,.72);border-radius:26px;box-shadow:0 20px 60px #0f172a1a,0 2px 8px #0f172a0a,inset 0 1px #fffffff2;display:flex;justify-content:space-between;margin-bottom:46px;padding:12px 12px 12px 18px}.brand-mark{align-items:center;color:#0f172a;display:inline-flex;font-size:1rem;font-weight:800;gap:10px}.brand-mark .material-symbols-rounded{align-items:center;background:linear-gradient(145deg,#dcfce7,#fff);border-radius:14px;color:#16a34a;display:inline-flex;font-size:1.2rem;height:34px;justify-content:center;width:34px}.material-symbols-rounded{direction:ltr;display:inline-block;font-family:Material Symbols Rounded;font-feature-settings:"liga";font-size:1.25em;font-style:normal;font-weight:400;letter-spacing:0;line-height:1;text-transform:none;white-space:nowrap;word-wrap:normal;opacity:0;overflow:hidden;transition:opacity .12s ease}.icons-ready .material-symbols-rounded{opacity:1}.eyebrow{color:#5d6b73;font-size:.78rem;font-weight:800;letter-spacing:0;margin:0 0 6px;text-transform:uppercase}h1,h2{letter-spacing:0;line-height:1.1;margin:0}h1{font-size:clamp(2rem,4vw,3.2rem)}h2{font-size:1.5rem}.icon-button{align-items:center;background:#ffffffe6;border-radius:999px;box-shadow:0 14px 34px #1620261f,inset 0 1px #ffffffe6;color:#334155;display:flex;font-size:1.15rem;height:46px;justify-content:center;min-height:46px;padding:0;width:46px}.icon-button:hover{background:#fff;color:#c93c4a}.dot{border-radius:999px;display:inline-block;height:9px;width:9px}.online{background:#1f9d55}.offline{background:#c83d47}.control-stage{align-items:center;display:flex;justify-content:center;flex-wrap:wrap;gap:20px}.device-card{background:linear-gradient(180deg,#fffffffa,#f8fafcf0);border:1px solid rgba(255,255,255,.76);border-radius:28px;box-shadow:0 30px 90px #0f172a29,0 10px 28px #0f172a14,inset 0 1px #fffffff5;max-width:380px;padding:22px;width:100%}.device-card.muted{background:#f8fafb;color:#526069}.device-hero{align-items:center;display:flex;gap:16px;justify-items:initial;margin-bottom:22px;text-align:left}.badge{border-radius:999px;color:#fff;font-size:.82rem;font-weight:800;padding:6px 10px;white-space:nowrap}.device-state{align-items:center;border-radius:999px;display:inline-flex;font-size:.75rem;font-weight:800;gap:7px;margin-top:8px;min-height:30px;padding:0 12px;width:max-content}.device-orb{align-items:center;border-radius:24px;flex:0 0 auto;display:inline-flex;height:74px;justify-content:center;position:relative;width:74px}.device-orb:after{border-radius:inherit;content:"";top:7px;right:7px;bottom:7px;left:7px;position:absolute}.device-orb .material-symbols-rounded{font-size:2.25rem;position:relative;z-index:1}.online-orb{background:linear-gradient(145deg,#dcfce7,#fff);box-shadow:0 22px 46px #16a34a38,inset 0 0 0 1px #16a34a29;color:#16a34a}.online-orb:after{box-shadow:inset 0 0 0 1px #1f9d5524}.offline-orb{background:linear-gradient(145deg,#ffe4e6,#fff);box-shadow:0 22px 46px #e11d482e,inset 0 0 0 1px #e11d4824;color:#e11d48}.cool-orb{background:linear-gradient(145deg,#e0f2fe,#fff);box-shadow:0 22px 46px #0ea5e933,inset 0 0 0 1px #0ea5e929;color:#0284c7}.device-title{align-items:flex-start;display:grid;min-width:0;width:100%}.online-state{background:#dcfce7;color:#15803d}.offline-state{background:#ffe4e6;color:#be123c}.actions{display:grid;gap:12px}.primary-action{align-items:center;display:inline-flex;font-size:1rem;gap:8px;justify-content:center;box-shadow:0 16px 32px #1223301f,inset 0 1px #ffffff3d;font-size:1.02rem;min-height:56px;width:100%}.secondary-actions{display:grid;gap:10px;grid-template-columns:1fr 1fr}.compact-action{align-items:center;border-radius:16px;display:inline-flex;font-size:.86rem;gap:6px;justify-content:center;min-height:46px;padding:0 10px;white-space:nowrap;width:100%}.compact-action .material-symbols-rounded{font-size:1.1rem}.wake-action{background:linear-gradient(135deg,#16a34a,#22c55e);box-shadow:0 16px 34px #16a34a3d,inset 0 1px #ffffff47}.wake-action:hover{background:linear-gradient(135deg,#15803d,#16a34a)}.shutdown-action{background:linear-gradient(135deg,#e11d48,#fb7185);box-shadow:0 16px 34px #e11d483d,inset 0 1px #ffffff42}.shutdown-action:hover{background:linear-gradient(135deg,#be123c,#e11d48)}.restart-action{background:#fffffff0;box-shadow:0 12px 28px #0e74901a,inset 0 0 0 1px #0e74902e;color:#0097c7}.restart-action:hover{background:#ecfeff}.sleep-action{background:#fffffff0;box-shadow:0 12px 28px #6366f11f,inset 0 0 0 1px #6366f12e;color:#4f46e5}.sleep-action:hover{background:#f2f1ff}.aircon-card{max-width:440px}.aircon-readout{align-items:center;background:#f0f9ffc7;border-radius:24px;display:grid;gap:14px;grid-template-columns:52px 1fr 52px;margin:6px 0 18px;padding:14px;text-align:center}.aircon-readout strong{display:block;font-size:2.25rem;line-height:1}.aircon-readout span{color:#64748b;display:block;font-weight:800;margin-top:4px}.round-action{align-items:center;border-radius:18px;display:inline-flex;height:52px;justify-content:center;min-height:52px;padding:0;width:52px}.control-group{display:grid;gap:10px;margin-top:16px}.control-group>span{color:#42515a;font-size:.86rem;font-weight:800}.segmented{background:#ffffffb8;border-radius:18px;box-shadow:inset 0 0 0 1px #64748b24;display:grid;gap:6px;grid-template-columns:repeat(5,minmax(0,1fr));padding:6px}.segmented button{background:transparent;border-radius:14px;color:#475569;font-size:.78rem;min-height:38px;padding:0 6px}.segmented button:hover,.segmented button.active{background:#0ea5e9;color:#fff}.timer-row{display:grid;gap:10px;grid-template-columns:minmax(0,1fr) minmax(130px,auto)}.dialog-backdrop{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#1320266b;display:flex;top:0;right:0;bottom:0;left:0;justify-content:center;padding:20px;position:fixed;z-index:20}.confirm-dialog{background:linear-gradient(180deg,#fffffffc,#f8fafcf5);border:1px solid rgba(255,255,255,.76);border-radius:28px;box-shadow:0 32px 90px #0e1c2647,0 12px 28px #0e1c2624,inset 0 1px #fffffff0;max-width:360px;padding:24px;text-align:center;width:100%}.dialog-icon{align-items:center;background:#ffe4e6;border-radius:20px;color:#e11d48;display:inline-flex;height:56px;justify-content:center;margin-bottom:14px;width:56px}.dialog-icon .material-symbols-rounded{font-size:1.8rem}.confirm-dialog h3{font-size:1.2rem;line-height:1.2;margin:0}.confirm-dialog p{color:#62717a;line-height:1.45;margin:10px 0 0}.dialog-actions{display:grid;gap:10px;grid-template-columns:1fr 1fr;margin-top:22px}.dialog-cancel{background:#fff;box-shadow:inset 0 0 0 1px #62717a33;color:#42515a}.dialog-cancel:hover{background:#f4f7fb}.dialog-confirm{background:linear-gradient(135deg,#e11d48,#fb7185)}.dialog-confirm:hover{background:linear-gradient(135deg,#be123c,#e11d48)}.error{background:#fff0f1;border-radius:14px;box-shadow:0 12px 26px #8f20291f;color:#9f2631;margin-top:16px;padding:12px 14px}.login-shell{align-items:center;display:flex;min-height:100vh;padding:20px}.login-panel{background:linear-gradient(180deg,#fffffffa,#f8fafcf0);border:1px solid rgba(255,255,255,.76);border-radius:28px;box-shadow:0 30px 90px #0f172a29,0 10px 28px #0f172a14,inset 0 1px #fffffff5;display:grid;gap:18px;margin:0 auto;max-width:430px;padding:30px;width:100%}.login-head{align-items:center;display:flex;gap:14px;margin-bottom:4px}.login-mark{align-items:center;background:linear-gradient(145deg,#dcfce7,#fff);border-radius:20px;box-shadow:0 18px 34px #16a34a2e,inset 0 0 0 1px #16a34a24;color:#16a34a;display:inline-flex;height:58px;justify-content:center;width:58px}.login-mark .material-symbols-rounded{font-size:1.9rem}label{color:#34444d;display:grid;font-size:.9rem;font-weight:800;gap:8px}input,select{border:0;border-radius:16px;box-shadow:inset 0 0 0 1px #64748b2e,0 8px 18px #1423320a;color:#172026;font:inherit;min-height:50px;padding:0 14px}input:focus,select:focus{border-color:transparent;outline:4px solid rgba(22,163,74,.15)}.login-submit{align-items:center;background:linear-gradient(135deg,#16a34a,#22c55e);box-shadow:0 16px 34px #16a34a3d,inset 0 1px #ffffff3d;display:inline-flex;gap:8px;justify-content:center;min-height:58px}.log-panel{margin-top:18px}.section-heading{margin-bottom:12px}.empty-state,.log-item{background:#fff;border-radius:14px;box-shadow:0 12px 28px #14233214}.empty-state{color:#526069;padding:18px}.log-list{display:grid;gap:10px}.log-item{align-items:flex-start;display:flex;gap:10px;padding:14px}.log-item .dot{flex:0 0 auto;margin-top:6px}.log-item p{color:#5d6b73;margin:4px 0 0}.log-item .log-error{color:#8f2029}@media(max-width:640px){.topbar{margin-bottom:34px}.device-card{padding:20px}.device-orb{height:68px;width:68px}.segmented{grid-template-columns:repeat(2,minmax(0,1fr))}.timer-row{grid-template-columns:1fr}}
