/* ============================================================
   CRVENA PILULA · Sajber enciklopedija — V5 „ČVRST OKVIR"
   ------------------------------------------------------------
   Suština: STRANICA SE NE SKROLUJE. body je flex column visine
   100dvh, header i footer su flex:none (uvek vidljivi), main je
   flex:1 i sadrži .enc zonu sa unutrašnjim scroll regionima.
   Mobile-first: bazni stilovi za telefon (swipe pager između
   kategorija), ≥1080px pager se „raspakuje" u nezavisne scroll-
   kolone i filter rail.
   Site header (partial header.php) ostaje, ali sa enc-shell
   override-om: position:static + flex:none (ne sticky).
   Site mini-footer (enc-footer partial) ostaje, takođe flex:none.
   Tokeni su scoped pod body.page-enciklopedija da kaskadiraju u
   header rail (osim site .hdr koji ima sopstvene boje) i u mini
   footer.
   ============================================================ */

/* ============================================================
   TOKENI — scoped na enc telo
   ============================================================ */
body.page-enciklopedija {
  /* Brand — signal */
  --brand:           #9b1919;
  --brand-hover:     #7d1414;
  --brand-faint:     rgba(155, 25, 25, 0.10);

  /* Kategorijske boje — boje nose tip, ne ukras */
  --cat-pretnje:     #9b1919;
  --cat-tehnike:     #a6731f;
  --cat-odbrane:     #3a5570;
  --cat-pretnje-faint: rgba(155, 25, 25, 0.10);
  --cat-tehnike-faint: rgba(166, 115, 31, 0.12);
  --cat-odbrane-faint: rgba(58, 85, 112, 0.12);

  /* LIGHT default — warm neutral porodica */
  --bg:              #f4f4f2;
  --bg-paper:        #fafaf8;
  --bg-card:         #ebebea;
  --bg-subtle:       #eeeeed;
  --line:            #d6d6d4;
  --line-soft:       #e3e1de;
  --line-strong:     #b8b6b3;
  --t-hi:            #1a1a18;
  --t-md:            #2d2d2b;
  --t-lo:            #5a5a58;
  /* Pod svetle rampe: #7a7a78 je merilo 3.98 a #9a9a98 svega 2.56 na ENC
     podlogama. Ispod poda nema tona za tekst, pa mute i faint pokazuju na
     isti pod (4.54-5.19 na sve cetiri podloge strane). (S130) */
  --t-mute:          #6a6a68;
  --t-faint:         #6a6a68;

  /* Tekstualne varijante: --brand i --cat-* nose i podloge i ivice, pa se
     sami ne diraju. Na svetloj podlozi prolaze, pa pokazuju na sebe. */
  --brand-text:        var(--brand);
  /* Mastilo NA kategorijskoj podlozi (popunjeni CTA). Nijedno jedno mastilo ne
     prolazi na sve tri boje: belo pada na amber (4.12), tamno pada na crvenu
     (2.2). Zato po kategoriji. (S130) */
  --ink-on-pretnje:    #ffffff;   /* na #9b1919 = 8.25 */
  --ink-on-tehnike:    #0f0f0d;   /* na #a6731f = 4.65; belo bi bilo 4.12 */
  --ink-on-odbrane:    #ffffff;   /* na #3a5570 = 7.74 */
  --cat-pretnje-text:  var(--cat-pretnje);
  --cat-tehnike-text:  #855c19;   /* amber kao TEKST na svetlom: #a6731f je merio
                                     3.74; ovo 5.36 na #f4f4f2 i 4.71 na tintu (S130) */
  --cat-odbrane-text:  var(--cat-odbrane);

  /* Tipografija — Inter / JetBrains Mono dolaze iz site fonts.css */
  --font-sans: 'Inter', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'Courier New', monospace;

  /* Layout */
  --radius:          3px;
  --pad:             16px;   /* rub na mobilnom */
  --pad-d:           28px;   /* rub na desktopu */
  --aside-w:         360px;
  --rail-w:          252px;
  --term-max:        1140px;   /* desktop POJAM fokus — sužen, ne full-bleed */

  /* Spacing skala */
  --s1: 0.25rem; --s2: 0.5rem; --s3: 0.75rem; --s4: 1rem;
  --s5: 1.5rem;  --s6: 2rem;   --s7: 3rem;
}

html[data-theme="dark"] body.page-enciklopedija {
  --bg:              #161614;
  --bg-paper:        #1c1c1a;
  --bg-card:         #232321;
  --bg-subtle:       #1c1c1a;
  --line:            #2e2e2c;
  --line-soft:       #242422;
  --line-strong:     #3a3a37;
  --t-hi:            #ece9e3;
  --t-md:            #c8c5be;
  --t-lo:            #a0a09e;
  /* #807d77 je merilo 4.16, #5a5754 svega 2.38 — oba padaju. Na pod, i to
     na isti: ispod poda nema tona za tekst. (S130) */
  --t-mute:          #8e8b85;
  --t-faint:         #8e8b85;

  --brand:           #c0392b;
  --brand-hover:     #d44a3a;
  --brand-faint:     rgba(192, 57, 43, 0.16);
  --cat-pretnje:     #c0392b;
  --cat-tehnike:     #c79248;
  --cat-odbrane:     #6a8db2;

  /* Tekstualne varijante ZA TAMNU TEMU. Na svom 14-16% tintu kategorijska
     boja kao TEKST pada: pretnje 2.78, odbrane 4.08 (tehnike prolazi).
     Crvena je dignuta ZASICENJEM, ne svetlinom — S80/L63, ne losos. Same
     --cat-* vrednosti ostaju jer nose i podloge i ivice. (S130) */
  --brand-text:        var(--brand-on-dark);
  /* Mastilo NA kategorijskoj podlozi — u tamnoj temi i plava trazi tamno
     mastilo (belo na #6a8db2 je 3.46). (S130) */
  --ink-on-pretnje:    #ffffff;   /* na #c0392b = 5.44 */
  --ink-on-tehnike:    #0f0f0d;   /* na #c79248 = 6.97; belo bi bilo 2.75 */
  --ink-on-odbrane:    #0f0f0d;   /* na #6a8db2 = 5.54; belo bi bilo 3.46 */
  --cat-pretnje-text:  #ec6355;
  --cat-tehnike-text:  var(--cat-tehnike);
  --cat-odbrane-text:  #769dc7;
  --cat-pretnje-faint: rgba(192, 57, 43, 0.16);
  --cat-tehnike-faint: rgba(199, 146, 72, 0.14);
  --cat-odbrane-faint: rgba(106, 141, 178, 0.14);
}

/* ============================================================
   APP-SHELL — stranica NE skroluje
   body je flex column 100dvh; site header, main i mini footer
   su njeni flex članovi (flex:none / flex:1 / flex:none).
   ============================================================ */
html, body { height: 100%; }
/* Hrom uvek taman (S85, Denis): na iOS-u notch pojas iznad hedera prekriva
   BODY (100dvh + viewport-fit=cover), NE html canvas — html pin sam nije bio
   dovoljan (ista lekcija kao /price/ u S84). Zato body fiksno #0f0f0d u OBE
   teme, a temsku pozadinu sadržaja (var(--bg)) nosi main; html pin ostaje
   za overscroll gumicu. */
html:has(body.page-enciklopedija) { background: #0f0f0d; }
body.page-enciklopedija {
  margin: 0;
  height: 100dvh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #0f0f0d;
  color: var(--t-hi);
  font-family: var(--font-sans);
  font-size: 17px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: 'ss01' 1, 'cv11' 1, 'kern' 1;
}

/* Site header (partial header.php) — override sticky → flex:none.
   Visual styling (boje, brand, nav) ostaje iz header.css. */
body.page-enciklopedija > .hdr {
  position: static !important;
  flex: none;
  top: auto !important;
}

/* Skip-link je position:absolute, ne ulazi u flex flow. */

/* ============================================================
   .enc-header — sekcijski heder enciklopedije („drugi sprat" pravog hedera).
   Renderuje partials/enc-header.php kao prvo dete main-a na svim
   enciklopedija stranicama. 54px fiksne visine, UVEK TAMNA paleta
   nezavisno od data-theme — tek sadržaj ispod prati svetlu/tamnu temu.
   Tokeni lokalni (eh-*) da kategorijske boje uvek imaju dark vrednosti.
   ============================================================ */
.enc-header {
  /* Prati temu strane (svetla podrazumevano) — isti svetao „drugi sprat" kao
     slim hub-bar na desktop hub-u. eh-* tokeni mapirani na temske tokene;
     kategorijske boje se nasleđuju iz teme (svetle: #9b1919/#a6731f/#3a5570). */
  --eh-bg: var(--bg);
  --eh-search: var(--bg-paper);
  --eh-line: var(--line);
  --eh-line-strong: var(--line-strong);
  --eh-hi: var(--t-hi);
  --eh-md: var(--t-md);
  --eh-lo: var(--t-lo);
  --eh-mute: var(--t-mute);
  --eh-faint: var(--t-faint);

  flex: none;
  background: var(--eh-bg);
  color: var(--eh-hi);
  border-top: 1px solid var(--eh-line);
  border-bottom: 1px solid var(--eh-line);
}
.enc-header .enc-row {
  display: flex; align-items: center; gap: 18px;
  height: 54px; padding: 0 22px;
}

/* brend (levo) — ZAJEDNIČKI za sekcijski heder i hub-bar (enc-path partial).
   Bez .enc-header prefiksa → iste klase, isti izgled, gde god se putanja pojavi. */
.enc-brand { display: flex; align-items: center; gap: 12px; flex: none; }
.enc-emblem { width: 40px; height: auto; flex: none; isolation: isolate; }
/* Normal blend na svetloj temi (screen bi izbledeo na svetloj pozadini);
   screen ostaje na tamnoj — kao i pre. */
.enc-blend polygon { mix-blend-mode: normal; fill-opacity: .85; }
html[data-theme="dark"] .enc-blend polygon { mix-blend-mode: screen; fill-opacity: .8; }
.enc-emblem .k-pretnje { fill: var(--cat-pretnje); }
.enc-emblem .k-tehnike { fill: var(--cat-tehnike); }
.enc-emblem .k-odbrane { fill: var(--cat-odbrane); }
.enc-emblem .k-nodes circle { mix-blend-mode: normal; }
.enc-header .enc-logo {
  font-family: 'JetBrains Mono', ui-monospace, 'Courier New', monospace;
  font-weight: 400; font-size: 18px;
  letter-spacing: -.03em; line-height: 1;
  color: var(--eh-hi); white-space: nowrap;
  text-decoration: none;
}
.enc-header .enc-logo:hover { color: var(--eh-hi); }
.enc-header .enc-logo .sl { color: var(--cat-pretnje-text); font-weight: 500; margin: 0 .05em; }
.enc-header .enc-logo .w2 { color: var(--eh-md); font-weight: 400; }
/* Verzioni bedž uz logotip (v2 handoff) — tiha mono oznaka, prati temu
   (svetla/tamna) preko --t-faint; isti tretman na hub-bar logotipu. */
.enc-header .enc-logo .ver,
.enc-hub .hb-logo .ver {
  font-size: .6em; font-weight: 500; letter-spacing: .02em;
  color: var(--t-faint); margin-left: .55em; vertical-align: baseline;
}

/* ── Putanja (wayfinding) — zamenjuje statični .enc-logo ──────────────────────
   Koren „sajber/enciklopedija" + dinamički segmenti (kategorija → pojam →
   pod-stranica). Obojen segment = poziv na klik; terminal = „gde si sad".
   Desktop: običan inline flex red, bez skrola. Mobilni svajp je niže u @720. */
.enc-path { display: flex; align-items: center; min-width: 0; }
.enc-path-scroll {
  display: flex; align-items: center;
  font-family: 'JetBrains Mono', ui-monospace, 'Courier New', monospace;
  font-size: 14px; font-weight: 400; letter-spacing: -.03em; line-height: 1; min-width: 0;
}
.enc-seg {
  display: inline-flex; align-items: center; padding: 2px 6px; border-radius: 4px;
  text-decoration: none; white-space: nowrap; line-height: 1.3; flex: none;
}
.enc-path .sl { color: var(--t-faint); padding: 0 1px; user-select: none; flex: none; }

/* koren = brend — bez levog padding-a da „sajber/enciklopedija" sedi uz emblem.
   „sajber" = --t-hi (svetlo); „enciklopedija" (.w2) prigušen. */
.enc-root { color: var(--t-hi); padding-left: 0; }
.enc-root:hover { color: var(--t-hi); }
.enc-root .sl { color: var(--cat-pretnje-text); font-weight: 500; margin: 0 .05em; padding: 0; }
.enc-root .w2 { color: var(--t-md); }

/* klikabilni segmenti pojma — boja SAMO na tekstu (bez podloge); lakši izgled.
   Hover dobije diskretnu podlogu kao nagoveštaj klika. */
.enc-seg.tint { font-weight: 400; background: none; }
.enc-seg.tint.cat-p { color: var(--cat-pretnje-text); }
.enc-seg.tint.cat-t { color: var(--cat-tehnike-text); }
.enc-seg.tint.cat-o { color: var(--cat-odbrane-text); }
a.enc-seg.tint:hover { background: color-mix(in srgb, currentColor 10%, transparent); }

/* terminal = „gde si sad" — blaga kategorijska podloga (bez bold-a; „gde si" čita iz podloge) */
.enc-seg.here { font-weight: 400; }
.enc-seg.here.cat-p { color: var(--cat-pretnje-text); background: var(--cat-pretnje-faint); }
.enc-seg.here.cat-t { color: var(--cat-tehnike-text); background: var(--cat-tehnike-faint); }
.enc-seg.here.cat-o { color: var(--cat-odbrane-text); background: var(--cat-odbrane-faint); }
/* neutralni terminal (pretraga — bez kategorije) */
.enc-seg.here:not(.cat-p):not(.cat-t):not(.cat-o) {
  color: var(--t-hi); background: color-mix(in srgb, var(--t-hi) 8%, transparent);
}

/* sidro (#…) — pod-segment pretrage unutar pojma */
.enc-seg.anch { color: var(--t-mute); background: none; font-weight: 500; }
.enc-seg.anch .hash { color: var(--cat-pretnje-text); }

/* brojači (sredina) — readout glas */
.enc-header .enc-meta {
  display: flex; align-items: center; gap: 13px;
  font-family: 'JetBrains Mono', ui-monospace, 'Courier New', monospace;
  font-size: 11.5px; color: var(--eh-mute);
}
.enc-header .enc-meta .sep { width: 1px; height: 14px; background: var(--eh-line-strong); }
.enc-header .enc-meta .counts {
  font-variant-numeric: tabular-nums;
}
.enc-header .enc-meta .counts b    { color: var(--eh-hi); font-weight: 600; }
.enc-header .enc-meta .counts .lbl { color: var(--eh-faint); }
.enc-header .enc-meta .counts .s   { color: var(--eh-faint); margin: 0 1px; }
.enc-header .enc-meta .counts .np  { color: var(--cat-pretnje-text); font-weight: 600; }
.enc-header .enc-meta .counts .nt  { color: var(--cat-tehnike-text); font-weight: 600; }
.enc-header .enc-meta .counts .no  { color: var(--cat-odbrane-text); font-weight: 600; }

/* alati (desno) */
.enc-header .enc-tools {
  margin-left: auto; display: flex; align-items: center; gap: 14px; flex: none;
}
.enc-header .enc-search {
  display: flex; align-items: center; gap: 9px;
  height: 36px; width: min(330px, 30vw);
  border: 1px solid var(--eh-line); border-radius: 4px;
  background: var(--eh-search);
  padding: 0 12px;
  color: var(--eh-mute);
  font-family: 'JetBrains Mono', ui-monospace, 'Courier New', monospace;
  font-size: 12.5px;
}
.enc-header .enc-search .ic { color: var(--eh-faint); }
.enc-header .enc-search .ph {
  flex: 1; min-width: 0;
  background: 0; border: 0; outline: 0;
  color: var(--eh-md);
  font: inherit;
}
.enc-header .enc-search .ph::placeholder { color: var(--eh-mute); }
.enc-header .enc-search .kbd {
  font-size: 10.5px;
  border: 1px solid var(--eh-line-strong); border-radius: 3px;
  padding: 1px 6px; color: var(--eh-faint);
}
.enc-header .enc-tools .sep { width: 1px; height: 16px; background: var(--eh-line-strong); }
.enc-header .enc-theme {
  display: inline-flex; align-items: center; gap: 7px;
  cursor: pointer; background: 0; border: 0; padding: 0;
  font-family: 'JetBrains Mono', ui-monospace, 'Courier New', monospace;
  font-size: 11.5px; color: var(--eh-mute);
}
.enc-header .enc-theme b { color: var(--eh-hi); font-weight: 600; text-transform: uppercase; }
.enc-header .enc-theme .sw {
  width: 9px; height: 9px; border-radius: 50%;
  background: var(--eh-hi);
  box-shadow: 0 0 0 1px var(--eh-line-strong);
}
.enc-header .enc-theme-txt { display: inline-flex; align-items: center; gap: 7px; }
.enc-header .enc-theme-ic { display: none; flex: none; color: var(--eh-md); }
.enc-header .enc-theme:hover .enc-theme-ic { color: var(--eh-hi); }

/* Responsive: ≤720 skrij search (ostaje brend + brojači + tema) */
@media (max-width: 720px) {
  .enc-header .enc-row { padding: 0 14px; gap: 7px; }
  .enc-header .enc-search { display: none; }
  /* „sajber/enciklopedija" = veličina slova „crvena/pilula" iz glavnog hedera (14px) */
  .enc-header .enc-logo { font-size: 14px; }
  /* Skupi emblem + brojače da theme toggle stane u red (≤375). */
  .enc-header .enc-brand { gap: 8px; }
  .enc-header .enc-emblem { width: 22px; }

  /* Putanja: na telefonu nema mesta za ceo red → horizontalni svajp.
     .enc-brand postaje skupljiv (flex:1, min-width:0) da scroll-kontejner
     dobije ograničenu širinu i da putanja zaista kliza umesto da prelije red. */
  .enc-header .enc-brand { flex: 1 1 auto; min-width: 0; }
  .enc-header .enc-path { position: relative; flex: 1 1 auto; min-width: 0; }
  .enc-header .enc-path-scroll {
    overflow-x: auto; scroll-behavior: smooth; -webkit-overflow-scrolling: touch;
    scrollbar-width: none;   /* veličina je 14px iz baznog pravila — ista kao desktop */
  }
  .enc-header .enc-path-scroll::-webkit-scrollbar { display: none; }
  /* fade ivice — nagoveštaj da putanja klizi (gase se na samom kraju/početku) */
  .enc-header .enc-path::before,
  .enc-header .enc-path::after {
    content: ""; position: absolute; top: 0; bottom: 0; width: 22px;
    pointer-events: none; z-index: 2; transition: opacity .2s;
  }
  .enc-header .enc-path::before { left: 0;  background: linear-gradient(90deg, var(--eh-bg), transparent); }
  .enc-header .enc-path::after  { right: 0; background: linear-gradient(270deg, var(--eh-bg), transparent); }
  .enc-header .enc-path[data-at-start]::before { opacity: 0; }
  .enc-header .enc-path[data-at-end]::after   { opacity: 0; }
  .enc-header .enc-tools .sep { display: none; }
  /* Brojači (163 · 75/46/42) se sele na seg-tabove — Pretnje/Tehnike/Odbrane
     već nose 75/46/42, pa header na telefonu = brend + tema, bez tesnobe širine. */
  .enc-header .enc-meta { display: none; }
  /* Tema: samo ikona sunca (štedi prostor) */
  .enc-header .enc-theme-txt { display: none; }
  .enc-header .enc-theme-ic { display: block; }
  .enc-header .enc-theme { padding: 7px; margin: -7px -4px -7px 0; }
}

/* Main je flex container koji drži .enc zonu. Nosi i temsku pozadinu
   sadržaja (var(--bg)) — body je fiksno #0f0f0d zbog notch pojasa (S85). */
body.page-enciklopedija > main {
  flex: 1;
  min-height: 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--bg);
}

/* Mini footer — override fixed → flex:none (V8 je bio fixed). */
body.page-enciklopedija > .enc-ftr {
  position: static !important;
  flex: none;
  z-index: auto;
}

/* ============================================================
   .enc — zona između header-a i footera, drži unutrašnju podelu.
   Svaka stranica je njena varijanta sa svojom strukturom.
   ============================================================ */
.enc {
  flex: 1;
  min-height: 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* Reset i osnove samo unutar enc subtree-a + glavnih members-a */
.enc *, .enc *::before, .enc *::after { box-sizing: border-box; }
.enc a { color: inherit; text-decoration: none; }
.enc a.lnk { color: var(--t-hi); border-bottom: 1px solid var(--line-strong); }
.enc a.lnk:hover { color: var(--brand-text); border-bottom-color: var(--brand); }
.enc button { font: inherit; cursor: pointer; border: 0; background: 0; color: inherit; }
.enc img, .enc svg { display: block; max-width: 100%; }
.enc .mono { font-family: var(--font-mono); font-feature-settings: 'zero' 1; }
.enc ::selection { background: var(--brand-faint); color: var(--t-hi); }

/* Suptilan scrollbar na zonama */
.enc .scroll { scrollbar-width: thin; scrollbar-color: var(--line-strong) transparent; }
.enc .scroll::-webkit-scrollbar { width: 10px; height: 10px; }
.enc .scroll::-webkit-scrollbar-thumb { background: var(--line-strong); border-radius: 99px; border: 3px solid var(--bg); }
.enc .scroll::-webkit-scrollbar-thumb:hover { background: var(--t-faint); }
.enc .scroll::-webkit-scrollbar-track { background: transparent; }

/* Octagonalni signal-marker (CP logo geometrija) */
.enc .signal {
  display: inline-block;
  width: 7px; height: 7px;
  background: var(--brand);
  clip-path: polygon(30% 0,70% 0,100% 30%,100% 70%,70% 100%,30% 100%,0 70%,0 30%);
  vertical-align: 1px; margin-right: 8px; flex: none;
}
.enc .kicker {
  font-family: var(--font-mono);
  font-size: 12px; letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--t-mute);
  display: inline-flex; align-items: center;
}

/* Theme toggle — sad živi u .bar, ne kao posebna meta traka */
.enc .enc-theme-toggle {
  border: 1px solid var(--line); border-radius: var(--radius);
  color: var(--t-lo); font-family: var(--font-mono);
  font-size: 11.5px; padding: 4px 10px; white-space: nowrap;
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--bg-paper);
  transition: border-color .15s, color .15s, background .15s;
}
.enc .enc-theme-toggle:hover { color: var(--t-hi); border-color: var(--line-strong); }
.enc .enc-theme-toggle .lbl { color: var(--t-hi); }

/* ============================================================
   FIKSNA POD-TRAKA (.bar) — intro / naslov / crumbs
   ============================================================ */
.enc .bar {
  flex: none;
  padding: 12px var(--pad);
  border-bottom: 1px solid var(--line);
  background: var(--bg);
}
.enc .bar-row {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px;
}

/* ============================================================
   SEGMENTED — čvrsta navigacija (mobilni primarno)
   ============================================================ */
.enc .seg {
  flex: none;
  display: flex; gap: 7px;
  padding: 10px var(--pad);
  border-bottom: 1px solid var(--line);
  background: var(--bg);
  overflow-x: auto;
  scrollbar-width: none;
}
.enc .seg::-webkit-scrollbar { display: none; }
.enc .seg button {
  flex: 1 0 auto; white-space: nowrap;
  padding: 9px 12px;
  border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--bg-paper);
  font-size: 13.5px; color: var(--t-lo);
  display: inline-flex; align-items: center; gap: 7px; justify-content: center;
  transition: border-color .14s, color .14s, background .14s;
  -webkit-tap-highlight-color: transparent;   /* bez sivog bleska pri dodiru */
}
.enc .seg button .c { font-family: var(--font-mono); font-size: 11.5px; color: var(--t-faint); }
.enc .seg button .mk { width: 8px; height: 8px; border-radius: 1px; flex: none; }
.enc .seg button .mk.t-pretnje { background: var(--cat-pretnje); }
.enc .seg button .mk.t-tehnike { background: var(--cat-tehnike); }
.enc .seg button .mk.t-odbrane { background: var(--cat-odbrane); }
.enc .seg button.on { color: var(--t-hi); background: var(--bg-card); font-weight: 500; border-color: var(--line-strong); }
.enc .seg button.on .c { color: var(--t-mute); }
.enc .seg button.on.t-pretnje { border-color: var(--cat-pretnje); }
.enc .seg button.on.t-tehnike { border-color: var(--cat-tehnike); }
.enc .seg button.on.t-odbrane { border-color: var(--cat-odbrane); }
/* „Pojam" tab (nema t-kategoriju) na stranici pojma: aktivni outline u boji
   kategorije samog pojma (--cat sa .enc-term[data-cat]); rel tabovi nose svoju. */
.enc-term .seg button.on { border-color: var(--cat); }

/* ============================================================
   HUB · sklopiva mobilna pretraga — krug-lupa na desnom kraju seg reda
   koji se VEŠTOM animacijom (širina) širi PREKO kategorija u puno polje;
   iksić ga vraća u krug. Krug je APSOLUTNI (van flex toka), pa kategorije
   drže svoj red ispod njega; seg rezerviše desni rub za krug.
   ============================================================ */
.enc-hub .seg { gap: 6px; position: relative; padding-right: calc(var(--pad) + 48px); }
.enc-hub .seg > button {
  flex: 1 1 auto; min-width: 0; min-height: 40px;
  padding: 0 10px; gap: 6px; font-size: 13px;
}
.enc-hub .seg > button .c { font-size: 11px; }

.enc-hub .seg-search {
  position: absolute; top: 50%; right: var(--pad); transform: translateY(-50%);
  z-index: 3;
  display: flex; align-items: center;
  width: 40px; height: 40px; overflow: hidden;
  border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--bg-paper);
  transition: width .34s cubic-bezier(.4,0,.2,1), border-color .2s, background .2s;
}
.enc-hub .seg-search > button {
  flex: none; border: 0; background: none; border-radius: 0; padding: 0;
  display: inline-flex; align-items: center; justify-content: center; color: var(--t-lo);
}
.enc-hub .seg-search .seg-search-ic { width: 38px; height: 38px; font-family: var(--font-mono); font-size: 17px; line-height: 1; }
.enc-hub .seg-search .seg-search-ic:hover { color: var(--t-hi); }
.enc-hub .seg-search .seg-search-in {
  flex: 1; min-width: 0; width: 0;
  background: none; border: 0; outline: 0; padding: 0;
  color: var(--t-hi); font: inherit; font-size: 15px;
  opacity: 0; transition: opacity .18s;
}
.enc-hub .seg-search .seg-search-in::placeholder { color: var(--t-mute); }
.enc-hub .seg-search .seg-search-in::-webkit-search-cancel-button { -webkit-appearance: none; }
.enc-hub .seg-search .seg-search-x { width: 36px; height: 38px; font-size: 13px; color: var(--t-mute); display: none; }
.enc-hub .seg-search .seg-search-x:hover { color: var(--t-hi); }

/* OTVORENO — krug naraste preko kategorija u puno polje (pill) */
.enc-hub[data-msearch="open"] .seg-search { width: calc(100% - 2 * var(--pad)); border-color: var(--line-strong); }
.enc-hub[data-msearch="open"] .seg-search .seg-search-in { opacity: 1; transition-delay: .12s; }
.enc-hub[data-msearch="open"] .seg-search .seg-search-x { display: inline-flex; }

@media (prefers-reduced-motion: reduce) {
  .enc-hub .seg-search { transition: none; }
}

/* ============================================================
   PAGER — horizontalni swipe sa peek-om (mobilni)
   Svaki panel skroluje vertikalno U SEBI.
   Desktop overrides ispod (1080px) raspakuju u block/grid.
   ============================================================ */
.enc .pager {
  flex: 1; min-height: 0; min-width: 0;
  display: flex; gap: calc(var(--pad) * 2);   /* dovoljno da susedni panel padne van ekrana — bez peek-a */
  overflow-x: auto; overflow-y: hidden;
  scroll-snap-type: x mandatory; scroll-behavior: smooth;
  padding: 14px var(--pad) 14px;
  scrollbar-width: none;
  overscroll-behavior-x: contain;
}
.enc .pager::-webkit-scrollbar { display: none; }

.enc .panel {
  flex: 0 0 100%;                   /* puna širina — bez peek-a (poziciju nosi indikator tačaka) */
  scroll-snap-align: center;
  min-height: 0; min-width: 0;
  overflow-y: auto; overflow-x: hidden;
  display: flex; flex-direction: column;
  border: 1px solid var(--line); border-radius: 6px;
  background: var(--bg-paper);
  position: relative;
}
.enc .panel-pad { padding: 16px 15px 22px; }

.enc .panel-head {
  position: sticky; top: 0; z-index: 2;
  padding: 13px 15px;
  background: color-mix(in srgb, var(--bg-paper) 94%, transparent);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  border-bottom: 1px solid var(--line);
  display: flex; align-items: baseline; justify-content: space-between; gap: 10px;
}
.enc .panel-head h2 {
  margin: 0; font-size: 15px; font-weight: 600; letter-spacing: -.01em;
  display: flex; align-items: center; gap: 9px;
}
.enc .panel-head h2 .mk { width: 9px; height: 9px; border-radius: 1px; }
.enc .panel-head h2 .mk.t-pretnje { background: var(--cat-pretnje); }
.enc .panel-head h2 .mk.t-tehnike { background: var(--cat-tehnike); }
.enc .panel-head h2 .mk.t-odbrane { background: var(--cat-odbrane); }
.enc .panel-head .cnt { font-family: var(--font-mono); font-size: 11.5px; color: var(--t-mute); white-space: nowrap; }
.enc .panel-head .note { font-size: 12px; color: var(--t-lo); font-weight: 400; margin-top: 2px; }
.enc .panel[data-cat="pretnje"] { border-top: 3px solid var(--cat-pretnje); }
.enc .panel[data-cat="tehnike"] { border-top: 3px solid var(--cat-tehnike); }
.enc .panel[data-cat="odbrane"] { border-top: 3px solid var(--cat-odbrane); }

/* „Sve" izmešana lista — samo desktop hub (vidi @1080). Na mobilnom ostaje
   3-panel swipe, pa je ovde sakrivena. */
.enc .panel-all { display: none; }

/* Slim hub-bar (logo · brojači · sort) — zamenjuje enc-header na desktop hub-u.
   Bazno sakriven; mobilni i dalje koristi enc-header (vidi @1080). */
.enc-hub .hub-bar { display: none; }

/* Live-filter: sakrivene pločice + prazno stanje */
.enc .card.is-hidden { display: none; }
.enc .hub-empty { display: none; }
.enc .hub-empty:not([hidden]) {
  padding: 40px 4px; display: flex; flex-direction: column; gap: 6px;
}
.enc .hub-empty .big { font-size: 16px; color: var(--t-hi); }
.enc .hub-empty .lnk-hint { font-size: 13px; color: var(--t-mute); }
.enc .hub-empty kbd, .enc .rail-hint kbd {
  font-family: var(--font-mono); font-size: 11px; padding: 1px 5px;
  border: 1px solid var(--line-strong); border-radius: 3px; color: var(--t-md);
}

/* Rail pretraga (desktop) */
.enc .rail-search {
  display: flex; align-items: center; gap: 8px;
  background: var(--bg-card); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 8px 10px;
}
.enc .rail-search .ic { color: var(--t-faint); font-size: 14px; }
.enc .rail-search .ph {
  flex: 1; min-width: 0; background: none; border: none; outline: none;
  color: var(--t-hi); font-size: 13px; font-family: inherit;
}
.enc .rail-search .ph::placeholder { color: var(--t-mute); }
.enc .rail-search .ph::-webkit-search-cancel-button { -webkit-appearance: none; }
.enc .rail-hint { margin: 8px 2px 0; font-size: 11.5px; line-height: 1.5; color: var(--t-faint); }
.enc .filters-foot { margin-top: auto; padding-top: 20px; }

/* Brojači u rail-u zadržavaju kategorijske boje (ne sive) */
.enc .type-list li.all     a .cnt { color: var(--t-hi); }
.enc .type-list li.pretnje a .cnt { color: var(--cat-pretnje-text); }
.enc .type-list li.tehnike a .cnt { color: var(--cat-tehnike-text); }
.enc .type-list li.odbrane a .cnt { color: var(--cat-odbrane-text); }

/* Mali swipe trag ispod pagera (mobilni) */
.enc .swipe-hint {
  flex: none;
  display: flex; justify-content: center; gap: 5px;
  padding: 0 0 8px;
}
.enc .swipe-hint i {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--line-strong);
  transition: background .2s, width .2s;
}
/* Aktivna tačka = boja glavnog sadržaja konteksta (--cat na pojmu/kompozitu).
   Hub je izuzetak: tačke nose boju svoje kategorije (:nth-child niže pregaze ovo). */
.enc .swipe-hint i.on { background: var(--cat, var(--brand)); width: 18px; border-radius: 99px; }

/* Hub: tačke nose boju SVOJE kategorije (crvena / žuta / plava po redu panela).
   Neaktivne prigušene, aktivna puna + izdužena (pill iz pravila .on gore). */
.enc-hub .swipe-hint i { opacity: .4; transition: opacity .2s, width .2s; }
.enc-hub .swipe-hint i.on { opacity: 1; }

/* Pojam: SVE tačke u boji kategorije pojma (jedan term = jedna boja), aktivna
   puna, ostale prigušene — indikator je dosledno u boji glavnog sadržaja (kao hub). */
.enc-term .swipe-hint i { background: var(--cat); opacity: .35; transition: opacity .2s, width .2s; }
.enc-term .swipe-hint i.on { opacity: 1; }
.enc-hub .swipe-hint i:nth-child(1) { background: var(--cat-pretnje); }
.enc-hub .swipe-hint i:nth-child(2) { background: var(--cat-tehnike); }
.enc-hub .swipe-hint i:nth-child(3) { background: var(--cat-odbrane); }

/* ============================================================
   SEARCH FIELD (deljen)
   ============================================================ */
.enc .search-shell {
  border: 1px solid var(--line); background: var(--bg-paper);
  border-radius: var(--radius);
  display: grid; grid-template-columns: auto 1fr auto;
  align-items: center; height: 46px;
  transition: border-color .15s;
}
.enc .search-shell:focus-within { border-color: var(--t-hi); }
.enc .search-shell .prompt { padding-left: 14px; color: var(--t-mute); font-family: var(--font-mono); font-size: 15px; }
.enc .search-shell input {
  background: transparent; border: none; outline: none;
  height: 100%; padding: 0 12px; width: 100%;
  font-family: var(--font-sans); font-size: 15px; color: var(--t-hi);
}
.enc .search-shell input::placeholder { color: var(--t-mute); }
.enc .search-shell .kbd {
  margin-right: 12px; padding: 3px 8px;
  border: 1px solid var(--line); border-radius: 3px;
  font-family: var(--font-mono); font-size: 11px; color: var(--t-mute);
}

/* ============================================================
   HUB
   mobilni: bar(title+tag+toggle / search) → seg → pager(3 kat.) → hint
   desktop: bar / [filters rail | items-region]
   ============================================================ */
/* (Staro hub-bar/.kh-text pravilo uklonjeno — novi slim hub-bar je desktop-only,
   stilizovan u @media ≥1080; bazno je display:none gore.) */
.enc .hub-title {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px;
}
.enc .hub-title h1 { font-size: 19px; font-weight: 600; letter-spacing: -.01em; margin: 0; }
.enc .hub-title .meta-right {
  display: inline-flex; align-items: center; gap: 10px;
}
.enc .hub-title .tag { font-family: var(--font-mono); font-size: 11.5px; color: var(--t-mute); white-space: nowrap; }

/* Filter rail — sakriven na mobilnom, vidljiv na desktopu */
.enc .filters { display: none; }
.enc .filters h4 {
  font-family: var(--font-mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: 0.08em; color: var(--t-mute);
  margin: 0 0 8px; font-weight: 500;
  padding-bottom: 8px; border-bottom: 1px solid var(--line);
}
.enc .filters-group + .filters-group { margin-top: 24px; }
.enc .type-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 2px; }
.enc .type-list li a {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  width: 100%; padding: 8px 10px 8px 14px;
  font-size: 14.5px; color: var(--t-md);
  border-left: 2px solid transparent; cursor: pointer;
}
.enc .type-list li a .lhs { display: inline-flex; align-items: center; gap: 9px; }
.enc .type-list li a .mk { width: 8px; height: 8px; border-radius: 1px; }
.enc .type-list li a .mk.t-pretnje { background: var(--cat-pretnje); }
.enc .type-list li a .mk.t-tehnike { background: var(--cat-tehnike); }
.enc .type-list li a .mk.t-odbrane { background: var(--cat-odbrane); }
.enc .type-list li a .cnt { font-family: var(--font-mono); font-size: 12px; color: var(--t-mute); }
.enc .type-list li a:hover { background: var(--bg-card); }
.enc .type-list li.on a { background: var(--bg-card); color: var(--t-hi); font-weight: 500; }
.enc .type-list li.on.pretnje a { border-left-color: var(--cat-pretnje); }
.enc .type-list li.on.tehnike a { border-left-color: var(--cat-tehnike); }
.enc .type-list li.on.odbrane a { border-left-color: var(--cat-odbrane); }
.enc .type-list li.on.all a { border-left-color: var(--t-hi); }
.enc .class-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 2px; }
.enc .class-list li a {
  display: flex; justify-content: space-between; gap: 8px;
  padding: 5px 10px 5px 14px;
  font-family: var(--font-mono); font-size: 12.5px; color: var(--t-lo); cursor: pointer;
}
.enc .class-list li a:hover { color: var(--t-hi); }
.enc .class-list li a .cnt { color: var(--t-faint); }
.enc .class-list li.on a { color: var(--t-hi); }

/* GRID kartica — PUNA širina (auto-fill na desktopu) */
.enc .grid { display: grid; grid-template-columns: 1fr; gap: 13px; }
.enc .card {
  display: grid; grid-template-rows: auto auto 1fr auto; gap: 9px;
  padding: 16px 16px 13px;
  background: var(--bg-paper); border: 1px solid var(--line);
  border-radius: var(--radius); border-left-width: 3px;
  transition: border-color .15s, background .15s; min-width: 0;
}
.enc .card:hover { border-color: var(--line-strong); background: var(--bg-card); }
.enc .card.t-pretnje { border-left-color: var(--cat-pretnje); }
.enc .card.t-tehnike { border-left-color: var(--cat-tehnike); }
.enc .card.t-odbrane { border-left-color: var(--cat-odbrane); }
.enc .card .meta-row {
  /* align-items: flex-start da badge ostane uz vrh prvog reda .no kad .no
     uvek zauzima 2 reda. Ujednačava vertikalnu poziciju naslova kartica. */
  display: flex; justify-content: space-between; align-items: flex-start; gap: 8px;
  font-family: var(--font-mono); font-size: 10.5px; color: var(--t-mute);
  letter-spacing: 0.04em; text-transform: uppercase;
}
.enc .card .meta-row .no {
  display: flex; flex-direction: column; align-items: flex-end;
  color: var(--t-faint); text-align: right; line-height: 1.25;
  white-space: nowrap;
}
.enc .card .meta-row .no .num { color: var(--t-faint); }
.enc .card .meta-row .no .cls { color: var(--t-mute); }
.enc .badge {
  font-family: var(--font-mono); font-size: 10px; padding: 3px 7px;
  border: 1px solid currentColor; letter-spacing: 0.06em; text-transform: uppercase;
  border-radius: var(--radius); white-space: nowrap;
}
.enc .badge.t-pretnje { color: var(--cat-pretnje-text); }
.enc .badge.t-tehnike { color: var(--cat-tehnike-text); }
.enc .badge.t-odbrane { color: var(--cat-odbrane-text); }
.enc .card h3 { font-size: 18px; font-weight: 600; letter-spacing: -.015em; line-height: 1.25; margin: 0; color: var(--t-hi); }
/* Engleski original na kartici — tiha mono labela ispod naziva (isti glas kao
   na pojmu: prefiks „EN", neutralna boja, NE pozajmljuje boju kategorije —
   ta je rezervisana za signal: bedž/pečat/veze). Renderuje se samo kad label
   ima „(English)" — vidi renderCard(): titleHtml() umesto e(). */
.enc .card h3 .t-en {
  display: block; margin-top: 4px;
  font-family: var(--font-mono); font-size: 11px; font-weight: 400;
  letter-spacing: .01em; color: var(--t-mute);
}
.enc .card h3 .t-en::before {
  content: "EN"; margin-right: 6px;
  font-size: 8.5px; letter-spacing: .12em; color: var(--t-faint);
}
.enc .card p {
  margin: 0; font-size: 14px; line-height: 1.5; color: var(--t-lo);
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.enc .card .rel-foot {
  display: flex; gap: 14px; padding-top: 9px;
  border-top: 1px dashed var(--line-soft);
  font-family: var(--font-mono); font-size: 11.5px; color: var(--t-mute);
}
.enc .card .rel-foot .ar { color: var(--t-faint); margin-right: 3px; }

.enc .items-head {
  flex: none; display: flex; justify-content: space-between; align-items: baseline;
  flex-wrap: wrap; gap: 8px;
  padding-bottom: 11px; margin-bottom: 14px;
  border-bottom: 1px solid var(--line);
}
.enc .items-head h2 {
  font-family: var(--font-mono); font-size: 12.5px; letter-spacing: 0.02em;
  color: var(--t-md); font-weight: 600; margin: 0;
}
.enc .items-head h2 .dim { color: var(--t-mute); font-weight: 400; }
.enc .items-head .sort { display: flex; gap: 12px; font-family: var(--font-mono); font-size: 12px; color: var(--t-mute); }
.enc .items-head .sort a { padding: 0; color: var(--t-mute); }
.enc .items-head .sort a:hover { color: var(--t-hi); }
.enc .items-head .sort a.on { color: var(--t-hi); }

/* Empty state (no rezultata za filter / pretragu) */
.enc .search-empty {
  padding: 60px 0; text-align: center; color: var(--t-mute);
  font-family: var(--font-mono); font-size: 13px; letter-spacing: 0.05em;
}
.enc .search-empty .big {
  display: block; font-size: 17px; color: var(--t-md);
  margin-bottom: 8px; letter-spacing: 0; font-family: var(--font-sans);
}

/* ============================================================
   POJAM
   mobilni: bar(crumbs) → term-title(badge+h1+lead) → seg → pager(doc + 2× rel)
   desktop: bar / title / [doc | rel1+rel2 split column]
   Generičko po POZICIJI: ista grid struktura za pretnju, tehniku, odbranu.
   ============================================================ */
.enc.enc-term .term-bar { flex: none; }
.enc.enc-term .term-bar .bar-row {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
}
.enc .crumbs {
  display: flex; flex-wrap: wrap; align-items: center; gap: 7px;
  font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.03em;
  color: var(--t-mute); text-transform: uppercase;
}
.enc .crumbs a { color: var(--t-lo); }
.enc .crumbs a:hover { color: var(--t-hi); }
.enc .crumbs .sep { color: var(--t-faint); }
.enc .crumbs .now { color: var(--t-hi); }

.enc .term-title {
  flex: none;
  padding: 16px var(--pad) 15px;
  border-bottom: 1px solid var(--line);
  background: var(--bg);
}
.enc .term-title .badge-row {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  margin-bottom: 11px;
}
.enc .term-title .badge-row .no {
  font-family: var(--font-mono); font-size: 11px; color: var(--t-mute); letter-spacing: 0.04em;
}
.enc .term-title h1 { font-size: 28px; line-height: 1.08; letter-spacing: -0.02em; font-weight: 600; margin: 0; }
/* Naslov: srpski naziv pa engleski ORIGINAL kao tiha referentna labela u svom
   redu — mono, neutralna boja, prefiks „EN". NE pozajmljuje boju kategorije
   (to je signal sistema: bedž/pečat/veze), pa engleski ne „viče" niti liči na
   link. Isto za naslov pojma i oba kompozit naslova (jedan stil). */
.enc .term-title h1 .t-en,
.enc .kompozit-head h1 .t-en,
.enc .flow-center h2 .t-en {
  display: block; margin-top: 10px;
  font-family: var(--font-mono);
  font-size: 13px; font-weight: 400; letter-spacing: 0.01em;
  color: var(--t-lo);
}
.enc .term-title h1 .t-en::before,
.enc .kompozit-head h1 .t-en::before,
.enc .flow-center h2 .t-en::before {
  content: "EN"; margin-right: 8px;
  font-size: 9.5px; letter-spacing: 0.14em; color: var(--t-faint); vertical-align: 1px;
}
.enc .term-title .lead {
  font-size: 16px; line-height: 1.5; color: var(--t-md);
  margin: 10px 0 0; max-width: 60ch; text-wrap: pretty;
}
/* Definicija (lead) u skrolabilnom doc-u — vidljiva samo <1080 (mobilni/landscape),
   gde je term-title varijanta skrivena. Stoji iznad „Opis", skroluje sa sadržajem. */
.enc .doc-lead {
  display: none;
  font-size: 16px; line-height: 1.6; color: var(--t-md);
  margin: 0 0 22px; max-width: 68ch; text-wrap: pretty;
  padding-bottom: 18px; border-bottom: 1px solid var(--line);
}

/* Dokument-panel sadržaj */
.enc .doc-section { margin: 0 0 26px; }
.enc .doc-section:first-child { margin-top: 2px; }
.enc .doc-section h2 {
  font-family: var(--font-mono); font-size: 12px; text-transform: uppercase;
  letter-spacing: 0.1em; color: var(--t-mute); font-weight: 600;
  margin: 0 0 11px; padding-bottom: 8px; border-bottom: 1px solid var(--line);
}
.enc .doc-section p {
  font-size: 16px; line-height: 1.66; color: var(--t-md);
  margin: 0 0 12px; max-width: 68ch; text-wrap: pretty;
}
/* „Pokriva" / „Ne pokriva" podnaslovi: uz svoju listu (malo ispod), a „Ne pokriva"
   (dolazi posle Pokriva-liste) jasno odvojen od prethodnog bloka (više iznad). */
.enc .doc-section p.cov-h { margin: 18px 0 8px; }
.enc .doc-section ul.docs + p.cov-h { margin-top: 26px; }
.enc .doc-section ul.docs { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 12px; }
.enc .doc-section ul.docs li {
  font-size: 15px; color: var(--t-md);
  padding-left: 22px; position: relative; line-height: 1.55;
}
.enc .doc-section ul.docs li::before {
  content: ""; position: absolute; left: 0; top: 12px;
  width: 9px; height: 1px; background: var(--brand);
}

.enc .tag-row { display: flex; flex-wrap: wrap; gap: 8px; }
.enc .tag {
  font-family: var(--font-mono); font-size: 12px; color: var(--t-lo);
  padding: 4px 10px; border: 1px solid var(--line);
  border-radius: var(--radius); background: var(--bg-paper);
}
.enc .tag:hover { color: var(--t-hi); border-color: var(--line-strong); }

.enc .actions {
  display: flex; gap: 8px; flex-wrap: wrap;
  margin: 24px 0 0; padding: 16px 0 0;
  border-top: 1px solid var(--line);
}
.enc .btn-line {
  font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.03em; text-transform: uppercase;
  border: 1px solid var(--line); color: var(--t-md);
  padding: 9px 13px; border-radius: var(--radius);
  display: inline-flex; align-items: center; gap: 8px;
}
.enc .btn-line:hover { color: var(--t-hi); border-color: var(--line-strong); background: var(--bg-card); }
.enc .btn-line .ar { color: var(--t-faint); }

.enc .prevnext {
  display: grid; grid-template-columns: 1fr; gap: 10px;
  margin: 26px 0 0; padding-top: 22px;
  border-top: 1px solid var(--line);
}
.enc .prevnext a {
  border: 1px solid var(--line); background: var(--bg-paper);
  border-radius: var(--radius); padding: 12px 15px;
  display: flex; flex-direction: column; gap: 4px;
}
.enc .prevnext a:hover { border-color: var(--line-strong); }
.enc .prevnext a .lbl {
  font-family: var(--font-mono); font-size: 11px; color: var(--t-mute);
  text-transform: uppercase; letter-spacing: 0.05em;
}
.enc .prevnext a .title { font-size: 15px; color: var(--t-hi); font-weight: 500; }

/* Relacioni panel (tehnike / odbrane / pretnje) — lista u sebi skroluje */
.enc .rel-intro {
  font-size: 13px; color: var(--t-lo);
  margin: 0 0 12px; line-height: 1.45;
}
.enc .rel-list { list-style: none; padding: 0; margin: 0; }
.enc .rel-list li a {
  display: grid; grid-template-columns: 11px 1fr auto;
  align-items: center; gap: 11px;
  padding: 12px 6px; font-size: 15px; color: var(--t-md);
  border-bottom: 1px dashed var(--line-soft); min-width: 0;
}
.enc .rel-list li:last-child a { border-bottom: none; }
.enc .rel-list li a:hover { color: var(--t-hi); background: var(--bg-card); }
.enc .rel-list li a .mk { width: 9px; height: 9px; border-radius: 1px; flex: none; }
.enc .rel-list li a .mk.t-pretnje { background: var(--cat-pretnje); }
.enc .rel-list li a .mk.t-tehnike { background: var(--cat-tehnike); }
.enc .rel-list li a .mk.t-odbrane { background: var(--cat-odbrane); }
.enc .rel-list li a .nm { min-width: 0; }
.enc .rel-list li a .nm small {
  display: block; font-size: 12px; color: var(--t-mute); margin-top: 1px;
}
.enc .rel-list li a .ar { color: var(--t-faint); font-family: var(--font-mono); font-size: 12px; }
.enc .rel-more {
  margin-top: 12px; padding-top: 12px;
  border-top: 1px dashed var(--line);
  font-family: var(--font-mono); font-size: 12px; color: var(--t-mute);
}
.enc .rel-more a { color: var(--t-lo); }
.enc .rel-more a:hover { color: var(--brand-text); }

/* ============================================================
   PATINA & KVALITET (V5.2)
   Kategorijski identitet (--cat) vodi sav vizuelni jezik stranice:
   naslov-band, pečat, numerisani naslovi, nit grafa u relacijama,
   pinovano podnožje. „Operativni dosije", ne klišei.
   ============================================================ */
.enc.enc-term { --cat: var(--brand); --cat-faint: var(--brand-faint); }   /* fallback */
.enc.enc-term[data-cat="pretnje"] { --cat: var(--cat-pretnje); --cat-faint: var(--cat-pretnje-faint); --cat-ink: var(--ink-on-pretnje); }
.enc.enc-term[data-cat="tehnike"] { --cat: var(--cat-tehnike); --cat-faint: var(--cat-tehnike-faint); --cat-ink: var(--ink-on-tehnike); }
.enc.enc-term[data-cat="odbrane"] { --cat: var(--cat-odbrane); --cat-faint: var(--cat-odbrane-faint); --cat-ink: var(--ink-on-odbrane); }

/* Naslov-band + vodeni žig (octagon signal) + materijalna dubina */
.enc .term-title {
  position: relative; overflow: hidden;
  border-top: 2px solid var(--cat);
  z-index: 2;
  background: linear-gradient(180deg, var(--cat-faint), transparent 64%);
  box-shadow: 0 12px 28px -22px rgba(0,0,0,.45);
}

/* Kategorijski PEČAT — „Refrakcija": tri ista heksagona, pomerena i stopljena u jednoj boji.
   Boja prati kategoriju preko data-cat → --cat. Apsolutno desno, iza teksta (z-index:0).
   Preseci se tamne preko mix-blend-mode multiply (light) / screen (dark). */
.enc .term-seal {
  position: absolute;
  right: 8px; top: 50%; transform: translateY(-50%);
  width: 150px; height: 150px;
  color: var(--cat);
  opacity: .9;
  pointer-events: none;
  z-index: 0;
}
.enc .term-seal .hx-blend { isolation: isolate; }
.enc .term-seal .hx-blend polygon { fill: currentColor; fill-opacity: .5; mix-blend-mode: multiply; }
html[data-theme="dark"] .enc .term-seal .hx-blend polygon { mix-blend-mode: screen; }
.enc .term-seal .seal-node { fill: currentColor; }
/* CP logo (watermark) — skriven u normalnom prikazu; pali se samo na izvoz/štampu */
.enc .term-seal-logo {
  display: none;
  position: absolute;
  right: 16px; top: 50%; transform: translateY(-50%);
  width: auto; height: 80px;
  object-fit: contain; object-position: center;
  pointer-events: none; z-index: 0;
}
@media (min-width: 760px) {
  .enc .term-seal { right: 14px; width: 184px; height: 184px; }
  .enc .term-seal-logo { right: 48px; height: 96px; }
}
.enc .term-title .badge-row,
.enc .term-title h1,
.enc .term-title .lead { position: relative; z-index: 1; }

/* Tinted badge bg po kategoriji */
.enc .badge.t-pretnje { background: var(--cat-pretnje-faint); }
.enc .badge.t-tehnike { background: var(--cat-tehnike-faint); }
.enc .badge.t-odbrane { background: var(--cat-odbrane-faint); }

/* Numerisane sekcije u kategorijskoj boji */
.enc .doc-scroll { counter-reset: sec; }
.enc.enc-term .doc-section { counter-increment: sec; }
.enc.enc-term .doc-section h2 { display: flex; align-items: center; gap: 11px; }
.enc.enc-term .doc-section h2::before {
  content: counter(sec, decimal-leading-zero);
  color: var(--cat); font-weight: 700;
  font-variant-numeric: tabular-nums; letter-spacing: 0;
}
.enc.enc-term .doc-section ul.docs li::before { background: var(--cat); }

/* Tagovi — finije, sa # u kategorijskoj boji */
.enc.enc-term .tag::before {
  content: "#"; color: var(--cat); opacity: .7; margin-right: 1px;
}
.enc.enc-term .tag:hover { border-color: var(--cat); color: var(--t-hi); }

/* PODNOŽJE DOKUMENTA — baza: u toku skrolovanja (panel-doc skroluje od .panel).
   Desktop @1080+ aktivira pin (panel-doc overflow:hidden + doc-scroll/foot flex). */
.enc .panel-doc { display: flex; flex-direction: column; }
.enc .doc-foot {
  border-top: 1px solid var(--line);
  background: linear-gradient(180deg, transparent, var(--cat-faint));
  box-shadow: 0 -12px 28px -22px rgba(0,0,0,.4);
  padding: 12px var(--pad) 13px;
  display: flex; flex-direction: column; gap: 10px;
  position: relative; z-index: 1;
}
.enc .foot-tags { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.enc .foot-lbl {
  font-family: var(--font-mono); font-size: 10px;
  text-transform: uppercase; letter-spacing: .07em;
  color: var(--t-mute); flex: none;
}
.enc .doc-foot .tag-row { gap: 6px; }
.enc .doc-foot .actions { margin: 0; padding: 0; border: none; }
.enc .foot-bar {
  display: flex; justify-content: space-between; align-items: center;
  gap: 12px; flex-wrap: wrap;
}
.enc .prevnext-mini { display: flex; gap: 6px; min-width: 0; }
.enc .prevnext-mini a {
  display: flex; align-items: center; gap: 7px;
  border: 1px solid var(--line); border-radius: var(--radius);
  padding: 7px 11px; font-size: 13px; color: var(--t-md);
  min-width: 0; max-width: 190px;
}
.enc .prevnext-mini a .ar { color: var(--cat); font-family: var(--font-mono); flex: none; }
.enc .prevnext-mini a .t {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-weight: 500;
}
.enc .prevnext-mini a:hover { border-color: var(--cat); color: var(--t-hi); }

/* RELACIJE — nit grafa (čvorovi povezani linijom); grupa nosi svoju kategoriju */
.enc .panel-rel { --rc: var(--cat); --rcf: var(--cat-faint); --rc-text: var(--cat-ink-text, var(--cat)); }
.enc .panel-rel[data-cat="pretnje"] { --rc: var(--cat-pretnje); --rcf: var(--cat-pretnje-faint); --rc-text: var(--cat-pretnje-text); }
.enc .panel-rel[data-cat="tehnike"] { --rc: var(--cat-tehnike); --rcf: var(--cat-tehnike-faint); --rc-text: var(--cat-tehnike-text); }
.enc .panel-rel[data-cat="odbrane"] { --rc: var(--cat-odbrane); --rcf: var(--cat-odbrane-faint); --rc-text: var(--cat-odbrane-text); }
.enc .panel-rel .rel-list { position: relative; }
.enc .panel-rel .rel-list::before {
  content: ""; position: absolute;
  left: 11px; top: 16px; bottom: 16px;
  width: 1px;
  background: linear-gradient(180deg, var(--rc), transparent);
  opacity: .4;
}
.enc .panel-rel .rel-list li a .mk { position: relative; z-index: 1; }
.enc .panel-rel .rel-list li a:hover { background: var(--rcf); color: var(--t-hi); }
.enc .panel-rel .rel-list li a:hover .ar { color: var(--rc-text, var(--rc)); }
.enc .panel-rel .panel-head .cnt { color: var(--rc-text, var(--rc)); }   /* --rc nosi i gradijent i hover, pa tekst ide na svoju varijantu (S130) */
.enc .panel-rel .rel-more a:hover { color: var(--rc); }

/* HUB kartice — materijalni hover lift */
.enc .card {
  transition: border-color .15s, background .15s, transform .14s, box-shadow .18s;
}
.enc .card:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px -24px rgba(0,0,0,.55);
}
.enc .card.t-pretnje .badge { background: var(--cat-pretnje-faint); }
.enc .card.t-tehnike .badge { background: var(--cat-tehnike-faint); }
.enc .card.t-odbrane .badge { background: var(--cat-odbrane-faint); }

/* ============================================================
   PRETRAGA
   bar (crumbs + search-shell + stats + toggle) / results-region (scroll)
   ============================================================ */
/* Search bar: kh-text wrapper levo (crumbs + search + stats), emblem desno (tablet+). */
.enc.enc-search .bar { display: flex; flex-direction: row; align-items: center; justify-content: space-between; gap: 28px; }
.enc.enc-search .bar > .kh-text { display: flex; flex-direction: column; gap: 11px; flex: 1; min-width: 0; }
.enc .search-stats {
  display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px;
  font-family: var(--font-mono); font-size: 12px; color: var(--t-mute);
  letter-spacing: 0.03em;
}
.enc .search-stats b { color: var(--t-hi); font-weight: 500; }

.enc .results-region {
  flex: 1; min-height: 0; min-width: 0;
  overflow-y: auto;
  padding: 18px var(--pad) 26px;
}
.enc .result-section { margin-bottom: 30px; }
.enc .result-section > header {
  display: flex; align-items: baseline; gap: 12px;
  margin: 0 0 4px; padding-bottom: 9px;
  border-bottom: 1px solid var(--line);
  position: sticky; top: -18px;
  background: var(--bg); z-index: 1;
}
.enc .result-section > header h2 {
  font-family: var(--font-mono); font-size: 12.5px; text-transform: uppercase;
  letter-spacing: 0.05em; font-weight: 500;
  margin: 0; padding-top: 6px;
}
.enc .result-section.t-pretnje > header h2 { color: var(--cat-pretnje-text); }
.enc .result-section.t-tehnike > header h2 { color: var(--cat-tehnike-text); }
.enc .result-section.t-odbrane > header h2 { color: var(--cat-odbrane-text); }
.enc .result-section.related > header h2 { color: var(--t-md); }
.enc .result-section > header .cnt { font-family: var(--font-mono); font-size: 12px; color: var(--t-mute); }
.enc .result-list { list-style: none; padding: 0; margin: 0; }
.enc .result-list li { border-bottom: 1px dashed var(--line-soft); }
.enc .result-list li:last-child { border-bottom: none; }
.enc .result-list li a {
  display: grid; grid-template-columns: 1fr auto;
  align-items: baseline; gap: 6px 16px;
  padding: 12px 4px;
}
.enc .result-list li a:hover { background: var(--bg-card); }
.enc .result-list .no { display: none; }
.enc .result-list .title-row { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.enc .result-list .title-row .t { font-size: 16px; font-weight: 500; color: var(--t-hi); }
.enc .result-list .title-row .t mark { background: var(--brand-faint); color: inherit; padding: 0 2px; }
/* Engleski original kao tiha mono labela u listi — neutralno, prefiks „EN"
   (ne pozajmljuje boju kategorije). */
.enc .result-list .title-row .t .t-en {
  display: block; margin-top: 3px;
  font-family: var(--font-mono); font-size: 11.5px; font-weight: 400;
  letter-spacing: .01em; color: var(--t-lo);
}
.enc .result-list .title-row .t .t-en::before {
  content: "EN"; margin-right: 6px;
  font-size: 9px; letter-spacing: .12em; color: var(--t-faint);
}
.enc .result-list .title-row .ex { font-size: 13.5px; color: var(--t-lo); line-height: 1.5; }
.enc .result-list .title-row .ex mark { background: var(--brand-faint); color: inherit; padding: 0 2px; }
.enc .result-list .right {
  font-family: var(--font-mono); font-size: 11px; color: var(--t-mute);
  text-transform: uppercase; letter-spacing: 0.03em; white-space: nowrap;
}

/* ============================================================
   KOMPOZIT v3.3 — 3 fiksne kolone, sadržaj svake skroluje u sebi.
   Mobile: kolone se slažu i ceo .kompozit-cols skroluje.
   Tablet+ (≥760): kolone side-by-side, svaka overflow-y:auto.
   ============================================================ */
.enc .kompozit-head {
  flex: none; padding: 14px var(--pad) 14px;
  border-bottom: 1px solid var(--line); background: var(--bg);
  display: flex; align-items: center; justify-content: space-between; gap: 28px;
}
.enc .kompozit-head h1 {
  font-size: 24px; line-height: 1.1; letter-spacing: -.02em;
  font-weight: 600; margin: 8px 0 0;
}
.enc .kompozit-head .lead {
  font-size: 16px; color: var(--t-md);
  margin: 10px 0 0; max-width: 60ch;
}
/* Akcije na dnu kompozita (Sačuvaj/Kopiraj/Podeli) — pinovana traka, kao doc-foot u članku */
.enc .kompozit-foot {
  flex: none;
  padding: 12px var(--pad);
  border-top: 1px solid var(--line);
  background: var(--bg);
}

/* Brand emblem (kh-emblem) — 3 prepletena heksagona (jedan po kategoriji).
   Koristi se na hub-u, pretrazi i kompozitu — gde stranica predstavlja sve tri kategorije.
   Preseci se stapaju mix-blend-mode unutar isolation:isolate grupe. */
.enc .kh-text { min-width: 0; }
.enc .kh-emblem { flex: none; display: none; width: 124px; height: auto; }
/* CP logo (watermark) za kompozit — skriven; pali se samo na izvoz/štampu */
.enc .kh-emblem-logo { flex: none; display: none; width: auto; height: 60px; object-fit: contain; }
.enc .he-blend { isolation: isolate; }
.enc .he-blend polygon { mix-blend-mode: multiply; fill-opacity: .55; stroke-width: 2; vector-effect: non-scaling-stroke; }
html[data-theme="dark"] .enc .he-blend polygon { mix-blend-mode: screen; }
.enc polygon.he-pretnje, .enc circle.he-pretnje { fill: var(--cat-pretnje); stroke: var(--cat-pretnje); }
.enc polygon.he-tehnike, .enc circle.he-tehnike { fill: var(--cat-tehnike); stroke: var(--cat-tehnike); }
.enc polygon.he-odbrane, .enc circle.he-odbrane { fill: var(--cat-odbrane); stroke: var(--cat-odbrane); }
.enc .he-nodes circle { stroke: none; }

/* Hub key — „Ključ u nizu": 3 heksagona položena u redu (crvena → žuta → plava).
   Kompaktan amblem za hub bar koji ujedno legenda redosleda kategorija. Multiply blend
   stapa susedne preseke (crvena+žuta = narandža, žuta+plava = prigušena zelena). */
.enc .hub-key { flex: none; display: none; width: 116px; height: auto; isolation: isolate; }
.enc .hub-key .hx-blend polygon { fill-opacity: .72; mix-blend-mode: multiply; }
html[data-theme="dark"] .enc .hub-key .hx-blend polygon { mix-blend-mode: screen; }
.enc .hub-key polygon.k-pretnje, .enc .hub-key circle.k-pretnje { fill: var(--cat-pretnje); }
.enc .hub-key polygon.k-tehnike, .enc .hub-key circle.k-tehnike { fill: var(--cat-tehnike); }
.enc .hub-key polygon.k-odbrane, .enc .hub-key circle.k-odbrane { fill: var(--cat-odbrane); }
.enc .hub-key .k-nodes circle { stroke: none; }

.enc .kompozit-cols {
  flex: 1; min-height: 0;
  overflow-y: auto;
  display: flex; flex-direction: column;
  gap: 13px;
  padding: 16px var(--pad) 24px;
}
.enc .kompozit-cols .flow-col,
.enc .kompozit-cols .flow-mid {
  display: flex; flex-direction: column;
  min-height: 0; padding: 0;
  /* baza (mobile, column flex): NE shrink-uj se ispod content-height
     — parent kompozit-cols skroluje vertikalno; @760+ se override-uje
     na flex:1 1 0 sa overflow-y:auto za nezavisne kolone. */
  flex: 0 0 auto;
  border: 1px solid var(--line);
  border-top: 3px solid var(--line);
  border-radius: var(--radius);
  background: var(--bg-paper);
}
/* Bočne kolone nose boju SVOJE kategorije; flow-mid border-top dolazi iz --cat
   (v3.4 kategorijski akcent — postavlja se preko data-cat na .enc-kompozit main). */
.enc .kompozit-cols .flow-col.c-tehnike { border-top-color: var(--cat-tehnike); }
.enc .kompozit-cols .flow-col.c-pretnja,
.enc .kompozit-cols .flow-col.c-pretnje { border-top-color: var(--cat-pretnje); }
.enc .kompozit-cols .flow-col.c-odbrane { border-top-color: var(--cat-odbrane); }

.enc .flow-col-head {
  position: sticky; top: 0; z-index: 2;
  padding: 12px 15px 11px;
  background: color-mix(in srgb, var(--bg-paper) 92%, transparent);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  border-bottom: 1px solid var(--line);
}
.enc .flow-col-head h3 {
  font-family: var(--font-mono); font-size: 12px;
  text-transform: uppercase; letter-spacing: 0.06em;
  margin: 0; font-weight: 600;
  display: flex; justify-content: space-between; align-items: baseline; gap: 8px;
}
.enc .flow-col.c-tehnike .flow-col-head h3 { color: var(--cat-tehnike-text); }
.enc .flow-col.c-pretnja .flow-col-head h3,
.enc .flow-col.c-pretnje .flow-col-head h3 { color: var(--cat-pretnje-text); }
.enc .flow-col.c-odbrane .flow-col-head h3 { color: var(--cat-odbrane-text); }
.enc .flow-col-head h3 .cnt { color: var(--t-faint); font-weight: 400; }
.enc .flow-col-body { padding: 12px 15px 14px; }
.enc .flow-col-body .col-note { font-size: 13px; color: var(--t-lo); margin: 0 0 10px; line-height: 1.45; }

.enc .kompozit-cols .flow-center {
  margin: 0; border: none; border-radius: 0;
  border-bottom: 1px solid var(--line);
  background: var(--bg-card);
  display: flex; flex-direction: column; gap: 6px;
  padding: 16px 15px;
}
.enc .flow-center .lbl {
  font-family: var(--font-mono); font-size: 11px;
  text-transform: uppercase; letter-spacing: 0.06em;
  color: var(--cat-pretnje-text);
}
.enc .flow-center.c-tehnike .lbl { color: var(--cat-tehnike-text); }
.enc .flow-center.c-odbrane .lbl { color: var(--cat-odbrane-text); }
.enc .flow-center h2 { font-size: 24px; font-weight: 600; margin: 0; letter-spacing: -.01em; }
.enc .flow-center p { margin: 6px 0 0; font-size: 14px; color: var(--t-md); line-height: 1.5; }

.enc .flow-map { padding: 13px 15px 16px; }
.enc .flow-map-head {
  font-family: var(--font-mono); font-size: 10.5px;
  text-transform: uppercase; letter-spacing: 0.06em;
  color: var(--t-mute);
  margin: 0 0 10px; line-height: 1.4;
}

.enc .flow-tabela {
  border: 1px solid var(--line);
  border-radius: var(--radius); overflow: hidden;
}
.enc .flow-mid .flow-tabela { margin: 0; }
.enc .flow-mid .flow-tabela .row {
  display: grid; grid-template-columns: 1fr;
  border-bottom: 1px solid var(--line);
}
.enc .flow-mid .flow-tabela .row:last-child { border-bottom: none; }
.enc .flow-mid .flow-tabela .cell {
  padding: 12px 14px;
  border-right: none;
  border-bottom: 1px dashed var(--line-soft);
}
.enc .flow-mid .flow-tabela .cell:last-child { border-bottom: none; }
.enc .flow-tabela .cell .ck {
  font-family: var(--font-mono); font-size: 10.5px;
  text-transform: uppercase; letter-spacing: 0.06em;
  color: var(--t-mute); display: block; margin-bottom: 4px;
}
.enc .flow-tabela .cell.tehnika .ck { color: var(--cat-tehnike-text); }
.enc .flow-tabela .cell.odbrana .ck { color: var(--cat-odbrane-text); }
.enc .flow-tabela .cell .nm { font-size: 15px; color: var(--t-hi); }

/* Tablet+ (≥760): 3 kolone side-by-side, svaka skroluje nezavisno */
@media (min-width: 760px) {
  .enc .kompozit-cols {
    flex-direction: row;
    overflow: hidden;
    gap: 14px; align-items: stretch;
    padding: 16px var(--pad) 18px;
  }
  .enc .kompozit-cols .flow-col,
  .enc .kompozit-cols .flow-mid {
    flex: 1 1 0;
    overflow-y: auto;
    min-height: 0;
  }
  .enc .kompozit-cols .flow-mid { flex: 1.12 1 0; }
  .enc .kh-emblem { display: block; }
  .enc .hub-key { display: block; }
}

/* ============================================================
   MINI FOOTER (enc-footer partial) — flex:none, ne fixed.
   Boje su eksplicitne jer je van .enc subtree-a (ne nasleđuje
   tokene osim ako CSS varijable na body cascade — ali zadržavamo
   eksplicitne hex-ove za jasnu separaciju od page bg-a).
   ============================================================ */
body.page-enciklopedija .enc-ftr {
  background: #ecebe7;
  border-top: 1px solid #c8c6c2;
  color: var(--t-lo);   /* bilo tvrdo #5a5a58 — u tamnoj temi je to svetla siva na tamnom futeru, 2.87 (S130) */
  font-family: 'JetBrains Mono', ui-monospace, 'Courier New', monospace;
  font-size: 11px;
  letter-spacing: 0.04em;
}
html[data-theme="dark"] body.page-enciklopedija .enc-ftr {
  background: #0a0a09;
  border-top-color: #2e2e2c;
  color: #a0a09e;
}
body.page-enciklopedija .enc-ftr-inner {
  padding: 10px var(--pad);
  display: flex; flex-direction: row;
  flex-wrap: wrap; gap: 8px 14px;
  align-items: center; justify-content: space-between;
}
body.page-enciklopedija .enc-ftr-l,
body.page-enciklopedija .enc-ftr-r {
  display: inline-flex; align-items: center;
  flex-wrap: wrap; gap: 10px;
}
body.page-enciklopedija .enc-ftr a {
  color: inherit; text-decoration: none;
  transition: color .12s;
}
body.page-enciklopedija .enc-ftr a:hover { color: #1a1a18; }
html[data-theme="dark"] body.page-enciklopedija .enc-ftr a:hover { color: #ece9e3; }
body.page-enciklopedija .enc-ftr .dot {
  width: 3px; height: 3px;
  background: #b8b6b3; border-radius: 50%;
  display: inline-block;
}
html[data-theme="dark"] body.page-enciklopedija .enc-ftr .dot { background: #3a3a37; }

/* Mobilni (≤767, gde se pali tabbar): kao /vesti/ — sakrij strip-footer,
   bottom tab bar ga zamenjuje; sadržaju daj prostor da ga traka ne pokrije. */
@media (max-width: 767px) {
  body.page-enciklopedija .enc-ftr { display: none; }
  body.page-enciklopedija > main { padding-bottom: calc(48px + env(safe-area-inset-bottom, 0px)); }
}

/* ============================================================
   KOMPOZIT v3.4 — kategorijski akcent centra + .flow-profile (tehnika/odbrana)
   .enc-kompozit[data-cat] postavlja --cat za main: border-top centra,
   .lbl boja, fp-k mono-caps key u kat. boji. Bočne kolone nose boju
   SVOJE kategorije (c-pretnje/c-tehnike/c-odbrane).
   ============================================================ */
.enc .enc-kompozit { --cat: var(--brand); }
.enc.enc-kompozit[data-cat="pretnje"] { --cat: var(--cat-pretnje); --cat-ink: var(--ink-on-pretnje); }
.enc.enc-kompozit[data-cat="tehnike"] { --cat: var(--cat-tehnike); --cat-ink: var(--ink-on-tehnike); }
.enc.enc-kompozit[data-cat="odbrane"] { --cat: var(--cat-odbrane); --cat-ink: var(--ink-on-odbrane); }
.enc .kompozit-cols .flow-mid { border-top-color: var(--cat); }
.enc .kompozit-cols .flow-center .lbl { color: var(--cat); }
.enc .kompozit-cols .flow-col.c-pretnje { border-top-color: var(--cat-pretnje); }
.enc .flow-col.c-pretnje .flow-col-head h3 { color: var(--cat-pretnje-text); }

/* PROFIL — isti vizuelni jezik kao mapa faza (mono-caps key u kat. boji, sans value) */
.enc .flow-profile { padding: 13px 15px 16px; }
.enc .flow-profile .flow-map-head { margin-bottom: 6px; }
.enc .fp-row {
  display: grid; grid-template-columns: 1fr; gap: 3px;
  padding: 10px 0;
  border-bottom: 1px dashed var(--line-soft);
}
.enc .fp-row:last-child { border-bottom: none; }
.enc .fp-k {
  font-family: var(--font-mono); font-size: 10.5px;
  text-transform: uppercase; letter-spacing: 0.05em;
  color: var(--cat);
}
.enc .fp-v { font-size: 14px; color: var(--t-hi); line-height: 1.45; }
.enc .fp-v .dim { color: var(--t-mute); }

/* Fallback rečenica (pretnja bez kuriranih phases) */
.enc .flow-note {
  padding: 14px 15px 16px;
  font-size: 14px; line-height: 1.55; color: var(--t-md);
  border-top: 1px dashed var(--line);
}
.enc .flow-note b { color: var(--t-hi); font-weight: 600; }
.enc .flow-note .nlbl {
  display: block;
  font-family: var(--font-mono); font-size: 10.5px;
  text-transform: uppercase; letter-spacing: 0.05em;
  color: var(--t-mute); margin-bottom: 6px;
}

/* ============================================================
   FIX 3.2 — uski mobilni (≤759px): pin podnožja je samo na
   desktopu. Na telefonu se lead u term-title sakriva da bi
   chrome bio tanji — definicija je već u „Pojam" panelu, izbegava
   se duplikat. Sve ostalo (panel-doc, doc-scroll, doc-foot) ostaje
   u toku, ceo .panel-doc skroluje (overflow-y:auto od .panel).
   ============================================================ */
@media (max-width: 759px) {
  /* Mobilni: breadcrumbs traka i URL putanja iz badge-reda su suvišni (jedu prostor) */
  .enc.enc-term .term-bar { display: none; }
  .enc .term-title .badge-row .no-path { display: none; }
  /* Kompozit: samo breadcrumbs traka se sklanja na mobilnom */
  .enc.enc-kompozit .bar { display: none; }
  /* Kompozit mobilni: lead opisuje levo/desno raspored (nevažeći kad su kolone složene) → sakrij;
     naslov se ne duplira — glava ostaje jedini naslov, centralna kartica zadržava labelu + definiciju. */
  .enc.enc-kompozit .kompozit-head .lead { display: none; }
  .enc.enc-kompozit .flow-center h2 { display: none; }
  /* Složene kolone skroluju zajedno → zaglavlja kolona NE lebde (sticky), skroluju sa sadržajem. */
  .enc.enc-kompozit .flow-col-head { position: static; backdrop-filter: none; -webkit-backdrop-filter: none; }
  /* Redosled na mobilnom: subjekt+opis (centar) ODMAH ispod naslova, pa dve kolone (Pretnje/Tehnike) ispod. */
  .enc.enc-kompozit .kompozit-cols .flow-mid { order: -1; }
}

/* ============================================================
   ≥ 760px — tablet
   Veći tekst, šire kartice u 2+ kolone, peek panela manji
   ============================================================ */
@media (min-width: 760px) {
  body.page-enciklopedija { font-size: 18px; }
  .enc .grid { grid-template-columns: repeat(auto-fill, minmax(258px, 1fr)); gap: 14px; }
  .enc .term-title h1 { font-size: 34px; }
  .enc .term-title .lead { font-size: 18px; }
  /* (v3.3) Kompozit: stara .flow grid 3-col + .flow-tabela 2-col uklonjene —
     novi .kompozit-cols sistem (vidi gore) rukuje raspored side-by-side. */
  .enc .result-list li a { grid-template-columns: 60px 1fr auto; }
  .enc .result-list .no {
    display: block; font-family: var(--font-mono);
    font-size: 12px; color: var(--t-faint);
  }
}

/* ============================================================
   ≥ 1080px — DESKTOP: pager se raspakuje, filter rail sticky
   ============================================================ */
@media (min-width: 1080px) {
  .enc .bar, .enc .term-title, .enc .seg {
    padding-left: var(--pad-d); padding-right: var(--pad-d);
  }

  /* Swipe elementi se gase na desktopu */
  .enc .seg, .enc .swipe-hint { display: none !important; }
  .enc-hub .seg-search { display: none !important; }   /* mobilna pretraga ne postoji na desktopu */

  /* ---- HUB ---- */
  /* Na hub-u enc-header (tamna traka preko cele širine) se gasi — zamenjuje ga
     slim .hub-bar unutar sadržaja. Mobilni i dalje koristi enc-header. */
  .page-enc-hub .enc-header { display: none; }

  .enc.enc-hub {
    display: grid;
    grid-template-columns: var(--rail-w) minmax(0, 1fr);
    grid-template-rows: auto 1fr;
    grid-template-areas:
      "bar    bar"
      "rail   items";
  }
  /* Slim hub-bar: logo + brojači levo, sort segment desno, crvena linija ispod */
  .enc.enc-hub .hub-bar {
    grid-area: bar;
    display: flex; align-items: center; justify-content: space-between; gap: 18px;
    height: 56px; box-sizing: border-box;   /* ista visina kao enc-header (54px red + border) — bez skoka */
    padding: 0 22px;                          /* isti levi rub kao enc-header */
    /* Simetrične ivice kao enc-header (1px gore + 1px dole) → brend se centrira na
       TAČAN centar trake, isto kao na stranici pojma. Gornja je providna (samo
       rezerviše 1px), donja crvena ostaje. Bez ovog, samo donja ivica je centrirala
       brend van centra → „sajber/enciklopedija" je skakao par px pri kliku na pojam. */
    border-top: 1px solid transparent;
    border-bottom: 1px solid var(--brand);
  }
  /* Levi deo hub-bara = enc-path partial (.enc-brand/.enc-emblem/.enc-path) —
     isti markup i CSS kao na svim stranicama; nema više zasebnih .hb-* path pravila. */
  .enc.enc-hub .hb-right { display: flex; align-items: center; gap: 14px; flex: none; }
  /* Divider između brojača i sorta u desnom klasteru. */
  .enc.enc-hub .hb-right .hb-sep { width: 1px; height: 16px; background: var(--line-strong); flex: none; }

  .enc.enc-hub .hb-counts { font-family: var(--font-mono); font-size: 11.5px; color: var(--t-mute); }
  .enc.enc-hub .hb-counts b { color: var(--t-hi); font-weight: 600; }
  .enc.enc-hub .hb-counts .s  { color: var(--t-faint); margin: 0 1px; }
  .enc.enc-hub .hb-counts .np { color: var(--cat-pretnje-text); font-weight: 600; }
  .enc.enc-hub .hb-counts .nt { color: var(--cat-tehnike-text); font-weight: 600; }
  .enc.enc-hub .hb-counts .no { color: var(--cat-odbrane-text); font-weight: 600; }
  .enc.enc-hub .hb-sort { display: flex; align-items: center; gap: 4px; flex: none; }
  .enc.enc-hub .hb-sort-lbl {
    font-family: var(--font-mono); font-size: 11px; text-transform: uppercase;
    letter-spacing: 0.08em; color: var(--t-faint); margin-right: 6px;
  }
  .enc.enc-hub .hb-sort .seg-btn {
    font-family: var(--font-mono); font-size: 12px; padding: 5px 11px;
    border: 1px solid var(--line); border-radius: var(--radius);
    color: var(--t-mute); text-decoration: none; white-space: nowrap;
  }
  .enc.enc-hub .hb-sort .seg-btn:hover { color: var(--t-hi); border-color: var(--line-strong); }
  .enc.enc-hub .hb-sort .seg-btn.on {
    background: var(--bg-card); color: var(--t-hi); border-color: var(--line-strong); font-weight: 500;
  }
  .enc.enc-hub .filters {
    display: flex; flex-direction: column;
    grid-area: rail;
    overflow-y: auto;
    padding: 20px var(--s5) 24px var(--pad-d);
    border-right: 1px solid var(--line);
  }
  .enc.enc-hub .pager {
    grid-area: items;
    display: block;
    overflow-y: auto; overflow-x: hidden;
    padding: 18px var(--pad-d) 28px;
  }
  .enc.enc-hub .pager .panel {
    all: unset;
    display: block;
  }
  .enc.enc-hub .panel-head {
    position: static; background: none;
    backdrop-filter: none; -webkit-backdrop-filter: none;
    border: none; padding: 0 0 11px;
    margin-top: 26px; border-bottom: 1px solid var(--line);
  }
  .enc.enc-hub .panel:first-of-type .panel-head { margin-top: 0; }
  .enc.enc-hub .panel-head h2 {
    font-size: 13px; font-family: var(--font-mono);
    text-transform: uppercase; letter-spacing: 0.05em;
    color: var(--t-md);
  }
  .enc.enc-hub .panel-head .note { display: none; }
  .enc.enc-hub .panel-pad { padding: 14px 0 0; }
  .enc.enc-hub .pager .panel { scroll-margin-top: 14px; }   /* Tip filter anchor scroll sleti na vrh sekcije */
  .enc.enc-hub .grid { grid-template-columns: repeat(auto-fill, minmax(248px, 1fr)); gap: 15px; }

  /* Filter sakrivanje (opcija (b) iz V5 spec) — kad je tip filter aktivan,
     sakri panele drugih tipova; aktivni panel postaje jedini, dobija margin-top:0
     na panel-head jer možda nije :first-of-type (npr. ?tip=odbrane). */
  .enc.enc-hub[data-active-tip="pretnje"] .pager > .panel:not([data-cat="pretnje"]),
  .enc.enc-hub[data-active-tip="tehnike"] .pager > .panel:not([data-cat="tehnike"]),
  .enc.enc-hub[data-active-tip="odbrane"] .pager > .panel:not([data-cat="odbrane"]) { display: none; }
  .enc.enc-hub[data-active-tip] .pager > .panel .panel-head { margin-top: 0; }

  /* „Sve" režim (bez tip-filtera): prikaži izmešanu listu, sakrij 3 tipska panela.
     Klik na tip postavlja data-active-tip → vraća se prikaz po tipu (gore). */
  .enc.enc-hub:not([data-active-tip]) .panel-all { display: block; }
  .enc.enc-hub:not([data-active-tip]) .pager > .panel { display: none; }

  /* ---- POJAM ----
     generičko: dve relacione zone po POZICIJI (rel1/rel2), pa
     isti shell radi za pretnju, tehniku i odbranu (samo druge kategorije).
     .panel-doc je 1, prvi .panel-rel je :nth-of-type(2), drugi :nth-of-type(3).
     FOKUS: dokument je centriran i sužen (max-width:--term-max), ne
     full-bleed — kratak sadržaj se ne rasteže preko celog ekrana, već
     dobija vizuelni fokus.
  */
  .enc.enc-term {
    display: grid;
    width: 100%;
    max-width: var(--term-max);
    margin-inline: auto;
    grid-template-columns: minmax(0, 1fr) var(--aside-w);
    grid-template-rows: auto auto 1fr 1fr;
    grid-template-areas:
      "bar    bar"
      "title  title"
      "doc    rel1"
      "doc    rel2";
    column-gap: 0;
  }
  .enc.enc-term .term-bar { grid-area: bar; }
  .enc.enc-term .term-title { grid-area: title; }
  .enc.enc-term .pager { display: contents; }
  .enc .panel-doc {
    grid-area: doc;
    overflow-y: auto;
    border: none; border-radius: 0; background: none;
  }
  /* PIN podnožja samo na desktopu — proza skroluje u sebi, doc-foot ostaje na dnu. */
  .enc .panel-doc { overflow: hidden; }
  .enc .panel-doc .doc-scroll { flex: 1; min-height: 0; overflow-y: auto; }
  .enc .panel-doc .doc-foot { flex: none; }
  .enc .panel-doc .panel-pad { padding: 24px var(--s6) 34px var(--pad-d); }
  .enc .panel-doc .panel-head { display: none; }
  /* Rail bez tinta — samo hairline divider; elegantnije i ne pravi poluprazne tinte kutije. */
  .enc .panel-rel {
    overflow-y: auto;
    border: none; border-radius: 0; border-top: none;
    background: none;
    border-left: 1px solid var(--line);
  }
  .enc.enc-term .pager > .panel-rel:nth-of-type(2) {
    grid-area: rel1;
    border-bottom: 1px solid var(--line);
  }
  .enc.enc-term .pager > .panel-rel:nth-of-type(3) { grid-area: rel2; }
  .enc .panel-rel .panel-head {
    position: sticky;
    background: color-mix(in srgb, var(--bg) 92%, transparent);
  }
  .enc .panel-rel .panel-pad { padding: 16px var(--s5) 22px; }
  .enc .doc-foot { padding-left: var(--pad-d); padding-right: var(--pad-d); }

  /* ---- PRETRAGA / KOMPOZIT — šira čitljiva kolona, centrirana ---- */
  .enc.enc-search .bar > *,
  .enc .results-region > * { max-width: 1100px; margin-left: auto; margin-right: auto; }
  .enc .results-region { padding: 22px var(--pad-d) 30px; }
  /* Kompozit v3.3 (≥1080): 3-kolone box dobija pad-d + max-width 1460 centered. */
  .enc .kompozit-cols { padding: 18px var(--pad-d) 20px; max-width: 1460px; margin-inline: auto; width: 100%; }
  /* Pinned kompozit-head: flex:none član .enc, sopstveni padding + max-width.
     Tekstualni blok levo (kh-text), emblem desno. Centriran kao kolone (1460px). */
  .enc.enc-kompozit .kompozit-head { padding: 18px var(--pad-d) 16px; max-width: 1460px; margin-inline: auto; width: 100%; }
  .enc.enc-kompozit .kompozit-head > .kh-text { max-width: 1100px; }
  .enc .kompozit-head h1 { font-size: 32px; }
  .enc .kh-emblem { display: block; width: 144px; }
  /* Foot akcije (Sačuvaj/Kopiraj/Podeli) prate centrirani sadržaj — poravnate
     ispod leve ivice kolona; traka (border/bg) ostaje puna širina. */
  .enc.enc-kompozit .kompozit-foot { padding-inline: 0; }
  .enc.enc-kompozit .kompozit-foot .foot-actions {
    max-width: 1460px; margin-inline: auto; width: 100%; padding-inline: var(--pad-d);
  }
}

/* Širi ekrani — hub dobija još kolona (auto-fill), pojam OSTAJE fokusiran/sužen (--term-max). */
@media (min-width: 1500px) {
  .enc.enc-hub .grid { gap: 16px; }
  body.page-enciklopedija { --rail-w: 280px; --aside-w: 380px; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .enc *, .enc *::before, .enc *::after {
    transition: none !important; animation: none !important;
    scroll-behavior: auto !important;
  }
}

/* ============================================================
   IZVOZ/ŠTAMPA · OKVIR — zaglavlje sa logom (tamna traka) + potpis.
   Skriveno na ekranu; prikazuje se SAMO u @media print (PDF) i
   .enc-capturing (PNG/JPG). Amblem je <img> koji enc-export.js puni
   rasterizovanim blend-amblemom (PNG) → bez fleke kroz html-to-image.
   ============================================================ */
.enc .enc-xport-head, .enc .enc-xport-foot { display: none; }
.enc .enc-xport-head {
  align-items: center; justify-content: center; gap: 13px;
  padding: 14px var(--pad-d);
  background: #171715;             /* uvek tamna traka (kao sekcijski heder; blend voli tamno) */
  border-bottom: 1px solid #2e2e2c;
}
.enc .enc-xport-head .xh-emblem { width: 46px; height: auto; flex: none; }
.enc .enc-xport-head .xh-word {
  font-family: var(--font-mono); font-weight: 600; font-size: 19px;
  letter-spacing: -.03em; line-height: 1; color: #ece9e3;
}
.enc .enc-xport-head .xh-word .sl { color: #c0392b; font-weight: 500; margin: 0 .05em; }
.enc .enc-xport-head .xh-word .w2 { color: #c8c5be; font-weight: 500; }
.enc .enc-xport-foot {
  padding: 13px var(--pad-d) 15px;
  border-top: 1px solid var(--line);
  font-family: var(--font-mono); font-size: 12px; letter-spacing: .08em;
  color: var(--t-mute); text-align: center;
}

/* ============================================================
   ŠTAMPA / „Sačuvaj kao PDF"
   App-shell (height:100dvh + overflow:hidden + unutrašnji scroll)
   bi posekao štampu na jedan ekran — ovde se raspakuje u normalan
   tok da ceo članak/kompozit uđe u PDF. Tema se na svetlu prebacuje
   iz JS-a (data-enc-print) pre štampe, pa svetli tokeni važe.
   ============================================================ */
@media print {
  html, body { height: auto !important; overflow: visible !important; background: #fff !important; }
  main#main { overflow: visible !important; height: auto !important; }

  /* Hrom van sadržaja se ne štampa */
  .hdr, .enc-ftr, .ftA, .enc-header,
  .enc .bar, .enc .term-bar, .enc .seg, .enc .swipe-hint,
  .enc .filters, .enc .hub-bar,
  .enc .actions, .enc .prevnext-mini, .enc .foot-actions, .enc .prevnext-foot, .enc .save-menu,
  .enc .kompozit-head .actions, .enc .kompozit-foot { display: none !important; }

  /* Logo ide u izvozno zaglavlje; CP logo i dekorativni pečat se NE štampaju. */
  .enc .term-seal, .enc .kh-emblem,
  .enc .term-seal-logo, .enc .kh-emblem-logo { display: none !important; }
  .enc .enc-xport-head { display: flex !important; }
  .enc .enc-xport-foot { display: block !important; }

  /* App-shell → normalan tok dokumenta */
  .enc, .enc.enc-term, .enc.enc-hub, .enc.enc-kompozit {
    display: block !important; height: auto !important; max-height: none !important; overflow: visible !important;
  }
  .enc .pager, .enc .panel, .enc .panel-doc, .enc .doc-scroll, .enc .doc-foot,
  .enc .panel-rel, .enc .panel-pad, .enc .scroll,
  .enc .kompozit-cols, .enc .flow-col, .enc .flow-mid {
    display: block !important; height: auto !important; max-height: none !important; overflow: visible !important;
  }

  /* Pojam: relacione zone idu ispod dokumenta (ne kao bočni rail) */
  .enc.enc-term .panel-rel { border-left: none !important; border-top: 1px solid #ddd; margin-top: 12px; }
  /* Dugi blokovi (relacije, kolone, proza) SMEJU da se prelome preko strana → samo
     male praznine, nikad cela prazna strana. Atomične ostaju pojedinačne stavke/redovi,
     a naslov sekcije se ne odvaja od svog sadržaja. */
  .enc .rel-list li, .enc .flow-tabela .row, .enc .fp-row, .enc .doc-section ul.docs li,
  .enc .flow-center, .enc .flow-note, .enc .flow-map-head, .enc .flow-profile .flow-map-head { break-inside: avoid; }
  .enc .panel-head, .enc .flow-col-head, .enc .doc-section h2,
  .enc .flow-center, .enc .flow-map-head { break-after: avoid; }

  /* Ravan dokument: bez boks-okvira panela; „Pojam" panel-head se ne štampa (suvišan);
     relaciona zaglavlja (Pretnje/Tehnike) ostaju kao naslovi sekcija; naslovni band bez ukrasa. */
  .enc .panel { border: none !important; background: none !important; border-radius: 0 !important; box-shadow: none !important; }
  .enc .panel-doc .panel-head { display: none !important; }
  .enc .panel-head { position: static !important; background: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
  .enc .term-title { background: none !important; box-shadow: none !important; }

  /* Kompozit: 3 kolone jedna ispod druge na papiru */
  .enc .kompozit-cols { padding: 0 !important; max-width: none !important; }
  .enc .flow-col, .enc .flow-mid { border: none !important; margin-bottom: 14px; }

  /* Boje kategorija i amblema u PDF-u */
  * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }

  @page { margin: 14mm; }
}

/* ============================================================
   IZVOZ SLIKE (html-to-image) — klasa `enc-capturing` na <html>
   razvije CEO lanac (body → main → .enc) da captured čvor ima punu
   visinu; app-shell flex/scroll bi inače posekao sliku na jedan ekran.
   Stavlja se iz enc-export.js samo za vreme rasterizacije.
   ============================================================ */
.enc-capturing, .enc-capturing body { height: auto !important; overflow: visible !important; }
.enc-capturing #main { height: auto !important; min-height: 0 !important; overflow: visible !important; display: block !important; }
.enc-capturing .enc, .enc-capturing .enc-term, .enc-capturing .enc-kompozit {
  height: auto !important; max-height: none !important; overflow: visible !important; flex: none !important;
}
.enc-capturing .hdr, .enc-capturing .enc-ftr, .enc-capturing .ftA,
.enc-capturing .enc-header,
.enc-capturing .bar, .enc-capturing .term-bar, .enc-capturing .seg,
.enc-capturing .swipe-hint, .enc-capturing .actions, .enc-capturing .prevnext-mini,
.enc-capturing .foot-actions, .enc-capturing .prevnext-foot, .enc-capturing .save-menu { display: none !important; }
.enc-capturing .scroll, .enc-capturing .doc-scroll,
.enc-capturing .flow-col, .enc-capturing .flow-mid {
  overflow: visible !important; max-height: none !important; height: auto !important;
}

/* Pojam: app-shell → tok dokumenta; relacije ispod */
.enc-capturing .enc-term { display: block !important; }
.enc-capturing .enc-term .pager, .enc-capturing .enc-term .panel, .enc-capturing .enc-term .panel-doc,
.enc-capturing .enc-term .panel-rel, .enc-capturing .enc-term .panel-pad {
  display: block !important; height: auto !important; max-height: none !important; overflow: visible !important;
}
.enc-capturing .enc-term .panel-rel { border-left: none !important; border-top: 1px solid var(--line); margin-top: 12px; }

/* Kompozit: zadrži 3-kolone, samo razvij visine kolona */
.enc-capturing .enc-kompozit .kompozit-cols { height: auto !important; }

/* html-to-image ne ume mix-blend-mode → amblemi (kh-emblem / term-seal) bi
   ispali kao crna mrlja. Za vreme snimka ih renderuj ravno (normalan blend),
   kao hub amblem — vidljivi kategorijski fill-evi. */
.enc-capturing .he-blend polygon,
.enc-capturing .hx-blend polygon,
.enc-capturing .enc-blend polygon { mix-blend-mode: normal !important; }
/* Logo ide u izvozno zaglavlje (rasterizovan PNG iz enc-export.js → bez fleke).
   CP logo i dekorativni pečat se NE rasterizuju. */
.enc-capturing .term-seal,
.enc-capturing .kh-emblem,
.enc-capturing .term-seal-logo,
.enc-capturing .kh-emblem-logo { display: none !important; }
.enc-capturing .enc-xport-head { display: flex !important; }
.enc-capturing .enc-xport-foot { display: block !important; }

/* ============================================================
   v6 — „KRAJ DOSIJEA": redizajn .doc-foot (akcije + prev/next)
   + „Sačuvaj" meni. Bazni (mobilni-first); desktop/telefon niže.
   Izvoz (PNG/JPG/PDF) ide kroz postojeći enc-export.js / data-enc-print.
   ============================================================ */
.enc .foot-grid { display: flex; flex-direction: column; gap: 14px; }
.enc .foot-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }

/* Primarni CTA — jedino popunjeno dugme, u kategorijskoj boji */
.enc .btn-cta {
  font-family: var(--font-mono); font-size: 12px; letter-spacing: .03em; text-transform: uppercase;
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 15px; border-radius: var(--radius);
  background: var(--cat); color: var(--cat-ink, #fff); border: 1px solid var(--cat); font-weight: 600;
}
.enc .btn-cta .ar, .enc .btn-cta .caret { color: var(--cat-ink, #fff); }
.enc .btn-cta:hover { filter: brightness(1.08); }

/* Ghost — sporedne akcije bez okvira dok se ne hover-uju */
.enc .btn-line.ghost { border-color: transparent; color: var(--t-mute); }
.enc .btn-line.ghost:hover { border-color: var(--line-strong); color: var(--t-hi); background: var(--bg-card); }

/* „Sačuvaj ▾" meni */
.enc .save-wrap { position: relative; }
.enc .save-wrap .caret { color: var(--t-faint); margin-left: 2px; }
.enc .save-wrap .btn-cta .caret { color: var(--cat-ink, #fff); }   /* na popunjenom CTA: mastilo kategorije, ne siva */
.enc .save-menu {
  position: absolute; left: 0; bottom: calc(100% + 6px); z-index: 30;
  min-width: 234px; padding: 6px;
  background: var(--bg-card); border: 1px solid var(--line-strong);
  border-radius: var(--radius); box-shadow: 0 12px 34px -14px rgba(0,0,0,.55);
  display: flex; flex-direction: column; gap: 2px;
}
.enc .save-menu.down { bottom: auto; top: calc(100% + 6px); }
.enc .save-menu[hidden] { display: none; }
.enc .save-menu .mi {
  display: flex; align-items: center; gap: 10px; text-align: left; width: 100%;
  padding: 10px 11px; border-radius: var(--radius);
  font-size: 13.5px; color: var(--t-hi); background: none; border: 0; cursor: pointer;
}
.enc .save-menu .mi:hover { background: var(--cat-faint); }
.enc .save-menu .mi .mi-ic { color: var(--cat); font-family: var(--font-mono); flex: none; }
.enc .save-menu .mi .mi-sub {
  margin-left: auto; font-family: var(--font-mono); font-size: 11px;
  color: var(--t-mute); letter-spacing: .04em;
}
.enc .save-menu .mi-sep { height: 1px; background: var(--line); margin: 4px 2px; }

/* Pun prev/next (labela + naslov) */
.enc .prevnext-foot { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; min-width: 0; }
.enc .prevnext-foot .pn {
  display: flex; flex-direction: column; gap: 3px; min-width: 0;
  border: 1px solid var(--line); background: var(--bg-paper);
  border-radius: var(--radius); padding: 10px 13px;
}
.enc .prevnext-foot .pn.prev { grid-column: 1; }
.enc .prevnext-foot .pn.next { grid-column: 2; text-align: right; }
.enc .prevnext-foot .pn:hover { border-color: var(--cat); }
.enc .prevnext-foot .pn-lbl {
  font-family: var(--font-mono); font-size: 10.5px; text-transform: uppercase;
  letter-spacing: .06em; color: var(--t-mute);
}
.enc .prevnext-foot .pn-title {
  font-size: 14px; font-weight: 500; color: var(--t-hi);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* Desktop ≥1080: akcije levo, prev/next desno (red) */
@media (min-width: 1080px) {
  .enc .foot-grid { flex-direction: row; align-items: flex-start; justify-content: space-between; gap: 18px; }
  .enc .foot-grid .prevnext-foot { flex: none; width: clamp(300px, 34vw, 420px); }
}

/* Telefon <760: CTA pun red; „Sačuvaj" kao bottom-sheet */
@media (max-width: 760px) {
  .enc .foot-actions .btn-cta { width: 100%; justify-content: center; min-height: 44px; }
  .enc .foot-actions .save-wrap { flex: 1 1 auto; }
  .enc .foot-actions .save-wrap > .btn-line,
  .enc .foot-actions .save-wrap > .btn-cta { width: 100%; justify-content: center; min-height: 42px; }
  .enc .save-menu {
    position: fixed; left: 0; right: 0; bottom: 0; top: auto; z-index: 60;
    min-width: 0; border-radius: 12px 12px 0 0;
    padding: 8px 8px calc(8px + env(safe-area-inset-bottom));
    box-shadow: 0 -14px 40px -10px rgba(0,0,0,.6);
  }
  .enc .save-menu.down { top: auto; bottom: 0; }
  .enc .save-menu .mi { min-height: 48px; font-size: 15px; }
  .enc .prevnext-foot .pn-title { font-size: 13px; }
  /* Bottom-sheet otvoren → zaključaj scroll dokumenta da se skrolbar ne vidi
     preko menija (kao modal). Vraća se kad se meni zatvori. */
  html:has(.save-menu:not([hidden])),
  body:has(.save-menu:not([hidden])) { overflow: hidden; }
}

/* ============================================================
   v6 — IZVOZ U SLIKU (PNG/JPG): „dosije" PLAKAT (pojam) / SHEET (kompozit)
   + izvozni MODAL (format · tema · veličina). Sve van .enc subtree-a
   (modal/plakat se grade u JS-u i kače na <body>). Tokeni plakata/sheet-a
   su SAMODOVOLJNI (theme-dark/theme-light klase), nezavisni od teme sajta.
   Amblem (lockup + watermark) je rasterizovan PNG iz enc-export.js (jedan,
   radi na obe podloge) — bez blend-fleke, bez PNG asseta na disku.
   PDF ostaje cela stranica (postojeća štampa) — nije ovde.
   ============================================================ */
/* ---- MODAL ---- */
.ex-overlay {
  position: fixed; inset: 0; z-index: 200; display: flex; align-items: center; justify-content: center;
  padding: 24px; background: rgba(16,16,14,.62);
  backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);
}
.ex-overlay[hidden] { display: none; }
.ex-modal {
  /* +50% u odnosu na raniji 960×auto; px-kapovi za 4K, vw/dvh brane da na FHD ne prelije */
  width: min(1440px, 96vw); height: min(960px, 90dvh); display: flex; flex-direction: column;
  background: var(--bg); border: 1px solid var(--line-strong); border-radius: 8px; overflow: hidden;
  box-shadow: 0 40px 90px -30px rgba(0,0,0,.7);
  color: var(--t-hi); font-family: var(--font-sans);
}
.ex-modal * { box-sizing: border-box; }
.ex-head { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 16px; border-bottom: 1px solid var(--line); background: var(--bg-paper); }
.ex-kicker { font-family: var(--font-mono); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--t-md); display: inline-flex; align-items: center; gap: 8px; }
.ex-kicker .signal { display: inline-block; width: 7px; height: 7px; background: var(--brand); clip-path: polygon(30% 0,70% 0,100% 30%,100% 70%,70% 100%,30% 100%,0 70%,0 30%); }
.ex-close { width: 32px; height: 32px; border: 1px solid var(--line); border-radius: var(--radius); color: var(--t-lo); font-size: 14px; display: flex; align-items: center; justify-content: center; background: 0; cursor: pointer; }
.ex-close:hover { color: var(--t-hi); border-color: var(--line-strong); background: var(--bg-card); }
.ex-body { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0,1fr) 268px; }
.ex-stage {
  min-width: 0; min-height: 0; overflow: hidden; display: flex; align-items: center; justify-content: center;
  padding: 24px; background: var(--bg-subtle);
  background-image: radial-gradient(var(--line) 1px, transparent 1px); background-size: 18px 18px;
}
.ex-scaler { flex: none; overflow: hidden; }
.ex-side { border-left: 1px solid var(--line); padding: 18px 16px; display: flex; flex-direction: column; gap: 18px; overflow-y: auto; background: var(--bg-paper); }
.ex-group h4 { font-family: var(--font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: .07em; color: var(--t-mute); margin: 0 0 9px; font-weight: 500; }
.ex-seg { display: flex; gap: 6px; }
.ex-seg button { flex: 1; padding: 9px 6px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--bg); color: var(--t-lo); font-family: var(--font-mono); font-size: 12px; cursor: pointer; }
.ex-seg button.on { background: var(--t-hi); color: var(--bg); border-color: var(--t-hi); }
.ex-sizes { display: flex; flex-direction: column; gap: 6px; }
.ex-sizes button { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--bg); color: var(--t-md); font-size: 13px; text-align: left; cursor: pointer; }
.ex-sizes button .dim { font-family: var(--font-mono); font-size: 11px; color: var(--t-faint); }
.ex-sizes button.on { border-color: var(--cat,var(--brand)); background: var(--bg-card); color: var(--t-hi); }
.ex-sizes button.on .dim { color: var(--cat,var(--brand)); }
.ex-hint, .ex-note { font-size: 12px; color: var(--t-mute); line-height: 1.5; margin: 0; }
.ex-download {
  justify-content: center; padding: 13px; margin-top: auto;
  display: inline-flex; align-items: center; gap: 8px; cursor: pointer;
  font-family: var(--font-mono); font-size: 12px; letter-spacing: .03em; text-transform: uppercase; font-weight: 600;
  border-radius: var(--radius); border: 1px solid var(--cat,var(--brand));
  background: var(--cat,var(--brand)); color: #fff;
}
.ex-download .ar { color: #fff; }
.ex-download:hover { filter: brightness(1.08); }
.ex-modal[data-cat="pretnje"] { --cat: var(--cat-pretnje); --cat-ink: var(--ink-on-pretnje); }
.ex-modal[data-cat="tehnike"] { --cat: var(--cat-tehnike); --cat-ink: var(--ink-on-tehnike); }
.ex-modal[data-cat="odbrane"] { --cat: var(--cat-odbrane); --cat-ink: var(--ink-on-odbrane); }
@media (max-width: 759px) {
  .ex-overlay { padding: 0; align-items: flex-end; }
  /* DEFINISANA visina (ne auto) — stage red dobija stabilnu visinu, pa se preview
     ne smanjuje pri prebacivanju formata. */
  .ex-modal { width: 100%; height: 94dvh; border-radius: 14px 14px 0 0; }
  .ex-body { grid-template-columns: 1fr; grid-template-rows: auto minmax(0,1fr); }
  /* Podešavanja kompaktna na vrhu → preview ispod dobija više prostora. */
  .ex-side { border-left: none; border-bottom: 1px solid var(--line); order: 0; gap: 9px; padding: 10px 14px; }
  .ex-side .ex-hint, .ex-side .ex-note { display: none; }   /* štedi visinu za preview */
  .ex-group h4 { margin-bottom: 6px; }
  .ex-stage { order: 1; padding: 16px; }
  .ex-sizes { flex-direction: row; flex-wrap: wrap; }
  .ex-sizes button { flex: 1 1 calc(50% - 3px); }
  .ex-download { position: sticky; bottom: 0; }
}

/* ---- IZVOZNA GRAFIKA · samodovoljni tokeni po temi ---- */
.poster.theme-dark, .ex-sheet.theme-dark {
  --bg:#161614; --bg-paper:#1c1c1a; --bg-card:#232321; --bg-subtle:#1c1c1a;
  --line:#2e2e2c; --line-soft:#242422; --line-strong:#3a3a37;
  --t-hi:#ece9e3; --t-md:#c8c5be; --t-lo:#a0a09e; --t-mute:#807d77; --t-faint:#5a5754;
  --brand:#c0392b; --brand-faint:rgba(192,57,43,.16);
  --cat-pretnje:#c0392b; --cat-tehnike:#c79248; --cat-odbrane:#6a8db2;
  --cat-pretnje-faint:rgba(192,57,43,.16); --cat-tehnike-faint:rgba(199,146,72,.14); --cat-odbrane-faint:rgba(106,141,178,.14);
  /* Izvozna grafika ostaje NEPROMENJENA: -text varijante pokazuju na sopstvene
     vrednosti bloka, da ne povuku boju sa strane. (S130) */
  --brand-text:var(--brand); --cat-pretnje-text:var(--cat-pretnje); --cat-tehnike-text:var(--cat-tehnike); --cat-odbrane-text:var(--cat-odbrane);
}
.poster.theme-light, .ex-sheet.theme-light {
  --bg:#f4f4f2; --bg-paper:#fafaf8; --bg-card:#ebebea; --bg-subtle:#eeeeed;
  --line:#d6d6d4; --line-soft:#e3e1de; --line-strong:#b8b6b3;
  --t-hi:#1a1a18; --t-md:#2d2d2b; --t-lo:#5a5a58; --t-mute:#7a7a78; --t-faint:#9a9a98;
  --brand:#9b1919; --brand-faint:rgba(155,25,25,.10);
  --cat-pretnje:#9b1919; --cat-tehnike:#a6731f; --cat-odbrane:#3a5570;
  --cat-pretnje-faint:rgba(155,25,25,.10); --cat-tehnike-faint:rgba(166,115,31,.12); --cat-odbrane-faint:rgba(58,85,112,.12);
  --brand-text:var(--brand); --cat-pretnje-text:var(--cat-pretnje); --cat-tehnike-text:var(--cat-tehnike); --cat-odbrane-text:var(--cat-odbrane);
}
.poster[data-cat="pretnje"], .ex-sheet[data-cat="pretnje"] { --cat:var(--cat-pretnje); --cat-faint:var(--cat-pretnje-faint); }
.poster[data-cat="tehnike"], .ex-sheet[data-cat="tehnike"] { --cat:var(--cat-tehnike); --cat-faint:var(--cat-tehnike-faint); }
.poster[data-cat="odbrane"], .ex-sheet[data-cat="odbrane"] { --cat:var(--cat-odbrane); --cat-faint:var(--cat-odbrane-faint); }

/* ---- PLAKAT (pojam) — sve u em, skalira se sa font-size ---- */
.poster {
  position: relative; box-sizing: border-box; overflow: hidden;
  background: var(--bg-paper); color: var(--t-hi);
  border-top: 0.5em solid var(--cat,var(--brand));
  font-family: var(--font-sans); display: flex; flex-direction: column;
  padding: 2.4em 2.4em 2.1em;
}
.poster * { box-sizing: border-box; }
.poster .p-top { display: flex; align-items: center; justify-content: space-between; gap: 1em; }
.poster .p-brand { display: inline-flex; align-items: center; gap: 0.6em; font-family: var(--font-mono); font-weight: 600; font-size: 1.05em; letter-spacing: -.01em; color: var(--t-hi); }
.poster .p-brand .sl { color: var(--brand-text); }
.poster .p-brand .enc-emb { height: 1.5em; width: auto; }
.poster .p-kicker { font-family: var(--font-mono); font-size: 0.72em; text-transform: uppercase; letter-spacing: .14em; color: var(--t-mute); }
/* Badge + №/klasa su sad u gornjem redu (desno, bedž uz ivicu) — bez gornje margine */
.poster .p-cat { display: flex; align-items: center; gap: 0.8em; margin-top: 0; }
.poster .p-top .p-cat { margin-left: auto; }
.poster .p-badge { font-family: var(--font-mono); font-size: 0.74em; padding: 0.32em 0.7em; border: 1px solid currentColor; border-radius: var(--radius); text-transform: uppercase; letter-spacing: .06em; color: var(--cat,var(--brand)); background: var(--cat-faint,var(--brand-faint)); }
.poster .p-no { font-family: var(--font-mono); font-size: 0.74em; color: var(--t-mute); letter-spacing: .03em; }
.poster .p-title { font-size: 3em; line-height: 1.02; letter-spacing: -.025em; font-weight: 700; margin: 0.55em 0 0; color: var(--t-hi); }
.poster.is-square .p-title { font-size: 2.6em; }
.poster.is-story .p-title { font-size: 2.9em; }
/* Engleski original kao tiha mono labela (isti glas kao na ekranu: prefiks
   „EN", neutralna boja — ne pozajmljuje boju kategorije). */
.poster .p-title .t-en,
.ex-sheet .s-title .t-en,
.ex-sheet .s-mid-card h2 .t-en {
  display: block; font-family: var(--font-mono); font-weight: 400; letter-spacing: 0; color: var(--t-lo);
}
.poster .p-title .t-en::before,
.ex-sheet .s-title .t-en::before,
.ex-sheet .s-mid-card h2 .t-en::before {
  content: "EN"; margin-right: .5em; font-size: .68em; letter-spacing: .12em; color: var(--t-mute); vertical-align: .08em;
}
.poster .p-title .t-en { font-size: .4em; margin-top: .18em; }
.ex-sheet .s-title .t-en { font-size: .5em; margin-top: .12em; }
.ex-sheet .s-mid-card h2 .t-en { font-size: .52em; margin-top: .08em; }
/* Lead ide PUNOM širinom (manje redova → više mesta za relacije); pejzaž zadržava limit niže. */
.poster .p-lead { font-size: 1.0em; line-height: 1.5; color: var(--t-md); margin: 0.7em 0 0; max-width: none; text-wrap: pretty; }
.poster .p-points { list-style: none; padding: 0; margin: 1.5em 0 0; display: flex; flex-direction: column; gap: 0.62em; }
.poster .p-points-lbl { font-family: var(--font-mono); font-size: 0.7em; text-transform: uppercase; letter-spacing: .1em; color: var(--t-mute); margin: 1.7em 0 0.2em; }
.poster .p-points li { position: relative; padding-left: 1.5em; font-size: 0.98em; line-height: 1.45; color: var(--t-md); }
.poster .p-points li::before { content: ""; position: absolute; left: 0; top: 0.62em; width: 0.7em; height: 1px; background: var(--cat,var(--brand)); }
.poster .p-body { flex: 1; min-height: 0; overflow: hidden; display: flex; flex-direction: column; }
.poster .p-foot { flex: none; padding-top: 1.5em; }
.poster .p-rule { height: 1px; background: var(--line); margin: 0 0 1em; }
.poster .p-path { font-family: var(--font-mono); font-size: 0.72em; color: var(--t-mute); letter-spacing: .02em; }
.poster .p-tags { display: flex; flex-wrap: wrap; gap: 0.45em; margin-top: 0.7em; }
.poster .p-tags span { font-family: var(--font-mono); font-size: 0.68em; color: var(--t-lo); padding: 0.25em 0.6em; border: 1px solid var(--line); border-radius: var(--radius); }
.poster .p-tags span::before { content: "#"; color: var(--cat,var(--brand)); opacity: .7; }
/* Podnožje: tekst (URL + tagovi) levo, žig (mali trefoil iz logoa) desno —
   u istom redu ISPOD linije (.p-rule), pa linija ne seče heksagone. */
.poster .p-foot-row { display: flex; align-items: center; justify-content: space-between; gap: 1.2em; }
.poster .p-foot-txt { min-width: 0; }
.poster .p-wm { width: 3.2em; height: auto; flex: none; opacity: .9; }
.poster.is-landscape { padding: 2.2em 2.6em; }
.poster.is-landscape .p-title { font-size: 3em; }
.poster.is-landscape .p-lead { max-width: 30em; }
/* DOSIJE trijas */
.poster .p-rel { margin-top: 1.1em; display: flex; flex-direction: column; gap: 1em; }
.poster.is-square .p-rel { margin-top: 1.05em; gap: .85em; }
.poster .p-rel .p-rule { margin: 0 0 .2em; }
.poster .pg .pg-h { display: flex; align-items: baseline; gap: .7em; font-family: var(--font-mono); font-size: .82em; text-transform: uppercase; letter-spacing: .06em; font-weight: 600; margin: 0 0 .5em; }
.poster .pg .pg-h .cnt { margin-left: auto; font-weight: 400; color: var(--t-faint); }
.poster .pg[data-c="tehnike"] .pg-h { color: var(--cat-tehnike-text); }
.poster .pg[data-c="odbrane"] .pg-h { color: var(--cat-odbrane-text); }
.poster .pg[data-c="pretnje"] .pg-h { color: var(--cat-pretnje-text); }
.poster .pg-list { list-style: none; margin: 0; padding: 0; position: relative; }
.poster .pg-list::before { content: ""; position: absolute; left: .42em; top: .8em; bottom: .8em; width: 2px; opacity: .4; }
.poster .pg[data-c="tehnike"] .pg-list::before { background: linear-gradient(180deg,var(--cat-tehnike),transparent); }
.poster .pg[data-c="odbrane"] .pg-list::before { background: linear-gradient(180deg,var(--cat-odbrane),transparent); }
.poster .pg[data-c="pretnje"] .pg-list::before { background: linear-gradient(180deg,var(--cat-pretnje),transparent); }
.poster .pg-list li { display: flex; align-items: center; gap: 1em; padding: .54em 0; font-size: .98em; color: var(--t-md); border-bottom: 1px dashed var(--line-soft); }
.poster .pg-list li:last-child { border-bottom: none; }
.poster .pg-list li .mk { width: .82em; height: .82em; border-radius: 2px; flex: none; position: relative; z-index: 1; }
.poster .pg[data-c="tehnike"] .mk { background: var(--cat-tehnike); }
.poster .pg[data-c="odbrane"] .mk { background: var(--cat-odbrane); }
.poster .pg[data-c="pretnje"] .mk { background: var(--cat-pretnje); }
.poster .pg-list li.more { color: var(--t-mute); font-family: var(--font-mono); font-size: .82em; border-bottom: none; padding-top: .55em; }

/* ---- SHEET (kompozit) ---- */
.ex-sheet {
  position: relative; box-sizing: border-box; overflow: hidden; background: var(--bg-paper); color: var(--t-hi);
  border-top: 0.5em solid var(--cat,var(--brand)); font-family: var(--font-sans);
  display: flex; flex-direction: column; padding: 2em 2.2em;
}
.ex-sheet * { box-sizing: border-box; }
.ex-sheet .s-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 1.4em; }
.ex-sheet .s-brand { display: inline-flex; align-items: center; gap: 0.6em; font-family: var(--font-mono); font-weight: 600; font-size: 1em; color: var(--t-hi); }
.ex-sheet .s-brand .sl { color: var(--brand-text); }
.ex-sheet .s-brand .enc-emb { height: 1.35em; width: auto; }
.ex-sheet .s-kicker { font-family: var(--font-mono); font-size: 0.68em; text-transform: uppercase; letter-spacing: .1em; color: var(--t-mute); }
.ex-sheet .s-title { font-size: 2.1em; font-weight: 700; letter-spacing: -.02em; margin: 0.5em 0 0.1em; }
.ex-sheet .s-cols { flex: 1; min-height: 0; overflow: hidden; display: grid; grid-template-columns: 1fr 1.18fr 1fr; gap: 1em; margin-top: 1.2em; }
.ex-sheet .s-col { border: 1px solid var(--line); border-top: 3px solid var(--line); border-radius: var(--radius); background: var(--bg); padding: 0.9em 1em 1em; display: flex; flex-direction: column; }
.ex-sheet .s-col.c-mid { border-top-color: var(--cat,var(--brand)); }
.ex-sheet .s-col.c-pretnje { border-top-color: var(--cat-pretnje); }
.ex-sheet .s-col.c-tehnike { border-top-color: var(--cat-tehnike); }
.ex-sheet .s-col.c-odbrane { border-top-color: var(--cat-odbrane); }
.ex-sheet .s-col h3 { font-family: var(--font-mono); font-size: 0.74em; text-transform: uppercase; letter-spacing: .05em; margin: 0 0 0.6em; display: flex; justify-content: space-between; gap: 0.5em; }
.ex-sheet .s-col.c-pretnje h3 { color: var(--cat-pretnje-text); }
.ex-sheet .s-col.c-tehnike h3 { color: var(--cat-tehnike-text); }
.ex-sheet .s-col.c-odbrane h3 { color: var(--cat-odbrane-text); }
.ex-sheet .s-col h3 .cnt { color: var(--t-faint); }
.ex-sheet .s-col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.ex-sheet .s-col li { display: flex; align-items: center; gap: 0.6em; padding: 0.5em 0; border-bottom: 1px dashed var(--line-soft); font-size: 0.92em; color: var(--t-md); }
.ex-sheet .s-col li:last-child { border-bottom: none; }
.ex-sheet .s-col li .mk { width: 0.6em; height: 0.6em; border-radius: 1px; flex: none; }
.ex-sheet .s-col li .mk.t-pretnje { background: var(--cat-pretnje); }
.ex-sheet .s-col li .mk.t-tehnike { background: var(--cat-tehnike); }
.ex-sheet .s-col li .mk.t-odbrane { background: var(--cat-odbrane); }
.ex-sheet .s-col li.more { color: var(--t-mute); font-family: var(--font-mono); font-size: .78em; border-bottom: none; padding-top: .5em; }
.ex-sheet .s-mid-card { background: var(--bg-card); border-bottom: 1px solid var(--line); margin: -0.9em -1em 0.8em; padding: 1em; }
.ex-sheet .s-mid-card .lbl { font-family: var(--font-mono); font-size: 0.68em; text-transform: uppercase; letter-spacing: .06em; color: var(--cat,var(--brand)); }
.ex-sheet .s-mid-card h2 { font-size: 1.5em; font-weight: 700; margin: 0.25em 0 0.2em; letter-spacing: -.01em; }
.ex-sheet .s-mid-card p { margin: 0; font-size: 0.9em; line-height: 1.45; color: var(--t-md); }
.ex-sheet .s-map-head { font-family: var(--font-mono); font-size: 0.66em; text-transform: uppercase; letter-spacing: .05em; color: var(--t-mute); margin: 0 0 0.5em; }
.ex-sheet .s-map { border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.ex-sheet .s-map .row { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid var(--line); }
.ex-sheet .s-map .row:last-child { border-bottom: none; }
.ex-sheet .s-map .cell { padding: 0.55em 0.7em; }
.ex-sheet .s-map .cell.tehnika { border-right: 1px dashed var(--line-soft); }
.ex-sheet .s-map .cell .ck { font-family: var(--font-mono); font-size: 0.6em; text-transform: uppercase; letter-spacing: .05em; display: block; margin-bottom: 0.25em; }
.ex-sheet .s-map .cell.tehnika .ck { color: var(--cat-tehnike-text); }
.ex-sheet .s-map .cell.odbrana .ck { color: var(--cat-odbrane-text); }
.ex-sheet .s-map .cell .nm { font-size: 0.84em; color: var(--t-hi); }
.ex-sheet .s-profile { display: flex; flex-direction: column; }
.ex-sheet .sp-row { display: flex; flex-direction: column; gap: .16em; padding: .55em 0; border-bottom: 1px dashed var(--line-soft); }
.ex-sheet .sp-row:last-child { border-bottom: none; }
.ex-sheet .sp-k { font-family: var(--font-mono); font-size: .62em; text-transform: uppercase; letter-spacing: .05em; color: var(--cat,var(--brand)); }
.ex-sheet .sp-v { font-size: .84em; color: var(--t-hi); line-height: 1.4; }
.ex-sheet .s-foot { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 1em; margin-top: 1.1em; padding-top: 0.9em; border-top: 1px solid var(--line); font-family: var(--font-mono); font-size: 0.68em; color: var(--t-mute); }
/* Žig = mali trefoil iz logoa, u redu podnožja desno (ispod border-top linije) */
.ex-sheet .s-wm { width: 2.6em; height: auto; flex: none; opacity: .9; }
/* TELEFON: subjekt gore, dve liste jedna pored druge ispod; mapa/profil se izostavlja */
.ex-sheet.is-portrait .s-cols, .ex-sheet.is-square .s-cols {
  display: grid; grid-template-columns: 1fr 1fr; gap: .8em;
  grid-template-areas: "mid mid" "left right"; align-content: start;
}
.ex-sheet.is-portrait .s-cols > section:nth-child(1), .ex-sheet.is-square .s-cols > section:nth-child(1) { grid-area: left; }
.ex-sheet.is-portrait .s-cols > section:nth-child(2), .ex-sheet.is-square .s-cols > section:nth-child(2) { grid-area: mid; }
.ex-sheet.is-portrait .s-cols > section:nth-child(3), .ex-sheet.is-square .s-cols > section:nth-child(3) { grid-area: right; }
.ex-sheet.is-portrait .s-title, .ex-sheet.is-square .s-title { font-size: 1.8em; }
.ex-sheet.is-portrait .s-map, .ex-sheet.is-portrait .s-map-head, .ex-sheet.is-portrait .s-profile,
.ex-sheet.is-square .s-map, .ex-sheet.is-square .s-map-head, .ex-sheet.is-square .s-profile { display: none; }
.ex-sheet.is-portrait .s-mid-card, .ex-sheet.is-square .s-mid-card { margin-bottom: 0; border-bottom: none; }

/* ============================================================
   MOBILNI/TABLET — „bez prozora" na SVIM enc ekranima
   Paneli (hub kategorije · pojam · relacije) i kompozit kolone prestaju
   da budu kartica-okviri: sadržaj puni feed punom širinom, a „glave
   prozora" postaju čiste lepljive sekcijske oznake (bez stakla/rama).
   Swipe, seg-tabovi i tačkice rade isto. Desktop (≥1080) i kompozit
   tablet+ (≥760) ostaju netaknuti.
   ============================================================ */
@media (max-width: 1079.98px) {
  /* Pager paneli — hub, pojam, relacije */
  .enc .pager { padding-left: 0; padding-right: 0; }
  .enc .panel { border: none; border-radius: 0; background: none; }
  .enc .panel[data-cat] { border-top: none; }
  .enc .panel-pad { padding-left: var(--pad); padding-right: var(--pad); }

  /* Glava panela: staklena „glava prozora" → čista sekcijska oznaka */
  .enc .panel-head {
    background: var(--bg);
    backdrop-filter: none; -webkit-backdrop-filter: none;
    padding-left: var(--pad); padding-right: var(--pad);
  }

  /* HUB: kategoriju već nosi seg traka → glava panela je višak */
  .enc-hub .panel-head { display: none; }
  .enc-hub .panel-pad { padding-top: 2px; }

  /* POJAM (članak): „Pojam · opis · primeri · napomene" i „Tehnike · neutrališe…"
     trake su višak na telefonu — seg tabovi (Pojam · Tehnike · Odbrane) već nose
     navigaciju, doc-sekcije se same naslovljavaju, a rel-intro nosi opis veze.
     (Desktop ≥1080 zadržava rel glave kao oznake bočnih kolona.) */
  .enc-term .panel-head { display: none; }
  .enc-term .panel-doc .panel-pad { padding-top: 6px; }
  .enc-term .panel-rel .panel-pad { padding-top: 8px; }

  /* Definicija (lead): van fiksne term-title glave (da ne guta visinu — u
     landscape-u je gušila ceo scroll), unutar skrolabilnog doc-a iznad „Opis". */
  .enc-term .term-title .lead { display: none; }
  .enc-term .doc-lead { display: block; }
}

/* ============================================================
   LANDSCAPE TELEFON (app-shell <1080, kratka visina): fiksni chrome
   (crumbs, mini-footer, krupan naslov+pečat) gušio je scroll-zonu do 0 —
   pager bi kolabirao i sadržaj se nije mogao skrolovati. Stanji chrome
   da panel dobije realnu visinu za skrol. Portret/tablet (visok viewport)
   i desktop ostaju netaknuti — gejtovano na max-height.
   ============================================================ */
@media (max-width: 1079.98px) and (max-height: 520px) {
  body.page-enciklopedija .enc-ftr { display: none; }   /* mini-footer */
  .enc.enc-term .term-bar { display: none; }            /* crumbs traka */
  .enc .term-title { padding-top: 10px; padding-bottom: 10px; }
  .enc .term-title .badge-row { margin-bottom: 7px; }
  .enc .term-title h1 { font-size: 22px; }
  .enc .term-seal, .enc .term-seal-logo { display: none; }   /* dekorativni pečat */
}

/* KOMPOZIT (<760 — kolone se slažu): iste flat sekcije umesto 3 kutije.
   Kategorijski akcent ostaje kao tanka gornja linija; hairline deli sekcije. */
@media (max-width: 759.98px) {
  .enc .kompozit-cols { padding-left: 0; padding-right: 0; gap: 0; }
  .enc .kompozit-cols .flow-col,
  .enc .kompozit-cols .flow-mid {
    border-left: none; border-right: none; border-radius: 0;
    background: none;
    border-bottom: 1px solid var(--line);
  }
  .enc .flow-col-head {
    background: var(--bg);
    backdrop-filter: none; -webkit-backdrop-filter: none;
    padding-left: var(--pad); padding-right: var(--pad);
  }
  .enc .flow-col-body { padding-left: var(--pad); padding-right: var(--pad); }
  .enc .flow-center { padding-left: var(--pad); padding-right: var(--pad); }
  .enc .flow-map { padding-left: var(--pad); padding-right: var(--pad); }
}

/* ============================================================
   03C · INDEKS RAIL (desni, meki) — bočna traka sa velikim brojem
   + „+N još" preseljen u zaglavlje grupe (ne krade red u listi).
   Designer handoff design_handoff_03C_rail, portovan 1:1.
   ============================================================ */
.poster .dk { position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.poster.v-rail.rail-right { padding-right:5.9em; }
.poster.v-rail .dk-indeks .rail {
  position:absolute; top:0; bottom:0; right:0; width:3.9em;
  display:flex; flex-direction:column; align-items:center; justify-content:space-between;
  padding:1.7em 0;
  background:var(--cat-faint,var(--brand-faint));
  border-left:1px solid var(--cat,var(--brand));
}
.poster.v-rail .dk-indeks .rail-cat {
  writing-mode:vertical-rl; transform:rotate(180deg);
  font-family:var(--font-mono); font-size:.8em; letter-spacing:.4em; text-transform:uppercase; font-weight:600;
  color:var(--cat,var(--brand));
}
.poster.v-rail .dk-indeks .rail-hx {
  width:1.1em; height:1.25em; flex:none; background:var(--cat,var(--brand)); opacity:.55;
  clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);
}
.poster.v-rail .dk-indeks .rail-no {
  writing-mode:vertical-rl; font-family:var(--font-mono); font-weight:700;
  font-size:3.3em; line-height:.9; letter-spacing:-.03em; color:var(--cat,var(--brand)); opacity:.92;
}
/* watermark beži u levi donji ugao da ne udari u rail */
.poster.v-rail.rail-right .p-wm { right:auto; left:-1.6em; }
/* „+N još" inline u zaglavlju grupe */
.poster .pg-h .pg-more { margin-left:.7em; font-weight:400; text-transform:none; letter-spacing:0; color:var(--t-mute); }

/* ============================================================
   POJMOVI-GRAF — „Spomenuto u vestima" na strani pojma (§4.3).
   Definicija je trajna, hronologija prolazna: lista vesti koje su
   pojam dotakle, primarne označene tip-bojom, najnovije prvo.
   ============================================================ */
.enc .doc-news .news-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.enc .doc-news .news-list li { border-bottom: 1px dashed var(--line); }
.enc .doc-news .news-list li:last-child { border-bottom: 0; }
.enc .doc-news .news-list a {
  display: flex; align-items: baseline; gap: 12px;
  padding: 10px 2px;
  text-decoration: none;
  color: var(--t-md);
}
.enc .doc-news .nw-date {
  font-family: var(--font-mono); font-size: 11px; color: var(--t-mute);
  flex: none; min-width: 86px;
}
.enc .doc-news .nw-title { font-size: 14.5px; line-height: 1.5; flex: 1; }
.enc .doc-news .news-list .ar { color: var(--t-mute); flex: none; transition: color 120ms ease, transform 120ms ease; }
.enc .doc-news .news-list a:hover .nw-title { color: var(--t-hi); }
.enc .doc-news .news-list a:hover .ar { color: var(--cat, var(--brand)); transform: translateX(2px); }
/* primarna veza — vest kojoj je OVAJ pojam glavna tema */
.enc .doc-news .news-list li.primarni .nw-date { color: var(--cat, var(--brand)); }
.enc .doc-news .news-list li.primarni .nw-title { color: var(--t-hi); font-weight: 500; }
