/* Klodtoss 3 — light-first radni stol, ne chat tema. */
:root {
  --pozadina: #f3f1eb;
  --ploha: #fffefa;
  --ploha-2: #ebe8df;
  --crta: #d8d3c8;
  --tekst: #20231f;
  --tekst-tiho: #6c7069;
  --zeleno: #18785d;
  --zeleno-tiho: #e2f2eb;
  --crveno: #bd493e;
  --zuto: #a66a12;
  --plavo: #3159b8;
  --plavo-svijetlo: #5274c8;
  --plavo-tekst: #274a9e;
  --plavo-ploha: #f3f6ff;
  --plavo-rub: #bdcbed;
  --radijus: 8px;
  --papir: #fffefa;
  --tinta: #20231f;
  --akcent: #ff5c35;
  --sjena: 0 1px 2px rgba(39,36,29,.06), 0 18px 50px rgba(39,36,29,.08);
}

html { background: var(--pozadina); color-scheme: light; }
body {
  background: var(--pozadina);
  color: var(--tekst);
  font-family: "Avenir Next", Avenir, "Segoe UI", system-ui, sans-serif;
  letter-spacing: -.01em;
}
button, input, textarea, select { color: var(--tekst); }
button { background: var(--papir); border-color: var(--crta); }
button:hover { background: #f6f3ec; border-color: #aaa397; }
button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible {
  outline: 3px solid rgba(255,92,53,.22); outline-offset: 2px;
}
input, textarea, select { background: var(--papir); border-color: var(--crta); }
input:focus, textarea:focus { outline: 2px solid var(--akcent); box-shadow: none; }

/* Ulaz izgleda kao naslovnica radnog alata, ne modal. */
#zaslon-prijava {
  overflow: auto;
  padding: 6vw;
  background:
    linear-gradient(90deg, transparent 49.9%, rgba(70,67,59,.08) 50%, transparent 50.1%),
    linear-gradient(#f8f6f0, #efede6);
}
#zaslon-prijava::after {
  content: "K3 / WORKSPACE";
  position: fixed; right: 5vw; bottom: 4vw;
  color: #8a887f; font: 700 11px/1 ui-monospace, monospace; letter-spacing: .18em;
}
.sredina { margin: auto auto auto 9vw; width: min(440px, 100%); max-width: none; padding: 0; }
.brand-znak { width: 58px; height: 58px; display: grid; place-items: center; margin-bottom: 44px; background: var(--tinta); color: white; border-radius: 50%; }
.brand-znak span { font: 600 24px/1 Georgia, serif; }
.nadnaslov { margin: 0 0 10px; color: var(--akcent); font: 700 11px/1 ui-monospace, monospace; letter-spacing: .14em; text-transform: uppercase; }
.sredina h1 { margin: 0; font: 500 clamp(46px,7vw,74px)/.94 Georgia, serif; letter-spacing: -.06em; }
.sredina .uvod { max-width: 38ch; margin: 20px 0 0; font-size: 16px; line-height: 1.6; }
.forma { margin-top: 36px; gap: 18px; }
.oznaka-polja { display: grid; gap: 7px; font-size: 12px; font-weight: 700; letter-spacing: .02em; }
.oznaka-polja input { border: 0; border-bottom: 1px solid #aaa397; border-radius: 0; padding: 12px 0; background: transparent; font-size: 16px; }
.primarni { margin-top: 8px; background: var(--tinta); border: 0; color: #fff; font-weight: 700; border-radius: 999px; }
.primarni:hover { background: var(--akcent); }
.preuzimanje { margin-top: 30px; font-size: 12px; }
.preuzimanje a { color: var(--tinta); text-underline-offset: 3px; }

/* Navigator je indeks projekta: gust, miran i skenabilan. */
header { min-height: 68px; padding: 12px 18px; background: rgba(255,254,250,.94); border-color: var(--crta); backdrop-filter: blur(16px); }
.brand-mini { display: flex; align-items: center; gap: 10px; font-family: Georgia, serif; font-size: 18px; }
.brand-mini span { width: 29px; height: 29px; display: grid; place-items: center; border-radius: 50%; background: var(--tinta); color: #fff; font: 600 13px/1 Georgia, serif; }
.gol { color: var(--tekst-tiho); }
.gol:hover { color: var(--tekst); background: var(--ploha-2); }
.znak { background: var(--zeleno-tiho); color: var(--zeleno); }
.traka-kvota span { background: transparent; border: 0; padding: 2px; font-family: ui-monospace, monospace; }
.k3-tema-label { display: flex; align-items: center; gap: 6px; margin-left: auto; color: var(--tekst-tiho); font-size: 11px; }
.k3-tema-label select { width: auto; padding: 6px 24px 6px 8px; font-size: 12px; }
.tok { scrollbar-color: #bbb5a9 transparent; scrollbar-width: thin; }
h2 { padding: 24px 18px 7px; color: #8a887f; font: 700 10px/1 ui-monospace, monospace; letter-spacing: .15em; }
.popis { padding: 0 10px; }
.popis li { min-height: 56px; margin: 2px 0; padding: 9px 10px; border: 0; border-radius: 8px; }
.popis li:hover { background: #eae7df; }
.popis li.zivo { background: var(--zeleno-tiho); }
.popis li.zivo b { color: #125d49; }
.popis .red1 { gap: 8px; }
.popis b { font-size: 13.5px; }
.popis .drugi { color: var(--tekst-tiho); font-size: 12px; }
.popis .udji { border-left-color: #cbc5b9; }
.tocka { width: 6px; height: 6px; }
.limiti { margin: 10px; padding: 0; gap: 6px; background: transparent; border: 0; }
.limit { min-width: 90px; padding: 8px 9px; background: #e9e6de; border: 0; }
.limit b { font-size: 15px; }
.podnozje { padding: 12px; background: rgba(255,254,250,.96); border-color: var(--crta); }
.podnozje select { padding: 9px 8px; background: transparent; }
#nova-sesija { border: 0; background: var(--akcent); color: #fff; font-weight: 750; }

/* Razgovor je dokument na stolu. Agent nije oblačić nego koautor. */
#zaslon-razgovor { background: #e8e5dd; }
#zaslon-razgovor header { background: rgba(243,241,235,.92); }
.zaglavlje-tijelo strong { font: 500 18px/1.2 Georgia, serif; }
select.malen { background: transparent; border: 0; }
#tok-poruka { width: min(880px, calc(100% - 48px)); margin: 28px auto 0; padding: clamp(30px,5vw,70px); gap: 24px; background: var(--papir); border: 1px solid #ddd8cd; box-shadow: var(--sjena); }
.poruka { line-height: 1.7; }
.poruka.ja { max-width: 74%; padding: 11px 15px; border: 0; border-radius: 4px 14px 14px 14px; background: #eeece5; }
.poruka.on { color: var(--tinta); font-family: Georgia, Cambria, serif; font-size: 16px; }
.md h2.u-tekstu, .md h3, .md h4 { font-family: "Avenir Next", system-ui, sans-serif; }
.md code { background: #f1efe9; border-color: #d8d3c8; }
.md pre.kod { padding: 16px; background: #292b28; border: 0; color: #f6f4ed; border-radius: 6px; }
.md a { color: #b33e24; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.alat { background: #f6f4ee; border-color: #d8d3c8; border-radius: 6px; font-family: "Avenir Next", system-ui, sans-serif; }
.misli { border-left-color: #aaa397; }
.tehnicka-grupa { background: #f6f4ee; border-color: #d8d3c8; border-radius: 6px; font-family: "Avenir Next", system-ui, sans-serif; }
.tehnicka-tijelo .misli { border-left-color: #aaa397; }
.rada { width: min(880px, calc(100% - 48px)); margin: 0 auto; border: 1px solid #d8d3c8; border-top: 0; background: #e6f1eb; }
#zaslon-razgovor > .podnozje, #zaslon-razgovor > .prilozi, #zaslon-razgovor > .dozvola { width: min(880px, calc(100% - 48px)); margin: 0 auto 20px; box-shadow: 0 12px 30px rgba(39,36,29,.08); }
#unos { align-items: flex-end; border: 1px solid #cbc5b9; border-radius: 14px; }
#unos textarea { min-height: 44px; padding: 10px 12px; background: transparent; border: 0; }
#posalji { height: 42px; border: 0; border-radius: 10px; background: var(--tinta); color: white; }
.prilog { height: 42px; }
.stani { border-color: #cf827a; color: #a7352c; }
.dozvola { border-color: #d8aa60; background: #fff8e9; }

/* K3 cockpit: na velikom zaslonu je ploča, ne rastegnuta mobilna lista. */
.k3-ploca { padding: 0 clamp(18px, 3vw, 48px) 110px; }
.k3-ploca > #kvote { display: flex; gap: 6px; overflow-x: auto; margin-inline: -10px; padding: 8px 10px 2px; }
.k3-ploca > #kvote .limiti { flex: 0 0 auto; display: flex; align-items: center; gap: 5px; margin: 0; }
.k3-ploca > #kvote .pretplata { margin: 0 2px 0 0; font-size: 9px; white-space: nowrap; }
.k3-ploca > #kvote .limit { min-width: 0; padding: 5px 7px; }
.k3-ploca > #kvote .limit .oznaka { display: none; }
.k3-ploca > #kvote .limit b { font-size: 12px; }
.k3-ploca > #kvote .napomena { display: none; }
.k3-ploca > #kvote .upisi { padding: 2px 5px; font-size: 9px; }
.k3-agenti { margin-top: 26px; }
.k3-naslov { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 16px; }
.k3-naslov.kompaktno { align-items: center; padding: 20px 22px 12px; margin: 0; }
.k3-kicker { display: block; margin-bottom: 6px; color: var(--akcent); font: 750 10px/1 ui-monospace, monospace; letter-spacing: .16em; }
.k3-naslov h1 { margin: 0; font: 500 clamp(28px, 3vw, 42px)/1 Georgia, serif; letter-spacing: -.035em; }
.k3-naslov.kompaktno h1 { font-size: 24px; }
.k3-hint { color: var(--tekst-tiho); font-size: 12px; }
.k3-sekundarni { width: auto; padding: 8px 12px; border-radius: 999px; font-size: 12px; }
.k3-sekundarni:not(:disabled) { background: var(--tinta); color: #fff; border-color: var(--tinta); }

#popis-agenata { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(360px, 100%), 1fr)); gap: 12px; padding: 0; }
#popis-agenata > li { position: relative; height: clamp(520px, 66vh, 760px); display: grid; grid-template-columns: 10px 1fr auto auto; grid-template-rows: auto auto minmax(0, 1fr) auto; align-items: start; gap: 10px; padding: 18px; background: var(--papir); border: 1px solid var(--crta); border-radius: 12px; box-shadow: 0 8px 28px rgba(39,36,29,.05); }
#popis-agenata > li:hover { background: #fff; border-color: #aaa397; }
#popis-agenata > li .telo { min-width: 0; }
#popis-agenata > li .red1 b { color: var(--tinta); font: 500 18px/1.2 Georgia, serif; }
#popis-agenata > li .drugi { margin-top: 7px; white-space: normal; line-height: 1.4; }
#popis-agenata > li .stop { width: 28px; height: 28px; padding: 0; border: 0; border-radius: 50%; font-size: 13px; }
#popis-agenata > li .tocka { margin-top: 7px; }
#popis-agenata > li.k3-ugasen { background: color-mix(in srgb, var(--papir) 72%, var(--pozadina)); border-color: color-mix(in srgb, var(--crta) 72%, transparent); box-shadow: none; }
#popis-agenata > li.k3-ugasen > :not(.k3-feed, .k3-brzi-unos, .k3-izbori, .stop) { opacity: .48; }
#popis-agenata > li.k3-ugasen > .stop { opacity: 1; }
#popis-agenata > li.k3-ugasen .k3-feed { opacity: .58; filter: saturate(.55); }
#popis-agenata > li.k3-ugasen .k3-brzi-unos { opacity: 1; }
#popis-agenata > li.k3-ugasen .k3-brzi-unos textarea { background: var(--papir); border: 1px solid var(--crta); }
#popis-agenata > li.k3-ugasen.k3-ponovno-pokretanje .tocka { opacity: 1; background: var(--zuto); animation: dah 1.2s ease-in-out infinite; }
#popis-agenata > li.k3-ugasen.k3-ponovno-pokretanje .k3-brzi-unos { pointer-events: none; opacity: .68; }
.k3-izbori { grid-column: 1 / -1; display: flex; gap: 6px; min-width: 0; }
.k3-izbori select {
  flex: 1;
  min-width: 0;
  width: auto;
  max-width: none;
  padding: 6px 8px;
  background: #f5f3ed;
  border: 1px solid var(--crta);
  border-radius: 8px;
  font-size: 12px;
}
.k3-feed { grid-column: 1 / -1; min-height: 0; align-self: stretch; overflow-y: auto; overscroll-behavior-y: contain; display: flex; flex-direction: column; gap: 10px; margin-top: 4px; padding: 14px 8px 10px 4px; border-top: 1px solid var(--crta); scrollbar-color: var(--tekst-tiho) transparent; scrollbar-width: thin; }
.k3-feed-red { flex: none; max-width: 92%; white-space: pre-wrap; overflow-wrap: anywhere; font-size: 13px; line-height: 1.52; }
.k3-feed-red.agent { font-family: Georgia, Cambria, serif; font-size: 14px; }
.k3-feed-red.md { max-width: 100%; white-space: normal; }
.k3-feed-red.md h2.u-tekstu, .k3-feed-red.md h3, .k3-feed-red.md h4 { margin: 12px 0 6px; font-size: 15px; }
.k3-feed-red.md h2.u-tekstu { font-size: 16px; }
.k3-feed-red.ja { align-self: flex-end; padding: 8px 10px; background: #eeece5; border-radius: 4px 12px 12px 12px; }
.k3-feed-red.misli, .k3-feed-red.alat, .k3-feed-red.meta, .k3-feed-red.prazno { color: var(--tekst-tiho); font-size: 11px; }
.k3-feed-red.misli { max-height: 4.5em; overflow: hidden; border-left: 2px solid #c9c3b8; padding-left: 8px; }
.k3-feed-red.alat { padding: 6px 8px; background: #f5f3ed; border: 0; border-left: 2px solid var(--crta); border-radius: 0 5px 5px 0; font-family: ui-monospace, monospace; }
.k3-feed-red.greska { color: var(--crveno); }
.k3-tehnicki-feed { flex: none; border-top: 1px solid var(--crta); color: var(--tekst-tiho); font-size: 11px; }
.k3-tehnicki-feed summary { padding: 8px 2px; cursor: pointer; user-select: none; }
.k3-tehnicki-tijelo { max-height: 180px; overflow-y: auto; display: flex; flex-direction: column; gap: 7px; padding: 2px 4px 10px; overscroll-behavior: contain; }
.k3-tehnicki-tijelo .k3-feed-red { max-width: 100%; }
.k3-potez-razdvajac { width: 100%; height: 0; margin: 8px 0; border: 0; border-top: 1px dashed var(--crta); }
.k3-brzi-unos { grid-column: 1 / -1; align-self: end; display: grid; grid-template-columns: 38px 1fr 38px; gap: 8px; padding-top: 12px; border-top: 1px solid var(--crta); }
.k3-prilozi { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 5px; }
.k3-prilog-chip { width: auto !important; max-width: 100%; height: 27px !important; padding: 0 8px !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; background: #e9e6de !important; color: var(--tekst) !important; border-radius: 6px !important; font-size: 11px; }
.k3-aktivnost { grid-column: 1 / -1; display: grid; grid-template-columns: 7px minmax(0, 1fr) auto; align-items: center; gap: 7px; min-height: 25px; padding: 5px 8px; color: #356557; background: #e6f1eb; border-radius: 6px; font-size: 11px; }
.k3-aktivnost .tocka { width: 6px; height: 6px; margin: 0; background: #3a8b70; }
.k3-aktivnost-sto { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.k3-aktivnost time { color: #55766d; font: 11px/1 ui-monospace, monospace; }
.k3-aktivnost.dugo { color: #785d2d; background: #f4ead2; }
.k3-aktivnost.dugo .tocka { background: #b78128; }
.k3-brzi-unos textarea { min-height: 46px; max-height: 100px; resize: vertical; padding: 10px 12px; background: #f5f3ed; border: 0; border-radius: 8px; font-size: 13px; line-height: 1.35; }
.k3-brzi-unos button { width: 38px; height: 38px; align-self: end; padding: 0; background: var(--tinta); color: #fff; border: 0; border-radius: 50%; }
.k3-brzi-unos .k3-dodaj-prilog { background: #e9e6de; color: var(--tinta); font-size: 22px; }
.k3-prazno { display: grid; min-height: 130px; place-items: center; border: 1px dashed #c8c1b5; color: var(--tekst-tiho); font-size: 13px; }

.k3-ploca-tabla { margin-top: 26px; background: rgba(255,254,250,.75); border: 1px solid var(--crta); border-radius: 12px; overflow: hidden; }
.ploca-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; padding: 0 16px 16px; }
.ploca-karta { display: flex; flex-direction: column; gap: 6px; padding: 12px 14px; background: #f8f6f0; border: 1px solid var(--crta); border-radius: 10px; }
.ploca-glava { display: flex; align-items: center; gap: 8px; }
.ploca-ime { flex: 1; min-width: 0; overflow: hidden; font: 700 13px/1.2 ui-monospace, monospace; text-overflow: ellipsis; white-space: nowrap; }
.ploca-motor { color: var(--tekst-tiho); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }
.ploca-x { width: 22px; height: 22px; padding: 0; background: transparent; border: 0; color: var(--tekst-tiho); font-size: 15px; line-height: 1; cursor: pointer; }
.ploca-x:hover { color: var(--tinta); }
.ploca-mapa { overflow: hidden; color: var(--tekst-tiho); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.ploca-sazetak { overflow: hidden; max-height: 4.2em; color: var(--tekst); font-size: 12.5px; line-height: 1.4; white-space: pre-wrap; }

.k3-donja-mreza { display: grid; grid-template-columns: minmax(0, 1fr) minmax(240px, 320px); gap: 14px; margin-top: 36px; }
.k3-workspace, .k3-panel { background: rgba(255,254,250,.75); border: 1px solid var(--crta); border-radius: 12px; overflow: hidden; }
.k3-browser { display: grid; grid-template-columns: minmax(240px, .8fr) minmax(300px, 1.2fr); min-height: 350px; border-top: 1px solid var(--crta); }
.k3-browser > .popis { padding: 8px; border-right: 1px solid var(--crta); }
.k3-browser .popis li { border-radius: 6px; }
.k3-datoteke { min-width: 0; background: #f8f6f0; }
.k3-datoteke-vrh { min-height: 42px; display: flex; align-items: center; border-bottom: 1px solid var(--crta); }
.k3-datoteke-vrh h2 { flex: 1; min-width: 0; }
.k3-datoteke-vrh h2 span { display: block; overflow: hidden; margin-top: 5px; letter-spacing: 0; text-overflow: ellipsis; white-space: nowrap; }
.k3-datoteke-vrh button { width: 34px; height: 34px; margin-right: 8px; padding: 0; border: 0; border-radius: 50%; }
#k3-popis-datoteka { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 2px; padding: 8px; }
#k3-popis-datoteka li { min-height: 46px; padding: 7px 9px; cursor: default; }
#k3-popis-datoteka li:hover { background: #ece9e1; }
.k3-stavka { cursor: pointer !important; }
.k3-stavka:focus-visible { outline: 3px solid rgba(255,92,53,.22); outline-offset: -2px; }
#k3-popis-datoteka .k3-placeholder { grid-column: 1 / -1; color: var(--tekst-tiho); }
.k3-file-ikona { width: 22px; height: 25px; display: grid; place-items: center; border: 1px solid #bdb6aa; border-radius: 3px; color: #817b70; font: 700 15px/1 ui-monospace, monospace; }
.k3-stavka.mapa .k3-file-ikona { background: #e9e0c9; border: 0; }
.k3-stavka .telo { min-width: 0; overflow: hidden; }
.k3-stavka b { display: flex; min-width: 0; overflow: hidden; font-size: 12px; }
.k3-stavka.mapa b, .k3-ime-osnova { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.k3-ime-osnova { display: block; }
.k3-ime-nastavak { flex: none; white-space: nowrap; }
.k3-stavka .drugi { font-size: 10px; }
.k3-prosli-agenti { margin: 4px 8px 10px; padding-top: 10px; border-top: 1px solid var(--crta); }
.k3-prosli-agenti > h2 { padding: 2px 8px 8px; }
.k3-prosli-motor + .k3-prosli-motor { margin-top: 10px; }
.k3-prosli-motor > h3 { margin: 0; padding: 5px 8px; color: var(--tekst-tiho); font: 700 10px/1.2 ui-monospace, monospace; letter-spacing: .08em; text-transform: uppercase; }
.k3-prosli-motor .popis { padding: 0; }
.k3-prosli-motor li { min-height: 46px; padding: 7px 9px; cursor: pointer; border-radius: 6px; }
.k3-prosli-motor li:hover { background: #ece9e1; }
.k3-prosli-motor li:focus-visible { outline: 3px solid rgba(255,92,53,.22); outline-offset: -2px; }
.k3-prosli-motor b { font-size: 12px; }
.k3-prosli-motor .drugi { font-size: 10px; }
.k3-prosli-prazno { margin: 2px 8px 8px; color: var(--tekst-tiho); font-size: 11px; }
.k3-file-modal { position: fixed; inset: 0; z-index: 95; display: grid; place-items: center; padding: 22px; }
.k3-file-pozadina { position: absolute; inset: 0; background: rgba(25,24,21,.72); }
.k3-file-prozor { position: relative; width: min(1100px, 96vw); height: min(820px, 92vh); display: grid; grid-template-rows: auto 1fr; overflow: hidden; background: #f8f6f0; border-radius: 12px; box-shadow: 0 18px 70px rgba(0,0,0,.35); }
.k3-file-prozor header { display: flex; align-items: center; gap: 16px; min-height: 58px; padding: 8px 12px 8px 18px; border-bottom: 1px solid var(--crta); }
.k3-file-prozor header h2 { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.k3-file-akcije { display: flex; align-items: center; gap: 7px; }
.k3-file-akcije a { text-decoration: none; }
.k3-file-akcije .opasno { color: #a72c20; }
.k3-file-preview { min-height: 0; display: grid; place-items: center; overflow: auto; background: #dedbd3; }
.k3-file-preview iframe, .k3-file-preview img { width: 100%; height: 100%; border: 0; object-fit: contain; }
.k3-file-preview p { padding: 24px; color: var(--tekst-tiho); text-align: center; }
body.k3-file-otvoren { overflow: hidden; }
.k3-statusi { display: grid; align-content: start; gap: 14px; }
.k3-panel { min-height: 110px; padding-bottom: 8px; }
.k3-panel .popis { padding: 0 8px; }
.k3-panel li { background: transparent; }
.k3-pali { border-color: #d3cec3; }
.k3-pali.ima-palih { border-color: #df958c; background: #fff5f2; }
.k3-prazno-malo { margin: 8px 18px 14px; color: var(--tekst-tiho); font-size: 12px; }
.k3-pali.ima-palih .k3-prazno-malo { display: none; }
.k3-precac { color: var(--tekst-tiho); }

.k3-modal { position: fixed; inset: 0; z-index: 80; display: grid; place-items: center; padding: 28px; }
.k3-modal-zastor { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; border-radius: 0; background: rgba(36,35,31,.45); backdrop-filter: blur(6px); }
.k3-modal-kutija { position: relative; width: min(760px, 100%); max-height: min(780px, calc(100dvh - 56px)); display: flex; flex-direction: column; overflow: hidden; background: var(--papir); border-radius: 14px; box-shadow: 0 35px 100px rgba(28,27,24,.28); }
.k3-modal-kutija header { flex: none; }
.k3-modal-kutija header > div { flex: 1; }
.k3-modal-kutija header strong { font: 500 22px/1 Georgia, serif; }
.k3-modal-tok { overflow-y: auto; padding-bottom: 18px; }
.k3-modal-tok .popis { padding: 0 12px; }
body.k3-modal-otvoren { overflow: hidden; }

/* Tamna tema zadrzava papirnati karakter K3, ali bez bljestavih ploha. */
:root[data-theme="dark"] {
  --pozadina: #171a18;
  --ploha: #222622;
  --ploha-2: #2c312c;
  --crta: #3c433d;
  --tekst: #e7e9e3;
  --tekst-tiho: #a4aaa2;
  --zeleno: #73c8aa;
  --zeleno-tiho: #203c33;
  --crveno: #ef8175;
  --zuto: #e0aa58;
  --plavo: #547bd4;
  --plavo-svijetlo: #7397e8;
  --plavo-tekst: #a9c0ff;
  --plavo-ploha: #1d2330;
  --plavo-rub: #394968;
  --papir: #202420;
  --tinta: #f0f1eb;
  --sjena: 0 1px 2px rgba(0,0,0,.25), 0 18px 50px rgba(0,0,0,.3);
  color-scheme: dark;
}
:root[data-theme="dark"] #zaslon-prijava { background: linear-gradient(90deg, transparent 49.9%, rgba(255,255,255,.05) 50%, transparent 50.1%), linear-gradient(#202420, #171a18); }
:root[data-theme="dark"] header,
:root[data-theme="dark"] .podnozje { background: rgba(32,36,32,.94); }
:root[data-theme="dark"] #zaslon-popis,
:root[data-theme="dark"] #zaslon-razgovor { background: #171a18; }
:root[data-theme="dark"] #zaslon-razgovor header { background: rgba(23,26,24,.94); }
:root[data-theme="dark"] #tok-poruka {
  background: #202420;
  border-color: #343b35;
}
:root[data-theme="dark"] .poruka.ja {
  background: #303530;
  color: #eef0ea;
}
:root[data-theme="dark"] .rada {
  background: #203a31;
  border-color: #315344;
  color: #b8ddcf;
}
:root[data-theme="dark"] #zaslon-razgovor > .podnozje,
:root[data-theme="dark"] #zaslon-razgovor > .prilozi { border-color: #3c433d; }
:root[data-theme="dark"] #unos { border-color: #465048; }
:root[data-theme="dark"] #unos textarea { color: #eef0ea; }
:root[data-theme="dark"] #unos textarea::placeholder { color: #8e968e; }
:root[data-theme="dark"] #posalji {
  background: #547bd4;
  color: #fff;
}
:root[data-theme="dark"] #posalji:hover { background: #678ce0; }
:root[data-theme="dark"] #unos .prilog {
  background: #303530;
  color: #c7cdc5;
  border-color: #454d46;
}
:root[data-theme="dark"] button:hover { background: #303630; border-color: #667067; }
:root[data-theme="dark"] #popis-agenata > li { background: #202420; border-color: #343b35; box-shadow: 0 10px 30px rgba(0,0,0,.18); }
:root[data-theme="dark"] #popis-agenata > li:hover { background: #232823; border-color: #566057; }
:root[data-theme="dark"] #popis-agenata > li .red1 b,
:root[data-theme="dark"] .k3-feed-red.agent { color: #f1f2ed; }
:root[data-theme="dark"] .k3-ploca > #kvote .limit { background: #292e29; color: #d9ddd6; }
:root[data-theme="dark"] .k3-ploca > #kvote .limit b { color: #f1f3ed; }
:root[data-theme="dark"] .k3-ploca > #kvote .upisi { background: #292e29; color: #c5cbc3; }
:root[data-theme="dark"] .popis li:hover,
:root[data-theme="dark"] #k3-popis-datoteka li:hover,
:root[data-theme="dark"] .k3-prosli-motor li:hover { background: #2a2f2a; }
:root[data-theme="dark"] .k3-feed-red.ja,
:root[data-theme="dark"] .k3-prilog-chip,
:root[data-theme="dark"] .k3-brzi-unos .k3-dodaj-prilog { background: #303530 !important; }
:root[data-theme="dark"] .k3-brzi-unos .k3-dodaj-prilog {
  color: #c7cdc5;
  box-shadow: inset 0 0 0 1px #454d46;
}
:root[data-theme="dark"] .k3-brzi-unos button[type="submit"] {
  background: #547bd4;
  color: #fff;
  box-shadow: 0 4px 14px rgba(46,78,151,.36);
}
:root[data-theme="dark"] .k3-brzi-unos button[type="submit"]:hover { background: #678ce0; }
:root[data-theme="dark"] .k3-feed-red.alat,
:root[data-theme="dark"] .k3-izbori select,
:root[data-theme="dark"] .k3-brzi-unos textarea { background: #292e29; }
:root[data-theme="dark"] .k3-izbori select { color: #eef0ea; border-color: #343b35; }
:root[data-theme="dark"] .k3-feed-red.alat { color: #b7beb6; border-left-color: #495149; }
:root[data-theme="dark"] .k3-feed-red.misli { border-left-color: #596159; }
:root[data-theme="dark"] .k3-potez-razdvajac { border-top-color: #3a403a; }
:root[data-theme="dark"] .k3-brzi-unos textarea { color: #eef0ea; box-shadow: inset 0 0 0 1px #343b35; }
:root[data-theme="dark"] .k3-brzi-unos textarea::placeholder { color: #8e968e; }
:root[data-theme="dark"] .k3-aktivnost { color: #a9d8c7; background: #203a31; }
:root[data-theme="dark"] .k3-aktivnost time { color: #8db5a7; }
:root[data-theme="dark"] .k3-ploca-tabla { background: rgba(32,36,32,.8); border-color: #343b35; }
:root[data-theme="dark"] .ploca-karta { background: #202420; border-color: #343b35; }
:root[data-theme="dark"] .ploca-ime { color: #f1f2ed; }
:root[data-theme="dark"] .ploca-x:hover { color: #eef0ea; }
:root[data-theme="dark"] .k3-aktivnost.dugo { color: #e2c891; background: #3a311f; }
:root[data-theme="dark"] .k3-workspace,
:root[data-theme="dark"] .k3-panel { background: rgba(32,36,32,.8); }
:root[data-theme="dark"] .k3-datoteke,
:root[data-theme="dark"] .k3-file-prozor { background: #1c201d; }
:root[data-theme="dark"] .k3-file-preview { background: #111311; }
:root[data-theme="dark"] .md code { background: #2a2e2a; border-color: var(--crta); }
:root[data-theme="dark"] .dozvola { background: #352d1d; }
:root[data-theme="dark"] .k3-pali.ima-palih { background: #352321; }
:root[data-theme="dark"] .poziv-kutija { background: var(--papir); }
:root[data-theme="dark"] .jeeves {
  background: #1d2330;
  border-color: #394968;
  box-shadow: 0 24px 70px rgba(0,0,0,.55);
}
:root[data-theme="dark"] .jeeves-ime strong,
:root[data-theme="dark"] .jeeves-feed .tko { color: #a9c0ff; }
:root[data-theme="dark"] .jeeves-stanje,
:root[data-theme="dark"] .jeeves-feed li,
:root[data-theme="dark"] .jeeves-feed time { color: #aeb8ca; }
:root[data-theme="dark"] .jeeves-feed li.od-jeevesa { color: #eef2fb; }
:root[data-theme="dark"] .jeeves-forma {
  padding-top: 10px;
  border-top: 1px solid #303d58;
}
:root[data-theme="dark"] .jeeves-forma input {
  background: #151a24;
  color: #f1f4fb;
  border-color: #46597d;
}
:root[data-theme="dark"] .jeeves-forma input::placeholder { color: #8995aa; }
:root[data-theme="dark"] .jeeves-forma button {
  background: #547bd4;
  border-color: #7397e8;
  color: #fff;
}
:root[data-theme="dark"] .jeeves-forma button:hover { background: #678ce0; }

/* Jeeves je zaseban pomoćni sloj, uredski plavi. */
.jeeves-mjehur {
  overflow: visible;
  background: radial-gradient(circle at 34% 26%, #88a8f2 0 8%, var(--plavo-svijetlo) 9% 32%, var(--plavo) 70%);
  border-radius: 18px;
  box-shadow: 0 8px 24px rgba(49,89,184,.34), 0 0 0 1px rgba(190,211,255,.4) inset;
  animation: jeeves-pluta 3.8s ease-in-out infinite;
}
.jeeves-mjehur .jeeves-znak { text-shadow: 0 2px 8px rgba(14,33,82,.7); transform: rotate(-7deg); }
.jeeves-iskra { position: absolute; pointer-events: none; color: #dce8ff; text-shadow: 0 0 7px #8db4ff; }
.jeeves-iskra.iskra-1 { top: -7px; left: 5px; font-size: 13px; animation: jeeves-iskra 2.2s ease-in-out infinite; }
.jeeves-iskra.iskra-2 { right: -6px; top: 11px; font-size: 16px; animation: jeeves-iskra 2.2s .8s ease-in-out infinite; }
.jeeves-mjehur:hover { animation-duration: 1.3s; filter: saturate(1.14) brightness(1.08); }
.jeeves { background: var(--plavo-ploha); border-color: var(--plavo-rub); box-shadow: 0 20px 60px rgba(39,49,74,.2); }
.jeeves-zeus {
  position: absolute;
  z-index: 2;
  width: 152px;
  height: auto;
  right: 38px;
  bottom: calc(100% - 93px);
  pointer-events: none;
  filter: drop-shadow(0 12px 12px rgba(6,13,31,.4));
  transform-origin: 50% 100%;
  animation: jeeves-zeus-dise 4.6s ease-in-out infinite;
}
.jeeves-zastor { background: rgba(40,42,38,.24); backdrop-filter: blur(4px); }
.jeeves-forma input { background: #fff; }
.poziv { background: rgba(236,234,227,.92); }
.poziv-kutija { background: #fff; box-shadow: var(--sjena); }
.poziv-kutija p { color: var(--tekst); }

@keyframes jeeves-pluta {
  0%, 100% { transform: translateY(0) rotate(0); }
  50% { transform: translateY(-4px) rotate(1.5deg); }
}
@keyframes jeeves-iskra {
  0%, 35%, 100% { opacity: 0; transform: scale(.45) rotate(0); }
  50% { opacity: 1; transform: scale(1.12) rotate(18deg); }
  72% { opacity: .35; transform: scale(.78) rotate(36deg); }
}
@keyframes jeeves-zeus-dise {
  0%, 100% { transform: translateY(0) rotate(0); }
  50% { transform: translateY(-3px) rotate(.6deg); }
}

@media (min-width: 900px) {
  /* Zajednicki stil na desktopu drzi K1/K2 kao trajni split-view i zato
     prisilno prikazuje razgovor cak i kad nosi .skriveno. K3 je zasebna
     cockpit ljuska: popis i razgovor zauzimaju cijeli zaslon, ali nikad
     istodobno. Ovi selektori moraju biti specificniji od onih u stil.css. */
  #zaslon-popis { right: 0; width: 100%; border-right: 0; background: #f3f1eb; }
  #zaslon-popis.skriveno, #zaslon-razgovor.skriveno { display: none !important; }
  #zaslon-popis > header { padding-inline: clamp(18px, 3vw, 48px); }
  #zaslon-razgovor, #zaslon-terminal { left: 0; }
  #natrag { display: block; }
  #zaslon-popis > .podnozje { position: fixed; width: min(720px, calc(100% - 48px)); left: 50%; bottom: 18px; transform: translateX(-50%); border: 1px solid var(--crta); border-radius: 12px; box-shadow: 0 14px 40px rgba(39,36,29,.14); }
}

@media (max-width: 899px) {
  .k3-ploca { padding: 0 0 90px; }
  .k3-agenti, .k3-donja-mreza { margin: 0; }
  .k3-ploca-tabla { margin: 14px 0 0; border-radius: 0; border-inline: 0; }
  .ploca-lista { grid-template-columns: 1fr; padding: 0 10px 10px; }
  .k3-naslov, .k3-datoteke, .k3-hint, .k3-prazno, .k3-prazno-malo { display: none; }
  .k3-naslov.kompaktno { display: flex; }
  .k3-naslov.kompaktno > div { display: none; }
  .k3-naslov.kompaktno .k3-sekundarni { margin-left: auto; }
  #popis-agenata { display: block; padding: 0 10px; }
  #popis-agenata > li { min-height: 56px; display: flex; padding: 9px 10px; border: 0; box-shadow: none; }
  #popis-agenata > li .red1 b { font: 700 13.5px/1.4 "Avenir Next", system-ui, sans-serif; }
  .k3-brzi-unos, .k3-feed, .k3-izbori { display: none; }
  .k3-donja-mreza { display: flex; flex-direction: column; }
  .k3-workspace, .k3-panel { border: 0; border-radius: 0; background: transparent; }
  .k3-browser { display: block; min-height: 0; border: 0; }
  .k3-browser > .popis { border: 0; }
  .k3-statusi { order: -1; }
  .k3-modal { padding: 0; }
  .k3-file-modal { padding: 0; }
  .k3-file-prozor { width: 100%; height: 100%; border-radius: 0; }
  .k3-file-prozor header { align-items: flex-start; flex-direction: column; gap: 7px; padding: 10px 12px; }
  .k3-file-akcije { width: 100%; overflow-x: auto; }
  .k3-file-akcije [data-k3-file-zatvori] { margin-left: auto; }
  .k3-modal-kutija { width: 100%; height: 100dvh; max-height: none; border-radius: 0; }
  #tok-poruka { width: 100%; margin: 0; padding: 22px 16px; border: 0; box-shadow: none; }
  #zaslon-razgovor > .podnozje, #zaslon-razgovor > .prilozi, #zaslon-razgovor > .dozvola, .rada { width: 100%; margin: 0; border-radius: 0; }
  #unos { box-shadow: none; border-width: 1px 0 0; }
}

@media (max-width: 560px) {
  #zaslon-prijava { padding: 28px 22px; background: #f4f2ec; }
  #zaslon-prijava::after { display: none; }
  .sredina { margin: auto; }
  .brand-znak { margin-bottom: 34px; }
  .sredina h1 { font-size: 50px; }
  header { min-height: 60px; padding-inline: 10px; gap: 4px; }
  #zaslon-popis { width: 100%; min-width: 0; overflow-x: hidden; }
  #zaslon-popis > header { flex-wrap: nowrap; }
  #zaslon-popis > header .brand-mini { flex: 1 1 auto; min-width: 0; }
  #zaslon-popis > header #verzija,
  #zaslon-popis > header .traka-kvota { display: none; }
  #zaslon-popis > header .znak { flex: none; white-space: nowrap; }
  #zaslon-popis > header .k3-tema-label { flex: none; margin-left: 0; }
  #zaslon-popis > header .k3-tema-label > span { display: none; }
  #zaslon-popis > header .k3-tema-label select { max-width: 76px; padding-inline: 7px 20px; }
  #zaslon-popis > .tok { width: 100%; min-width: 0; overflow-x: hidden; }
  .k3-ploca > #kvote { max-width: 100%; overscroll-behavior-x: contain; }
  .brand-mini { font-size: 16px; }
  select.malen { max-width: 82px; }
  #zatvori-agenta { display: none; }
  .poruka.ja { max-width: 90%; }
  .jeeves-zeus { width: 118px; right: 34px; bottom: calc(100% - 73px); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
}