/* ============================================================
   TERMINAL TRADINGOWY — DESIGN SYSTEM v2 (złoto/grafit)
   Wzorce zdjęte 1:1 z kodu terminali:
   - sidebar/logo/nav: 8000 (Dziennik, main.css)
   - mbb-banner, sw-glass, badge kategorii, chipy .cfb: 8003 (dashboard_v2)
   ============================================================ */
:root{
  --bg0:#0a0e17; --bg2:#13131a; --bg3:#18181f; --bg4:#21212d;
  --border:#21212d; --text:#efefef; --text2:#8a8a9e; --text3:#5a5a72;
  --gold:#C9A84C; --gold-hi:#E8D5A3; --gold-deep:#8B6B14;
  --gold-border:rgba(201,168,76,.3);
  --ok:#34d399; --warn:#f59e0b; --zle:#f87171;
  --shadow-gold:0 0 12px rgba(201,168,76,.25),0 0 4px rgba(201,168,76,.15);
  --shadow-gold-strong:0 0 20px rgba(201,168,76,.4),0 0 8px rgba(201,168,76,.25);
  --radius:12px; --radius-sm:8px;
  --font:"Montserrat",sans-serif;

  /* ── PREMIUM GLOSS: jeden zestaw zmiennych dla całego terminala ──────
     Głębia bierze się z trzech warstw naraz: rozświetlenia u góry (gloss),
     ciemnego dna (spód) i wewnętrznej kreski światła (inset). Wcześniej
     każdy szablon dobierał to sobie inline i karty na różnych stronach
     wyglądały jak z dwóch różnych aplikacji. */
  --gl-tlo:linear-gradient(158deg,rgba(255,255,255,.075) 0%,rgba(255,255,255,.018) 42%,
           rgba(6,10,18,.62) 100%);
  --gl-tlo-mocne:radial-gradient(130% 110% at 12% -25%,rgba(201,168,76,.16),transparent 58%),
           linear-gradient(158deg,rgba(255,255,255,.09) 0%,rgba(255,255,255,.02) 45%,
           rgba(6,10,18,.7) 100%);
  --gl-brzeg:1px solid rgba(255,255,255,.10);
  --gl-inset:inset 0 1px 0 rgba(255,255,255,.14),inset 0 -1px 0 rgba(0,0,0,.35);
  --gl-cien:0 10px 34px rgba(0,0,0,.5),0 2px 8px rgba(0,0,0,.35);
  --gl-cien-hi:0 16px 44px rgba(0,0,0,.6),0 0 22px rgba(201,168,76,.14);
  --gl-pole:linear-gradient(180deg,rgba(255,255,255,.07),rgba(0,0,0,.32));
  --gl-blur:blur(10px);
}
/* natywne kontrolki (kalendarz, spinnery, listy) w ciemnym wariancie */
:root{color-scheme:dark}
*{box-sizing:border-box;scrollbar-width:thin;scrollbar-color:rgba(201,168,76,.35) transparent}
::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(201,168,76,.35);border-radius:10px}
::-webkit-scrollbar-thumb:hover{background:rgba(201,168,76,.65)}
body{margin:0;font-family:var(--font);background:var(--bg0);color:var(--text);
  line-height:1.5;-webkit-font-smoothing:antialiased;height:100vh;overflow:hidden}

/* ── UKŁAD: SIDEBAR (1:1 z 8000) + TREŚĆ ────────────────────── */
.uklad{display:flex;height:100vh}
.sidebar{width:216px;min-width:216px;background:linear-gradient(180deg,#0e0e16,#0b0b12);
  display:flex;flex-direction:column;height:100vh;border-right:1px solid var(--border);
  box-shadow:4px 0 32px #0009,2px 0 8px #0006,inset -1px 0 #ffffff08;
  position:relative;z-index:10;overflow:hidden}
.sidebar-logo{padding:22px 18px 18px;border-bottom:1px solid var(--border)}
.logo-title{font-size:14px;font-weight:800;letter-spacing:-.3px;
  background:linear-gradient(135deg,var(--gold),var(--gold-hi));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.logo-sub{font-size:10.5px;color:var(--text3);text-transform:uppercase;letter-spacing:1.2px;margin-top:2px}
.sidebar-nav{flex:1;padding:8px;display:flex;flex-direction:column;gap:1px;overflow-y:auto}
.nav-item{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:var(--radius-sm);
  background:none;border:none;color:var(--text3);cursor:pointer;font-size:13px;font-weight:500;
  font-family:var(--font);text-align:left;transition:all .15s ease;width:100%;
  position:relative;text-decoration:none}
.nav-item:hover{color:var(--text2);background:#ffffff08}
.nav-item.active{background:linear-gradient(135deg,#7a5c1e38,#c9a84c2e);color:var(--gold);
  font-weight:600;border-left:2px solid var(--gold);
  box-shadow:var(--shadow-gold),inset 0 1px #c9a84c26,inset 0 -1px #00000026}
.nav-item .zn{width:18px;text-align:center;font-size:14px}
.sidebar-bottom{padding:10px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:8px}
.sidebar-user{padding:7px 10px;border-radius:var(--radius-sm);
  background:linear-gradient(145deg,#ffffff0d,#0000000d);border:1px solid rgba(255,255,255,.06);
  display:flex;align-items:center;gap:8px;box-shadow:inset 0 1px #ffffff0f;
  font-size:12px;color:var(--text2)}
.tresc{flex:1;overflow-y:auto;height:100vh;padding:16px 20px}

/* ── BANER ZAKŁADKI (1:1 z .v3-banner 8003) ─────────────────── */
.baner{position:relative;overflow:hidden;display:flex;align-items:center;
  justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:14px;
  padding:20px 24px;border-radius:18px;border:1px solid rgba(201,168,76,.35);
  background:radial-gradient(140% 160% at 8% -30%,rgba(201,168,76,.2),transparent 55%),
    linear-gradient(160deg,rgba(24,22,14,.92),rgba(10,12,17,.96) 60%);
  box-shadow:0 14px 40px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.12)}
.baner-glow{position:absolute;left:6%;right:6%;top:0;height:2px;
  background:linear-gradient(90deg,transparent,rgba(232,212,138,.8),transparent)}
.baner .etykieta{display:flex;align-items:center;gap:8px;font-size:10.5px;font-weight:800;
  letter-spacing:2px;text-transform:uppercase;color:var(--gold);margin-bottom:4px}
.baner .etykieta::before{content:'';width:3px;height:14px;border-radius:2px;
  background:linear-gradient(180deg,var(--gold),var(--gold-deep))}
.baner h1{margin:0;font-size:26px;font-weight:900;letter-spacing:-.3px;color:var(--text);
  font-family:var(--font)}
.baner .pod{color:var(--text2);font-size:12px;margin-top:3px}
.baner-staty{display:flex;gap:10px}
.baner-stat{min-width:96px;text-align:center;padding:11px 16px;border-radius:14px;
  border:1px solid rgba(201,168,76,.3);
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(6,10,16,.6));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 6px 18px rgba(0,0,0,.4)}
.baner-stat .w{font-size:21px;font-weight:900;font-family:var(--font);color:#e8d48a;
  text-shadow:0 0 14px rgba(201,168,76,.35)}
.baner-stat .l{font-size:8.5px;color:var(--text3);text-transform:uppercase;
  letter-spacing:1.2px;font-weight:700;margin-top:2px}

/* ── NAGŁÓWEK SEKCJI TF (1:1 z .v3-tfhdr2 8003) ─────────────── */
.tfhdr{display:flex;align-items:center;justify-content:center;gap:14px;
  margin:26px 0 14px;user-select:none}
.tfhdr .ln{flex:1;height:1px;background:linear-gradient(90deg,transparent,rgba(201,168,76,.5))}
.tfhdr .ln2{flex:1;height:1px;background:linear-gradient(90deg,rgba(201,168,76,.5),transparent)}
.tfhdr .pill{display:flex;align-items:center;gap:11px;padding:11px 26px;border-radius:14px;
  border:1px solid rgba(201,168,76,.4);
  background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.02) 45%,rgba(10,12,17,.7)),
    radial-gradient(120% 100% at 50% -20%,rgba(201,168,76,.22),transparent 60%);
  box-shadow:0 10px 28px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.18)}
.tfhdr .t{font-size:19px;font-weight:900;font-family:var(--font);color:var(--gold);
  letter-spacing:2.5px}
.tfhdr .n{font-size:10px;color:var(--text3);font-weight:700}
.tfhdr .chev{color:var(--gold);font-size:13px}

/* ── KAFEL WYNIKÓW (1:1 z .tn-tile 8003) ────────────────────── */
.tn-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(295px,1fr));gap:12px}
/* `contain` = kazdy kafel malowany osobno, bez unieważniania calej strony.
   Bez tego przewijanie sekcji z 38 kaflami gubilo 16 klatek na 2,5 s i strona
   rozjezdzala sie pozioma szczelina — przegladarka przemalowywala rozmyte
   cienie wszystkich kafli w kazdej klatce. Pomiar: 58 -> 72 FPS.
   `paint` jest tu bezpieczne, bo kafel i tak ma `overflow:hidden`. */
/* jedna warstwa tla zamiast dwoch. Zdjety radialny poblysk mial 7% krycia
   zlota w rogu — na ekranie niewidoczny, a rasteryzacja drugiego gradientu na
   206 kaflach zakladki Wyniki kosztowala tyle, ze przewijanie spadalo do 48 FPS
   (plaskie tlo w tescie: 78 FPS). Glebia zostaje z gradientu liniowego. */
.tn-tile{contain:layout paint style;position:relative;overflow:hidden;cursor:pointer;
  border-radius:13px;padding:15px 16px 12px;
  background:linear-gradient(160deg,#141822 0%,#0d1017 55%,#0a0c11 100%);
  border:1px solid rgba(255,255,255,.06);
  box-shadow:0 5px 18px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.05);
  transition:all .2s}
.tn-tile:hover{transform:translateY(-2px);border-color:rgba(201,168,76,.45);
  box-shadow:0 8px 26px rgba(0,0,0,.55),0 0 18px rgba(201,168,76,.10),
  inset 0 1px 0 rgba(255,255,255,.07)}
.tn-tile-glow{position:absolute;left:8%;right:8%;top:0;height:1.5px;
  background:linear-gradient(90deg,transparent,rgba(201,168,76,.55),transparent)}
.tn-sym{font-size:17px;font-weight:900;font-family:var(--font);color:var(--text);
  letter-spacing:.3px}
.tn-baz{font-size:9px;font-weight:800;color:#34d399;background:rgba(52,211,153,.12);
  border:1px solid rgba(52,211,153,.35);padding:2px 9px;border-radius:10px}
.tn-pnl{font-size:26px;font-weight:900;font-family:var(--font)}
.tn-stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px 10px}
.tn-sl{font-size:8px;color:var(--text3);text-transform:uppercase;letter-spacing:.9px;
  font-family:var(--font)}
.tn-sv{font-size:13.5px;font-weight:800;font-family:var(--font);
  font-feature-settings:'tnum'}

/* ── KARTA / KAFEL (1:1 z .sw-glass 8003) ───────────────────── */
/* UWAGA: karta NIE ma `backdrop-filter`. Rozmycie tla na dziesiatkach kart
   w kontenerze przewijanym (`.tresc`) kazało Chrome kompozytować każdą z nich
   osobno — przy przewijaniu strona rozjeżdżała się poziomą szczeliną. Głębia
   i tak bierze się z gradientu i wewnętrznych rozświetleń, nie z rozmycia:
   pod kartami leży jednolite ciemne tło, więc nie było czego rozmywać. */
.karta{position:relative;background:var(--gl-tlo);border:var(--gl-brzeg);border-radius:14px;
  box-shadow:var(--gl-cien),var(--gl-inset);padding:16px 18px}
/* pasek światła u góry karty — to on daje wrażenie szkła, nie sam gradient */
.karta::before{content:'';position:absolute;left:9%;right:9%;top:0;height:1px;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent)}
.karta-zlota{background:var(--gl-tlo-mocne);border-color:var(--gold-border);
  box-shadow:var(--shadow-gold),var(--gl-cien),var(--gl-inset)}
.karta-zlota::before{background:linear-gradient(90deg,transparent,rgba(232,212,138,.75),transparent)}

/* ── BADGE KATEGORII (1:1 z swCatBadge 8003) ────────────────── */
.kat{display:inline-flex;align-items:center;gap:5px;padding:2px 8px;border-radius:7px;
  font-size:9.5px;font-weight:800;font-family:var(--font);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1);text-transform:uppercase}
.kat-duzy{padding:3px 11px;font-size:11px}
.kat-fx{background:linear-gradient(160deg,rgba(96,165,250,.22),rgba(96,165,250,.07));
  border:1px solid rgba(96,165,250,.55);color:#9ec8f8}
.kat-crypto{background:linear-gradient(160deg,rgba(250,130,49,.22),rgba(250,130,49,.07));
  border:1px solid rgba(250,130,49,.55);color:#ffc9a3}
.kat-metal,.kat-comm{background:linear-gradient(160deg,rgba(201,168,76,.22),rgba(201,168,76,.07));
  border:1px solid rgba(201,168,76,.55);color:#e3cf96}
.kat-index{background:linear-gradient(160deg,rgba(240,180,41,.22),rgba(240,180,41,.07));
  border:1px solid rgba(240,180,41,.55);color:#f3d68a}

/* ── CHIPY KONFIGURACJI (1:1 z .cfb / swCfgBadges 8003) ─────── */
.cfb{display:inline-block;padding:1px 7px;border-radius:6px;font-size:10px;
  font-weight:700;letter-spacing:.3px;margin-right:4px;white-space:nowrap}
.cfb-trigger{background:linear-gradient(160deg,rgba(240,180,41,.22),rgba(240,180,41,.06));
  border:1px solid rgba(240,180,41,.4);color:#f3d68a}
.cfb-warunek{background:linear-gradient(160deg,rgba(158,140,196,.22),rgba(158,140,196,.06));
  border:1px solid rgba(158,140,196,.4);color:#c0b2dc}
.cfb-wyjscie{background:linear-gradient(160deg,rgba(193,102,107,.22),rgba(193,102,107,.06));
  border:1px solid rgba(193,102,107,.4);color:#e2a8ab}
.cfb-tf{background:linear-gradient(160deg,rgba(111,147,189,.22),rgba(111,147,189,.06));
  border:1px solid rgba(111,147,189,.4);color:#aec2da}
.cfb-sl{background:linear-gradient(160deg,rgba(198,172,118,.22),rgba(198,172,118,.06));
  border:1px solid rgba(198,172,118,.4);color:#d8c69c}
.cfb-rr{background:linear-gradient(160deg,rgba(100,153,120,.22),rgba(100,153,120,.06));
  border:1px solid rgba(100,153,120,.4);color:#9cc4ab}
.cfb-szary{background:linear-gradient(160deg,rgba(138,151,168,.22),rgba(138,151,168,.06));
  border:1px solid rgba(138,151,168,.4);color:#aab6c6}
.cfb-zloty{background:linear-gradient(160deg,rgba(201,168,76,.22),rgba(201,168,76,.06));
  border:1px solid rgba(201,168,76,.4);color:#dcc180}
/* zielony badge liczby (jak „16 baz") */
.cfb-baz{background:linear-gradient(160deg,rgba(52,211,153,.22),rgba(52,211,153,.06));
  border:1px solid rgba(52,211,153,.45);color:#6ee7b7;border-radius:999px;padding:1px 9px}

/* pigułki transakcyjne (BUY/SELL/SL/TP/TS/PC/BE/HEDGE/OVERLAP) */
.pig-buy{background:linear-gradient(160deg,rgba(96,165,250,.22),rgba(96,165,250,.07));
  border:1px solid rgba(96,165,250,.55);color:#9ec8f8}
.pig-sell{background:linear-gradient(160deg,rgba(224,85,85,.22),rgba(224,85,85,.07));
  border:1px solid rgba(224,85,85,.55);color:#f0a5a9}
.pig-sl{background:linear-gradient(160deg,rgba(248,113,113,.22),rgba(248,113,113,.06));
  border:1px solid rgba(248,113,113,.4);color:#f0a5a9}
.pig-tp{background:linear-gradient(160deg,rgba(52,211,153,.22),rgba(52,211,153,.06));
  border:1px solid rgba(52,211,153,.4);color:#6ee7b7}
.pig-ts{background:linear-gradient(160deg,rgba(111,147,189,.22),rgba(111,147,189,.06));
  border:1px solid rgba(111,147,189,.4);color:#aec2da}
.pig-pc{background:linear-gradient(160deg,rgba(240,180,41,.22),rgba(240,180,41,.06));
  border:1px solid rgba(240,180,41,.4);color:#f3d68a}
.pig-be{background:linear-gradient(160deg,rgba(138,151,168,.22),rgba(138,151,168,.06));
  border:1px solid rgba(138,151,168,.4);color:#aab6c6}
.pig-hedge{background:linear-gradient(160deg,rgba(158,140,196,.22),rgba(158,140,196,.06));
  border:1px solid rgba(158,140,196,.4);color:#c0b2dc}
.pig-overlap{background:linear-gradient(160deg,rgba(193,102,107,.22),rgba(193,102,107,.06));
  border:1px solid rgba(193,102,107,.4);color:#e2a8ab}

/* ── BADGE SESJI HANDLOWYCH (kolory jak w liście 8003) ──────── */
.ses{display:inline-block;padding:2px 8px;border-radius:8px;font-size:8.5px;
  font-weight:800;letter-spacing:.5px;text-transform:uppercase;white-space:nowrap}
.ses-tokio{background:linear-gradient(160deg,rgba(201,168,76,.24),rgba(201,168,76,.07));
  border:1px solid rgba(201,168,76,.5);color:#e3cf96}
.ses-toklon{background:linear-gradient(160deg,rgba(116,198,157,.2),rgba(201,168,76,.08));
  border:1px solid rgba(150,190,130,.45);color:#cfe3b0}
.ses-londyn{background:linear-gradient(160deg,rgba(82,183,136,.22),rgba(82,183,136,.06));
  border:1px solid rgba(82,183,136,.5);color:#8fdcb6}
.ses-overlap{background:linear-gradient(160deg,rgba(82,183,136,.26),rgba(30,92,58,.1));
  border:1px solid rgba(82,183,136,.6);color:#a5e8c6}
.ses-ny{background:linear-gradient(160deg,rgba(74,144,217,.24),rgba(74,144,217,.07));
  border:1px solid rgba(74,144,217,.55);color:#9ec8f8}
.ses-off{background:linear-gradient(160deg,rgba(138,151,168,.18),rgba(138,151,168,.05));
  border:1px solid rgba(138,151,168,.4);color:#aab6c6}

/* ── PRZYCISKI AGENTA (Bloki/Weekend/Retest/Wg planu jak 8003) ─ */
.abtn{display:inline-flex;align-items:center;gap:7px;padding:9px 16px;border-radius:11px;
  font-size:11.5px;font-weight:800;font-family:var(--font);cursor:pointer;
  text-decoration:none;transition:all .15s;border:1px solid;letter-spacing:.3px}
.abtn:hover{transform:translateY(-1px);filter:brightness(1.12)}
.abtn-blk{background:linear-gradient(180deg,rgba(193,102,107,.28),rgba(90,32,48,.35));
  border-color:rgba(193,102,107,.55);color:#f0b7ba}
.abtn-wknd{background:linear-gradient(180deg,rgba(167,139,250,.26),rgba(76,53,140,.3));
  border-color:rgba(167,139,250,.5);color:#cfc0f5}
.abtn-rt{background:linear-gradient(180deg,rgba(250,130,49,.26),rgba(140,66,20,.3));
  border-color:rgba(250,130,49,.55);color:#ffc9a3}
.abtn-plan{background:linear-gradient(180deg,rgba(74,144,217,.26),rgba(21,61,107,.35));
  border-color:rgba(74,144,217,.55);color:#a9cdf3}
.abtn.on{box-shadow:0 0 0 1px rgba(255,255,255,.25) inset,0 0 16px rgba(255,255,255,.12);
  filter:brightness(1.25)}

/* ── PODIUM + NUMERY MIEJSC (premium gloss szkło) ───────────── */
.podium{border-radius:12px 12px 6px 6px;display:flex;align-items:center;justify-content:center;
  font-size:30px;font-weight:900;font-family:var(--font);position:relative;overflow:hidden;
  box-shadow:0 14px 30px rgba(0,0,0,.55),inset 0 2px 0 rgba(255,255,255,.55),
  inset 0 -10px 20px rgba(0,0,0,.35)}
.podium::after{content:'';position:absolute;top:-70%;left:-20%;width:60%;height:250%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.35) 45%,transparent 60%);
  transform:rotate(10deg)}
.podium-1{background:linear-gradient(135deg,#f4e3a1,#c9a84c 55%,#8B6B14);color:#241a04}
.podium-2{background:linear-gradient(135deg,#eef1f6,#aab2bd 55%,#6c737d);color:#181c22}
.podium-3{background:linear-gradient(135deg,#e8b585,#b5763a 55%,#7a4a1c);color:#221204}
.miejsce{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:30px;
  border-radius:9px;font-weight:900;font-size:13px;font-family:var(--font);color:var(--gold-hi);
  background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(201,168,76,.12) 45%,rgba(10,12,17,.6)),
    radial-gradient(120% 100% at 50% -20%,rgba(201,168,76,.3),transparent 60%);
  border:1px solid rgba(201,168,76,.45);
  box-shadow:0 4px 10px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.25)}

/* ── KREATOR: chipy .sw-b + dropdowny .pdrop (1:1 z 8003) ───── */
.sw-lbl{font-size:8.5px;color:var(--text3);text-transform:uppercase;letter-spacing:.8px;
  font-weight:800;margin-bottom:5px;font-family:var(--font)}
.sw-row{display:flex;gap:4px;flex-wrap:wrap;align-items:center}
.sw-b{display:inline-block;padding:4px 11px;border-radius:8px;font-size:10.5px;font-weight:700;
  cursor:pointer;user-select:none;color:var(--text2);border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(0,0,0,.28));
  transition:all .13s;font-family:var(--font)}
.sw-b:hover{border-color:rgba(240,180,41,.45);color:#f0e6c8}
.sw-b.on{color:#f3d68a;border-color:rgba(240,180,41,.65);
  background:linear-gradient(135deg,rgba(247,207,92,.24),rgba(232,161,58,.14));
  box-shadow:0 0 10px rgba(240,180,41,.18),inset 0 1px 0 rgba(255,255,255,.15)}
.pdrop{position:relative}
.pdrop-btn{width:100%;text-align:left;display:flex;justify-content:space-between;align-items:center;
  gap:8px;padding:7px 11px;border-radius:9px;cursor:pointer;font-size:11px;font-weight:600;
  color:var(--text);font-family:var(--font);border:1px solid rgba(255,255,255,.13);
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(0,0,0,.3))}
.pdrop-btn:hover{border-color:rgba(240,180,41,.45)}
.pdrop-pop{display:none;position:absolute;left:0;top:calc(100% + 4px);z-index:40;
  min-width:290px;max-height:360px;overflow-y:auto;border-radius:11px;
  border:1px solid rgba(240,180,41,.3);background:linear-gradient(180deg,#161e2a,#0d131d);
  box-shadow:0 18px 44px rgba(0,0,0,.65),inset 0 1px 0 rgba(255,255,255,.08)}
.pdrop-pop.open{display:block}
.pdrop-item{display:flex;align-items:center;gap:8px;padding:6px 11px;font-size:11px;
  cursor:pointer;color:var(--text2)}
.pdrop-item:hover{background:rgba(240,180,41,.08);color:var(--text)}
.pdrop-item.sel{color:#f3d68a}
.pdrop-item .chk{width:14px;text-align:center;color:#52b788;font-weight:900}
.pdrop-group{padding:5px 11px 3px;font-size:8.5px;color:var(--text3);
  text-transform:uppercase;letter-spacing:.8px;border-top:1px solid rgba(255,255,255,.06)}
.przycisk-run{padding:8px 20px;background:linear-gradient(135deg,#f7cf5c,#e8a13a 60%,#c96a1f);
  color:#1a1206;border:1px solid rgba(255,255,255,.16);border-radius:9px;font-size:12px;
  font-weight:800;cursor:pointer;font-family:var(--font);
  box-shadow:0 8px 22px rgba(240,180,41,.4),inset 0 1px 0 rgba(255,255,255,.3)}

/* ── WARTOŚCI PROGOWE (jak col() w 8003) ────────────────────── */
.v-ok{color:var(--ok);font-weight:700} .v-warn{color:var(--warn);font-weight:700}
.v-zle{color:var(--zle);font-weight:700} .v-zloto{color:var(--gold-hi);font-weight:700}
.pnl-plus{color:var(--ok);font-weight:800} .pnl-minus{color:var(--zle);font-weight:800}

/* ── PASEK POSTĘPU (złoty, % + x/y) ─────────────────────────── */
.pasek{background:var(--bg3);border:1px solid var(--border);border-radius:999px;
  height:20px;position:relative;overflow:hidden}
.pasek .wyp{height:100%;border-radius:999px;
  background:linear-gradient(90deg,var(--gold-deep),var(--gold) 60%,var(--gold-hi));
  box-shadow:var(--shadow-gold);transition:width .5s}
.pasek .info{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  gap:10px;font-size:11px;font-weight:700;text-shadow:0 1px 3px rgba(0,0,0,.8)}

/* ── KAFLE DASHBOARDU ───────────────────────────────────────── */
.kafle{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
/* to samo co przy .tn-tile — kafle nawigacyjne nie maja w srodku nic, co
   wystaje poza ich obrys, wiec izolacja malowania niczego nie przycina */
.kafel{contain:layout paint style;cursor:pointer;text-decoration:none;color:var(--text);
  transition:all .18s ease;display:block}
.kafel:hover{transform:translateY(-2px);border-color:var(--gold-border);
  box-shadow:var(--shadow-gold-strong),0 10px 34px rgba(0,0,0,.5)}
.kafel .zn{font-size:26px;color:var(--gold);text-shadow:0 0 14px rgba(201,168,76,.5)}
.kafel h3{margin:8px 0 4px;font-size:15.5px;font-weight:700;color:var(--gold-hi)}
.kafel p{margin:0;color:var(--text2);font-size:12px}

/* ── TABELE / MODAL / FORMULARZE ────────────────────────────── */
.tabela{width:100%;border-collapse:collapse;font-size:12.5px}
.tabela th{color:var(--text3);text-transform:uppercase;font-size:10.5px;letter-spacing:1px;
  text-align:left;padding:8px 10px;border-bottom:1px solid var(--border)}
.tabela td{padding:8px 10px;border-bottom:1px solid #ffffff08}
.tabela tr:hover td{background:#c9a84c0a}
.modal-tlo{position:fixed;inset:0;background:rgba(5,5,8,.7);backdrop-filter:blur(6px);
  display:flex;align-items:center;justify-content:center;z-index:50}
.modal{max-width:860px;width:92%;max-height:86vh;overflow:auto}
.pole{width:100%;padding:10px 13px;border-radius:var(--radius-sm);color:var(--text);
  background:var(--bg3);border:1px solid var(--border);outline:none;
  font-family:var(--font);font-size:13px}
.pole:focus{border-color:var(--gold);box-shadow:var(--shadow-gold)}
.przycisk{padding:10px 20px;border:1px solid var(--gold-border);border-radius:var(--radius-sm);
  cursor:pointer;font-weight:700;letter-spacing:.4px;font-family:var(--font);font-size:13px;
  color:#1a1200;background:linear-gradient(135deg,var(--gold),var(--gold-hi));
  box-shadow:var(--shadow-gold);transition:all .15s ease}
.przycisk:hover{box-shadow:var(--shadow-gold-strong);filter:brightness(1.06)}
.przycisk-cichy{background:var(--bg3);color:var(--text2);border:1px solid var(--border);box-shadow:none}
.mut{color:var(--text2)} .mut2{color:var(--text3)} .maly{font-size:11.5px}

/* ════════════════════════════════════════════════════════════════════
   PREMIUM GLOSS v3 — warstwa wspólna dla całego terminala
   ════════════════════════════════════════════════════════════════════ */

/* ── POD-MENU BACKTESTU W SIDEBARZE ──────────────────────────── */
.nav-pod{display:flex;flex-direction:column;gap:1px;margin:3px 0 5px 13px;
  padding-left:9px;border-left:1px solid rgba(201,168,76,.22)}
.nav-pod-item{display:flex;align-items:center;gap:8px;padding:5px 9px;border-radius:7px;
  color:var(--text3);font-size:11.5px;font-weight:500;text-decoration:none;
  transition:all .13s ease;position:relative}
.nav-pod-item:hover{color:var(--text2);background:#ffffff08}
.nav-pod-item.active{color:var(--gold);font-weight:700;
  background:linear-gradient(135deg,rgba(122,92,30,.3),rgba(201,168,76,.14));
  box-shadow:inset 0 1px 0 rgba(201,168,76,.2),0 0 10px rgba(201,168,76,.12)}
.nav-pod-item.active::before{content:'';position:absolute;left:-10px;top:50%;
  transform:translateY(-50%);width:3px;height:14px;border-radius:2px;
  background:linear-gradient(180deg,var(--gold-hi),var(--gold-deep));
  box-shadow:0 0 8px rgba(201,168,76,.6)}
.nav-pod-item .zn{width:14px;text-align:center;font-size:11.5px;opacity:.85}
.nav-pod-item .nz{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ── KAFLE WEJŚCIA W SEKCJE (mniejsze niż dashboardowe) ─────── */
.kafle-mini{grid-template-columns:repeat(auto-fill,minmax(224px,1fr));gap:10px;margin-bottom:6px}
.kafel-mini{padding:12px 14px 13px}
.kafel-mini .zn{font-size:19px}
.kafel-mini h3{margin:5px 0 3px;font-size:13px;letter-spacing:.2px}
.kafel-mini p{font-size:10.5px;line-height:1.42;color:var(--text3)}
.kafel-mini:hover p{color:var(--text2)}

/* ── KREATOR: jedna wysokość dla każdej sekcji, kontrolki na całą szerokość ─
   Kreatory różnią się liczbą pól (Fluid ma 6, SPS 10), więc bez wymuszonej
   wysokości podium skakało w górę i w dół przy przełączaniu sekcji. */
.kreator{padding:12px 14px;margin-bottom:12px;min-height:322px;
  display:flex;flex-direction:column}
/* Rzędy dzielą wolną przestrzeń po równo, a każda komórka jest w swoim rzędzie
   wyśrodkowana (`align-items`, NIE `display:flex` na dzieciach — kilka komórek
   ma własne inline `display:flex` w poziomie i pionowa oś by je rozwaliła). */
.kr-siatka{display:grid;gap:11px 15px;flex:1;align-content:stretch;
  align-items:center;grid-auto-rows:minmax(min-content,1fr)}
.kr-siatka > div{min-width:0}
/* kreatory z dużą liczbą pól (SniperPro Scalping ma ich dziesięć) zagęszczam,
   żeby wysokość kafla nie odjeżdżała od pozostałych sekcji */
.kr-siatka:has(> div:nth-child(9)){gap:7px 14px}
.kr-siatka:has(> div:nth-child(9)) .sw-lbl{font-size:7.5px;margin-bottom:3px}
.kr-siatka:has(> div:nth-child(9)) .sw-b{padding:3px 8px;font-size:9.5px}
.kr-siatka:has(> div:nth-child(9)) .pole{padding:5px 8px;font-size:10.5px}
.kr-siatka:has(> div:nth-child(9)) .pdrop-btn{padding:6px 9px;font-size:10px}
.kr-stopka{display:flex;align-items:center;gap:12px;margin-top:10px;padding-top:9px;
  border-top:1px solid rgba(255,255,255,.07)}
/* zmniejszenie o kilka % + rozciągnięcie kontrolek na wolną przestrzeń */
.kreator .sw-lbl{font-size:8px;margin-bottom:4px}
.kreator .sw-row{gap:4px}
.kreator .sw-b{padding:4px 9px;font-size:10px;flex:1 1 auto;text-align:center;min-width:34px}
.kreator .pdrop-btn{padding:7px 10px;font-size:10.5px}
.kreator .pole{padding:6px 9px;font-size:11px;width:100%}
.kreator .pdrop{width:100%}
.kreator .przycisk-run{padding:7px 18px;font-size:11.5px}

/* ── PREMIUM PASEK POSTĘPU TESTÓW ───────────────────────────── */
.pp{position:relative;overflow:hidden;margin-bottom:12px;padding:12px 16px 13px;
  border-radius:15px;border:1px solid rgba(201,168,76,.26);
  background:radial-gradient(130% 150% at 6% -35%,rgba(201,168,76,.15),transparent 55%),
    linear-gradient(158deg,rgba(24,22,14,.88),rgba(10,12,17,.95) 62%);
  box-shadow:var(--gl-cien),var(--gl-inset)}
.pp-glow{position:absolute;left:6%;right:6%;top:0;height:2px;
  background:linear-gradient(90deg,transparent,rgba(232,212,138,.75),transparent)}
.pp-gora{display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-bottom:9px;flex-wrap:wrap}
.pp-tyt{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:800;
  letter-spacing:1.4px;text-transform:uppercase;color:var(--gold)}
.pp-ikona{font-size:13px;display:inline-block}
.pp[data-stan="zywy"] .pp-ikona{animation:pp-obrot 1.4s linear infinite;color:var(--gold-hi)}
.pp[data-stan="koniec"] .pp-ikona{color:var(--ok)}
.pp[data-stan="blad"] .pp-ikona{color:var(--zle)}
@keyframes pp-obrot{to{transform:rotate(360deg)}}
.pp-teraz{font-size:11px;color:var(--text2);font-weight:600;text-align:right;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:56%}
.pp-staty{display:flex;gap:26px;flex-wrap:wrap;margin-top:9px;font-size:11.5px}
.pp-l{font-size:8.5px;color:var(--text3);text-transform:uppercase;letter-spacing:1.1px;
  font-weight:800;margin-bottom:1px}

/* pasek premium: szkło + połysk + przesuwające się prążki gdy testy idą */
.pasek-premium{height:24px;border-radius:12px;border:1px solid rgba(201,168,76,.28);
  background:linear-gradient(180deg,rgba(0,0,0,.45),rgba(255,255,255,.03));
  box-shadow:inset 0 2px 6px rgba(0,0,0,.6),inset 0 -1px 0 rgba(255,255,255,.06)}
.pasek-premium .wyp{position:relative;overflow:hidden;
  background:linear-gradient(180deg,#f4d97a 0%,#d4af37 38%,#a8873a 72%,#8a6d1f 100%);
  box-shadow:0 0 18px rgba(212,175,55,.45),inset 0 1px 0 rgba(255,255,255,.55),
    inset 0 -6px 12px rgba(0,0,0,.3)}
.pasek-premium .wyp::after{content:'';position:absolute;inset:0;
  background:repeating-linear-gradient(115deg,rgba(255,255,255,.16) 0 10px,
    transparent 10px 22px);opacity:0}
.pp[data-stan="zywy"] .pasek-premium .wyp::after{opacity:1;
  animation:pp-prazki 1.1s linear infinite}
@keyframes pp-prazki{to{background-position:44px 0}}
.pasek-premium .info{font-size:11.5px;font-weight:800;letter-spacing:.3px;
  color:#f2ead2;text-shadow:0 1px 3px rgba(0,0,0,.9)}
/* stan spoczynku — pasek zostaje w układzie, ale nie udaje pracy */
.pp[data-stan="spokoj"] .pasek-premium .wyp{filter:grayscale(.75) brightness(.75);
  box-shadow:none}
.pp[data-stan="koniec"] .pasek-premium .wyp{
  background:linear-gradient(180deg,#a7f3d0 0%,#34d399 40%,#0f9d6e 100%);
  box-shadow:0 0 18px rgba(52,211,153,.4),inset 0 1px 0 rgba(255,255,255,.5)}
.pp[data-stan="blad"] .pasek-premium .wyp{
  background:linear-gradient(180deg,#fca5a5 0%,#ef4444 45%,#991b1b 100%);
  box-shadow:0 0 18px rgba(239,68,68,.35),inset 0 1px 0 rgba(255,255,255,.4)}

/* ── ZADANIA W TLE (Dashboard) ──────────────────────────────────
   Ten sam pasek co w sekcjach Backtestu, tylko w stosie: jedna pozycja na
   zadanie. Dzięki temu przenoszenie danych, kolejka testów i przebudowa
   indeksu wygladaja tak samo i czyta sie je jednym spojrzeniem. */
.zwt-gora{display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-bottom:10px;flex-wrap:wrap}
.zwt-poz{padding:11px 0 12px;border-top:1px solid rgba(255,255,255,.07)}
.zwt-poz:first-child{border-top:none;padding-top:2px}
.zwt-naglowek{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:7px}
.zwt-ikona{font-size:12px;color:var(--text3);display:inline-block}
.zwt-poz[data-stan="zywy"] .zwt-ikona{color:var(--gold-hi);
  animation:pp-obrot 1.4s linear infinite}
.zwt-poz[data-stan="koniec"] .zwt-ikona{color:var(--ok)}
.zwt-poz[data-stan="blad"] .zwt-ikona{color:var(--zle)}
.zwt-nazwa{font-size:12.5px;color:var(--text);font-weight:700}
.zwt-teraz{font-size:10.5px;color:var(--text2);margin-left:auto;text-align:right;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:46%}
.zwt-staty{display:flex;gap:22px;flex-wrap:wrap;margin-top:7px;font-size:11px;
  color:var(--text2)}
.zwt-staty .pp-l{display:inline;margin:0 4px 0 0}
/* stan spoczynku pojedynczej pozycji — pasek nie udaje pracy */
.zwt-poz[data-stan="spokoj"] .pasek-premium .wyp{filter:grayscale(.75) brightness(.75);
  box-shadow:none}
.zwt-poz[data-stan="zywy"] .pasek-premium .wyp::after{opacity:1;
  animation:pp-prazki 1.1s linear infinite}
.zwt-poz[data-stan="koniec"] .pasek-premium .wyp{
  background:linear-gradient(180deg,#a7f3d0 0%,#34d399 40%,#0f9d6e 100%);
  box-shadow:0 0 18px rgba(52,211,153,.4),inset 0 1px 0 rgba(255,255,255,.5)}
.zwt-poz[data-stan="blad"] .pasek-premium .wyp{
  background:linear-gradient(180deg,#fca5a5 0%,#ef4444 45%,#991b1b 100%);
  box-shadow:0 0 18px rgba(239,68,68,.35),inset 0 1px 0 rgba(255,255,255,.4)}

/* pasek pomocniczy (miesiące, udziały) — ta sama głębia, mniejsza skala */
.pasek-mini{height:14px;border-radius:7px;overflow:hidden;
  background:linear-gradient(180deg,rgba(0,0,0,.42),rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.07);
  box-shadow:inset 0 1px 4px rgba(0,0,0,.55)}
.pasek-mini .wyp{height:100%;border-radius:7px;transition:width .4s ease;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.4),inset 0 -3px 7px rgba(0,0,0,.3)}

/* ── PODIUM SEKCJI ──────────────────────────────────────────── */
.podium-rzad{display:flex;justify-content:center;align-items:flex-end;gap:14px;
  flex-wrap:wrap;margin-bottom:20px}
.podium-slup{display:flex;flex-direction:column;width:340px;max-width:100%}
.tn-tile-lider{border-color:rgba(201,168,76,.5)!important;
  box-shadow:0 0 26px rgba(201,168,76,.18),0 10px 30px rgba(0,0,0,.55),
    inset 0 1px 0 rgba(255,255,255,.09)!important}
.miejsce-maly{min-width:23px;height:23px;border-radius:7px;font-size:11px}

/* ── BADGE / CHIPY: dodanie głębi bez zmiany kolorystyki 8000/8002/8003 ──
   Bez `backdrop-filter` — jedna strona ma ich ponad dwieście (38 kafli × 6 chipów)
   i każdy byłby osobną warstwą kompozycji. Na 10-pikselowym chipie rozmycie tła
   i tak jest niewidoczne, a kosztowało płynność przewijania. */
.cfb,.kat,.ses,.pig-buy,.pig-sell{box-shadow:inset 0 1px 0 rgba(255,255,255,.16),
  0 1px 3px rgba(0,0,0,.45)}
.kat{box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 2px 6px rgba(0,0,0,.5)}
a.cfb,button.cfb{text-decoration:none;transition:all .14s ease}
a.cfb:hover,button.cfb:hover{filter:brightness(1.18);transform:translateY(-1px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 4px 10px rgba(0,0,0,.5)}

/* ── POLA / DROPDOWNY / KALENDARZE ──────────────────────────── */
.pole,select.pole,input[type=date].pole,input[type=number].pole,textarea.pole{
  background:var(--gl-pole);border:1px solid rgba(255,255,255,.13);
  box-shadow:inset 0 1px 3px rgba(0,0,0,.45),inset 0 -1px 0 rgba(255,255,255,.06);
  transition:border-color .14s ease,box-shadow .14s ease}
.pole:hover{border-color:rgba(201,168,76,.4)}
.pole:focus{border-color:var(--gold);
  box-shadow:var(--shadow-gold),inset 0 1px 3px rgba(0,0,0,.45)}
select.pole{appearance:none;-webkit-appearance:none;padding-right:30px;cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,var(--gold) 50%),
    linear-gradient(135deg,var(--gold) 50%,transparent 50%),var(--gl-pole);
  background-position:calc(100% - 15px) center,calc(100% - 10px) center,0 0;
  background-size:5px 5px,5px 5px,100% 100%;background-repeat:no-repeat}
select.pole option{background:#12161f;color:var(--text)}
/* ikonka kalendarza w złocie zamiast systemowej szarości */
input[type=date]::-webkit-calendar-picker-indicator{cursor:pointer;opacity:.75;
  filter:invert(78%) sepia(38%) saturate(560%) hue-rotate(2deg) brightness(92%)}
input[type=date]:hover::-webkit-calendar-picker-indicator{opacity:1}
input[type=checkbox]{accent-color:var(--gold);width:13px;height:13px;cursor:pointer}
.pdrop-btn{background:var(--gl-pole);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 2px 8px rgba(0,0,0,.4);
  transition:all .14s ease}
.pdrop-btn:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 4px 12px rgba(0,0,0,.5)}
.pdrop-pop{background:radial-gradient(120% 80% at 50% -10%,rgba(201,168,76,.1),transparent 60%),
  linear-gradient(180deg,#171f2c,#0c111a);
  box-shadow:0 22px 50px rgba(0,0,0,.7),0 0 0 1px rgba(0,0,0,.4),
    inset 0 1px 0 rgba(255,255,255,.1)}
.pdrop-item{transition:background .1s ease}
.sw-b{box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 2px 5px rgba(0,0,0,.35)}
.przycisk-run{transition:all .15s ease}
.przycisk-run:hover{filter:brightness(1.1);transform:translateY(-1px);
  box-shadow:0 11px 26px rgba(240,180,41,.45),inset 0 1px 0 rgba(255,255,255,.35)}

/* ── TABELE ─────────────────────────────────────────────────── */
.tabela{border-radius:11px;overflow:hidden;
  box-shadow:0 6px 20px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.06)}
/* lepki naglowek na NIEPRZEZROCZYSTYM tle — przy rozmyciu tresc tabeli
   przebijala przez naglowek w trakcie przewijania */
.tabela thead th,.tabela th{position:sticky;top:0;z-index:2;
  background:linear-gradient(180deg,#1a1e27,#0c1017);
  border-bottom:1px solid rgba(201,168,76,.28);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 2px 8px rgba(0,0,0,.45)}
.tabela tbody tr:nth-child(even) td{background:rgba(255,255,255,.018)}
.tabela tr:hover td{background:rgba(201,168,76,.07)}
.tabela td{transition:background .1s ease}

/* ── MODAL ──────────────────────────────────────────────────── */
.modal-tlo{backdrop-filter:blur(9px) saturate(.85)}
.modal{background:var(--gl-tlo-mocne);border:1px solid rgba(201,168,76,.28);
  box-shadow:0 30px 70px rgba(0,0,0,.75),var(--gl-inset)}