.network-scene { color:#252522; max-width:1500px; margin:0 auto; padding:clamp(20px,3vw,46px); }
.network-heading { display:flex; justify-content:space-between; gap:24px; align-items:end; border-bottom:1px solid #222; padding-bottom:28px; }
.network-heading span,.network-list-heading span { color:#a5452c; font-size:.72rem; font-weight:800; letter-spacing:.12em; }
.network-heading h1 { font-family:Georgia,serif; font-size:clamp(2.4rem,5vw,4.9rem); letter-spacing:-.045em; line-height:1; margin:14px 0; }
.network-heading p { max-width:650px; line-height:1.55; margin:0; }
.network-mark { color:#b04b32; font-weight:800; line-height:1.2; letter-spacing:.1em; text-align:right; }
.network-controls { padding:22px 0; display:flex; flex-wrap:wrap; gap:14px; align-items:end; }
.network-controls .toolbar,.network-controls .graph-context { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.network-controls select,.network-controls input[type=search] { min-height:40px; max-width:100%; }
.network-controls .atlas-time-controls { min-width:240px; }
.network-note,.network-footnote { color:#55544f; font-size:.88rem; line-height:1.5; }
.network-workspace { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(280px,.8fr); gap:26px; align-items:start; margin-top:24px; }
.network-list { min-width:0; container-type:inline-size; }
.network-list-heading { display:flex; justify-content:space-between; gap:18px; align-items:end; margin-bottom:16px; }
.network-list-heading h2 { font-family:Georgia,serif; font-size:1.6rem; margin:6px 0 0; }
.network-list-heading p { color:#65635e; font-size:.85rem; max-width:230px; margin:0; }
.network-result-count { color:#65635e; font-size:.8rem; margin-bottom:12px; }
.network-rows { display:grid; gap:10px; }
.network-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(160px,1.1fr) minmax(0,1fr); background:#fff; border:1px solid #d8d3c8; border-radius:6px; overflow:hidden; }
.network-row.is-selected { border-color:#a5452c; box-shadow:0 0 0 1px #a5452c; }
.network-actor,.network-relation { font:inherit; text-align:left; border:0; padding:17px; min-width:0; cursor:pointer; }
.network-actor { background:#f4f1ea; color:#252522; display:flex; flex-direction:column; gap:8px; justify-content:center; font-weight:750; overflow-wrap:anywhere; }
.network-actor small { color:#6b675f; font-size:.72rem; font-weight:400; }
.network-actor-missing { cursor:default; }
.network-relation { background:#fff; color:#252522; display:flex; flex-direction:column; align-items:start; gap:6px; overflow-wrap:anywhere; }
.network-relation strong { font-size:.94rem; line-height:1.35; }
.network-relation small,.network-claim { color:#69655e; font-size:.74rem; line-height:1.4; }
.network-arrow { color:#a5452c; font-size:1.4rem; line-height:1; }
.network-open { color:#a5452c; font-size:.72rem; font-weight:700; margin-top:3px; }
.network-actor:hover,.network-relation:hover { background:#f9e9df; }
.network-actor:focus-visible,.network-relation:focus-visible { outline:3px solid #a5452c; outline-offset:-3px; }
.network-detail { position:sticky; top:18px; min-width:0; background:#f4f1ea; border:1px solid #d8d3c8; border-top:4px solid #a5452c; padding:24px; overflow-wrap:anywhere; }
.network-detail h2 { font-family:Georgia,serif; font-size:1.55rem; line-height:1.15; }
.network-detail .power-source { display:block; padding:12px; margin:12px 0; background:white; }
.network-detail .power-source span,.network-detail .power-source small { display:block; }
.network-detail .power-date small { display:block; }
.network-pagination { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin:20px 0; }
.network-empty { background:#f4f1ea; padding:26px; }
.network-footnote { border-top:1px solid #d8d3c8; margin-top:30px; padding-top:18px; }
@media(max-width:850px) { .network-workspace { grid-template-columns:minmax(0,1fr); } .network-detail { position:static; grid-row:1; } }
@media(max-width:570px) { .network-scene { padding:20px 14px; } .network-mark { display:none; } .network-list-heading { display:block; } .network-list-heading p { max-width:none; margin-top:8px; } .network-row { grid-template-columns:1fr; } .network-actor,.network-relation { padding:12px 15px; } .network-actor { gap:3px; } .network-arrow { transform:rotate(90deg); } }

/* Контроле у тамном оквиру имају сопствене боје текста и површине. */
.directory-shell .network-controls .toolbar { width:100%; border-color:#6c8c7e; }
.directory-shell .network-controls .filter { color:#dce9d9; border:1px solid transparent; }
.directory-shell .network-controls .filter:hover { color:#fff; border-color:#9dbba4; background:#254b40; }
.directory-shell .network-controls .filter.active { color:#173a34; background:#bcd9bc; border-color:#bcd9bc; }
.directory-shell .network-controls .graph-context { width:100%; min-width:0; }
.directory-shell .network-controls label { color:#dce9d9; }
.directory-shell .network-controls :is(select,input[type="search"]) { color:#173a34; background:#f2f7e9; border:1px solid #9bb4a0; border-radius:4px; padding:9px 10px; }
.directory-shell .network-controls input[type="search"]::placeholder { color:#52685c; opacity:1; }
.directory-shell .network-controls select option { color:#173a34; background:#f2f7e9; }
.directory-shell .network-controls .atlas-time-controls { flex:1 1 100%; min-width:0; color:#eaf0e2; background:#173c36; border:1px solid #739182; }
.directory-shell .network-controls .atlas-time-controls :is(label,.atlas-time-ticks,.atlas-time-context,.atlas-compare-legend) { color:#d2e2d2; }
.directory-shell .network-controls .atlas-time-controls button,
.directory-shell .network-controls .graph-context > button { color:#eaf0e2; background:#254e40; border:1px solid #9abb9f; border-radius:4px; padding:8px 12px; }
.directory-shell .network-controls :is(.atlas-time-controls button,.graph-context > button):hover { color:#17372d; background:#e6c483; border-color:#e6c483; }
.directory-shell .network-controls input[type="range"],
.directory-shell .network-controls input[type="checkbox"] { accent-color:#bcd9bc; }
.directory-shell .network-controls :is(button,input,select):focus-visible { outline:3px solid #ffda91; outline-offset:3px; }
@media(max-width:570px) {
  .directory-shell .network-controls .toolbar { gap:8px; }
  .directory-shell .network-controls .graph-context { display:grid; grid-template-columns:minmax(0,1fr); }
  .directory-shell .network-controls :is(select,input[type="search"],.atlas-time-controls,.graph-context > button) { width:100%; max-width:100%; }
}

.network-graph-scroll { max-width:100%; overflow-x:auto; border:1px solid #739182; background:#102e2c; }
.network-graph { display:block; width:100%; min-width:700px; height:auto; }
.network-graph-mobile { display:none; }
.network-graph-edge { fill:none; stroke:#a6c7ad; stroke-width:2.5; }
.network-graph :is(#network-arrow,#network-arrow-mobile) path { fill:#a6c7ad; }
.network-graph-edge-hit { fill:none; stroke:transparent; stroke-width:22; cursor:pointer; }
.network-graph-node,.network-graph-edge-label { cursor:pointer; }
.network-graph-node-box { fill:#214b40; stroke:#a9c8ac; stroke-width:2; }
.network-graph-node-center .network-graph-node-box { fill:#315f4d; stroke:#d3e7ca; stroke-width:3; }
.network-graph-node-name { fill:#f5f7eb; font:600 17px system-ui,sans-serif; }
.network-graph-edge-label-bg { fill:#e9f0e1; stroke:#9bb9a3; stroke-width:1; }
.network-graph-edge-label text { fill:#173a34; font:600 14px system-ui,sans-serif; }
.network-graph-direction { fill:#d5e7d5; }
.network-graph-caption { color:#d2e2d2; font-size:.85rem; line-height:1.5; }
.network-graph-connection.is-selected .network-graph-edge { stroke:#f3d48c; stroke-width:4; }
.network-graph-connection.is-selected .network-graph-edge-label-bg,
.network-graph-edge-label:hover .network-graph-edge-label-bg,
.network-graph-edge-label:focus-visible .network-graph-edge-label-bg { fill:#f3d48c; stroke:#f3d48c; }
.network-graph-node:hover .network-graph-node-box,
.network-graph-node:focus-visible .network-graph-node-box { stroke:#f3d48c; stroke-width:4; }
.network-graph-edge-hit:focus-visible { stroke:#f3d48c; stroke-width:5; outline:none; }
.network-graph-node:focus-visible,.network-graph-edge-label:focus-visible { outline:none; }
.network-list-fallback { margin-top:1rem; }
.network-list-fallback summary { color:#e6c483; cursor:pointer; font-weight:700; }
@media(max-width:850px) {
  .network-graph-desktop { display:none; }
  .network-graph-mobile { display:block; width:min(100%,420px); min-width:0; margin:auto; }
}
@container (max-width:700px) {
  .network-graph-desktop { display:none; }
  .network-graph-mobile { display:block; width:min(100%,420px); min-width:0; margin:auto; }
}
