/* vodadanas – koncept 2 „Moja ulica” (Matea, 18. 10. 2026.): svijetla i tamna tema po postavkama uređaja; traka lista #0aa5d8 */
@font-face{font-family:'Schibsted Grotesk';font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/schibstedgrotesk-sub.woff2?v=1) format('woff2');unicode-range:U+20-7e, U+a0-17f, U+218-21b, U+2c6-2c7, U+2d8-2dd, U+300-301, U+304, U+308, U+30c, U+327-329, U+2000-200a, U+2010-2027, U+202f-2030, U+2032-2033, U+2039-203a, U+2044, U+20ac, U+2116, U+2122, U+2190-2193, U+2212, U+2215, U+25b6, U+2605}
:root{
  --band:#0aa5d8; --acc:#0784b0; --bg:#eaf4f8; --card:#fff; --t:#0f2430; --mu:#536a77; --l:#cfdee6; --pill:#eaf4f8;
  --boil:#073b52; --boil-t:#e9f7fd; --hit:#fff6d9; --kvar:#ea6a3d;
  --tp:#055f80; --tp-bg:#dbf1fa; --tk:#9a3412; --tk-bg:#fde8e1; --tm:#7a5600; --tm-bg:#fff2c2; --tg:#536a77; --tg-bg:#e8eef1;
  --leaf:#fffcf5; --leaf-t:#1e1a15;
  --f:'Schibsted Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;   /* samo logotip i wordmarkovi (mreza-danas.md) */
  --fb:system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;   /* tijelo: sistemsko pismo – tekst se crta odmah (PSI 18. 10.: LCP naslovnice 4,1 s zbog čekanja web-pisma) */
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root{
  --acc:#4cc3f5; --bg:#0b1820; --card:#11232e; --t:#e4f0f5; --mu:#93a9b6; --l:#22394a; --pill:#173040;
  --boil:#0d4a66; --boil-t:#e9f7fd; --hit:#3a3214; --kvar:#f08a5d;
  --tp:#9fdcf7; --tp-bg:#12384c; --tk:#ffc3a8; --tk-bg:#4a2417; --tm:#ffe08a; --tm-bg:#4a3a0c; --tg:#a9bcc7; --tg-bg:#1d3341;
  color-scheme:dark;
}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--t);font:16px/1.5 var(--fb)}
.mreza .a,.mreza .b,.xlink .a,.xlink .b{font-family:var(--f)}
a{color:var(--acc)}
.tn{font-variant-numeric:tabular-nums}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:8px;background:var(--card);padding:8px 12px;z-index:9}
:focus-visible{outline:3px solid var(--band);outline-offset:2px}
main,.hdr,.ftr{max-width:760px;margin:0 auto;padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}

/* zaglavlje i logotip B (mreza-danas.md) */
.hdr{display:flex;justify-content:space-between;align-items:center;padding-top:14px;padding-bottom:10px}
.logo{display:flex;align-items:center;font-size:1.4rem;letter-spacing:-.035em;white-space:nowrap;text-decoration:none;color:var(--t);font-family:var(--f)}
.logo .leaf{box-sizing:border-box;font:700 .62em/1 var(--f);width:1.935em;height:2.19em;margin-right:.516em;padding-bottom:.2em;border-radius:3px;position:relative;display:grid;place-items:end center;overflow:hidden;flex:none;letter-spacing:0;background:var(--leaf);color:var(--leaf-t);border:1.5px solid var(--t)}
.logo .leaf::before{content:"";position:absolute;inset:0 0 auto;height:.58em;background:var(--band)}
.logo .a{font-weight:800}.logo .b{font-weight:500;opacity:.78}
.cc{display:flex;gap:4px}
.cc a{font-size:.82rem;font-weight:700;padding:6px 10px;border-radius:8px;background:var(--card);color:var(--t);text-decoration:none;border:1px solid var(--l)}
.cc a[aria-current]{background:var(--t);color:var(--card);border-color:var(--t)}

/* kartice */
.card{background:var(--card);border-radius:18px;padding:16px;margin:0 0 12px;box-shadow:0 1px 3px rgba(15,40,55,.08)}
h1{font-size:1.35rem;line-height:1.2;margin:0 0 12px;letter-spacing:-.015em;text-wrap:balance}
h2{font-size:1.05rem;margin:0 0 10px}
.sub{color:var(--mu);font-size:.85rem;margin:10px 0 0}
.sub.dan{margin:-6px 0 12px}
.crumbs{font-size:.8rem;color:var(--mu);margin:0 0 6px}.crumbs a{color:var(--mu)}
.src{font-size:.78rem;color:var(--mu)}
.src a{color:var(--mu)}
.empty{color:var(--mu);margin:12px 0}

/* tražilica i pilule */
.search{display:flex;align-items:center;gap:6px;border:2px solid var(--band);border-radius:12px;padding:4px 4px 4px 12px;background:var(--card)}
.search input{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:1rem;color:var(--t);padding:8px 0}
.search input:focus{outline:none}
.search:focus-within{box-shadow:0 0 0 3px color-mix(in srgb,var(--band) 35%,transparent)}
.search button{border:0;background:var(--band);color:#fff;font-size:1.2rem;width:40px;height:40px;border-radius:9px;cursor:pointer}
.pills{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.pills a{font-size:.82rem;font-weight:700;padding:7px 11px;border-radius:999px;background:var(--pill);color:var(--t);text-decoration:none}

/* preporuke – sažetak na naslovnici */
.boil{display:flex;gap:12px;align-items:center;background:var(--boil);color:var(--boil-t);border-radius:14px;padding:12px 14px;margin:0 0 12px;text-decoration:none}
.boil .n{font-size:1.8rem;font-weight:800;line-height:1}
.boil small{opacity:.85}
.boil.prazno{opacity:.9}

/* pločice gradova */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin:0 0 12px}
.tile{background:var(--card);border-radius:14px;padding:12px;display:grid;gap:2px;text-decoration:none;color:var(--t);box-shadow:0 1px 2px rgba(15,40,55,.06)}
.tile .c{font-weight:800;font-size:.9rem}
.tile .n{font-size:1.65rem;font-weight:800;letter-spacing:-.02em;line-height:1.1}
.tile .n small{font-size:.75rem;font-weight:600;color:var(--mu);letter-spacing:0}
.tile.nula .n{color:var(--mu)}

/* segmenti danas/sutra/tjedan */
.seg{display:flex;background:var(--pill);border-radius:10px;padding:3px;margin-top:12px;gap:3px}
.seg a{flex:1;text-align:center;padding:8px 4px;border-radius:8px;font-weight:700;font-size:.82rem;color:var(--mu);text-decoration:none}
.seg a[aria-current]{background:var(--card);color:var(--t);box-shadow:0 1px 2px rgba(0,0,0,.08)}

/* vremenska crta */
.tl{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:12px}
.ev{display:grid;grid-template-columns:48px 1fr;gap:10px}
.ev .h{font-weight:800;font-size:.85rem;text-align:right;padding-top:1px}
.ev .b{border-left:3px solid var(--band);padding-left:10px;display:grid;gap:3px;min-width:0}
.ev.kvar .b{border-left-color:var(--kvar)}
.ev.gotovo{opacity:.62}
.ev .mj{font-size:.85rem;overflow-wrap:anywhere}
.tag{display:inline-block;font-size:.66rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;padding:2px 6px;border-radius:4px;vertical-align:1px}
.t-plan{background:var(--tp-bg);color:var(--tp)}.t-kvar{background:var(--tk-bg);color:var(--tk)}
.t-maybe{background:var(--tm-bg);color:var(--tm)}.t-topl{background:var(--tk-bg);color:var(--tk)}.t-gotovo{background:var(--tg-bg);color:var(--tg)}

/* preporuke i nalazi */
.prl,.nal,.izv{list-style:none;margin:12px 0;padding:0;display:grid;gap:10px}
.pr,.nal li{display:grid;gap:3px;padding:10px 12px;border:1px solid var(--l);border-radius:12px}
.pr.st-aktivna{border-color:var(--band)}
.pr.st-ukinuta{opacity:.7}
.pr .pn{font-size:.88rem}
.pr .warn{font-size:.82rem;font-weight:700;color:var(--tm)}
.check{font-size:.82rem;padding:12px 14px;border-radius:12px;background:var(--card);margin:0 0 12px;border:1px solid var(--l)}
.card .check{background:var(--pill);border:0}
.ulice{line-height:1.9;font-size:.9rem}
h2.okol{margin:18px 0 0;font-size:.95rem;color:var(--mu)}
.xlink{display:block;background:var(--card);border-radius:14px;padding:12px 14px;margin:0 0 12px;color:var(--t);text-decoration:none;font-size:.9rem;border:1px solid var(--l)}
.xlink .a{font-weight:800}.xlink .b{font-weight:500;opacity:.78}
.prose p,.prose li{max-width:65ch}
.moja{display:block;background:var(--hit);color:var(--t);border-radius:14px;padding:12px 14px;margin:0 0 12px;text-decoration:none;font-size:.9rem}
.k-gumb[aria-pressed="true"]{background:var(--tp-bg);color:var(--tp)}
.k-gumb{font:inherit;font-weight:700;padding:9px 14px;border-radius:10px;border:1px solid var(--l);background:var(--pill);color:var(--t);cursor:pointer}

/* traka Danas i podnožje */
.danas{display:flex;gap:6px;overflow-x:auto;padding:2px 0 12px;font-size:.8rem;scrollbar-width:none}
.danas a{white-space:nowrap;padding:7px 11px;border-radius:999px;background:var(--card);color:var(--t);text-decoration:none}
.ftr{padding-top:8px;padding-bottom:28px;font-size:.8rem;color:var(--mu);border-top:1px solid var(--l);margin-top:8px}
.ftr a{color:var(--mu);text-decoration:none}
.mreza{line-height:1.9}
.mreza b{color:var(--t)}
.mreza a{margin-right:8px;color:var(--t)}.mreza .a{font-weight:800}.mreza .b{font-weight:500;opacity:.78}
.kup{width:100%;border-collapse:collapse;margin:10px 0 0;font-size:.9rem}.kup caption{text-align:left;padding:0 0 6px}.kup th{text-align:left;font-size:.78rem;color:var(--mu);font-weight:600;padding:4px 6px;border-bottom:1px solid var(--l)}.kup td{padding:6px;border-bottom:1px solid var(--l);vertical-align:top}.kup td:first-child{overflow-wrap:anywhere}
details>summary{cursor:pointer;margin:8px 0 0;font-weight:600}
@media (min-width:700px){h1{font-size:1.6rem}.card{padding:20px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}