.pond-offline-message { margin-top:16px; padding-top:12px; border-top:1px solid #f0dfb8; color:#a9792f; font:500 10px 'DM Mono',monospace; }.pond-head
 .status.pending { color:#a9792f; background:#fff4d8; }
 .chart-empty { margin-top:17px; padding-top:22px; border-top:1px solid var(--line); color:#9aaba7; font:10px 'DM Mono'; text-align:center; height:70px; }
 .raw-status { display:flex; align-items:center; gap:10px; margin:10px 0 0; padding:9px 11px; border:1px solid #e5ece9; border-radius:5px; background:#f8fbf9; color:#859793; font:9px 'DM Mono'; }
 .raw-status code { color:var(--ink); font:500 10px 'DM Mono'; }
 .raw-status strong { color:var(--teal); font:500 14px 'DM Mono'; }
 .raw-status small { margin-left:auto; color:#a1afac; font:9px 'DM Mono'; }
 .diagnostics-panel { margin-top:29px; }.diagnostic-summary { display:flex; gap:40px; margin:18px 0; }.diagnostic-summary b,.diagnostic-summary small { display:block; }.diagnostic-summary b { font-size:11px; }.diagnostic-summary small { color:var(--muted); font:9px 'DM Mono'; margin-top:4px; }.diagnostic-table { overflow-x:auto; border:1px solid var(--line); border-radius:5px; }.diagnostic-table > div { display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr .7fr 1fr; gap:12px; min-width:620px; padding:11px 13px; border-bottom:1px solid #edf2ef; font:10px 'DM Mono'; }.diagnostic-table > div:last-child { border-bottom:0; }.diagnostic-table > div:first-child { color:#829793; background:#f8fbf9; font-size:9px; }.diagnostic-table code { color:var(--ink); }.diagnostic-table strong { color:var(--teal); }
:root { --ink:#143c3a; --muted:#718583; --line:#dce8e4; --paper:#f6faf7; --white:#fff; --teal:#167c70; --orange:#ef8b45; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:'Manrope',sans-serif; }
button, select { font:inherit; }
.app-shell { display:flex; min-height:100vh; }
.sidebar { width:248px; background:#123b3a; color:#d3e4df; display:flex; flex-direction:column; padding:30px 18px 22px; flex-shrink:0; }
.brand { display:flex; align-items:center; gap:11px; padding:0 12px 48px; color:#fff; }.brand-mark { display:grid; place-items:center; width:34px; height:34px; border:1px solid #73b8a3; color:#a4e3cd; border-radius:11px 11px 11px 3px; font-weight:800; letter-spacing:-2px; }.brand strong { display:block; font-size:17px; line-height:1; }.brand small { display:block; color:#84b2a7; font:500 9px 'DM Mono',monospace; letter-spacing:1.6px; margin-top:6px; }
nav { display:grid; gap:7px; }.nav-item { display:flex; align-items:center; gap:13px; height:43px; padding:0 13px; color:#94b6ae; text-decoration:none; font-size:12px; font-weight:600; border-radius:7px; }.nav-item span { width:17px; text-align:center; font-size:18px; }.nav-item.active,.nav-item:hover { color:#fff; background:#1b5550; }.nav-badge { margin-left:auto; background:#dc7159; color:#fff; border-radius:20px; min-width:20px; padding:2px 6px; text-align:center; font-size:10px; }.farm-card { margin-top:auto; display:flex; gap:9px; align-items:center; border-top:1px solid #2a5a56; padding:20px 8px 0; font-size:10px; }.farm-card strong,.farm-card small { display:block; }.farm-card strong { color:#e6f2ee; font-size:11px; }.farm-card small { color:#7da69e; margin-top:4px; }.farm-avatar { display:grid; place-items:center; width:29px; height:29px; border-radius:50%; color:#174640; background:#9bd2c0; font-size:10px; font-weight:800; }.more { margin-left:auto; color:#85aaa3; letter-spacing:2px; }
.main-content { width:min(100%, 1420px); padding:37px 5.2% 30px; margin:0 auto; }.top-header { display:flex; justify-content:space-between; gap:28px; align-items:flex-start; }.eyebrow { color:#85a09b; font:500 10px 'DM Mono',monospace; letter-spacing:1.35px; margin:0 0 10px; }.top-header h1 { font-size:27px; letter-spacing:-1px; margin:0; }.subtitle { color:var(--muted); font-size:12px; margin:8px 0 0; }.header-actions { display:flex; align-items:center; gap:18px; }.header-actions select { border:1px solid var(--line); border-radius:6px; color:var(--ink); background:#fff; padding:10px 27px 10px 12px; font-size:11px; }.sync-pill { display:flex; gap:9px; align-items:center; white-space:nowrap; }.sync-pill i,.live-dot { display:block; width:8px; height:8px; border-radius:50%; background:#28a17d; box-shadow:0 0 0 4px #e1f3ec; }.sync-pill b,.sync-pill small { display:block; font-size:10px; }.sync-pill small { color:#8b9e9b; margin-top:3px; }.icon-button { position:relative; border:0; background:transparent; color:var(--ink); font-size:21px; cursor:pointer; }.icon-button em { position:absolute; top:-5px; right:-7px; width:14px; height:14px; border-radius:50%; background:var(--orange); color:#fff; font:700 9px Manrope; font-style:normal; display:grid; place-items:center; }.user-avatar { display:grid; place-items:center; border-radius:50%; width:31px; height:31px; background:#e5c5a7; color:#804e30; font-size:10px; font-weight:800; }.menu-button { display:none; }
.hero-strip { margin:34px 0 33px; border:1px solid #cde4da; background:#eaf7f0; border-radius:7px; padding:15px 18px; display:flex; justify-content:space-between; align-items:center; }.hero-strip strong { font-size:12px; }.hero-strip p { display:inline; margin:0 0 0 13px; color:#64827b; font-size:11px; }.demo-label { margin-left:13px; color:#167c70; background:#d1eee3; border-radius:3px; padding:4px 6px; font:500 9px 'DM Mono'; letter-spacing:.4px; }.outline-button,.text-button { border:0; background:none; color:var(--teal); font-size:11px; font-weight:700; cursor:pointer; }.outline-button { border:1px solid #a8d4c5; border-radius:5px; padding:8px 12px; }.section-heading,.panel-heading { display:flex; justify-content:space-between; align-items:flex-end; }.section-heading h2,.panel-heading h2,.quick-actions h2 { font-size:17px; letter-spacing:-.4px; margin:0; }.pond-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; margin-top:16px; }.pond-card,.panel,.quick-actions { background:var(--white); border:1px solid #e1ebe7; border-radius:8px; }.pond-card { padding:20px; }.pond-head { display:flex; justify-content:space-between; border-bottom:1px solid var(--line); padding-bottom:17px; }.pond-name { display:flex; gap:11px; align-items:center; }.pond-icon { display:grid; place-items:center; width:39px; height:39px; border-radius:8px; background:#dff2e8; color:#168170; font-size:21px; }.pond-name h3 { font-size:15px; margin:0 0 4px; }.pond-name small,.device-line { color:#839592; font-size:10px; }.status { color:#239373; background:#e9f7f0; border-radius:20px; height:22px; padding:5px 9px; font:500 9px 'DM Mono'; }.status::before { content:''; display:inline-block; width:5px; height:5px; border-radius:50%; background:#2aab80; margin:0 5px 1px 0; }.device-line { display:flex; justify-content:space-between; padding:14px 0 4px; font-family:'DM Mono',monospace; font-size:9px; }.metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:10px; }.metric { border:1px solid #edf2ef; padding:12px 10px; min-width:0; }.metric-label { color:#849894; display:block; font-size:10px; margin-bottom:7px; }.metric-value { font:500 18px 'DM Mono',monospace; letter-spacing:-1px; }.metric-unit { color:#91a19e; font-size:9px; margin-left:3px; }.metric-status { display:block; color:#269477; font:500 8px 'DM Mono'; margin-top:7px; }.metric-status.warn { color:#d78738; }.chart-wrap { margin-top:17px; padding-top:15px; border-top:1px solid var(--line); }.chart-top { display:flex; justify-content:space-between; align-items:center; }.chart-tabs { display:flex; gap:14px; }.chart-tabs button { border:0; background:none; color:#94a5a1; padding:0 0 5px; font:500 9px 'DM Mono'; cursor:pointer; }.chart-tabs button.active { color:var(--teal); border-bottom:2px solid var(--teal); }.range { color:#9ca9a6; font-size:9px; }.chart { display:block; width:100%; height:70px; margin-top:8px; }
.lower-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:22px; margin-top:29px; }.panel { padding:20px; }.panel-heading { align-items:flex-start; margin-bottom:17px; }.ai-spark { display:grid; place-items:center; width:27px; height:27px; border-radius:7px; background:#eff5d8; color:#8b9c3f; }.alert-row { display:flex; align-items:center; gap:12px; padding:12px 0; border-top:1px solid #edf2ef; }.alert-mark { width:27px; height:27px; display:grid; place-items:center; border-radius:6px; background:#fff0e8; color:#e17a42; font-weight:800; }.alert-row p,.insight p { margin:0; font-size:10px; line-height:1.6; color:#718581; }.alert-row strong,.insight strong { color:var(--ink); font-size:11px; }.alert-time { margin-left:auto; color:#a1afac; font:9px 'DM Mono'; white-space:nowrap; }.insight { display:flex; gap:11px; padding:13px 0; border-top:1px solid #edf2ef; }.insight-icon { flex:0 0 25px; width:25px; height:25px; display:grid; place-items:center; border-radius:50%; font-weight:800; }.insight-icon.green { background:#e1f3e9; color:#299774; }.insight-icon.amber { background:#fff1d8; color:#d98a34; }.disclaimer { color:#9aaba7; font-size:9px; margin:14px 0 0; }.quick-actions { display:flex; justify-content:space-between; align-items:center; padding:18px 20px; margin-top:29px; }.quick-actions .eyebrow { margin-bottom:7px; }.action-list { display:flex; gap:9px; }.action-list button { border:1px solid var(--line); background:#fff; color:#345c56; border-radius:5px; padding:10px 12px; font-size:10px; font-weight:700; cursor:pointer; }.action-list button:hover { border-color:#82c6b4; background:#f1faf6; }.action-list span { color:#228c7a; margin-right:7px; font-size:14px; vertical-align:-1px; }footer { color:#9aaba7; font:9px 'DM Mono'; text-align:center; margin-top:30px; }footer span { margin:0 8px; color:#c0cdca; }
+@media (max-width:1050px) { .sidebar { width:210px; }.main-content { padding-left:30px; padding-right:30px; }.header-actions { gap:10px; }.sync-pill { display:none; }.action-list { flex-wrap:wrap; justify-content:flex-end; } }
+@media (max-width:760px) { .sidebar { position:fixed; z-index:5; inset:0 auto 0 0; transform:translateX(-100%); transition:transform .2s ease; width:245px; }.sidebar.open { transform:translateX(0); }.main-content { padding:22px 16px 24px; }.menu-button { display:block; border:0; background:none; color:var(--ink); font-size:22px; margin-bottom:15px; }.top-header { display:block; }.top-header h1 { font-size:24px; }.header-actions { margin-top:20px; justify-content:space-between; }.header-actions select { flex:1; }.hero-strip { align-items:flex-start; gap:12px; margin:25px 0; }.hero-strip p { display:block; margin:7px 0 0; line-height:1.5; }.demo-label { margin-left:7px; }.pond-grid,.lower-grid { grid-template-columns:1fr; }.metrics { grid-template-columns:repeat(2,1fr); }.metric:nth-child(5) { border-radius:0 0 0 5px; }.metric:nth-child(6) { border-radius:0 0 5px 0; }.quick-actions { display:block; }.action-list { justify-content:flex-start; margin-top:17px; }.section-heading { align-items:center; } }
