body.details-v5 { margin:0;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.5; }
.details-v5 * { box-sizing:border-box; }
.details-v5-container { width:min(calc(100% - 20px),1820px);margin-inline:auto; }
.details-v5-top { position:sticky;top:0;z-index:70;border-bottom:1px solid var(--border);background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(16px); }
.details-v5-top .top-inner { min-height:68px;display:flex;align-items:center;gap:16px; }
.details-v5-brand { min-width:max-content;display:inline-flex;align-items:center;gap:12px;color:var(--text);font-weight:950;text-decoration:none;letter-spacing:-.035em; }
.details-v5-brand img { width:46px;height:46px;border-radius:50%;background:transparent;object-fit:contain;box-shadow:0 8px 20px rgba(0,120,191,.18); }
.details-v5-brand span { display:grid;gap:1px;line-height:1.1; }
.details-v5-brand strong { display:block;white-space:nowrap; }
.details-v5-brand small { display:block;color:var(--muted);font-size:.76rem;letter-spacing:0;white-space:nowrap; }
.details-snapshot { margin-left:auto;width:fit-content;display:flex;align-items:center;gap:10px;padding:7px 10px;border:1px solid var(--border);border-radius:999px;background:var(--surface-2);font-size:.82rem; }
.details-snapshot i { width:9px;height:9px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 4px var(--ok-bg); }
.details-snapshot.stale i { background:var(--warn); }
.details-snapshot span,.details-snapshot small { display:block; }
.details-snapshot strong { font-size:.82rem; }
.details-snapshot small { color:var(--muted);font-size:.74rem; }
.details-v5-nav { display:flex;align-items:center;gap:4px; }.details-v5-nav a,.details-v5-back { min-height:42px;display:inline-flex;align-items:center;padding:8px 12px;border-radius:999px;color:var(--muted);font-weight:800;text-decoration:none; }
.details-v5-nav a:hover,.details-v5-back:hover { background:var(--surface-2);color:var(--text); }
.details-v5-page { padding:22px 0 70px; }
.details-v5-headline { display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,auto);align-items:end;gap:18px;margin-bottom:18px; }
.details-v5-headline h1 { margin:0;color:var(--text);font-size:clamp(2rem,4vw,4rem);line-height:1.05;letter-spacing:-.05em; }
.details-v5 .breadcrumb { display:flex;gap:7px;flex-wrap:wrap;margin-bottom:10px;color:var(--muted);font-size:.92rem; }.details-v5 .breadcrumb a { color:var(--muted); }
.details-v5 .meta { margin:8px 0 0;color:var(--muted);font-weight:650; }
.details-v5-headline-side { display:grid;justify-items:end;gap:10px; }
.owner-bar { min-width:min(360px,100%);display:flex;align-items:center;gap:11px;padding:10px 12px;border:1px solid var(--border);border-radius:18px;background:var(--surface);box-shadow:var(--shadow-soft); }
.owner-logo { display:block;width:auto;height:auto;max-width:min(220px,42%);max-height:64px;flex:0 1 auto;object-fit:contain;padding:4px;border:1px solid var(--border);border-radius:14px;background:#fff; }
.owner-logo[hidden] { display:none !important; }
.owner-logo-placeholder { width:46px;height:46px;flex:0 0 46px;display:block; }
.owner-logo-placeholder[hidden] { display:none !important; }
.owner-bar > div:last-child { min-width:0; }
.owner-bar span,.owner-bar strong { display:block; }
.owner-bar span { color:var(--muted);font-size:.76rem;font-weight:850;text-transform:uppercase;letter-spacing:.055em; }
.owner-bar strong { color:var(--text);font-size:.98rem; }
.v5-status { display:inline-flex;align-items:center;min-height:38px;padding:8px 12px;border-radius:999px;font-weight:900;white-space:nowrap; }.v5-status.ok { color:var(--ok);background:var(--ok-bg); }.v5-status.warn { color:var(--warn);background:var(--warn-bg); }.v5-status.danger { color:var(--danger);background:var(--danger-bg); }
.details-v5-shell { display:grid;grid-template-columns:minmax(230px,270px) minmax(0,1fr);gap:16px;align-items:start; }
.details-v5-sidebar,.v5-card { border:1px solid var(--border);border-radius:22px;background:var(--surface);box-shadow:var(--shadow-soft); }
.details-v5-sidebar { position:sticky;top:84px;padding:14px; }.details-v5-sidebar h2 { margin:0 0 14px;font-size:1.35rem; }.details-v5-sidebar label { display:block;margin:0 0 7px;font-size:.92rem;font-weight:850; }
.details-v5-sidebar input { width:100%;min-height:44px;padding:10px 12px;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--text); }
.details-sidebar-note { margin:-6px 0 12px;color:var(--muted);font-size:.9rem; }
.details-group-switch{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin:0 0 12px;padding:4px;border:1px solid var(--border);border-radius:14px;background:var(--surface-2)}
.details-group-switch button{min-width:0;min-height:38px;padding:7px 6px;border:0;border-radius:10px;background:transparent;color:var(--muted);font:inherit;font-size:.76rem;font-weight:900;cursor:pointer;transition:background-color .16s ease,color .16s ease,box-shadow .16s ease,transform .16s ease}
.details-group-switch button:hover{background:var(--surface);color:var(--text);box-shadow:inset 0 -3px 0 var(--brand);transform:translateY(-1px)}
.details-group-switch button.is-active{background:var(--brand);color:#fff;box-shadow:0 6px 14px rgba(7,42,68,.18)}
.details-group-switch button:focus-visible{outline:3px solid var(--brand);outline-offset:2px}
.details-river-list[hidden]{display:none!important}
.details-group-switch{grid-template-columns:repeat(2,minmax(0,1fr))}
.details-river-list.administrative-tree .admin-children{display:grid;gap:3px;padding:0 0 7px 10px;border-left:1px solid color-mix(in srgb,var(--brand) 24%,var(--border))}
.details-river-list.administrative-tree .admin-county>summary{min-height:43px;font-size:.86rem}
.details-river-list.administrative-tree .admin-municipality>summary{min-height:40px;font-size:.82rem;font-weight:850}
.details-river-list { display:grid;gap:6px;max-height:calc(100svh - 265px);overflow:auto;padding-right:3px; }
.details-river-list details { border-bottom:1px solid var(--border); }
.details-river-list summary { min-height:44px;display:flex;align-items:center;gap:8px;padding:8px 6px;border-radius:12px;font-weight:900;cursor:pointer;transition:background-color .16s ease,color .16s ease,box-shadow .16s ease,transform .16s ease; }
.details-river-list summary span { flex:1; }
.details-river-list summary small { min-width:27px;height:27px;display:grid;place-items:center;padding:3px 7px;border-radius:999px;background:var(--surface-3);font-weight:950; }
.details-river-list details[open] { border-radius:14px;border-bottom-color:transparent;background:color-mix(in srgb,var(--brand) 7%,var(--surface));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--brand) 18%,transparent); }
.details-river-list details[open]>summary { border-radius:12px;background:color-mix(in srgb,var(--brand) 10%,transparent);color:var(--text); }
.details-river-list summary:hover,.details-river-list summary:focus-visible{background:var(--surface-2);box-shadow:inset 3px 0 0 var(--brand);transform:translateX(2px)}
.details-river-list summary:hover span,.details-river-list summary:focus-visible span{color:var(--brand-3);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.details-river-list summary:focus-visible{outline:3px solid color-mix(in srgb,var(--brand) 45%,transparent);outline-offset:1px}
.details-river-list summary small.group-status-normal { background:var(--ok);color:#fff; }
.details-river-list summary small.group-status-warning { background:var(--warn);color:#fff; }
.details-river-list summary small.group-status-alarm { background:var(--danger);color:#fff; }
.details-river-list summary::-webkit-details-marker { display:none; }
.details-river-list summary::marker { content:""; }
.details-river-list summary::after { content:"";width:.48rem;height:.48rem;flex:0 0 .48rem;margin-left:2px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;opacity:.78;transform:rotate(45deg);transition:transform .16s ease,opacity .16s ease; }
.details-river-list details[open]>summary::after { transform:rotate(225deg);opacity:1; }
.details-river-list details>div { display:grid;gap:5px;padding:0 2px 8px; }
.details-river-list .rain { margin-top:8px;border-top:2px solid var(--brand); }
@media (prefers-reduced-motion:reduce){.details-group-switch button,.details-river-list summary{transition:none!important}.details-group-switch button:hover,.details-river-list summary:hover,.details-river-list summary:focus-visible{transform:none!important}}
.details-station-row{min-height:50px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;padding:7px 7px 7px 10px;border:1px solid transparent;border-radius:14px;color:var(--text);transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease}
.details-station-row:hover,.details-station-row:focus-within{border-color:color-mix(in srgb,var(--brand) 24%,var(--border));background:var(--surface-2);box-shadow:inset 3px 0 0 color-mix(in srgb,var(--brand) 72%,transparent)}
.details-station-row:hover>span strong,.details-station-row:focus-within>span strong{color:var(--brand-3);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.details-station-row.is-current{border-color:var(--brand);background:var(--surface-2);box-shadow:inset 3px 0 0 var(--brand)}
.details-station-row>span{min-width:0}.details-station-row>span strong{display:block;overflow-wrap:anywhere}.details-station-row>span small{display:none}
.details-station-action{min-height:32px;display:inline-flex;align-items:center;justify-content:center;padding:6px 10px;border-radius:999px;background:var(--brand);color:#fff;font-size:.72rem;font-weight:950;line-height:1;text-decoration:none;white-space:nowrap;box-shadow:0 4px 10px rgba(7,42,68,.16);transition:transform .14s ease,box-shadow .14s ease,filter .14s ease}
.details-station-action:hover{transform:translateY(-1px);filter:brightness(1.08);box-shadow:0 7px 15px rgba(7,42,68,.24),inset 0 -2px 0 rgba(255,255,255,.48);text-decoration:underline;text-underline-offset:2px}
.details-station-action:focus-visible{outline:3px solid var(--brand);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.details-station-row,.details-station-action{transition:none!important}.details-station-action:hover{transform:none!important}}
.tiny-dot { width:11px;height:11px;border-radius:50%;background:var(--ok); }.tiny-dot.warn { background:#ef8f1e; }.tiny-dot.danger { background:#ef4444; }
.details-v5-content { display:grid;gap:16px; }.details-v5-top-grid { display:grid;grid-template-columns:minmax(0,1.05fr) minmax(300px,.95fr);gap:16px;align-items:stretch; }
.v5-card { padding:18px; }.station-card { display:grid;gap:16px; }.station-head { display:flex;justify-content:space-between;gap:12px; }.station-head h2,.card-top h2,.alert-panel h2 { margin:0;font-size:1.35rem; }.station-head p,.card-top p,.alert-panel p { margin:5px 0 0;color:var(--muted); }
.metrics { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px; }.metric { position:relative;padding:14px 14px 14px 18px;border:1px solid var(--border);border-radius:16px;background:var(--surface-2);overflow:hidden; }.metric::before { content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:transparent; }.metric span,.metric small { display:block;color:var(--muted); }.metric strong { display:inline-block;margin-top:3px;font-size:1.75rem;line-height:1.05; }.metric strong.date-value { font-size:1.02rem;line-height:1.35; }.metric-water.status-ok { border-color:rgba(13,148,136,.62);background:linear-gradient(135deg,rgba(13,148,136,.24),rgba(13,148,136,.08) 48%,var(--surface-2)); }.metric-water.status-ok::before { background:#0d9488; }.metric-water.status-ok strong { color:#0f766e; }.metric-water.status-warn,.metric-threshold-warn { border-color:rgba(239,143,30,.7);background:linear-gradient(135deg,rgba(239,143,30,.28),rgba(239,143,30,.1) 48%,var(--surface-2)); }.metric-water.status-warn::before,.metric-threshold-warn::before { background:#ef8f1e; }.metric-water.status-warn strong,.metric-threshold-warn strong { color:#c66f13; }.metric-water.status-danger,.metric-threshold-danger { border-color:rgba(220,38,38,.7);background:linear-gradient(135deg,rgba(220,38,38,.26),rgba(220,38,38,.1) 48%,var(--surface-2)); }.metric-water.status-danger::before,.metric-threshold-danger::before { background:#dc2626; }.metric-water.status-danger strong,.metric-threshold-danger strong { color:#b91c1c; }
.photo-card { padding:0;overflow:hidden;min-height:360px; }.photo-wrap { position:relative;height:100%;min-height:360px;background:var(--surface-2); }.photo-wrap img { width:100%;height:100%;min-height:360px;object-fit:cover;display:block;cursor:zoom-in; }.photo-overlay { position:absolute;inset:auto 0 0;padding:42px 18px 16px;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.76)); }.photo-overlay h2 { margin:0;font-size:1.25rem; }.photo-overlay p { margin:5px 0 0; }.photo-empty { min-height:360px;display:grid;place-items:center;margin:0;color:var(--muted); }.photo-empty[hidden] { display:none !important; }.photo-zoom-button{position:absolute;right:14px;top:14px;z-index:3;border:0;border-radius:999px;padding:9px 13px;background:rgba(255,255,255,.92);color:#111827;font-weight:900;box-shadow:0 10px 24px rgba(0,0,0,.18);cursor:pointer}.photo-zoom-button:hover{background:#fff}
.camera-card { display:grid;grid-template-columns:minmax(320px,.9fr) minmax(260px,.55fr);gap:16px;align-items:center; }.camera-live { min-height:260px;border-radius:16px;overflow:hidden;background:var(--surface-2); }.camera-card img { width:100%;height:100%;min-height:260px;max-height:360px;border-radius:16px;object-fit:cover;display:block;cursor:zoom-in; }.camera-card h2 { margin:0; }.camera-card p { color:var(--muted);margin:4px 0 0; }.camera-empty { min-height:240px;border-radius:16px;background:linear-gradient(135deg,var(--surface-2),rgba(23,79,118,.08));border:1px dashed var(--border);display:grid;place-items:center;text-align:center;color:var(--muted);padding:18px; }.camera-info { display:grid;gap:8px; }.camera-select-label { display:grid;gap:5px;font-size:.84rem;color:var(--muted); }.station-camera-select { width:100%;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--text);padding:8px 10px; }.camera-status-row { display:grid;gap:6px;font-size:.82rem;color:var(--muted); }.camera-status { display:inline-flex;align-items:center;gap:7px;font-weight:800; }.camera-status-dot { width:10px;height:10px;border-radius:999px;background:#ef8f1e;box-shadow:0 0 0 4px rgba(239,143,30,.14); }.camera-status-green .camera-status-dot { background:#16a34a;box-shadow:0 0 0 4px rgba(22,163,74,.14); }.camera-status-red .camera-status-dot { background:#dc2626;box-shadow:0 0 0 4px rgba(220,38,38,.14); }.camera-status-yellow .camera-status-dot { background:#ef8f1e; }.camera-actions { display:flex;gap:8px; }.zoom-button { border:0;border-radius:999px;padding:8px 13px;background:#174f76;color:#fff;font-weight:800;cursor:pointer; }.camera-zoom-overlay { position:fixed;inset:0;display:none;place-items:center;background:rgba(0,0,0,.78);z-index:80;padding:24px; }.camera-zoom-overlay.open { display:grid; }.camera-zoom-modal { position:relative;max-width:min(1100px,96vw);max-height:92vh; }.camera-zoom-image { max-width:100%;max-height:88vh;border-radius:18px;box-shadow:0 22px 70px rgba(0,0,0,.45);background:#111; }.camera-zoom-close { position:absolute;right:12px;top:12px;border:0;border-radius:999px;padding:9px 13px;background:#fff;color:#111;font-weight:900;cursor:pointer; }
.section-card,.chart-card,.details-map-card { display:grid;gap:16px; }.card-top { display:flex;align-items:flex-start;justify-content:space-between;gap:16px; }.section-grid { display:grid;grid-template-columns:minmax(0,1fr) minmax(440px,440px);gap:14px;align-items:start; }
.cross { min-height:430px;display:grid;align-content:start;gap:10px;padding:12px;border:1px solid var(--border);border-radius:18px;background:#f8fbff;overflow:visible; }.cross svg { width:100%;height:390px;overflow:visible;color:#071d31; }.cross.js-rain-section svg { width:min(100%,560px);margin:auto; }
.details-v5 .section-preview-button { justify-self:start;margin-top:0; }.table-card { width:100%;min-width:0;justify-self:end;display:grid;align-content:start;gap:12px;padding:0;border:0;border-radius:0;background:transparent; }.table-card h3 { margin:0; }.table-card .meta { margin:5px 0 0;color:var(--muted);font-size:.88rem;font-weight:650; }.details-v5 .table-wrap { overflow:hidden;border:1px solid var(--border);border-radius:18px;background:var(--surface); }.details-v5 .compact-table table { width:100%;min-width:0;table-layout:fixed;border-collapse:collapse;font-size:clamp(.7rem,.78vw,.82rem); }.details-v5 .compact-table th,.details-v5 .compact-table td { padding:9px 8px;border-bottom:1px solid var(--border);text-align:left;white-space:normal;line-height:1.18;overflow-wrap:anywhere; }.details-v5 .compact-table th { background:var(--surface-2);color:var(--muted);font-size:clamp(.6rem,.68vw,.74rem);text-transform:uppercase;letter-spacing:.045em; }.details-v5 .compact-table th:nth-child(1),.details-v5 .compact-table td:nth-child(1){width:34%;white-space:nowrap;overflow-wrap:normal;}.details-v5 .compact-table th:nth-child(2),.details-v5 .compact-table td:nth-child(2){width:20%;}.details-v5 .compact-table th:nth-child(3),.details-v5 .compact-table td:nth-child(3){width:18%;}.details-v5 .compact-table th:nth-child(4),.details-v5 .compact-table td:nth-child(4){width:28%;}.details-v5 .compact-table tr:last-child td { border-bottom:0; }.details-v5 .compact-table td strong { color:var(--text);font-weight:900; }.details-v5 .delta-cell { font-weight:850;color:var(--muted); }.details-v5 .delta-cell.delta-up { color:#dc2626; }.details-v5 .delta-cell.delta-down { color:var(--ok); }
.details-map { position:relative;width:100%;height:min(68svh,680px);min-height:460px;border:1px solid var(--border);border-radius:18px;overflow:hidden;background:var(--surface-2); }.details-map-status { margin:0;color:var(--muted);font-size:.9rem; }.map-popup { display:grid;gap:5px;min-width:170px; }.map-popup p { margin:0;color:#4b5563; }.map-popup a { display:inline-flex;margin-top:4px;color:#174f76;font-weight:900;text-decoration:none; }.map-ctrl-hint{position:absolute;left:50%;top:50%;z-index:650;transform:translate(-50%,-50%);max-width:min(360px,calc(100% - 32px));padding:10px 14px;border:1px solid var(--border);border-radius:999px;background:color-mix(in srgb,var(--surface) 92%,transparent);box-shadow:0 16px 36px rgba(7,42,68,.2);color:var(--text);font-size:.86rem;font-weight:900;text-align:center;pointer-events:none;opacity:0;transition:opacity .16s ease}.map-ctrl-hint.show{opacity:1}
.chart-tabs { display:inline-flex;padding:4px;border:1px solid var(--border);border-radius:999px;background:var(--surface-2); }.chart-tab { min-height:38px;padding:7px 13px;border:0;border-radius:999px;background:transparent;color:var(--muted);font-weight:850;cursor:pointer; }.chart-tab.is-active { background:var(--brand);color:#fff; }
.chart-tools { display:flex;gap:8px;flex-wrap:wrap; }.chart-tools button { min-height:40px;padding:7px 12px;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--text);font-weight:800;cursor:pointer; }.chart-tools button:hover { background:var(--surface-2); }
.chart-card.is-expanded { position:fixed;inset:12px;z-index:900;overflow:auto;overscroll-behavior:contain;background:var(--surface);box-shadow:0 24px 80px rgba(0,0,0,.38); }
.chart-card.is-expanded .chart-wrap { height:calc(100dvh - 210px);min-height:300px; }
.chart-card.is-expanded [data-chart-action="expand"]{display:none;}
.chart-expanded-close{position:fixed;top:max(22px,env(safe-area-inset-top));right:max(22px,env(safe-area-inset-right));z-index:905;min-height:44px;padding:9px 15px;border:2px solid var(--brand);border-radius:999px;background:var(--surface);color:var(--text);box-shadow:0 10px 28px rgba(0,0,0,.28);font:inherit;font-weight:950;cursor:pointer;}
.chart-expanded-close[hidden]{display:none!important;}
.chart-expanded-close:hover{background:var(--brand);color:#fff;}
.chart-expanded-close:focus-visible{outline:3px solid var(--brand);outline-offset:3px;}
html.chart-expanded,html.chart-expanded body{overflow:hidden;}
@media(max-width:720px){
    .chart-card.is-expanded{inset:0;padding:calc(max(66px,env(safe-area-inset-top) + 54px)) 10px calc(10px + env(safe-area-inset-bottom));border:0;border-radius:0;}
    .chart-card.is-expanded .card-top{padding-right:0;}
    .chart-card.is-expanded .chart-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));}
    .chart-card.is-expanded .chart-tools button{width:100%;}
    .chart-card.is-expanded .chart-wrap{height:calc(100dvh - 300px);min-height:280px;padding:4px;}
    .chart-expanded-close{top:max(10px,env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));}
}
.chart-wrap { position:relative;width:100%;height:390px;padding:8px;border:1px solid var(--border);border-radius:18px;background:var(--surface-2); }.chart-wrap canvas { width:100%;height:100%; }
.history-controls { display:flex;align-items:end;gap:12px;flex-wrap:wrap;margin-bottom:12px; }.history-controls label { display:grid;gap:6px;font-weight:800; }.history-controls select { min-height:44px;padding:8px 12px;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--text); }.history-message { color:var(--muted); }
.details-v5 .btn { min-height:44px;padding:10px 16px;border:0;border-radius:999px;background:var(--brand);color:#fff;font-weight:900;cursor:pointer; }.details-v5 .btn:disabled { opacity:.55;cursor:not-allowed; }
.alert-panel { display:grid;grid-template-columns:minmax(0,.9fr) minmax(320px,.8fr);gap:16px;align-items:start; }.section-preview-modal[hidden] { display:none; }
.alert-copy{display:grid;align-content:start;gap:10px}.alert-copy .meta{margin:0;color:var(--muted);font-weight:650}.alert-copy .alert-threshold-note{margin:4px 0 0;padding:12px 14px;border-left:4px solid var(--brand);border-radius:0 14px 14px 0;background:var(--surface-2);color:var(--text);font-weight:800}
.public-alert-form{display:grid;gap:12px;min-width:0;max-width:none}.public-alert-form label{display:grid;gap:7px;margin:0;color:var(--text);font-size:.92rem;font-weight:850}.public-alert-form input[type=email],.public-alert-form input[type=text]{width:100%;min-height:44px;padding:10px 12px;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--text)}.public-alert-form .alert-station-input{background:var(--surface-2);color:var(--text);font-weight:800;cursor:default}.public-alert-form .alert-check{display:flex!important;align-items:flex-start;gap:10px;color:var(--muted);line-height:1.35;font-weight:650}.alert-check input{width:20px;height:20px;min-height:20px;flex:0 0 20px;margin:2px 0 0;accent-color:var(--brand)}.alert-check span{display:block}.alert-check a{font-weight:900;color:var(--brand-3);text-decoration:underline;text-underline-offset:.16em}.public-alert-form .btn{width:100%}.alert-panel .alert-success,.alert-panel .alert-error{margin:0;padding:10px 12px;border-radius:14px;font-weight:850}.alert-panel .alert-success{background:var(--ok-bg);color:var(--ok);border:1px solid color-mix(in srgb,var(--ok) 45%,var(--border))}.alert-panel .alert-error{background:var(--danger-bg);color:var(--danger);border:1px solid color-mix(in srgb,var(--danger) 45%,var(--border))}
@media (max-width:1120px) { .alert-panel { grid-template-columns:1fr; } }
html.contrast-yellow .cross,html.contrast-inverse .cross { background:#000!important; } html.contrast-blackyellow .cross { background:#ffe500!important; } html.contrast-mono .cross { background:#fff!important; }
html.dark-theme .cross { background:#071323; }
html.dark-theme .cross svg { filter:brightness(.92) saturate(.95); }
html.contrast-mono .cross svg { filter:grayscale(1) contrast(1.35); }
html.contrast-yellow .cross svg,html.contrast-inverse .cross svg { filter:grayscale(1) contrast(1.55) brightness(1.28); }
html.contrast-blackyellow .cross svg { filter:grayscale(1) contrast(1.65); }
@media (max-width:1000px) { .details-v5-shell { grid-template-columns:1fr; }.details-v5-sidebar { position:static; }.details-v5-top-grid,.section-grid,.camera-card { grid-template-columns:1fr; } }
@media (max-width:900px) { .details-v5-top .top-inner { flex-wrap:wrap;padding:8px 0; }.details-snapshot { margin-left:0; }.details-v5-nav { order:3;width:100%;justify-content:flex-start;overflow:auto; }.details-v5-back { margin-left:auto; } }
@media (max-width:720px) { .details-v5-nav { display:none; }.details-v5-brand { min-width:0; }.details-v5-headline { grid-template-columns:1fr;align-items:start; }.details-v5-headline-side { justify-items:start;width:100%; }.owner-bar { width:100%; }.owner-logo { max-width:min(150px,40%);max-height:54px; }.details-v5-shell { grid-template-columns:1fr; }.metrics { grid-template-columns:1fr 1fr; }.card-top { flex-direction:column; }.chart-wrap { height:330px; }.photo-wrap img,.photo-empty { min-height:300px; }.cross { min-height:330px; }.cross svg { height:300px; } }

.details-v5-top .top-inner{position:relative;justify-content:center;}
.details-v5-brand{position:absolute;left:0;}
.details-v5-back{position:absolute;right:0;}
.details-snapshot{margin-left:0;}
@media(max-width:900px){.details-v5-top .top-inner{justify-content:space-between;}.details-v5-brand,.details-v5-back{position:static;}}

.details-v5 .metric strong{max-width:100%;font-size:clamp(1.35rem,1.7vw,1.75rem);white-space:normal;overflow-wrap:anywhere;}
.details-v5 .compact-table table{table-layout:fixed;font-size:clamp(.66rem,.74vw,.8rem);}

.details-v5 .camera-zoom-modal{width:96vw;height:92vh;max-width:96vw;max-height:92vh;display:grid;place-items:center;}
.details-v5 .camera-zoom-image{width:100%;height:100%;max-width:96vw;max-height:88vh;object-fit:contain;}
.details-v5 .photo-zoom-modal{display:block;overflow:hidden;background:#111;border-radius:18px;}
.photo-zoom-viewport{width:100%;height:100%;display:grid;place-items:center;overflow:hidden;touch-action:none;user-select:none;}
.details-v5 .photo-zoom-image{will-change:transform;transform:translate(0,0) scale(1);transform-origin:center center;cursor:zoom-in;border-radius:0;box-shadow:none;-webkit-user-drag:none;user-select:none;}
.details-v5 .photo-zoom-image.is-zoomed{cursor:grab;}
.details-v5 .photo-zoom-image.is-dragging{cursor:grabbing;}
.photo-zoom-controls{position:absolute;left:50%;bottom:14px;z-index:3;display:flex;align-items:center;gap:6px;transform:translateX(-50%);padding:6px;border-radius:999px;background:rgba(17,24,39,.88);box-shadow:0 10px 30px rgba(0,0,0,.35);}
.photo-zoom-controls button{min-width:44px;min-height:44px;border:1px solid rgba(255,255,255,.3);border-radius:999px;padding:8px 12px;background:#fff;color:#111827;font-size:1rem;font-weight:900;cursor:pointer;}
.photo-zoom-controls button:hover{background:#e5eef7;}
.photo-zoom-controls button:focus-visible{outline:3px solid #facc15;outline-offset:2px;}
.photo-zoom-controls #photoZoomReset{min-width:68px;}
.details-v5 .compact-table th:nth-child(4),
.details-v5 .compact-table td:nth-child(4){text-align:center;}
.details-v5 .compact-table.rain-measurements-table th:nth-child(1),
.details-v5 .compact-table.rain-measurements-table td:nth-child(1){width:44%;}
.details-v5 .compact-table.rain-measurements-table th:nth-child(2),
.details-v5 .compact-table.rain-measurements-table td:nth-child(2){width:28%;}
.details-v5 .compact-table.rain-measurements-table th:nth-child(3),
.details-v5 .compact-table.rain-measurements-table td:nth-child(3){width:28%;text-align:center;}
.details-v5 .compact-table table.rain-measurements-table th:nth-child(1),
.details-v5 .compact-table table.rain-measurements-table td:nth-child(1){width:44%;}
.details-v5 .compact-table table.rain-measurements-table th:nth-child(2),
.details-v5 .compact-table table.rain-measurements-table td:nth-child(2){width:28%;}
.details-v5 .compact-table table.rain-measurements-table th:nth-child(3),
.details-v5 .compact-table table.rain-measurements-table td:nth-child(3){width:28%;text-align:center;}
.details-v5-back.user-login-icon{width:42px;height:42px;display:inline-grid;place-items:center;padding:0;font-size:1.25rem;line-height:1;}
.details-v5-top .details-header-actions{position:absolute;right:0;margin:0;}
.details-v5-top .details-header-actions .details-v5-back{position:static;margin:0;}
@media(max-width:900px){.details-v5-top .details-header-actions{position:static;margin-left:auto;}}

/* Pełnoszerokościowy nagłówek i rozdzielone sekcje mobilne. */
.details-v5-top .top-inner{width:100%;max-width:none;min-height:74px;margin:0;padding-inline:clamp(12px,1.5vw,28px);display:grid;grid-template-columns:minmax(190px,1fr) auto auto auto;align-items:center;justify-content:stretch;gap:clamp(10px,1.3vw,22px);}
.details-v5-top .details-v5-brand,.details-v5-top .details-header-actions{position:static;margin:0;}
.details-v5-top .details-v5-brand{justify-self:start;}.details-v5-top .details-snapshot{justify-self:center;margin:0;}.details-v5-top .details-v5-nav{justify-self:center;}.details-v5-top .details-header-actions{justify-self:end;display:flex;align-items:center;gap:8px;}
@media(max-width:900px){
    .details-v5-top .top-inner{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"brand actions" "snapshot navigation";padding-block:8px;}
    .details-v5-top .details-v5-brand{grid-area:brand;}.details-v5-top .details-header-actions{grid-area:actions;}.details-v5-top .details-snapshot{grid-area:snapshot;justify-self:start;}
    .details-v5-top .details-v5-nav{grid-area:navigation;width:auto;justify-self:end;overflow-x:auto;}
}
@media(max-width:720px){
    .details-v5-top .top-inner{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"brand actions" "snapshot snapshot";gap:8px 10px;padding:8px 10px 10px;}
    .details-v5-top .details-v5-brand{min-width:0;gap:8px;}.details-v5-top .details-v5-brand img{width:40px;height:40px;flex:0 0 40px;}.details-v5-top .details-v5-brand span{min-width:0;}
    .details-v5-top .details-v5-brand strong,.details-v5-top .details-v5-brand small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
    .details-v5-top .details-header-actions{gap:5px;}.details-v5-top .header-icon-button,.details-v5-top .details-v5-back.user-login-icon{width:40px;height:40px;min-width:40px;}
    .details-v5-top .details-snapshot{width:100%;justify-content:center;border-radius:14px;}.details-v5-top .details-v5-nav{display:none;}
}
.details-v5 .compact-table th,.details-v5 .compact-table td{padding:8px 6px;overflow:visible;line-height:1.18;}
.details-v5 .compact-table th{font-size:clamp(.56rem,.62vw,.7rem);letter-spacing:.025em;}
.details-v5 .compact-table th:nth-child(1),.details-v5 .compact-table td:nth-child(1){width:36%;white-space:normal;overflow-wrap:normal;}
.details-v5 .compact-table th:nth-child(2),.details-v5 .compact-table td:nth-child(2){width:18%;}
.details-v5 .compact-table th:nth-child(3),.details-v5 .compact-table td:nth-child(3){width:17%;}
.details-v5 .compact-table th:nth-child(4),.details-v5 .compact-table td:nth-child(4){width:29%;}
html[class*="contrast-"] .metric-water.status-ok,
html[class*="contrast-"] .metric-water.status-warn,
html[class*="contrast-"] .metric-water.status-danger,
html[class*="contrast-"] .metric-threshold-warn,
html[class*="contrast-"] .metric-threshold-danger{border-color:var(--border)!important;background:var(--surface-2)!important;}
html[class*="contrast-"] .metric-water.status-ok::before,
html[class*="contrast-"] .metric-water.status-warn::before,
html[class*="contrast-"] .metric-water.status-danger::before,
html[class*="contrast-"] .metric-threshold-warn::before,
html[class*="contrast-"] .metric-threshold-danger::before{background:var(--text)!important;}
html[class*="contrast-"] .metric-water.status-ok strong,
html[class*="contrast-"] .metric-water.status-warn strong,
html[class*="contrast-"] .metric-water.status-danger strong,
html[class*="contrast-"] .metric-threshold-warn strong,
html[class*="contrast-"] .metric-threshold-danger strong,
html[class*="contrast-"] .delta-cell.delta-up,
html[class*="contrast-"] .delta-cell.delta-down{color:var(--text)!important;}
html[class*="contrast-"] .photo-wrap img,
html[class*="contrast-"] .camera-card img,
html[class*="contrast-"] .camera-zoom-image{filter:grayscale(1) contrast(1.22);}
html.contrast-yellow .photo-wrap img,html.contrast-yellow .camera-card img,html.contrast-yellow .camera-zoom-image,
html.contrast-inverse .photo-wrap img,html.contrast-inverse .camera-card img,html.contrast-inverse .camera-zoom-image{filter:grayscale(1) contrast(1.32);}

html[class*="contrast-"] .details-v5 .btn,
html[class*="contrast-"] .details-v5 .chart-tools button,
html[class*="contrast-"] .details-v5 .chart-tab,
html[class*="contrast-"] .details-v5 .chart-tab.is-active,
html[class*="contrast-"] .details-v5 .zoom-button,
html[class*="contrast-"] .details-v5 .photo-zoom-button,
html[class*="contrast-"] .details-v5 .camera-zoom-close,
html[class*="contrast-"] .details-v5 .section-preview-button,
html[class*="contrast-"] .section-preview-close{
    background:var(--surface)!important;
    color:var(--text)!important;
    border:2px solid var(--border)!important;
    box-shadow:none!important;
    text-shadow:none!important;
}
html[class*="contrast-"] .details-v5 .btn:hover,
html[class*="contrast-"] .details-v5 .chart-tools button:hover,
html[class*="contrast-"] .details-v5 .chart-tab:hover,
html[class*="contrast-"] .details-v5 .zoom-button:hover,
html[class*="contrast-"] .details-v5 .photo-zoom-button:hover,
html[class*="contrast-"] .details-v5 .camera-zoom-close:hover,
html[class*="contrast-"] .details-v5 .section-preview-button:hover,
html[class*="contrast-"] .section-preview-close:hover{
    background:var(--surface-2)!important;
    color:var(--text)!important;
}
html[class*="contrast-"] .details-v5 .chart-tab.is-active,
html[class*="contrast-"] .details-v5 .btn:focus-visible,
html[class*="contrast-"] .details-v5 .chart-tools button:focus-visible,
html[class*="contrast-"] .details-v5 .chart-tab:focus-visible,
html[class*="contrast-"] .details-v5 .zoom-button:focus-visible,
html[class*="contrast-"] .details-v5 .photo-zoom-button:focus-visible,
html[class*="contrast-"] .details-v5 .camera-zoom-close:focus-visible,
html[class*="contrast-"] .details-v5 .section-preview-button:focus-visible,
html[class*="contrast-"] .section-preview-close:focus-visible{
    outline:3px solid var(--text)!important;
    outline-offset:3px;
}
html.dark-theme:not([class*="contrast-"]) .cross{
    background:#071323;
    border-color:#1e3a5f;
}
html.dark-theme:not([class*="contrast-"]) .cross svg{
    filter:invert(1) hue-rotate(180deg) saturate(.86) contrast(.98) brightness(.82);
}
html.dark-theme:not([class*="contrast-"]) .section-preview-body svg{
    filter:invert(1) hue-rotate(180deg) saturate(.86) contrast(.98) brightness(.82);
}
html[class*="contrast-"] .section-preview-body svg{
    filter:grayscale(1) contrast(1.45);
}