:root{--bg:#eef3f8;--panel:#fff;--ink:#112033;--muted:#67768a;--blue:#1867e8;--navy:#10233f;--line:#dfe7f0;--danger:#c2413b;--warn:#a16207;--ok:#15803d}
*{box-sizing:border-box}body{margin:0;background:var(--bg);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink)}
button,input{font:inherit}.app{max-width:1080px;margin:auto;padding-bottom:92px}.hero{padding:calc(18px + env(safe-area-inset-top)) 18px 22px;background:linear-gradient(145deg,#0e213e,#183b67);color:#fff}.brand{font-size:12px;letter-spacing:.16em;font-weight:800;color:#9ec5ff}.hero h1{margin:5px 0 3px;font-size:34px}.hero p{margin:0;color:#c9d7e8}.search{margin-top:16px;width:100%;border:0;border-radius:17px;padding:15px 16px;font-size:16px}
.section{padding:14px}.head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.head h2{margin:0}.head small{color:var(--muted)}
.homes{display:grid;gap:12px}.home-card{border:0;background:#fff;border-radius:23px;padding:17px;text-align:left;box-shadow:0 8px 26px rgba(16,35,63,.08)}.home-top{display:flex;justify-content:space-between;gap:12px}.home-name{display:flex;gap:11px;align-items:center}.home-icon{font-size:30px}.home-card h3{margin:0 0 4px;font-size:20px}.sub{font-size:12px;color:var(--muted)}.badge{border-radius:999px;padding:7px 10px;background:#fef3c7;color:#92400e;font-weight:800;font-size:11px}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}.metric{padding:10px;border-radius:14px;background:#f7f9fc;border:1px solid var(--line)}.metric strong{display:block;font-size:17px}.metric span{font-size:11px;color:var(--muted)}
.quick,.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.tile{border:0;background:#fff;border-radius:18px;padding:15px;text-align:left;min-height:120px;box-shadow:0 5px 18px rgba(16,35,63,.06)}.tile .ico{font-size:28px;display:block;margin-bottom:10px}.tile strong{display:block}.tile small{display:block;color:var(--muted);margin-top:5px;line-height:1.3}.tile.camera{background:linear-gradient(145deg,#dcecff,#fff)}.alert{margin-top:8px;font-size:11px;font-weight:800;color:var(--danger)}
.filters{display:flex;gap:8px;overflow:auto;padding-bottom:4px}.filter{white-space:nowrap;border:1px solid var(--line);background:#fff;border-radius:999px;padding:9px 12px;font-weight:700}.filter.active{background:var(--navy);color:#fff}
.room{background:#fff;border-radius:18px;padding:15px;margin-bottom:10px}.room h3{margin:0 0 10px}.pills{display:flex;flex-wrap:wrap;gap:7px}.pill{border:0;border-radius:999px;background:#eef3f8;padding:8px 10px;font-weight:700}
.bottom{position:fixed;bottom:0;left:0;right:0;background:rgba(255,255,255,.97);border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(5,1fr);padding:8px 6px calc(8px + env(safe-area-inset-bottom));z-index:20}.bottom button{border:0;background:none;color:#6b7788;font-size:11px;font-weight:700}.bottom button.active{color:var(--blue)}
.modal{position:fixed;inset:0;background:rgba(5,15,30,.58);display:flex;align-items:flex-end;z-index:40}.hidden{display:none}.sheet{width:100%;background:#fff;border-radius:25px 25px 0 0;padding:19px 17px calc(25px + env(safe-area-inset-bottom));max-height:88vh;overflow:auto}.close{float:right;border:0;background:#e8eef5;width:36px;height:36px;border-radius:50%;font-size:20px}.action{width:100%;border:0;border-radius:14px;padding:14px;margin-top:10px;background:var(--blue);color:#fff;font-weight:800}.secondary{background:#e8eef5;color:var(--ink)}.note{background:#f6f8fb;border:1px solid var(--line);border-radius:13px;padding:12px;color:#536176;line-height:1.4}.empty{text-align:center;padding:30px;color:var(--muted)}
@media(min-width:720px){.homes{grid-template-columns:repeat(3,1fr)}.grid{grid-template-columns:repeat(4,1fr)}.quick{grid-template-columns:repeat(4,1fr)}}

.home-card.expanded{display:block}
.overview-list{margin-top:14px;border-top:1px solid var(--line);padding-top:8px}
.overview-row{display:flex;justify-content:space-between;gap:12px;padding:7px 0;font-size:13px}
.overview-row span{color:#4d5d72}
.overview-row strong{text-align:right}
.open-home{margin-top:11px;color:var(--blue);font-weight:800;font-size:13px}
.badge.good{background:#dcfce7;color:#166534}
.status-banner{border-radius:18px;padding:15px 16px;display:flex;flex-direction:column;gap:3px}
.status-banner strong{font-size:17px}
.status-banner span{font-size:12px}
.status-banner.warn{background:#fff7ed;border:1px solid #fed7aa;color:#9a3412}
.status-banner.ok{background:#ecfdf5;border:1px solid #bbf7d0;color:#166534}