/* /statistika-pravila — isti jezik kao /pravila: uredničke brojke, tanke
   linije, podaci su jedino glasno na stranici. Zeleno je uvijek „potvrđeno",
   plavo „AI izvedeno", sivo „u reviziji / van obrade" (validirano za
   daltonizam i kontrast na ovoj podlozi, vidi statistika_grafikoni.js). */
.st-shell{
  --st-ink:#171512;--st-muted:#6e6860;--st-faint:rgba(110,104,96,.78);
  --st-line:rgba(61,52,43,.14);--st-line-soft:rgba(61,52,43,.08);
  --st-card:rgba(255,255,255,.66);--st-accent:#8b6f47;
  --st-p:#2e7d32;--st-i:#2a78d6;--st-r:#bdb6aa;--st-r-edge:#8f887c;
  --st-grid:#e7e2d9;--st-base:#c9c3b8;
}

/* ——— Naslov ——— */
.st-hero{position:relative;padding:clamp(24px,3.4vw,52px) 0 0}
.st-hero>canvas.pr-sinapse-canvas{position:absolute;inset:-60px 0 0;width:100%;height:calc(100% + 60px);pointer-events:none;opacity:.6}
.st-hero>*:not(canvas){position:relative;z-index:1}
.st-kicker{margin:0 0 18px;font:600 10px/1.3 Inter,sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--st-accent)}
.st-hero h1{margin:0;font:400 clamp(46px,6vw,88px)/.92 "Cormorant Garamond",serif;letter-spacing:-.025em;color:var(--st-ink)}
.st-sub{margin:20px 0 0;max-width:720px;font:400 14px/1.7 Inter,sans-serif;color:var(--st-muted)}

/* ——— Brojke ——— */
.st-kpi{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:clamp(30px,4vw,48px) 0 0;border-top:1px solid var(--st-line);border-left:1px solid var(--st-line)}
.st-kpi-mali{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));margin-top:-1px}
.st-tile{position:relative;min-width:0;padding:20px 22px 18px;background:#fbf9f5;border-right:1px solid var(--st-line);border-bottom:1px solid var(--st-line)}
.st-tile .k{font:600 9.5px/1.35 Inter,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--st-muted)}
.st-tile .v{margin:10px 0 8px;font:400 clamp(44px,4.4vw,62px)/.9 "Cormorant Garamond",serif;font-variant-numeric:lining-nums;letter-spacing:-.01em;color:var(--st-ink)}
.st-tile .s{max-width:36ch;font:400 11.5px/1.55 Inter,sans-serif;color:var(--st-faint)}
.st-kpi-mali .st-tile{padding:16px 20px 15px}
.st-kpi-mali .st-tile .v{font-size:clamp(30px,2.6vw,38px);margin:8px 0 6px}
.st-kpi-pgr{margin-top:14px;grid-template-columns:repeat(3,minmax(0,1fr))}
.st-kpi-pgr .st-tile .v{margin:0 0 8px}
.st-kpi-pgr .st-tile .k{letter-spacing:.04em;text-transform:none;font:400 12px/1.45 Inter,sans-serif}
.st-tile-p .k:before,.st-tile-i .k:before,.st-tile-r .k:before,.st-tile-ink .k:before{content:"";display:inline-block;width:7px;height:7px;margin:0 8px 1px 0;border-radius:50%;vertical-align:middle}
.st-tile-ink .k:before{background:var(--st-ink)}
.st-tile-p .k:before{background:var(--st-p)}
.st-tile-i .k:before{background:var(--st-i)}
.st-tile-r .k:before{background:var(--st-r)}
.st-spark{position:absolute;right:18px;top:18px;width:96px;height:30px;overflow:visible}
.st-spark path{fill:none;stroke:rgba(110,104,96,.42);stroke-width:1.5;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.st-tile-p .st-spark path{stroke:rgba(46,125,50,.55)}
.st-tile-i .st-spark path{stroke:rgba(42,120,214,.55)}

/* ——— Sastav (jedna traka, dio prema cjelini) ——— */
.st-sastav{margin:22px 0 0;padding:0}
.st-sastav figcaption{margin:0 0 10px;font:400 13px/1.5 Inter,sans-serif;color:var(--st-muted)}
.st-sastav figcaption b{font-weight:600;color:var(--st-ink)}
.st-stack{display:flex;gap:2px;height:14px}
.st-stack i{flex:1 1 0;min-width:3px;cursor:default}
.st-stack i:first-child{border-radius:4px 0 0 4px}
.st-stack i:last-child{border-radius:0 4px 4px 0}
.st-stack i:only-child{border-radius:4px}
.st-stack i:hover{filter:brightness(1.08)}
.st-shell .p{--c:var(--st-p)}.st-shell .i{--c:var(--st-i)}.st-shell .r{--c:var(--st-r)}
.st-stack i,.st-bar i{background:var(--c)}
.st-legend{display:flex;flex-wrap:wrap;gap:8px 22px;margin:12px 0 0;padding:0;list-style:none;font:400 12.5px/1.5 Inter,sans-serif;color:var(--st-muted)}
.st-legend li{display:flex;align-items:center;gap:7px}
.st-legend li>i{flex:none;width:10px;height:10px;border-radius:2px;background:var(--c)}
.st-legend b{font-weight:600;color:var(--st-ink)}
.st-legend span{color:var(--st-faint)}

/* ——— Odjeljci ——— */
.st-section{margin:clamp(56px,6vw,92px) 0 0}
.st-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px 40px;flex-wrap:wrap;margin:0 0 18px}
.st-section h2{margin:0 0 8px;font:400 clamp(28px,2.6vw,38px)/1.05 "Cormorant Garamond",serif;color:var(--st-ink)}
.st-section .lead{max-width:78ch;margin:0;font:400 13px/1.7 Inter,sans-serif;color:var(--st-muted)}
.st-state{display:flex;align-items:center;gap:8px;max-width:46ch;margin:0;font:400 11.5px/1.5 Inter,sans-serif;color:var(--st-muted)}
.st-state:before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:#9a6b16}
.st-state.ok:before{background:var(--st-p)}
.st-card{border:1px solid var(--st-line);background:var(--st-card);padding:22px 24px}
.st-card h3{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:0 0 14px;font:500 14px/1.3 Inter,sans-serif;color:var(--st-ink)}
.st-card h3 span{font:400 11.5px/1 Inter,sans-serif;color:var(--st-faint)}
.st-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}

/* ——— Grafikon rasta ——— */
.st-chart-top{display:flex;align-items:center;justify-content:space-between;gap:12px 24px;flex-wrap:wrap;margin:0 0 12px}
.st-legend-chart{margin:0}
.st-legend-chart li>i{width:12px;height:12px}
.st-range{display:inline-flex;border:1px solid var(--st-line);border-radius:999px;overflow:hidden;background:rgba(255,255,255,.5)}
.st-range button{appearance:none;border:0;background:none;padding:8px 14px;font:500 11px/1 Inter,sans-serif;color:var(--st-muted);cursor:pointer}
.st-range button+button{border-left:1px solid var(--st-line)}
.st-range button[aria-pressed="true"]{background:var(--st-ink);color:#fff}
.st-range button:focus-visible{outline:2px solid var(--st-accent);outline-offset:-2px}
.st-plot{position:relative;height:300px}
.st-plot-dani{height:150px}
.st-plot-title{margin:22px 0 4px;font:600 9.5px/1.3 Inter,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--st-muted)}
.st-svg{display:block;overflow:visible;font-family:Inter,sans-serif}
.st-svg:focus-visible{outline:2px solid var(--st-accent);outline-offset:4px}
.st-axis text{font-size:11px;fill:var(--st-faint);font-variant-numeric:tabular-nums}
.st-axis .today{fill:var(--st-ink);font-weight:600}
.st-axis .grid{stroke:var(--st-grid);stroke-width:1}
.st-axis .base,.st-svg .base{stroke:var(--st-base);stroke-width:1}
.st-axis .tick{stroke:var(--st-base);stroke-width:1}
.st-svg .band.p{fill:rgba(46,125,50,.2)}
.st-svg .band.i{fill:rgba(42,120,214,.16)}
.st-svg .band.r{fill:rgba(160,152,140,.26)}
.st-svg .edge{fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.st-svg .edge.p{stroke:var(--st-p)}
.st-svg .edge.i{stroke:var(--st-i)}
.st-svg .edge.r{stroke:var(--st-r-edge)}
.st-svg .cross{stroke:rgba(23,21,18,.35);stroke-width:1}
.st-svg .dot{stroke:#fbf9f5;stroke-width:2}
.st-svg .dot.p{fill:var(--st-p)}.st-svg .dot.i{fill:var(--st-i)}.st-svg .dot.r{fill:var(--st-r-edge)}
.st-svg .hit{fill:transparent;cursor:crosshair}
.st-endlabels text{font-size:11.5px;fill:var(--st-muted)}
.st-endlabels .v{font-weight:600;fill:var(--st-ink);font-variant-numeric:tabular-nums}
.st-endlabels .total{font-weight:600;fill:var(--st-ink)}
.st-endlabels .leader{stroke:var(--st-base);stroke-width:1;fill:none}
.st-svg .bar{fill:var(--st-i)}
.st-svg .bar.neg{fill:var(--st-r-edge)}
.st-svg .col:hover .bar{filter:brightness(1.1)}
.st-svg .col .hit{cursor:default}
.st-svg .val{font-size:11px;font-weight:600;fill:var(--st-ink);font-variant-numeric:tabular-nums}
.st-svg .empty{font-size:12px;fill:var(--st-faint)}

/* ——— Trake po propisu i oblasti ——— */
.st-bars{margin:0;padding:0;list-style:none}
.st-bars li{display:grid;grid-template-columns:minmax(0,40%) minmax(0,1fr) 44px;align-items:center;gap:14px;padding:6px 0;border-top:1px solid var(--st-line-soft)}
.st-bars li:first-child{border-top:0}
.st-bar-label{min-width:0;font:400 12.5px/1.35 Inter,sans-serif;color:var(--st-ink)}
.st-bar-label>*{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.st-bar-label a{color:inherit;text-decoration:none}
.st-bar-label a:hover{color:var(--st-accent);text-decoration:underline}
.st-bar{display:flex;gap:2px;height:10px;min-width:0}
.st-bar i{height:100%;min-width:2px}
.st-bar i:last-child{border-radius:0 4px 4px 0}
.st-bar-n{font:600 12px/1 Inter,sans-serif;color:var(--st-ink);text-align:right;font-variant-numeric:tabular-nums}

/* ——— Tabele, detalji, napomene ——— */
.st-note{max-width:82ch;margin:12px 0 0;font:400 11.5px/1.7 Inter,sans-serif;color:var(--st-faint)}
.st-note a,.st-foot a{color:var(--st-accent);text-decoration:none;border-bottom:1px solid rgba(139,111,71,.3)}
.st-foot{margin-top:40px}
.st-details{margin:16px 0 0}
.st-details>summary{display:inline-block;cursor:pointer;font:500 12px/1.4 Inter,sans-serif;color:var(--st-accent);list-style:none}
.st-details>summary::-webkit-details-marker{display:none}
.st-details>summary:before{content:"+ ";font-weight:600}
.st-details[open]>summary:before{content:"− "}
.st-details>.st-wrap,.st-details>p{margin-top:12px}
.st-wrap{overflow-x:auto;border:1px solid var(--st-line);background:var(--st-card)}
.st-table{width:100%;border-collapse:collapse;font:400 12px/1.55 Inter,sans-serif}
.st-table th{text-align:left;font:600 9px/1.3 Inter,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--st-muted);padding:10px 12px;border-bottom:1px solid var(--st-line)}
.st-table td,.st-table tbody th{padding:9px 12px;border-bottom:1px solid var(--st-line-soft);color:#2c2926;vertical-align:top;text-align:left}
.st-table tbody th{font-weight:600;letter-spacing:0;text-transform:none;font-size:12px;color:var(--st-ink)}
.st-table tr:last-child td,.st-table tr:last-child th{border-bottom:0}
.st-table td.num,.st-table th.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.st-table td ul{margin:0;padding-left:16px}
.st-table time{white-space:nowrap;font-variant-numeric:tabular-nums}
.st-dates .st-age{white-space:nowrap;color:var(--st-faint)}

/* ——— Tooltip ——— */
.st-tip{position:fixed;z-index:1000;max-width:300px;padding:10px 12px;border:1px solid var(--st-line,rgba(61,52,43,.14));background:#fff;box-shadow:0 14px 34px -18px rgba(40,30,20,.35);font:400 12px/1.5 Inter,sans-serif;color:#171512;pointer-events:none}
.st-tip[hidden]{display:none}
.st-tip .st-tip-head{font-weight:600;margin-bottom:2px}
.st-tip .st-tip-sub{color:#6e6860;font-size:11px;margin-bottom:6px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.st-tip .st-tip-row,.st-tip .st-tip-total{display:flex;align-items:center;gap:6px}
.st-tip .st-tip-total{margin-top:4px;padding-top:4px;border-top:1px solid rgba(61,52,43,.12)}
.st-tip b{font-weight:600;font-variant-numeric:tabular-nums}
.st-tip .k{flex:none;width:12px;height:2px;border-radius:1px;background:var(--c)}
.st-tip .k.p{--c:#2e7d32}.st-tip .k.i{--c:#2a78d6}.st-tip .k.r{--c:#8f887c}

/* ——— Uži ekrani ——— */
@media(max-width:1100px){
  .st-kpi{grid-template-columns:repeat(2,minmax(0,1fr))}
  .st-kpi-mali{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
  .st-kpi-pgr{grid-template-columns:repeat(2,minmax(0,1fr))}
  .st-two{grid-template-columns:1fr}
}
@media(max-width:640px){
  .st-hero{padding-top:18px}
  .st-hero h1{font-size:clamp(42px,12vw,56px)}
  .st-kpi{grid-template-columns:1fr}
  .st-kpi-mali{grid-template-columns:repeat(2,minmax(0,1fr))}
  .st-tile{padding:18px 16px 16px}
  .st-spark{right:14px;top:16px;width:84px}
  .st-card{padding:18px 16px}
  .st-plot{height:250px}
  .st-plot-dani{height:140px}
  .st-bars li{grid-template-columns:minmax(0,1fr) 40px;gap:6px 10px}
  .st-bar-label{grid-column:1/-1}
  .st-range{width:100%}
  .st-range button{flex:1}
}
@media(prefers-reduced-motion:reduce){.st-stack i:hover,.st-svg .col:hover .bar{filter:none}}