html,body{margin:0;padding:0}:root{--bg:#eef1f4;--surface:#fff;--surface-sunken:#f5f7f9;--border:#e3e7ec;--ink:#12151a;--ink-secondary:#5b6472;--ink-muted:#98a2b3;--sidebar-bg:#14181f;--sidebar-ink:#c7ccd4;--sidebar-ink-muted:#6b7280;--sidebar-active-bg:#1f2430;--accent:#0f766e;--accent-tint:#e6f2f1;--temp:#c2410c;--temp-tint:#fdf1ea;--humidity:#0284c7;--humidity-tint:#e8f6fd;--good:#16a34a;--good-tint:#dcfce7;--warn:#d97706;--warn-tint:#fef3c7;--critical:#dc2626;--critical-tint:#fee2e2;--font-display:"Space Grotesk", sans-serif;--font-body:"IBM Plex Sans", sans-serif;--font-mono:"IBM Plex Mono", monospace;--radius:12px;--shadow-card:0 1px 2px #12151a0a, 0 1px 12px #12151a0a}*{box-sizing:border-box}html,body,#root{height:100%}body{background:var(--bg);color:var(--ink);font-family:var(--font-body);-webkit-font-smoothing:antialiased;margin:0}a{color:inherit}button{cursor:pointer;font-family:inherit}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.app-shell{min-height:100vh;display:flex}.main-area{flex:1;min-width:0;padding:1.75rem clamp(1rem,3vw,2.5rem) 3rem}.sidebar{background:var(--sidebar-bg);width:250px;color:var(--sidebar-ink);flex-direction:column;flex-shrink:0;height:100vh;padding:1.5rem 1rem;display:flex;position:sticky;top:0}.sidebar-brand{border-bottom:1px solid #ffffff14;margin-bottom:1.25rem;padding:0 .5rem 1.25rem}.sidebar-eyebrow{letter-spacing:.08em;text-transform:uppercase;color:var(--sidebar-ink-muted);font-size:.68rem;font-weight:500}.sidebar-title{font-family:var(--font-display);color:#fff;margin:.15rem 0 0;font-size:1.15rem;font-weight:600}.sidebar-nav-label{letter-spacing:.06em;text-transform:uppercase;color:var(--sidebar-ink-muted);margin-bottom:.5rem;padding:0 .75rem;font-size:.7rem}.sidebar-nav{flex-direction:column;gap:.15rem;display:flex}.sidebar-nav a{color:var(--sidebar-ink);border-left:2px solid #0000;border-radius:8px;align-items:center;gap:.6rem;padding:.55rem .75rem;font-size:.88rem;text-decoration:none;transition:background-color .15s,color .15s;display:flex}.sidebar-nav a:hover{background:#ffffff0d}.sidebar-nav a.active{background:var(--sidebar-active-bg);color:#fff;border-left-color:var(--accent)}.sidebar-nav .dot{background:var(--good);border-radius:999px;flex-shrink:0;width:6px;height:6px}.sidebar-footer{color:var(--sidebar-ink-muted);border-top:1px solid #ffffff14;margin-top:auto;padding:.75rem;font-size:.72rem;line-height:1.5}.sidebar-footer a{color:var(--sidebar-ink);text-underline-offset:2px;text-decoration:underline}.empty-state{flex-direction:column;justify-content:center;align-items:flex-start;max-width:420px;min-height:60vh;display:flex}.empty-state h1{font-family:var(--font-display);margin:0 0 .5rem;font-size:1.6rem}.empty-state p{color:var(--ink-secondary);margin:0;line-height:1.6}.site-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:1rem;margin-bottom:1.75rem;display:flex}.site-header h1{font-family:var(--font-display);letter-spacing:-.01em;margin:0 0 .3rem;font-size:1.9rem;font-weight:600}.site-meta{color:var(--ink-secondary);align-items:center;gap:.4rem;font-size:.9rem;display:flex}.site-meta .sep{color:var(--ink-muted)}.device-chip{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-card);border-radius:999px;align-items:center;gap:.5rem;padding:.45rem .9rem .45rem .7rem;font-size:.82rem;display:flex}.status-dot{border-radius:999px;flex-shrink:0;width:8px;height:8px}.status-dot.online{background:var(--good)}.status-dot.offline{background:var(--critical)}.status-dot.warning{background:var(--warn)}.status-dot.pulse{animation:1.8s ease-out infinite pulse-ring;box-shadow:0 0 #16a34a99}@keyframes pulse-ring{0%{box-shadow:0 0 #16a34a8c}70%{box-shadow:0 0 0 7px #16a34a00}to{box-shadow:0 0 #16a34a00}}@media (prefers-reduced-motion:reduce){.status-dot.pulse{animation:none}}.card-grid{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.25rem;display:grid}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-card);padding:1.25rem 1.35rem}.sensor-card-head{justify-content:space-between;align-items:center;margin-bottom:.9rem;display:flex}.sensor-card-title{align-items:center;gap:.6rem;display:flex}.sensor-icon{border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:30px;height:30px;display:flex}.sensor-card-title h3{font-family:var(--font-display);margin:0;font-size:.98rem;font-weight:600}.pill{border-radius:999px;align-items:center;gap:.3rem;padding:.22rem .6rem;font-size:.72rem;font-weight:600;display:inline-flex}.pill.good{background:var(--good-tint);color:var(--good)}.pill.muted{background:var(--surface-sunken);color:var(--ink-muted)}.sensor-value{font-family:var(--font-mono);align-items:baseline;gap:.35rem;margin-bottom:.75rem;display:flex}.sensor-value .num{font-size:2.1rem;font-weight:600;line-height:1}.sensor-value .unit{color:var(--ink-secondary);font-size:.95rem}.range-picker{gap:.25rem;margin-bottom:.6rem;display:flex}.range-picker button{background:var(--surface-sunken);color:var(--ink-secondary);border:1px solid #0000;border-radius:6px;padding:.25rem .55rem;font-size:.72rem;font-weight:500}.range-picker button.active{background:var(--ink);color:#fff}.sensor-card-footer{color:var(--ink-muted);border-top:1px solid var(--border);justify-content:space-between;margin-top:.4rem;padding-top:.6rem;font-size:.76rem;display:flex}.chart-wrap{position:relative}.chart-wrap svg{width:100%;height:auto;display:block;overflow:visible}.chart-axis-label{font-family:var(--font-mono);fill:var(--ink-muted);font-size:9px}.chart-empty{color:var(--ink-muted);text-align:center;padding:1.5rem 0;font-size:.82rem}.chart-tooltip{pointer-events:none;background:var(--ink);color:#fff;white-space:nowrap;z-index:5;border-radius:8px;padding:.45rem .65rem;font-size:.75rem;position:absolute;transform:translate(-50%,-115%);box-shadow:0 4px 14px #00000040}.chart-tooltip .tt-value{font-family:var(--font-mono);align-items:center;gap:.35rem;font-weight:600;display:flex}.tt-key{border-radius:2px;width:10px;height:2px;display:inline-block}.chart-tooltip .tt-time{color:#fff9;margin-top:.1rem}.location-card h3,.forecast-card h3{font-family:var(--font-display);margin:0 0 1rem;font-size:.98rem;font-weight:600}.location-rows{flex-direction:column;gap:.85rem;display:flex}.location-row{align-items:flex-start;gap:.65rem;font-size:.85rem;display:flex}.location-row svg{color:var(--ink-muted);flex-shrink:0;margin-top:.1rem}.location-row .label{color:var(--ink-muted);font-size:.72rem;display:block}.location-row .value{color:var(--ink);font-weight:500}.forecast-row{justify-content:space-between;gap:.4rem;display:flex}.forecast-day{flex-direction:column;flex:1;align-items:center;gap:.35rem;min-width:0;display:flex}.forecast-day .d{color:var(--ink-muted);font-size:.72rem;font-weight:500}.forecast-day .icon{font-size:1.15rem}.forecast-day .hi{font-family:var(--font-mono);font-size:.8rem;font-weight:600}.forecast-day .lo{font-family:var(--font-mono);color:var(--ink-muted);font-size:.75rem}.forecast-note{color:var(--ink-muted);text-align:center;padding:1rem 0;font-size:.72rem}.error{color:var(--critical)}