/* ============================================================================
   LUDA EKIPA — "HUD" redizajn (2026-08-20)
   ----------------------------------------------------------------------------
   Smjer je uzet iz same igre: CS 1.6 HUD ispisuje zivot i municiju JANTARNOM
   bojom na tamnom, ostrim brojevima. Zato ovdje jantar nosi SVE sto je zivo i
   mjerljivo (igraci, ping, brojevi), a crvena ostaje samo brend i akcija.
   Uz to: nula zaobljenja, tanke svijetle linije umjesto plutajucih kartica,
   i monospace za svaki podatak — kao u konzoli i server browseru.

   Ucitava se POSLIJE theme.css i nexus.css, pa gasi njihov mekani izgled.
   ========================================================================== */

:root,
body.nexus {
  /* --- tlo: hladnije i tvrdje od dosadasnjeg #0a0b0d --- */
  --g0:      #08090a;
  --g1:      #0f1214;
  --g2:      #161a1d;
  --g3:      #1d2226;

  /* --- HUD jantar: boja zivota/municije iz CS 1.6 --- */
  --hud:     #ffb02e;
  --hud-dim: rgba(255,176,46,.16);

  /* --- brend crvena, posvijetljena: stara #e0252e pada ispod AA (4.19:1) --- */
  --red:     #ff3742;
  --red-2:   #ff5560;
  --red-ink: #0a0000;

  --ink:     #eef1f3;
  --ink-2:   #9aa6ae;
  --ink-3:   #6b767e;

  --line:    rgba(255,255,255,.075);
  --line-2:  rgba(255,255,255,.14);
  --live:    #35d07a;

  /* povrsine mapirane na stare nazive, da naslijedjeni CSS odmah slusa */
  --bg:      var(--g0);
  --bg-1:    var(--g1);
  --panel:   var(--g1);
  --panel-2: var(--g2);
  --panel-3: var(--g3);

  /* --- ostro: nista se ne zaobljava --- */
  --r: 0; --r-lg: 0; --r-sm: 0;

  /* --- tipografska skala (bilo je 26 nasumicnih velicina) --- */
  --t-11: .688rem; --t-13: .813rem; --t-15: .938rem;
  --t-18: 1.125rem; --t-24: 1.5rem;  --t-32: 2rem;
  --t-44: 2.75rem; --t-64: 4rem;
}

/* zaobljenja dolje, svuda */
body.nexus *,
body.nexus *::before,
body.nexus *::after { border-radius: 0 !important; }

body, body.nexus { background: var(--g0); color: var(--ink); }

/* --- fokus: ranije ga NIJE bilo nigdje --------------------------------- */
body.nexus a:focus-visible,
body.nexus button:focus-visible,
body.nexus input:focus-visible,
body.nexus select:focus-visible,
body.nexus textarea:focus-visible,
body.nexus [tabindex]:focus-visible {
  outline: 2px solid var(--hud);
  outline-offset: 2px;
}

/* ============================ TIPOGRAFIJA ============================== */
body.nexus h1, body.nexus h2, body.nexus h3 {
  font-family: var(--f-disp);
  letter-spacing: -.028em;
  text-wrap: balance;
}
body.nexus h2 { font-size: clamp(var(--t-24), 3.4vw, var(--t-44)); line-height: 1.06; text-transform: uppercase; }
body.nexus h3 { font-size: var(--t-18); line-height: 1.25; }

/* kicker: mono etiketa sa jantarnom crticom — nosi ritam cijele stranice */
body.nexus .kicker {
  font-family: var(--f-mono);
  font-size: var(--t-11);
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--ink-3);
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 10px;
}
body.nexus .kicker::before {
  content: ""; width: 22px; height: 2px; background: var(--hud); flex: 0 0 auto;
}
body.nexus .sub { color: var(--ink-2); font-size: var(--t-15); max-width: 62ch; }

/* zaglavlje sekcije dobija liniju preko cijele sirine */
body.nexus .sec-head {
  border-bottom: 1px solid var(--line);
  padding-bottom: 18px;
  margin-bottom: 26px;
}

/* svaki podatak je mono i poravnat u kolonu */
body.nexus .mono,
body.nexus .hstat-num, body.nexus .wnum, body.nexus .chnum,
body.nexus .srv-players, body.nexus .srv-region {
  font-family: var(--f-mono);
  font-variant-numeric: tabular-nums;
}

/* ============================== DUGMAD ================================= */
body.nexus .btn {
  font-family: var(--f-mono);
  font-size: var(--t-13);
  letter-spacing: .06em;
  text-transform: uppercase;
  border: 1px solid var(--line-2);
  padding: 11px 18px;
  transition: background .12s linear, border-color .12s linear, color .12s linear;
}
body.nexus .btn-red {
  background: var(--red); color: #fff; border-color: var(--red);
  box-shadow: none; font-weight: 700;
}
body.nexus .btn-red:hover { background: var(--red-2); border-color: var(--red-2); }
body.nexus .btn-ghost, body.nexus .btn-dark {
  background: transparent; color: var(--ink); border-color: var(--line-2);
}
body.nexus .btn-ghost:hover, body.nexus .btn-dark:hover {
  background: var(--hud); color: #0a0a0a; border-color: var(--hud);
}

/* ====================== KARTICE -> REDOVI SA RUBOM ===================== */
/* Bile su plutajuce zaobljene kutije sa sjenkom. Sada su ploce sa jednom
   jantarnom ivicom lijevo — gusce, ostrije, citljivije.                    */
body.nexus .card,
body.nexus .srv-card,
body.nexus .news-card,
body.nexus .com-card,
body.nexus .wpanel {
  background: var(--g1);
  border: 1px solid var(--line);
  border-left: 2px solid var(--line-2);
  box-shadow: none;
  transition: border-left-color .14s linear, background .14s linear;
}
body.nexus .card:hover,
body.nexus .srv-card:hover,
body.nexus .news-card:hover,
body.nexus .com-card:hover,
body.nexus .wpanel:hover {
  background: var(--g2);
  border-left-color: var(--hud);
  transform: none;
}

/* ============================ SERVER LISTA ============================= */
/* Izgleda kao server browser: ime lijevo, podaci desno u mono koloni.      */
body.nexus .srv-title { font-family: var(--f-disp); text-transform: uppercase; letter-spacing: -.02em; }
body.nexus .srv-mode,
body.nexus .srv-region {
  font-family: var(--f-mono); font-size: var(--t-11);
  letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3);
}
body.nexus .srv-players { font-size: var(--t-24); color: var(--hud); font-weight: 700; }
body.nexus .srv-players small,
body.nexus .srv-players span { color: var(--ink-3); font-size: var(--t-13); }

/* traka popunjenosti: jantar, ostra, bez zaobljenja */
body.nexus .bar { background: rgba(255,255,255,.07); height: 3px; }
body.nexus .bar > i,
body.nexus .bar > span,
body.nexus .bar::before { background: var(--hud); }

/* IP polje = konzola */
body.nexus .ipcopy {
  font-family: var(--f-mono); font-size: var(--t-13);
  background: var(--g0); border: 1px solid var(--line);
  color: var(--hud);
}
body.nexus .ip-label {
  font-family: var(--f-mono); font-size: var(--t-11);
  letter-spacing: .16em; text-transform: uppercase; color: var(--ink-3);
}

/* ============================ HERO STATISTIKA ========================== */
body.nexus .hstat-num { font-size: var(--t-32); color: var(--hud); font-weight: 700; line-height: 1; }
body.nexus .hstat-label {
  font-family: var(--f-mono); font-size: var(--t-11);
  letter-spacing: .18em; text-transform: uppercase; color: var(--ink-3);
}
body.nexus .hero-stats { border: 1px solid var(--line); border-left: 2px solid var(--hud); background: rgba(8,9,10,.6); }

/* ============================ ZIVE OZNAKE ============================== */
body.nexus .ld { width: 7px; height: 7px; }
body.nexus .ld-on  { background: var(--live); box-shadow: 0 0 0 3px rgba(53,208,122,.16); }
body.nexus .ld-off { background: var(--ink-3); box-shadow: none; }

/* TS kanali: mono lista, broj ljudi u jantaru */
body.nexus .comms-ch {
  border-bottom: 1px solid var(--line);
  padding: 9px 0;
  font-family: var(--f-mono); font-size: var(--t-13);
}
body.nexus .comms-ch:last-child { border-bottom: 0; }
body.nexus .chico { color: var(--ink-3); }
body.nexus .chname { color: var(--ink-2); }
body.nexus .chnum { color: var(--hud); font-weight: 700; }
body.nexus .comms-ch--empty .chname { color: var(--ink-3); font-style: normal; }

/* ============================== VIJESTI ================================ */
body.nexus .news-tags span,
body.nexus .new-tag {
  font-family: var(--f-mono); font-size: var(--t-11);
  letter-spacing: .12em; text-transform: uppercase;
  border: 1px solid var(--line); color: var(--ink-3); background: transparent;
  padding: 3px 8px;
}
/* izvodi su bili slijepljeni bez razmaka i sjeceni usred rijeci */
body.nexus .news-body { line-height: 1.6; color: var(--ink-2); }
body.nexus .news-body p + p { margin-top: .6em; }

/* ============================== FORME ================================== */
body.nexus input, body.nexus select, body.nexus textarea {
  background: var(--g0);
  border: 1px solid var(--line-2);
  color: var(--ink);
  font-family: var(--f-body);
  padding: 11px 13px;
}
body.nexus input::placeholder, body.nexus textarea::placeholder { color: var(--ink-3); }
body.nexus input:focus, body.nexus select:focus, body.nexus textarea:focus {
  border-color: var(--hud); outline: none;
  box-shadow: inset 0 0 0 1px var(--hud-dim);
}
body.nexus label {
  font-family: var(--f-mono); font-size: var(--t-11);
  letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3);
  display: block; margin-bottom: 6px;
}

/* ============================ NAVIGACIJA =============================== */
body.nexus .nav a, body.nexus header nav a {
  font-family: var(--f-mono); font-size: var(--t-13);
  letter-spacing: .04em;
}
/* aktivna stranica: jantarna crta ispod — 5 od 8 stranica je nije imalo */
body.nexus .nav a[aria-current="page"],
body.nexus .nav a.active {
  color: var(--ink);
  box-shadow: inset 0 -2px 0 var(--hud);
}

/* ============================== FUTER ================================== */
body.nexus footer { border-top: 1px solid var(--line); background: var(--g0); }
body.nexus footer h4, body.nexus footer .foot-h {
  font-family: var(--f-mono); font-size: var(--t-11);
  letter-spacing: .18em; text-transform: uppercase; color: var(--hud);
}

/* ====================== PRAZNA STANJA I PORUKE ========================= */
body.nexus .flash { border: 1px solid var(--line-2); border-left: 2px solid var(--hud); background: var(--g1); }
body.nexus .flash-ok  { border-left-color: var(--live); }
body.nexus .flash-err { border-left-color: var(--red); }

/* ============================ SITNICE ================================== */
body.nexus .sec-conn { color: var(--ink-2); }          /* bilo 2.74:1 — necitljivo */
body.nexus hr { border: 0; border-top: 1px solid var(--line); }
body.nexus ::selection { background: var(--hud); color: #0a0a0a; }

@media (prefers-reduced-motion: reduce) {
  body.nexus * { transition: none !important; animation: none !important; }
}

/* ============================== VIP ==================================== */
/* Stranica je vukla zasebnu zlatnu paletu (--gold) za dugmad, oznake i
   naslove. To se tuklo sa pravilom ostatka sajta: jantar nosi PODATAK,
   crvena nosi AKCIJU. Zato --gold vise ne postoji kao treca boja —
   preslikan je na jantar, a dugmad su vracena u crveno.                   */
body.nexus { --gold: var(--hud); --gold-2: var(--hud); }

/* cijena i coini SU podatak -> jantar, mono, tabularne cifre */
body.nexus .vip-price {
  font-family: var(--f-mono); font-variant-numeric: tabular-nums;
  font-size: var(--t-44); line-height: 1; color: var(--hud); font-weight: 700;
}
body.nexus .vip-price .cur { font-size: var(--t-18); color: var(--ink-3); margin-right: 2px; }
body.nexus .vip-price small {
  display: block; margin-top: 6px;
  font-family: var(--f-mono); font-size: var(--t-11); font-weight: 400;
  letter-spacing: .16em; text-transform: uppercase; color: var(--ink-3);
}
body.nexus .vip-coins {
  font-family: var(--f-mono); font-size: var(--t-13);
  color: var(--ink-2); margin-top: 8px;
}

/* kupovina je AKCIJA -> crvena, kao svuda drugdje */
body.nexus .btn-gold {
  background: var(--red); color: #fff; border-color: var(--red); font-weight: 700;
}
body.nexus .btn-gold:hover { background: var(--red-2); border-color: var(--red-2); }

/* oznaka paketa: tanak jantarni okvir, ne puna zlatna plocica */
body.nexus .vip-flag {
  font-family: var(--f-mono); font-size: var(--t-11);
  letter-spacing: .14em; text-transform: uppercase;
  background: transparent; border: 1px solid var(--line-2);
  color: var(--ink-3); padding: 3px 8px;
}
body.nexus .vip-flag-gold { border-color: var(--hud); color: var(--hud); }

/* istaknuti paket: jantarna ivica lijevo umjesto zlatnog sjaja */
body.nexus .vip-card.pop { border-left-color: var(--hud); background: var(--g2); }

body.nexus .vip-name h3 {
  font-family: var(--f-disp); text-transform: uppercase; letter-spacing: -.02em;
}

/* napomena koja je zamijenila tri identicne liste */
body.nexus .vip-note {
  font-size: var(--t-13); color: var(--ink-3);
  line-height: 1.5; margin: 14px 0 18px;
  padding-top: 14px; border-top: 1px solid var(--line);
}

/* tagline je etiketa, ne podatak -> ostaje prigusen (gasi inline var(--gold)) */
body.nexus .tagline {
  font-family: var(--f-mono); font-size: var(--t-11);
  letter-spacing: .2em; text-transform: uppercase;
  color: var(--ink-3) !important;
}

body.nexus .vip-perks li, body.nexus .split-list li {
  display: flex; gap: 10px; align-items: flex-start;
  padding: 9px 0; border-bottom: 1px solid var(--line);
  font-size: var(--t-15); color: var(--ink-2); line-height: 1.45;
}
body.nexus .vip-perks li:last-child, body.nexus .split-list li:last-child { border-bottom: 0; }
body.nexus .vip-perks svg, body.nexus .split-list svg { color: var(--hud); flex: 0 0 auto; margin-top: 3px; }

/* kartice paketa: sadrzaj im nije iste duzine (srednja nema red sa coinima),
   pa su dugmad stajala na tri razlicite visine. Kolona + auto margina ih
   spusta na isto dno.                                                       */
body.nexus .vip-card { display: flex; flex-direction: column; }
body.nexus .vip-card .btn { margin-top: auto; }
body.nexus .vip-note { margin-bottom: 18px; }

/* ================================ HEROJ ================================ */
/* Bio je visok min(92vh, 860px), a logotip clamp(290px, 40vw, 480px) sirok —
   dvoredni znak visok ~450px. Na ekranu od 900px stali su samo znacka, amblem
   i logotip: nijedno dugme, nijedan podatak, nijedna recenica. Uz to je isti
   znak stajao tri puta (zaglavlje, amblem, logotip).
   Sada: nizi heroj, manji logotip, i sve sto se moze kliknuti u prvom ekranu. */
body.nexus .hero { min-height: min(76vh, 660px); }
body.nexus .hero-inner { padding-block: 34px; }
body.nexus .hero-emblem { display: none; }        /* znak je vec u zaglavlju i logotipu */
body.nexus .hero-logo { width: clamp(190px, 21vw, 280px); margin-bottom: 18px; }
body.nexus .hero-badge {
  font-family: var(--f-mono); font-size: var(--t-11);
  letter-spacing: .18em; text-transform: uppercase;
  background: rgba(8,9,10,.72); border: 1px solid var(--line);
  color: var(--ink-2); padding: 6px 12px; margin-bottom: 18px;
}
body.nexus .hero-tag { font-size: var(--t-15); max-width: 52ch; margin-bottom: 22px; }
body.nexus .hero-cta { gap: 10px; margin-bottom: 20px; }
body.nexus .hero-cta .btn-lg { padding: 13px 22px; font-size: var(--t-13); }
body.nexus .hero-typed { font-size: var(--t-13); color: var(--ink-3); margin-bottom: 18px; }
body.nexus .hero-typed .prompt, body.nexus .hero-typed .caret { color: var(--hud); background: var(--hud); }
body.nexus .hero-typed .prompt { background: none; }

/* citljivost: tekst stoji na fotografiji, pa ide zavjesa SAMO uz lijevu ivicu
   (preklop preko cijelog heroja je ranije gasio i crvena dugmad). */
body.nexus .hero-grad {
  background: linear-gradient(100deg, rgba(8,9,10,.94) 0%, rgba(8,9,10,.80) 34%,
                                      rgba(8,9,10,.30) 62%, rgba(8,9,10,.55) 100%);
}
body.nexus .hero-video { filter: saturate(.8) contrast(1.02) brightness(.46); }

/* statistika u heroju: kompaktna traka umjesto cetiri velika bloka */
body.nexus .hero-stats { display: flex; flex-wrap: wrap; padding: 0; }
body.nexus .hero-stats .hstat { padding: 12px 20px; border-right: 1px solid var(--line); }
body.nexus .hero-stats .hstat:last-child { border-right: 0; }
body.nexus .hstat-num { font-size: var(--t-24); }

@media (max-width: 720px) {
  body.nexus .hero { min-height: auto; }
  body.nexus .hero-inner { padding-block: 26px 30px; }
  body.nexus .hero-grad { background: linear-gradient(180deg, rgba(8,9,10,.86), rgba(8,9,10,.94)); }
  body.nexus .hero-stats .hstat { flex: 1 1 50%; border-right: 0; border-top: 1px solid var(--line); }
}

/* ============================ CETIRI SVETA ============================= */
/* Panele je bojila zasebna paleta po "svijetu" (narandzasta/plava/zelena/
   crvena), pa se cetiri akcentne boje tukle sa sistemom. Svi idu na jantar. */
body.nexus [data-world], body.nexus .wpanel { --w-accent: var(--hud); --wa: var(--hud); }
body.nexus .wpanel {
  background: var(--g1); border: 1px solid var(--line);
  border-left: 2px solid var(--line-2); box-shadow: none;
}
body.nexus .wpanel::before { display: none; }     /* obojeni sjaj po svijetu */
body.nexus .wpanel:hover { border-left-color: var(--hud); background: var(--g2); }
body.nexus .wpanel h3 { font-size: var(--t-18); letter-spacing: -.01em; }
body.nexus .wpanel p { font-size: var(--t-13); color: var(--ink-2); }
body.nexus .wpanel .wstat {
  background: var(--g0); box-shadow: none; border: 1px solid var(--line);
  font-size: var(--t-11); color: var(--ink-3); padding: 4px 10px;
}
body.nexus .wpanel .wstat b { color: var(--hud); }
body.nexus .wpanel .wgo {
  font-family: var(--f-mono); font-size: var(--t-11);
  letter-spacing: .16em; text-transform: uppercase; color: var(--ink-3);
}
body.nexus .wpanel:hover .wgo { color: var(--hud); }

/* Snimak u pozadini ima ugradjen tekst (imena igraca iz originalnog klipa) koji
   je izbijao iza dugmadi u zaglavlju. Desna strana ide tamnije, a kadar se
   pomjera nanize da natpisi izadju iz vidnog polja.                          */
body.nexus .hero-grad {
  background:
    linear-gradient(100deg, rgba(8,9,10,.95) 0%, rgba(8,9,10,.84) 34%,
                            rgba(8,9,10,.52) 64%, rgba(8,9,10,.72) 100%),
    linear-gradient(180deg, rgba(8,9,10,.72) 0%, rgba(8,9,10,0) 26%);
}
body.nexus .hero-video { object-position: 50% 72%; filter: saturate(.78) contrast(1.02) brightness(.40); }

/* ========================= KARTICA SERVERA ============================= */
/* Tri reda teksta su bila slijepljena i skoro istog tona, pa je opis ispod
   naslova izgledao kao duh iza njega. Sada je hijerarhija jasna: naslov,
   pa rezim kao mono etiketa, pa ime servera kako stoji u igri.             */
body.nexus .srv-card { display: flex; flex-direction: column; gap: 12px; padding: 16px 18px 18px; }
body.nexus .srv-top { display: flex; justify-content: space-between; align-items: center; }
body.nexus .srv-status {
  font-family: var(--f-mono); font-size: var(--t-11);
  letter-spacing: .16em; text-transform: uppercase;
  display: inline-flex; align-items: center; gap: 7px; color: var(--ink-2);
}
body.nexus .srv-title { font-size: var(--t-18); margin: 0 0 5px; }
body.nexus .srv-mode {
  margin: 0; font-family: var(--f-mono); font-size: var(--t-11);
  letter-spacing: .14em; text-transform: uppercase; color: var(--hud); opacity: .85;
}
body.nexus .srv-livename {
  margin: 0; font-size: var(--t-13); color: var(--ink-3);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
body.nexus .srv-meta {
  display: flex; justify-content: space-between; align-items: flex-end;
  font-family: var(--f-mono); font-size: var(--t-11);
  letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3);
  padding-top: 10px; border-top: 1px solid var(--line);
}
body.nexus .srv-meta b { color: var(--ink); font-weight: 500; letter-spacing: 0; text-transform: none; }
body.nexus .srv-actions { display: flex; gap: 8px; align-items: stretch; margin-top: auto; }
body.nexus .srv-actions .ipcopy { flex: 1; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 12px; }
body.nexus .srv-card.is-off .srv-players,
body.nexus .srv-card:has(.ld-off) .srv-players { color: var(--ink-3); }

/* aktivna stavka menija: selektor je ranije gadjao .nav, a element nosi
   klasu .nav-main / .nav-mobile — pa se aktivno stanje nikad nije vidjelo. */
body.nexus .nav-main a[aria-current="page"] {
  color: var(--ink); box-shadow: inset 0 -2px 0 var(--hud);
}
body.nexus .nav-mobile a[aria-current="page"] { color: var(--hud); }
body.nexus .nav-main a, body.nexus .nav-mobile a {
  font-family: var(--f-mono); font-size: var(--t-13); letter-spacing: .04em;
}

/* tijelo Pravila: lijeva ivica ista kao kod naslova, mjera na tekstu */
body.nexus .rules-doc { max-width: var(--wrap); }
body.nexus .rules-doc p, body.nexus .rules-doc li { max-width: 74ch; }

body.nexus .apply-doc { max-width: var(--wrap); }

body.nexus .log-doc { max-width: var(--wrap); }

/* ============================ KONTAKT ================================== */
/* Stranica podrske vise nema formu — ostale su rute kontakta. `.split` je
   imao vlastitu mrezu koja je gasila inline kolone, pa cetiri kartice imaju
   svoju.                                                                   */
body.nexus .contact-grid {
  display: grid; gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}
body.nexus .contact-card {
  display: block; padding: 22px 24px; text-decoration: none;
  background: var(--g1); border: 1px solid var(--line);
  border-left: 2px solid var(--line-2);
  transition: border-left-color .14s linear, background .14s linear;
}
body.nexus .contact-card:hover { border-left-color: var(--hud); background: var(--g2); }
body.nexus .contact-card h3 {
  margin: 0 0 8px; font-family: var(--f-disp);
  text-transform: uppercase; letter-spacing: -.01em; font-size: var(--t-18);
}
body.nexus .contact-card p { margin: 0 0 14px; color: var(--ink-2); font-size: var(--t-13); line-height: 1.55; }
body.nexus .contact-card .com-go {
  font-family: var(--f-mono); font-size: var(--t-11);
  letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3);
}
body.nexus .contact-card:hover .com-go { color: var(--hud); }