:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--ink:#1d211b;--muted:#6f7568;--paper:#f7f1e4;--paper-strong:#fffaf0;--moss:#4f6f52;--moss-dark:#2f4a38;--clay:#c86f4f;--straw:#e5c46f;--line:#1d211b1f;--shadow:0 24px 80px #2d342324;--radius-lg:30px;--radius-md:20px;--radius-sm:14px;background:var(--paper);color:var(--ink);font-family:Avenir Next,Trebuchet MS,Verdana,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(circle at 8% 10%,#c86f4f33,#0000 32rem),radial-gradient(circle at 92% 5%,#4f6f5233,#0000 28rem),linear-gradient(135deg,#fbf4e7 0%,#eee4cf 48%,#f7f1e4 100%);min-width:320px;min-height:100vh;margin:0}button,input,select{font:inherit}button,select{cursor:pointer}button:disabled,input:disabled{cursor:wait;opacity:.62}.shell{width:min(1440px,100% - 32px);margin:0 auto;padding:32px 0 48px}.panel{border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#fffaf0bd}.hero{grid-template-columns:minmax(0,1fr) auto;align-items:stretch;gap:28px;min-height:260px;padding:clamp(28px,5vw,56px);display:grid;position:relative;overflow:hidden}.hero:after{content:"";background:repeating-linear-gradient(45deg,#4f6f521c 0 10px,#0000 10px 20px);border-radius:999px;width:28rem;height:28rem;position:absolute;inset:auto -9rem -12rem auto;transform:rotate(-8deg)}.eyebrow{color:var(--moss-dark);letter-spacing:.18em;text-transform:uppercase;margin:0 0 14px;font-size:.8rem;font-weight:800}h1,h2{margin:0;font-family:Georgia,Times New Roman,serif;font-weight:700;line-height:.96}h1{letter-spacing:-.075em;max-width:850px;font-size:clamp(3rem,8vw,7.2rem)}h2{letter-spacing:-.045em;font-size:clamp(1.5rem,3vw,2.3rem)}.hero-copy{max-width:620px;color:var(--muted);margin:22px 0 0;font-size:clamp(1rem,2vw,1.25rem);line-height:1.6}.status-card{z-index:1;background:var(--ink);min-width:210px;color:var(--paper-strong);border-radius:24px;flex-direction:column;justify-content:flex-end;padding:24px;display:flex;position:relative}.status-card strong{letter-spacing:-.07em;margin-top:16px;font-size:2.3rem}.status-card small{color:#fffaf0b3}.pulse{background:#87d78d;border-radius:999px;width:18px;height:18px;animation:1.8s infinite breathe;box-shadow:0 0 #87d78da6}.pulse.off{background:var(--clay);box-shadow:none;animation:none}.stats-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:16px;display:grid}.stat{padding:22px}.stat span{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:.88rem;font-weight:700;display:block}.stat strong{letter-spacing:-.08em;margin-top:8px;font-size:3rem;line-height:1;display:block}.workspace{grid-template-columns:360px minmax(0,1fr);align-items:start;gap:18px;margin-top:18px;display:grid}.rooms{padding:22px;position:sticky;top:18px}.section-head,.device-topline,.device-footer,.room-edit-row,.slider-row{justify-content:space-between;align-items:center;gap:12px;display:flex}.section-head h2{font-size:2rem}.room-form{grid-template-columns:minmax(0,1fr) auto;gap:10px;margin:22px 0;display:grid}input,select{border:1px solid var(--line);border-radius:var(--radius-sm);width:100%;min-height:46px;color:var(--ink);background:#ffffff9e;outline:none;padding:0 14px}input:focus,select:focus{border-color:#4f6f528c;box-shadow:0 0 0 4px #4f6f521f}button{background:var(--moss);color:#fff;border:0;border-radius:999px;min-height:42px;padding:0 18px;font-weight:800;transition:transform .18s,box-shadow .18s,background .18s}button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 12px 24px #2f4a382e}button.ghost{border:1px solid var(--line);color:var(--ink);background:0 0}.room-list{gap:8px;display:grid}.room-list button{width:100%;min-height:50px;color:var(--ink);text-align:left;background:#ffffff6b;border:1px solid #0000;justify-content:space-between;display:flex}.room-list button.active{background:var(--moss-dark);color:var(--paper-strong);border-color:#4f6f5259}.room-actions{border-top:1px solid var(--line);margin-top:24px;padding-top:18px}.room-actions p{color:var(--muted);letter-spacing:.1em;text-transform:uppercase;margin:0 0 12px;font-size:.8rem;font-weight:800}.room-edit-row{margin-top:8px}.room-edit-row span{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.room-edit-row button{min-height:34px;padding:0 12px;font-size:.82rem}.devices{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;display:grid}.error,.empty{grid-column:1/-1;padding:28px}.error{color:#873d27;background:#ffebded1;border-color:#c86f4f5c;font-weight:800}.empty p{color:var(--muted);margin-bottom:0}.device-card{gap:18px;padding:24px;animation:.36s both cardIn;display:grid}.device-topline{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;font-size:.82rem;font-weight:800}.device-type,.room-pill{border:1px solid var(--line);background:#ffffff80;border-radius:999px;padding:8px 10px}.room-pill{color:var(--moss-dark);text-transform:none;letter-spacing:0}.device-main{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px;display:grid}.device-main h2{overflow-wrap:anywhere}.device-main p{color:var(--muted);margin:10px 0 0;font-size:1.1rem;font-weight:800}.power{width:82px;height:82px;color:var(--ink);background:#d9d0bd;border-radius:28px;font-size:1.05rem}.power.on{background:var(--straw);color:#4a3311;box-shadow:0 18px 34px #e5c46f59}.slider-row{color:var(--muted);grid-template-columns:auto minmax(0,1fr) 48px;font-weight:800;display:grid}input[type=range]{min-height:auto;accent-color:var(--moss)}.metrics{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0;display:grid}.metrics div{background:#ffffff7a;border-radius:16px;min-width:0;padding:12px}.metrics dt{color:var(--muted);letter-spacing:.06em;text-transform:uppercase;font-size:.74rem;font-weight:800}.metrics dd{color:var(--ink);text-overflow:ellipsis;white-space:nowrap;margin:6px 0 0;font-weight:800;overflow:hidden}.device-footer{align-items:stretch}.device-footer select{max-width:230px}@keyframes breathe{70%{box-shadow:0 0 0 14px #87d78d00}to{box-shadow:0 0 #87d78d00}}@keyframes cardIn{0%{opacity:0;transform:translateY(10px)scale(.98)}}@media (width<=1080px){.hero,.workspace{grid-template-columns:1fr}.rooms{position:static}}@media (width<=760px){.shell{width:min(100% - 20px,1440px);padding-top:10px}.hero{padding:26px}.stats-grid,.devices{grid-template-columns:1fr}.status-card{min-width:0}.room-form,.device-main,.device-footer,.metrics{grid-template-columns:1fr}.device-footer select{max-width:none}}