
@font-face { font-family:"KievitPro"; src:url("/frontend/fonts/KievitPro-Light.otf") format("opentype"); font-weight:300; font-style:normal; font-display:swap; }
@font-face { font-family:"KievitPro"; src:url("/frontend/fonts/KievitPro-Book.ttf") format("truetype"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"KievitPro"; src:url("/frontend/fonts/KievitPro-Regular.otf") format("opentype"); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:"KievitPro"; src:url("/frontend/fonts/KievitPro-Bold.otf") format("opentype"); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:"KievitPro"; src:url("/frontend/fonts/KievitPro-Black.otf") format("opentype"); font-weight:900; font-style:normal; font-display:swap; }


:root {
  --bg: #f2f5ef;
  --panel: #ffffff;
  --ink: #16301d;
  --muted: #6a786d;
  --green: #287a42;
  --green-dark: #19552d;
  --line: #d9e2d8;
  --shadow: 0 14px 40px rgba(25, 55, 32, .10);
  font-family: "KievitPro", ui-sans-serif, system-ui, sans-serif;
}
* { box-sizing: border-box; }
/* v0.20.10 — Vivid Chlorophyll: the canvas gets the personality; panels stay readable. */
body {
  margin: 0;
  min-height: 100vh;
  color: var(--ink);
  background-color: var(--bg);
  background-image:
    url("/frontend/assets/grain.png"),
    radial-gradient(ellipse at 8% 4%, rgba(115, 235, 65, .20) 0%, rgba(115, 235, 65, 0) 34%),
    radial-gradient(ellipse at 92% 24%, rgba(0, 190, 112, .13) 0%, rgba(0, 190, 112, 0) 36%),
    linear-gradient(135deg, #f5faed 0%, #eaf6e5 48%, #f5faef 100%);
  background-size: 220px 220px, auto, auto, auto;
  background-repeat: repeat, no-repeat, no-repeat, no-repeat;
  background-attachment: fixed;
  background-blend-mode: soft-light, normal, normal, normal;
}
button, input, select { font: inherit; }
.topbar {
  min-height: 78px; padding: 14px 24px; display: grid;
  grid-template-columns: 1fr auto 1fr; gap: 24px; align-items: center;
  background: rgba(255,255,255,.92); border-bottom: 1px solid var(--line);
  position: sticky; top: 0; z-index: 20; backdrop-filter: blur(12px);
}
.brand { display:flex; align-items:center; min-width:0; }
.brand-logo {
  display:block;
  width:192px;
  height:68px;
  max-width:192px;
  object-fit:contain;
  object-position:left center;
}
.brand-logo-dark { display:none; }

.mode-switch { display:flex; padding:4px; border:1px solid var(--line); border-radius:12px; background:#f7faf6; }
.mode-btn {
  border:0; background:transparent; padding:9px 18px; border-radius:9px; color:var(--muted); cursor:pointer;
}
.mode-btn.active { background:var(--green); color:white; box-shadow:0 3px 10px rgba(40,122,66,.2); }
.search { position:relative; justify-self:end; width:min(330px, 100%); }
.search input {
  width:100%; border:1px solid var(--line); border-radius:12px; padding:11px 14px 11px 34px;
  outline:none; background:white;
}
.search input:focus { border-color: var(--green); box-shadow:0 0 0 3px rgba(40,122,66,.1); }
.search > span { position:absolute; left:12px; top:9px; color:var(--muted); font-size:20px; }
.search-results {
  position:absolute; left:0; right:0; top:47px; background:white; border:1px solid var(--line);
  border-radius:12px; box-shadow:var(--shadow); overflow:hidden; z-index:30;
}
.search-results button { width:100%; text-align:left; border:0; background:white; padding:10px 13px; cursor:pointer; }
.search-results button:hover { background:#f1f7f1; }
.hidden { display:none; }
.app-shell { width:min(1480px, calc(100% - 32px)); margin:20px auto; display:grid; grid-template-columns:minmax(0, 1fr) 330px; gap:18px; align-items:stretch; }
.map-card, .detail-panel { background:var(--panel); border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow); }
.map-toolbar { display:flex; justify-content:space-between; align-items:center; padding:20px 22px 14px; gap:16px; }
.eyebrow { font-size:10px; font-weight:800; letter-spacing:.15em; color:var(--green); }
h1 { margin:3px 0 0; font-size:25px; }
#parameterSelect { border:1px solid var(--line); border-radius:10px; padding:9px 11px; background:white; color:var(--ink); }
.detail-panel { min-height:540px; padding:22px; }
.panel-empty { height:100%; min-height:490px; display:grid; place-content:center; text-align:center; color:var(--muted); }
.panel-empty h2 { color:var(--ink); margin:10px 0 5px; }
.panel-empty p { max-width:230px; margin:auto; line-height:1.5; }
.frog { font-size:44px; }
.footer { width:min(1480px, calc(100% - 32px)); margin:0 auto 20px; display:flex; justify-content:space-between; color:var(--muted); font-size:11px; }
.footer-sources { width:min(1480px, calc(100% - 32px)); margin:-8px auto 24px; color:var(--muted); font-size:10.5px; line-height:1.5; }
.footer-sources p { margin:0 0 4px; }
.footer-sources a { color:inherit; text-decoration:underline; }

/* v0.6.0 — functional current/forecast switch */
.mode-switch { align-items:center; }
.mode-btn { min-width:110px; }
.mode-btn:focus-visible,
.forecast-day:focus-visible { outline:3px solid rgba(40,122,66,.22); outline-offset:2px; }

.forecast-context.hidden { display:none !important; }

.forecast-context {
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:2px;
  color:var(--muted);
  font: size 16px;
}
.forecast-context-label {
  color:var(--green);
  font-size:24px;
  font-weight:900;
  letter-spacing:.05em;
}
.forecast-context span:last-child { font-size:24px; }

.forecast-rail {
  width:100%;
  display:flex;
  align-items:center;
  gap:12px;
  padding:0 0 8px;
}
.forecast-rail-title {
  flex:0 0 auto;
  color:var(--green);
  font-size:10px;
  font-weight:900;
  letter-spacing:.10em;
}
.forecast-days {
  display:flex;
  gap:5px;
  flex-wrap:wrap;
}
.forecast-day {
  border:1px solid var(--line);
  background:white;
  color:var(--muted);
  padding:6px 10px;
  border-radius:8px;
  cursor:pointer;
  font-size:16px;
  font-weight:800;
}
.forecast-day:hover { background:#f1f7f1; color:var(--ink); }
.forecast-day.active {
  background:var(--green);
  border-color:var(--green);
  color:white;
}

/* Jakość powietrza: dni poza zakresem pozostają widoczne,
   ale są celowo nieaktywne, żeby nie zmieniać układu interfejsu. */
.forecast-day.unavailable,
.forecast-day:disabled {
  opacity:.35;
  cursor:not-allowed;
  background:#f3f3f3;
  color:var(--muted);
}
.forecast-day.unavailable:hover,
.forecast-day:disabled:hover {
  background:#f3f3f3;
  color:var(--muted);
}
@media (max-width:760px) {
  .forecast-context { display:none; }
  .forecast-rail { align-items:flex-start; flex-direction:column; }
  .forecast-days { width:100%; }
  .forecast-day { flex:1 1 auto; }
}

/* v0.6.1 — real forecast data state */
.forecast-model-badge {
  flex:0 0 auto;
  padding:5px 9px;
  border:1px solid var(--line);
  border-radius:8px;
  background:#fff;
  color:var(--green);
  font-size:9px;
  font-weight:900;
  letter-spacing:.08em;
}
.forecast-rail { align-items:center; }
@media (max-width:760px) {
  .forecast-model-badge { align-self:stretch; text-align:center; }
  .brand-logo { width:160px; height:auto; max-width:160px; }
}

/* v0.6.2 — forecast uses the same map + parameter selector surface */
.tile-bar.disabled { opacity:1; pointer-events:auto; }
.forecast-rail { border-bottom:1px solid var(--line); margin-bottom:8px; }
.forecast-model-badge { min-width:92px; text-align:center; }

/* v0.8.1.2 — Żabod dark mode */
:root[data-theme="dark"]{
  --bg:#101712;
  --panel:#18221b;
  --ink:#edf5ee;
  --muted:#9aaa9e;
  --green:#43a85f;
  --green-dark:#2d7d43;
  --line:#304136;
  --shadow:0 14px 40px rgba(0,0,0,.32);
}
/* v0.12.3 — Dark mode polish: brat-green branding + subtle green depth */
:root[data-theme="dark"] .brand-logo-light{display:none}
:root[data-theme="dark"] .brand-logo-dark{
  display:block;
  /* Re-colour the monochrome dark logo toward the requested #8ACE00 brat green. */
  filter:brightness(0) saturate(100%) invert(80%) sepia(83%) saturate(1198%) hue-rotate(38deg) brightness(98%) contrast(103%);
}
:root[data-theme="dark"] body{
  color:var(--ink);
  background-color: #030b05;
  background-image:
    url("/frontend/assets/grain.png"),
    radial-gradient(ellipse at 10% 0%, rgba(0, 232, 93, .25) 0%, rgba(0, 232, 93, 0) 35%),
    radial-gradient(ellipse at 88% 22%, rgba(0, 164, 104, .22) 0%, rgba(0, 164, 104, 0) 39%),
    radial-gradient(ellipse at 54% 100%, rgba(111, 210, 0, .14) 0%, rgba(111, 210, 0, 0) 38%),
    linear-gradient(135deg, #020904 0%, #06170b 42%, #092012 72%, #041009 100%);
  background-size: 220px 220px, auto, auto, auto, auto;
  background-repeat: repeat, no-repeat, no-repeat, no-repeat, no-repeat;
  background-attachment: fixed;
  background-blend-mode: soft-light, normal, normal, normal, normal;
}
:root[data-theme="dark"] .topbar{
  background:rgba(16,23,18,.94);border-color:var(--line);
}
:root[data-theme="dark"] .mode-switch{background:#151f18;border-color:var(--line)}
:root[data-theme="dark"] .mode-btn{color:var(--muted)}
:root[data-theme="dark"] .mode-btn.active{color:#fff}
:root[data-theme="dark"] .search input,
:root[data-theme="dark"] #parameterSelect{
  background:#121a14;color:var(--ink);border-color:var(--line);
}
:root[data-theme="dark"] .search-results{
  background:var(--panel);border-color:var(--line);
}
:root[data-theme="dark"] .search-result{
  background:transparent;color:var(--ink);border-color:var(--line);
}
:root[data-theme="dark"] .search-result:hover,
:root[data-theme="dark"] .search-result:focus{background:#203125}
:root[data-theme="dark"] .map-card,
:root[data-theme="dark"] .detail-panel,
:root[data-theme="dark"] .forecast-day,
:root[data-theme="dark"] .forecast-model-badge,
:root[data-theme="dark"] .meteorogram-tab,
:root[data-theme="dark"] .meteorogram-close{
  background:#141d1700;color:var(--muted);border-color:var(--line);
}
:root[data-theme="dark"] .forecast-day:hover,
:root[data-theme="dark"] .meteorogram-tab:hover,
:root[data-theme="dark"] .meteorogram-close:hover{background:#203125;color:var(--ink)}
:root[data-theme="dark"] .forecast-day.active,
:root[data-theme="dark"] .meteorogram-tab.active{background:var(--green);color:#fff;border-color:var(--green)}
:root[data-theme="dark"] .param-tile{background:#141d17;color:var(--ink);border-color:var(--line)}
:root[data-theme="dark"] .param-tile.active{background:#203a28;border-color:var(--green)}
:root[data-theme="dark"] .location-card button{background:#203a28;color:var(--ink)}
:root[data-theme="dark"] .meteorogram-sheet{background:#141d17;border-color:var(--line)}
:root[data-theme="dark"] .meteorogram-chart{background:#101712;border-color:var(--line)}
:root[data-theme="dark"] .map-control,
:root[data-theme="dark"] .map-controls,
:root[data-theme="dark"] .layer-panel,
:root[data-theme="dark"] .rain-panel{
  background:rgba(20,29,23,.94);color:var(--ink);border-color:var(--line);
}
:root[data-theme="dark"] .map-control select,
:root[data-theme="dark"] .map-control button,
:root[data-theme="dark"] .layer-panel select,
:root[data-theme="dark"] .rain-panel input,
:root[data-theme="dark"] .rain-panel select{
  background:#121a14;color:var(--ink);border-color:var(--line);
}
:root[data-theme="dark"] .map-status,
:root[data-theme="dark"] .map-source,
:root[data-theme="dark"] .footer{color:var(--muted)}
:root[data-theme="dark"] .theme-toggle{background:#18221b;color:#f5d56a;border-color:var(--line)}

/* ================================================================
   ETAP A1 — DATA HEALTH / ROZDZIAŁ POMIAR vs PROGNOZA
   Status jest celowo tekstowy + kolorowy: kolor nie jest jedynym nośnikiem
   informacji, a awaria pojedynczego źródła nie udaje awarii całej aplikacji.
   ================================================================ */
.toolbar-status-group{display:flex;align-items:center;justify-content:flex-end;gap:18px;min-width:290px;position:relative}
.data-source-status{display:flex;align-items:center;gap:9px;min-width:205px;padding:8px 11px;border:1px solid var(--line);border-radius:12px;background:rgba(247,250,246,.92)}
.data-source-copy{min-width:0}
.data-health-dot{width:10px;height:10px;flex:0 0 10px;border-radius:50%;background:#aab5ad;box-shadow:0 0 0 3px rgba(170,181,173,.14)}
.data-source-kind{font-size:9px;font-weight:900;letter-spacing:.12em;color:var(--green)}
.data-source-detail{font-size:11px;font-weight:800;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.data-source-updated{font-size:9px;color:var(--muted);margin-top:2px}

.data-source-status{cursor:help;position:relative}
.data-source-details{position:absolute;right:0;top:calc(100% + 8px);z-index:40;min-width:260px;max-width:380px;padding:10px 12px;border:1px solid var(--line);border-radius:11px;background:rgba(255,255,255,.97);box-shadow:0 10px 28px rgba(20,50,30,.12);font-size:11px;line-height:1.45;color:var(--ink)}
.data-source-details:not(.hidden){display:block}
.data-source-details .status-detail-title{font-size:9px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:5px}
.data-source-details ul{margin:0;padding-left:17px}
.data-source-details li+li{margin-top:3px}
.data-source-details .detail-ok{color:var(--green)}
.data-source-details .detail-error{color:#b72f2f}
:root[data-theme="dark"] .data-source-details{background:rgba(20,29,23,.98);border-color:var(--line)}

.data-source-status.status-success .data-health-dot{background:#2fa451;box-shadow:0 0 0 3px rgba(47,164,81,.15)}
.data-source-status.status-loading .data-health-dot{background:#d6ad2f;box-shadow:0 0 0 3px rgba(214,173,47,.15);animation:zabod-pulse 1.1s ease-in-out infinite}
.data-source-status.status-partial .data-health-dot{background:#d9822b;box-shadow:0 0 0 3px rgba(217,130,43,.15)}
.data-source-status.status-error .data-health-dot{background:#c73b3b;box-shadow:0 0 0 3px rgba(199,59,59,.15)}
.data-source-status.status-empty .data-health-dot{background:#9aa49d;box-shadow:0 0 0 3px rgba(154,164,157,.15)}
.map-card.mode-current .tile-bar{border-top:1px solid rgba(40,122,66,.08)}
.map-card.mode-forecast .tile-bar{background:linear-gradient(90deg,rgba(40,122,66,.055),rgba(40,122,66,.018));border-top:1px solid rgba(40,122,66,.14)}
.map-card.mode-forecast .eyebrow{color:var(--green-dark)}
.map-card.mode-forecast .data-source-kind{color:var(--green-dark)}
@keyframes zabod-pulse{50%{opacity:.45;transform:scale(.8)}}
@media (max-width:900px){
  .toolbar-status-group{min-width:0;gap:10px}
  .data-source-status{min-width:0}
  .forecast-context{display:none}
}
@media (max-width:620px){
  .toolbar-status-group{width:100%;justify-content:flex-start}
  .data-source-status{width:100%}
  .map-toolbar{align-items:flex-start;flex-direction:column}
}
:root[data-theme="dark"] .data-source-status{background:rgba(20,29,23,.94);border-color:var(--line)}


/* v0.9.25 — dark mode: native form controls inherit the dark palette. */
:root[data-theme="dark"] .gradient-panel select,
:root[data-theme="dark"] select{
  color-scheme:dark;
}


/* v0.9.27 — minimum readable chrome text */
.data-source-kind{font-size:10px!important}
.data-source-detail{font-size:12px!important}
.data-source-updated{font-size:10px!important}
.rain-controls,.gradient-panel,.layer-panel{font-size:12px!important}
:root[data-theme="dark"] #dataSourceMeasured{color:var(--muted)}

/* v0.12.3.4 — control rail hygiene
   Forecast dates belong exclusively to the forecast mode.
   Pollen controls appear only after selecting the Pollen forecast tile. */
.map-card.mode-current #forecastRail,
.map-card.mode-current #pollenControls {
  display:none !important;
}

.map-card.mode-forecast #pollenControls.hidden {
  display:none !important;
}


/* v0.12.4 — Historical hub */
.history-hub{width:min(1180px,calc(100vw - 32px));margin:0 auto;padding:28px 0 48px}
.history-hub.hidden,.map-card.hidden{display:none!important}
.history-hub-head h1{margin:4px 0 6px;font-size:clamp(30px,4vw,52px);letter-spacing:-.03em}
.history-hub-head p{margin:0;color:var(--muted,#8a8a8a);font-size:16px}
.history-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:28px}
.history-card{appearance:none;text-align:left;border:1px solid rgba(138,206,0,.18);border-radius:24px;padding:28px;background:linear-gradient(145deg,rgba(138,206,0,.08),rgba(255,255,255,.025));color:inherit;min-height:310px;display:flex;flex-direction:column;cursor:pointer;transition:transform .18s ease,border-color .18s ease,background .18s ease}
.history-card:hover{transform:translateY(-3px);border-color:rgba(138,206,0,.5);background:linear-gradient(145deg,rgba(138,206,0,.13),rgba(255,255,255,.04))}
.history-card-disabled{cursor:default;opacity:.78}.history-card-disabled:hover{transform:none;border-color:rgba(138,206,0,.18)}
.history-card-icon{font-size:42px;margin-bottom:18px}.history-card-kicker{font-size:11px;font-weight:800;letter-spacing:.12em;color:#8ACE00;margin-bottom:8px}.history-card h2{margin:0 0 10px;font-size:28px}.history-card p{margin:0;color:var(--muted,#aaa);line-height:1.55}.history-card-meta{margin-top:auto;padding-top:24px;font-size:13px;font-weight:700}.history-card-cta{margin-top:12px;color:#8ACE00;font-weight:800}
.history-zabod-panel{margin-top:24px;padding:26px;border:1px solid rgba(138,206,0,.2);border-radius:24px;background:rgba(0,0,0,.12)}.history-panel-head{display:flex;justify-content:space-between;gap:20px;align-items:center}.history-panel-head h2{margin:4px 0 0;font-size:28px}.history-back{border:1px solid rgba(138,206,0,.35);background:transparent;color:inherit;border-radius:999px;padding:10px 16px;cursor:pointer}.history-snapshot-list{display:grid;gap:10px;margin-top:22px}.history-snapshot{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:16px 18px;border-radius:16px;background:rgba(255,255,255,.035)}.history-snapshot strong,.history-snapshot span{display:block}.history-snapshot span{font-size:13px;opacity:.7;margin-top:3px}.history-snapshot b{color:#8ACE00;white-space:nowrap}.history-empty{padding:22px;opacity:.75}
@media(max-width:760px){.history-hub{width:min(100% - 20px,1180px);padding-top:18px}.history-grid{grid-template-columns:1fr}.history-card{min-height:260px;padding:22px}.history-panel-head{align-items:flex-start;flex-direction:column}.history-snapshot{align-items:flex-start;flex-direction:column;gap:8px}}
.history-archive-layout{display:grid;grid-template-columns:minmax(280px,.9fr) minmax(320px,1.1fr);gap:18px;margin-top:22px}.history-snapshot-list{margin-top:0;max-height:520px;overflow:auto;padding-right:4px}.history-snapshot{width:100%;border:1px solid transparent;color:inherit;text-align:left;cursor:pointer;font:inherit}.history-snapshot:hover,.history-snapshot.active{border-color:rgba(138,206,0,.5);background:rgba(138,206,0,.08)}.history-snapshot-detail{border:1px solid rgba(138,206,0,.18);border-radius:18px;padding:18px;background:rgba(255,255,255,.025);min-height:180px}.history-detail-head{display:flex;justify-content:space-between;gap:16px}.history-detail-head strong,.history-detail-head span{display:block}.history-detail-head span{font-size:13px;opacity:.7;margin-top:4px}.history-detail-head b{color:#8ACE00}.history-detail-note{opacity:.72;font-size:13px;margin:16px 0}.history-data-preview{display:grid;gap:7px}.history-data-row{display:flex;justify-content:space-between;gap:12px;padding:9px 10px;border-radius:10px;background:rgba(255,255,255,.035)}.history-data-row span{color:#8ACE00;font-weight:700}@media(max-width:850px){.history-archive-layout{grid-template-columns:1fr}.history-snapshot-list{max-height:320px}}


/* 0.12.5 · History workspace: history has its own controls, not the Current/Forecast rail. */
.app-shell.history-active{grid-template-columns:1fr;align-items:start}
.app-shell.history-active .right-rail{display:none}
.app-shell.history-active .history-hub{order:1;width:100%;max-width:none;padding:8px 0 10px;margin:0}
.app-shell.history-active .map-card{order:2;width:100%}
.map-card.mode-history .map-toolbar,.map-card.mode-history .tile-bar,.map-card.mode-history .map-control-rail,.map-card.mode-history .legend{display:none!important}
.map-card.mode-history .map{border-radius:18px;min-height:min(78vh,860px)}
.history-archive-toolbar{display:flex;gap:16px;align-items:end;flex-wrap:wrap;margin:20px 0 18px;padding:16px;border:1px solid rgba(138,206,0,.14);border-radius:18px;background:rgba(255,255,255,.02)}
.history-filter-group{display:grid;gap:6px;min-width:190px}.history-filter-group label,.history-compare-controls label{font-size:10px;font-weight:800;letter-spacing:.1em;opacity:.72}
.history-filter-group select,.history-compare-controls select{background:var(--panel,#132019);color:inherit;border:1px solid var(--line,rgba(255,255,255,.14));border-radius:10px;padding:10px 12px;font:inherit}
.history-toolbar-note{margin-left:auto;max-width:480px;color:var(--muted,#aab5aa);font-size:13px;line-height:1.45}
.history-compare-panel{margin-top:18px;padding:20px;border:1px solid rgba(138,206,0,.18);border-radius:20px;background:linear-gradient(145deg,rgba(138,206,0,.045),rgba(255,255,255,.018))}
.history-compare-head{display:flex;justify-content:space-between;align-items:center;gap:18px}.history-compare-head h3{margin:4px 0 0;font-size:22px}.history-compare-head button{border:1px solid rgba(138,206,0,.45);background:rgba(138,206,0,.1);color:inherit;border-radius:12px;padding:11px 15px;font:inherit;font-weight:800;cursor:pointer}
.history-compare-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:16px}.history-compare-controls label{display:grid;gap:6px}
.history-compare-result{margin-top:16px;padding:14px 16px;border-radius:14px;background:rgba(0,0,0,.12);font-size:14px}.history-compare-stats{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}.history-compare-stats b{font-size:28px;color:#8ACE00}.history-compare-result ul{margin:14px 0 0;padding-left:18px;display:grid;gap:7px}.history-compare-result li span{opacity:.7;margin-left:6px}
@media(max-width:760px){.history-archive-toolbar{align-items:stretch}.history-toolbar-note{margin-left:0}.history-filter-group{width:100%}.history-compare-head{align-items:flex-start;flex-direction:column}.history-compare-controls{grid-template-columns:1fr}.map-card.mode-history .map{min-height:560px}}


/* v0.21.8.2 — reserved home for ŻABOD for you (feature planned for 0.31) */
.zabod-for-you-slot{
  margin-top:18px;
  padding:16px 14px 14px;
  border:1px dashed rgba(67,168,95,.48);
  border-radius:16px;
  background:linear-gradient(135deg,rgba(30,110,51,.13),rgba(8,25,15,.08));
  color:var(--ink);
}
.zabod-for-you-kicker{font-size:9px;font-weight:900;letter-spacing:.13em;color:var(--green);}
.zabod-for-you-slot h3{margin:5px 0 3px;font-size:20px;font-weight:900;}
.zabod-for-you-slot p{margin:0 0 10px;color:var(--muted);font-size:12px;}
.zabod-for-you-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px;}
.zabod-for-you-chips span{display:inline-flex;align-items:center;padding:5px 8px;border:1px solid var(--line);border-radius:999px;background:rgba(67,168,95,.09);font-size:10px;font-weight:700;}
.zabod-for-you-slot small{display:block;color:var(--muted);font-size:10px;line-height:1.4;}
:root[data-theme="dark"] .zabod-for-you-slot{background:linear-gradient(135deg,rgba(40,122,66,.16),rgba(5,15,9,.22));}
