/* ========== DESIGN SYSTEM — AIHub24 ========== */
/* 1) KARTY L/M/S — dodatki do istniejącego CSS (nie ruszaj tła) */
/* --- Large (L) --- */
.card-L{ grid-column: span 2 / span 2; border-radius: 18px; overflow:hidden; }
.card-L .thumb-wrap{ aspect-ratio:16/9; }
.card-L h3{ font-size: clamp(1.1rem,2.1vw,1.6rem); }
/* --- Medium (M) --- */
.card-M .thumb-wrap{ aspect-ratio:16/9; }
.card-M h3{ font-size: clamp(1rem,1.6vw,1.2rem); }
/* --- Small list (S) --- */
.card-S{ display:flex; gap:.8rem; padding:.65rem .2rem; border-bottom:1px solid rgba(255,255,255,.06); }
.card-S:last-child{ border-bottom:0; }
.card-S .s-thumb{ width:88px; height:66px; border-radius:10px; overflow:hidden; flex:0 0 88px; }
.card-S .s-meta{ font-size:.8rem; color:rgba(226,232,240,.9); }
.card-S h4{ font-weight:800; line-height:1.15; }
/* underline-reveal tytułów na hover dla L/M */
.ai-card.card-L h3,.ai-card.card-M h3{ text-decoration-thickness:2px; text-underline-offset:3px; text-decoration-color: transparent; }
.ai-card.card-L:hover h3,.ai-card.card-M:hover h3{ text-decoration-color: rgba(148,163,184,.55); }

/* 2) BADGE kategorii = kolorowy DOT + skrót */
.cat-chip{ padding:.22rem .48rem .22rem .42rem; display:inline-flex; align-items:center; gap:.35rem; }
.cat-dot{ width:8px; height:8px; border-radius:999px; box-shadow:0 0 10px var(--cat-glow, rgba(56,189,248,.35)); background: var(--cat-color, #38bdf8); }

/* 3) HUBY sticky pilot (pod navem) */
#hubs-orbit.sticky{ position: sticky; top: calc(var(--adminbar-h) + 56px); z-index: 5; margin-top:.25rem; }
#hubs-orbit .track{ scrollbar-width: thin; }
#hubs-orbit .pill[aria-current="true"]{ box-shadow:0 0 0 1px rgba(255,255,255,.35) inset, 0 0 18px hsla(var(--c1)/.6); transform: translateY(-1px) scale(1.02); }

/* 4) Karta Botka w sidebarze – mini lista S */
#botek-card .mini-list{ margin-top:.5rem; }
#botek-card .mini-list .item{ display:flex; gap:.5rem; padding:.4rem 0; border-bottom:1px solid rgba(255,255,255,.06); }
#botek-card .mini-list .item:last-child{ border-bottom:0; }
#botek-card .mini-list h4{ font-size:.9rem; line-height:1.15; }

/* 5) Share z kart OUT — nic nie stylujemy, bo usuwamy HTML */

:root{
  --ai-aqua:#38bdf8;
  --ai-blue:#60a5fa;
  --ai-violet:#a78bfa;
  --ai-ink:#0b1220;
  --ai-card-border:rgba(148,163,184,0.14);
  --ai-glow:rgba(56,189,248,0.45);
  --ai-text-soft:#9ca3af;
}
html, body { background-color:#010a1a; color-scheme:dark; overflow-x: clip; }
/* Stacking i tło */
body { position: relative; isolation:isolate; }
#neural-bg{ position:fixed; inset:0; z-index:-2 !important; pointer-events:none; filter:none !important; opacity:.42; contain: layout paint; }
header, main, footer { position: relative; z-index: 0; }
/* Animated gradient tła */
body::before{
  content:""; position:fixed; inset:0; z-index:-3; opacity:.28; pointer-events:none;
  background:linear-gradient(120deg,#020617,#0a1b3c,#122e5f,#0a1b3c,#020617);
  background-size:160% 160%; animation:ai-plasma-pan 38s ease infinite; will-change:background-position,opacity;
}
@keyframes ai-plasma-pan{ 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} }
@media (prefers-reduced-motion: reduce){ body::before{ animation:none; } #neural-bg{ display:none; } }

/* === Jedno ŹRÓDŁO „NOISE” — inline SVG (fix 404) === */
body::after{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:-1; opacity:.018; mix-blend-mode:soft-light;
  background-repeat:repeat; background-size:256px 256px; image-rendering:pixelated;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E");
}



/* === Typografia „WOW” === */
.ai-hero-title{ font-weight:900; letter-spacing:.01em; line-height:1.05; font-size:clamp(1.85rem,2.6vw,2.4rem); color:#fff; margin-bottom:.35rem; text-shadow:0 4px 18px rgba(0,0,0,.35); }
.ai-hero-sub{ display:inline-block; font-weight:700; letter-spacing:.02em; line-height:1.25; font-size:clamp(1rem,1.3vw,1.15rem); background:linear-gradient(90deg,var(--ai-aqua),var(--ai-violet)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; text-wrap:balance; filter:drop-shadow(0 0 10px rgba(56,189,248,.15)); opacity:.95; }

/* Tytuły sekcji */
.ai-section-title{ font-weight:900; letter-spacing:.02em;
  background:linear-gradient(90deg,#fff,#c7d2fe 60%,#a78bfa);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  text-shadow:0 0 12px rgba(99,102,241,.15); position:relative; display:inline-block;
}
.ai-section-title::after{ content:""; display:block; height:2px; width:72px; margin-top:8px; border-radius:2px; background:linear-gradient(90deg,var(--ai-aqua),var(--ai-violet)); opacity:.85; }

/* CTA bazowe (chip) */
.ai-cta{
  display:inline-flex; align-items:center; gap:.5rem; font-weight:600; font-size:.9rem;
  padding:.5rem .9rem; border-radius:999px; border:1px solid rgba(255,255,255,.12);
  background:rgba(15,23,42,.35); backdrop-filter:blur(8px) saturate(160%);
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}
.ai-cta:hover{ transform:translateY(-1px); border-color:rgba(148,163,184,.35); background:rgba(15,23,42,.5); }

/* CTA Reveal */
.ai-cta.ai-reveal{ padding:.5rem .6rem; gap:.55rem; overflow:hidden; }
.ai-cta.ai-reveal .label{ white-space:nowrap; max-width:0; opacity:0; transform:translateX(-6px); transition:max-width .35s ease, opacity .25s ease, transform .25s ease; }
.ai-cta.ai-reveal:hover .label, .ai-cta.ai-reveal:focus-visible .label{ max-width:160px; opacity:1; transform:none; }
@media (max-width:767.98px){ .ai-cta.ai-reveal .label{ max-width:0; } }
@media (prefers-reduced-motion: reduce){ .ai-cta.ai-reveal .label{ transition:none; } }

/* Karty */
.ai-card{
  position:relative; border:1px solid transparent;
  background: linear-gradient(rgba(2,6,23,0.35),rgba(2,6,23,0.35)) padding-box,
              linear-gradient(90deg,rgba(56,189,248,.45),rgba(167,139,250,.45)) border-box;
  backdrop-filter: blur(6px) saturate(140%);
  transition: box-shadow .25s ease, transform .25s ease, border-color .25s ease;
  content-visibility:auto; contain-intrinsic-size:320px 280px;
}
.ai-card::after{
  content:""; position:absolute; inset:auto 0 0 0; height:2px;
  background:linear-gradient(90deg,transparent,var(--ai-aqua),var(--ai-violet),transparent);
  opacity:0; transform:translateY(2px); transition:opacity .25s ease, transform .25s ease;
}
.ai-card:hover{
  background: linear-gradient(rgba(2,6,23,0.42),rgba(2,6,23,0.42)) padding-box,
              linear-gradient(90deg,var(--ai-aqua),var(--ai-violet)) border-box;
  border-color: rgba(148,163,184,0.28);
  box-shadow: 0 10px 30px rgba(2,8,23,.45), 0 0 20px rgba(56,189,248,.1);
  transform: translateY(-2px);
}
.ai-card:hover::after{ opacity:1; transform:translateY(0); }
.ai-card h3{ color:#fff; font-weight:800; letter-spacing:.01em; }

/* Meta */
.ai-meta-row{ margin-top:.15rem; display:flex; align-items:center; gap:.55rem; font-size:.78rem; color:var(--ai-text-soft); }
.ai-time{ display:inline-flex; align-items:center; gap:.35rem; }
.ai-icon-clock{ width:14px; height:14px; stroke:currentColor; stroke-width:2; fill:none; opacity:1; }

/* Mikro-sygnały */
.ai-dot-new{ width:8px; height:8px; border-radius:999px; display:inline-block;
  background: radial-gradient(circle at 50% 50%, rgba(56,189,248,.95) 0 45%, rgba(56,189,248,.25) 70%, transparent 72%);
  box-shadow: 0 0 10px rgba(56,189,248,.45);
}
.ai-flag-video{ width:16px; height:16px; display:inline-flex; align-items:center; justify-content:center;
  border:1px solid rgba(255,255,255,.14); border-radius:4px;
  background: linear-gradient(180deg, rgba(2,6,23,.35), rgba(2,6,23,.6));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06);
}
.ai-flag-video svg{ width:10px; height:10px; fill:currentColor; color:#a78bfa; }

/* STORY CARDS */
.story-card{ display:flex; flex-direction:column; height:100%; }
.story-card .thumb-wrap{ position:relative; overflow:hidden; }
.story-card .thumb-wrap > div[style*="padding-top"]{ display:block; }
.story-card .thumb-wrap img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition: transform .35s ease, filter .35s ease, opacity .35s ease; z-index:0;
  filter:saturate(.25) contrast(1.05) brightness(.95) blur(0); opacity:1;
}
.story-card:hover .thumb-wrap img{ transform:scale(1.04); filter:none; }
.story-card .thumb-wrap img.is-lqip{ filter: blur(12px) saturate(1.2); opacity:.85; }
.story-card .img-grad{ position:absolute; inset:0; background:linear-gradient(to top, rgba(0,0,0,.55), rgba(0,0,0,.15) 40%, rgba(0,0,0,0)); pointer-events:none; z-index:1; }
.ai-card .thumb-wrap::before{ z-index:2; }
.ai-card .thumb-wrap::after{ z-index:3; }

/* Kategoria chip */
.cat-chip{
  position:absolute; left:.75rem; top:.75rem; z-index:5; font-size:.68rem; font-weight:800; letter-spacing:.02em;
  padding:.25rem .5rem; border-radius:.5rem; color:#e5edff; background:rgba(2,6,23,.6); border:1px solid rgba(255,255,255,.15);
  backdrop-filter: blur(4px) saturate(150%);
}
.story-card .content{ padding:.9rem 1rem .85rem; display:flex; flex-direction:column; gap:.5rem; position:relative; }
.story-card h3{ line-height:1.2; color:#fff; text-shadow:0 1px 6px rgba(0,0,0,.25); }

/* Mini-hero */
.side-picks-mini-hero article, .main-hero-equal { position:relative; border-radius:1rem; overflow:hidden; }
.side-picks-mini-hero .mini-hero-img, .main-hero-equal .mini-hero-img { width:100%; height:11rem; }
@media (min-width:640px){ .side-picks-mini-hero .mini-hero-img, .main-hero-equal .mini-hero-img { height:13rem; } }
@media (min-width:768px){ .side-picks-mini-hero .mini-hero-img, .main-hero-equal .mini-hero-img { height:auto; aspect-ratio:16/9; } }
.side-picks-mini-hero .mini-hero-overlay, .main-hero-equal .mini-hero-overlay { position:absolute !important; left:0; right:0; bottom:0; padding:0.75rem 1rem; z-index:10; }
@media (min-width:640px){ .side-picks-mini-hero .mini-hero-overlay, .main-hero-equal .mini-hero-overlay { padding:1rem; } }
.side-picks-mini-hero .mini-hero-title, .main-hero-equal .mini-hero-title { color:#fff; font-weight:800; line-height:1.2; text-shadow:0 2px 10px rgba(0,0,0,.35); }
.side-picks-mini-hero .mini-hero-meta, .main-hero-equal .mini-hero-meta{ color:rgba(255,255,255,.92); font-size:11px; }
.side-picks-mini-hero .mini-hero-grad, .main-hero-equal .mini-hero-grad { pointer-events:none; position:absolute; inset:0; background:linear-gradient(to top, rgba(0,0,0,.75), rgba(0,0,0,.35), rgba(0,0,0,0)); }

/* MOBILE */
@media (max-width:767.98px){
  .main-hero-equal .mini-hero-img, .side-picks-mini-hero .mini-hero-img{ height:auto !important; aspect-ratio:1/1 !important; }
  .main-hero-equal .mini-hero-img img, .side-picks-mini-hero .mini-hero-img img{ object-position:center 30%; }
  .main-hero-equal .mini-hero-grad, .side-picks-mini-hero .mini-hero-grad{ background:linear-gradient(to top, rgba(0,0,0,.85), rgba(0,0,0,.55) 40%, rgba(0,0,0,0) 75%); }
  .main-hero-equal .mini-hero-overlay, .side-picks-mini-hero .mini-hero-overlay{ padding:.65rem .8rem; }
  .main-hero-equal .mini-hero-title, .side-picks-mini-hero .mini-hero-title{
    font-size:clamp(1rem, 2.8vw, 1.15rem); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; line-height:1.2;
    text-shadow:0 1px 2px rgba(0,0,0,.35);
  }
  .main-hero-equal .mini-hero-meta, .side-picks-mini-hero .mini-hero-meta{ font-size:10.5px; color:rgba(255,255,255,.92); text-shadow:0 1px 2px rgba(0,0,0,.25); }
  @media (hover:none){ .main-hero-equal .mini-hero-img img, .side-picks-mini-hero .mini-hero-img img{ transform:none !important; } }
}

/* Glassmorphic sidebar */
.ai-glass{ border:1px solid rgba(255,255,255,.12); background: rgba(15,23,42,.35); backdrop-filter: blur(10px) saturate(160%); border-radius:16px; box-shadow:0 10px 30px rgba(2,8,23,.45); position:relative; }
.ai-glass .ai-glass-head{ padding:1rem; border-bottom:1px solid rgba(255,255,255,.08); }
.ai-glass .ai-glass-body{ padding:.25rem .5rem; }

/* Tag chips w sidebarze */
.ai-chip{ padding:.4rem .8rem; border-radius:999px; border:1px solid rgba(255,255,255,.12); background: rgba(2,6,23,.4); backdrop-filter: blur(6px) saturate(150%); transition: border-color .25s ease, transform .2s ease, background .2s ease; }
.ai-chip:hover{ border-color: rgba(148,163,184,.35); transform: translateY(-1px); }

/* Linki kafelków */
.card-link, .card-link:hover, .card-link:focus { text-decoration:none !important; color:inherit !important; }

/* A11y skip link */
a.skip-link:focus{ position:absolute !important; left:0.5rem; top:0.5rem; z-index:50; padding:.5rem .75rem; background:#0f172a; color:#fff; border-radius:.5rem; }

/* === SCI-FI: HOLO tytuły, scanline === */
.ai-section-title.ai-holo{
  position:relative; display:inline-block; letter-spacing:.02em;
  background:linear-gradient(90deg,#ffffff 0%,#e5edff 35%,#a78bfa 60%,#60a5fa 90%);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  text-shadow:0 0 18px rgba(99,102,241,.18), 0 0 36px rgba(56,189,248,.10);
}
.ai-section-title.ai-holo::before{
  content:""; position:absolute; inset:-2px -4px;
  background:repeating-linear-gradient(180deg, rgba(255,255,255,.16) 0 1px, rgba(255,255,255,0) 1px 4px);
  mix-blend-mode:screen; opacity:.0; animation:aiHoloScan 3.6s ease-in-out infinite; pointer-events:none;
}
@keyframes aiHoloScan{ 0%,100%{opacity:0; transform:translateY(14%);} 40%{opacity:.35; transform:translateY(-14%);} }
.ai-section-title.ai-holo::after{
  content:""; display:block; height:2px; width:88px; margin-top:10px; border-radius:2px;
  background:linear-gradient(90deg, transparent, var(--ai-aqua) 35%, var(--ai-violet) 65%, transparent),
             radial-gradient(ellipse at var(--x,0%) 50%, rgba(255,255,255,.6), transparent 45%);
  background-size:100% 100%, 180% 100%; background-position:0 0, 0 0; animation: aiIon 5.2s linear infinite; opacity:.9;
}
@keyframes aiIon{ 0%{--x:-20%;} 50%{--x:120%;} 100%{--x:-20%;} }

/* Overlay pack */
.ai-card .thumb-wrap::after{
  content:""; position:absolute; inset:0;
  background-image:url('assets/overlay/neural-grid.webp');
  background-size:cover; background-repeat:no-repeat; mix-blend-mode:overlay; opacity:.18; transition:opacity .4s ease; pointer-events:none;
}
.ai-card:hover .thumb-wrap::after{ opacity:.32; }

#poradniki-narzedzia .ai-card .thumb-wrap::after{ background-image:url('assets/overlay/plasma-dots.webp'); opacity:.2; }
#poradniki-narzedzia .ai-card:hover .thumb-wrap::after{ opacity:.35; }
#analizy .ai-card .thumb-wrap::after{ background-image:url('assets/overlay/circuit-lines.webp'); opacity:.22; }
#analizy .ai-card:hover .thumb-wrap::after{ opacity:.38; }

.ai-card .thumb-wrap::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(ellipse at center bottom, rgba(56,189,248,.35) 0%, rgba(167,139,250,.25) 40%, rgba(0,0,0,0) 100%);
  mix-blend-mode:screen; opacity:.4; pointer-events:none; transition:opacity .35s ease;
}
.ai-card:hover .thumb-wrap::before{ opacity:.7; }

/* Fallback: brak miniatury — bez :has(), tylko klasa no-thumb */
.story-card.no-thumb .thumb-wrap{
  background:linear-gradient(120deg,#0f172a,#1e3a8a,#0f172a,#0369a1);
  background-size:300% 300%; animation:aiPlasmaBG 18s ease-in-out infinite;
}
@keyframes aiPlasmaBG{ 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} }

/* delikatny scanline */
.story-card .content::before{
  content:""; position:absolute; left:0; right:0; top:0; height:1px;
  background: linear-gradient(90deg, transparent 0, rgba(56,189,248,.45) 30%, rgba(167,139,250,.45) 70%, transparent 100%);
  transform: translateX(-35%); animation: aiScanline 7s linear infinite; opacity:.85; pointer-events:none;
}
@keyframes aiScanline{ 0%{transform:translateX(-35%);} 100%{transform:translateX(135%);} }
@media (prefers-reduced-motion: reduce){ .ai-section-title.ai-holo::before,.ai-section-title.ai-holo::after,.story-card .content::before{ animation:none !important; } }

/* CTA ikonowe */
.ai-cta-icon,.ai-cta-sci{
  display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:radial-gradient(120px 120px at 50% 45%, rgba(56,189,248,.18), rgba(2,6,23,.35) 55%, rgba(2,6,23,.65) 100%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); color:#e5edff; transition: transform .28s ease, border-color .28s ease, background .28s ease, box-shadow .28s ease, filter .28s ease;
  position:relative; overflow:visible; will-change: transform, filter;
}
.ai-cta-svg{ width:20px; height:20px; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; display:block; }

/* PORTAL/RADAR/ORBIT/NEURAL animacje */
.ai-cta-icon.is-portal .ring-1,.ai-cta-icon.is-portal .ring-2{ transform-origin:50% 50%; }
.ai-cta-icon.is-portal .ring-1{ opacity:.95; stroke-dasharray:16 10; animation: aiSpin 5.5s linear infinite; }
.ai-cta-icon.is-portal .ring-2{ opacity:.65; stroke-dasharray:6 8; animation: aiSpinRev 9s linear infinite; }
.ai-cta-icon.is-portal .core{ fill: currentColor; opacity:.95; filter: drop-shadow(0 0 6px rgba(99,102,241,.45)); }

.ai-cta-icon .radar,.ai-cta-icon .orbit{ display:none; }

.ai-cta-icon.is-radar .radar{ display:block; }
.ai-cta-icon.is-radar .ring-1{ opacity:.75; stroke-dasharray:3 4; animation:none; }
.ai-cta-icon.is-radar .ring-2{ opacity:.35; stroke-dasharray:1 6; animation:none; }
.ai-cta-icon.is-radar .sweep{ fill:none; stroke:currentColor; stroke-width:3.2; stroke-linecap:round; stroke-dasharray:12 100; opacity:.9; transform-origin:12px 12px; animation: aiSpin 3.2s linear infinite; filter: drop-shadow(0 0 6px rgba(56,189,248,.45)); }
.ai-cta-icon.is-radar .blip{ fill:currentColor; opacity:0; animation: aiBlink 1.8s ease-in-out infinite; filter: drop-shadow(0 0 6px rgba(99,102,241,.45)); }

.ai-cta-icon.is-orbit .orbit{ display:block; }
.ai-cta-icon.is-orbit .ring-1{ opacity:.9; stroke-dasharray:12 10; animation: aiSpin 8s linear infinite; }
.ai-cta-icon.is-orbit .ring-2{ opacity:.45; stroke-dasharray:2 8; animation: aiSpinRev 10s linear infinite; }
.ai-cta-icon.is-orbit .satellite{ fill:currentColor; transform-origin:12px 12px; filter: drop-shadow(0 0 6px rgba(167,139,250,.45)); }
.ai-cta-icon.is-orbit .orbit{ transform-origin:12px 12px; animation: aiOrbit 4.8s linear infinite; }

.ai-cta-icon.is-neural .ring-1,.ai-cta-icon.is-neural .ring-2{ transform-origin:50% 50%; }
.ai-cta-icon.is-neural .ring-1{ opacity:.9; stroke-dasharray:12 8; animation: aiSpin 7s linear infinite; }
.ai-cta-icon.is-neural .ring-2{ opacity:.45; stroke-dasharray:3 6; animation: aiSpinRev 9s linear infinite; }
.ai-cta-icon.is-neural .core{ fill:currentColor; opacity:.9; filter:drop-shadow(0 0 6px rgba(56,189,248,.45)); }
.ai-cta-icon.is-neural .grid{ stroke:currentColor; stroke-width:1; opacity:.35; transform-origin:12px 12px; animation: aiPulse 2.6s ease-in-out infinite; }
@keyframes aiPulse{ 0%,100%{ opacity:.15; transform:scale(.96);} 50%{ opacity:.45; transform:scale(1.02);} }
@keyframes aiSpin{ to{ transform: rotate(360deg); } }
@keyframes aiSpinRev{ to{ transform: rotate(-360deg); } }
@keyframes aiOrbit{ to{ transform: rotate(360deg); } }
@keyframes aiBlink{ 0%,100%{ opacity:0; transform:scale(.6);} 50%{ opacity:.95; transform:scale(1);} }

/* Mobile tune */
@media (max-width: 767.98px){
  .story-card .thumb-wrap{ aspect-ratio: 5 / 2; }
  .story-card .thumb-wrap > div[style*="padding-top"]{ display:none; }
}

/* Sekcje – separator */
.ai-block{ position:relative; padding-top:28px; margin-top:16px; }
.ai-block::before{
  content:""; position:absolute; left:0; right:0; top:0; height:1px;
  background:linear-gradient(90deg, transparent 0%, rgba(56,189,248,.35) 15%, rgba(167,139,250,.35) 85%, transparent 100%);
}

/* DARK CONTRAST PATCH */
#analizy .ai-card .content,#poradniki-narzedzia .ai-card .content,#felietony .ai-card .content{ background:transparent !important; color:#e5e7eb !important; }
#analizy .ai-card h3,#poradniki-narzedzia .ai-card h3,#felietony .ai-card h3{ color:#ffffff !important; }
.ai-meta-row{ color:rgba(226,232,240,.9); }
.story-card .excerpt{ color:rgba(226,232,240,.88); }

/* Mobile: mocniejsza zasłona */
@media (max-width:767.98px){
  .story-card .img-grad{ background:linear-gradient(to top, rgba(0,0,0,.82), rgba(0,0,0,.46) 40%, rgba(0,0,0,0)); }
  .story-card .thumb-wrap img{ filter:brightness(.95) contrast(1.05) saturate(1.05); }
  .mini-hero-grad{ background:linear-gradient(to top, rgba(0,0,0,.9), rgba(0,0,0,.55) 40%, rgba(0,0,0,0) 75%); }
  .mini-hero-title{ text-shadow:0 2px 10px rgba(0,0,0,.55); }
}

/* Holo akcent */
.ai-section-title.ai-holo::after{ filter: drop-shadow(0 0 6px rgba(56,189,248,.35)); }

/* ===== Toggle „Efekty” w HEADERZE ===== */
#toggle-effects{
  position: static; background: rgba(15,23,42,.6); color:#e5e7eb; border:1px solid rgba(255,255,255,.12);
  border-radius:999px; padding:8px 12px; font-size:12px; line-height:1; cursor:pointer; backdrop-filter: blur(8px) saturate(160%);
}
#toggle-effects:hover{ background: rgba(15,23,42,.8); }

/* Gdy efekty OFF – gasimy animacje/VFX globalnie, ale guzik pozostaje żywy */
html.effects-off *{ animation: none !important; transition: none !important; }
html.effects-off #neural-bg, html.effects-off .ai-burst-flash, html.effects-off .ai-burst-ring, html.effects-off .ai-burst-spark{ display:none !important; }
html.effects-off .ai-cta-icon .ring-1, html.effects-off .ai-cta-icon .ring-2, html.effects-off .ai-cta-icon .sweep, html.effects-off .ai-cta-icon .orbit, html.effects-off .ai-section-title.ai-holo::before, html.effects-off .ai-section-title.ai-holo::after{ animation: none !important; }
/* Whitelist — przycisk „Efekty” działa nadal przy effects-off */
html.effects-off #toggle-effects, html.effects-off #toggle-effects *{
  display:inline-flex !important; visibility:visible !important; pointer-events:auto !important; animation:initial !important; transition:initial !important;
}

/* ===== STICKY RIGHT — klasyczny sticky do footera ===== */
:root{ --adminbar-h:0px; }
body.admin-bar{ --adminbar-h:32px; }
@media (max-width:782px){ body.admin-bar{ --adminbar-h:46px; } }
#sticky-right{ position: sticky; top: calc(var(--adminbar-h) + 16px); align-self: start; height: fit-content; z-index: 1; }

/* Botek card (sidebar) */
#botek-card{ border:1px solid rgba(255,255,255,.12); background: rgba(15,23,42,.35); backdrop-filter: blur(10px) saturate(160%); border-radius:16px; padding:16px; overflow: visible; }
#botek-card .botek-face{ width:100%; aspect-ratio:1/1; border-radius:12px; background: radial-gradient(40% 40% at 50% 35%, rgba(99,102,241,.25), transparent 70%), radial-gradient(35% 35% at 65% 60%, rgba(56,189,248,.25), transparent 80%), rgba(2,6,23,.6); }
#botek-card .botek-txt{ font-size:12px; color:#cbd5e1; margin-top:12px; line-height:1.45; }

/* ===== HUBY & TAGI (bez liczników) ===== */
#hubs-orbit .rail{
  display:inline-block; max-width:min(100%,60rem); position:relative; padding:.3rem .2rem; border-radius:14px;
  border:1px solid rgba(255,255,255,.1); background:linear-gradient(180deg,rgba(2,6,23,.6),rgba(2,6,23,.4)); backdrop-filter:blur(10px) saturate(160%); overflow:hidden;
}
#hubs-orbit .track{ display:flex; gap:.5rem; align-items:center; overflow:auto hidden; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; padding:.35rem .5rem; }
#hubs-orbit .track > *{ scroll-snap-align:start }
#hubs-orbit .fade-right{ position:absolute; right:0; top:0; bottom:0; width:80px; pointer-events:none; background:linear-gradient(90deg,transparent,rgba(2,6,23,.9)); }
#hubs-orbit .lead{
  scroll-snap-align:start; display:inline-flex; align-items:center; gap:.5rem; padding:.5rem .85rem; border-radius:999px; font-weight:900; font-size:.92rem; letter-spacing:.06em;
  color:#eaf2ff; text-transform:uppercase; border:1px solid rgba(255,255,255,.12); background:linear-gradient(180deg,rgba(2,6,23,.85),rgba(2,6,23,.45));
}
#hubs-orbit .pill{
  --g1:hsla(var(--c1)/.95); --g2:hsla(var(--c2)/.95);
  display:inline-block; border-radius:999px; padding:.5rem .85rem; color:#eaf2ff; font-weight:800; font-size:.9rem; border:1px solid transparent;
  background: linear-gradient(180deg,rgba(2,6,23,.7),rgba(2,6,23,.4)) padding-box,
              linear-gradient(90deg,var(--g1),var(--g2)) border-box;
  box-shadow:0 0 0 1px rgba(255,255,255,.05) inset,0 6px 18px rgba(2,8,23,.45),0 0 16px hsla(var(--c1)/.55);
  transition:transform .2s ease, box-shadow .2s ease; white-space:nowrap; position:relative;
}
#hubs-orbit .pill:hover{ transform:translateY(-1px) scale(1.03) }
@media (max-width:767.98px){
  #hubs-orbit{margin-top:.15rem;margin-bottom:.4rem}
  #hubs-orbit .lead,#hubs-orbit .pill{font-size:.86rem;padding:.42rem .72rem}
}

/* ===== Baner „Świat według Botka” ===== */
#botek-banner .wrap{
  position:relative; border-radius:18px; overflow:hidden; border:1px solid rgba(255,255,255,.12);
  background: radial-gradient(1200px 600px at 10% 100%, rgba(56,189,248,.15), transparent 60%),
              radial-gradient(900px 500px at 90% 0%, rgba(167,139,250,.15), transparent 60%),
              rgba(2,6,23,.55);
  backdrop-filter: blur(8px) saturate(160%);
}
#botek-banner .cover{
  position:absolute; inset:0; pointer-events:none; opacity:.35;
  background-image:
    linear-gradient(180deg, rgba(0,0,0,.5), rgba(0,0,0,0)),
    radial-gradient(800px 400px at 70% 40%, rgba(99,102,241,.35), transparent 70%),
    url('assets/overlay/neural-grid.webp');
  background-size:cover, cover, cover; mix-blend-mode:screen;
}
#botek-banner .face{
  width:88px; height:88px; border-radius:16px;
  background: radial-gradient(40% 40% at 50% 35%, rgba(99,102,241,.45), transparent 70%),
             radial-gradient(35% 35% at 65% 60%, rgba(56,189,248,.45), transparent 80%),
             rgba(15,23,42,.8);
  box-shadow: 0 10px 30px rgba(2,8,23,.5), inset 0 0 0 1px rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
}
#botek-banner .cta{
  display:inline-flex; align-items:center; gap:.55rem; padding:.6rem .9rem; border-radius:999px; border:1px solid rgba(255,255,255,.14);
  background:radial-gradient(120px 120px at 50% 45%, rgba(56,189,248,.18), rgba(2,6,23,.35) 55%, rgba(2,6,23,.65) 100%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); font-weight:700; color:#e5edff; transition:transform .2s ease, border-color .2s ease;
}
#botek-banner .cta:hover{ transform:translateY(-1px); border-color:rgba(148,163,184,.35); }

/* === AIHub24 — A11y/PSI patch: kontrast + tap targets (WCAG) === */
/* 1) Toggle Efekty — kontrast + większy target */
#toggle-effects{
  background: linear-gradient(180deg, rgba(15,23,42,.96), rgba(2,6,23,.88));
  color:#ffffff; border:1.5px solid rgba(255,255,255,.28);
  text-shadow: 0 1px 2px rgba(0,0,0,.5);
  padding:10px 14px; min-width:44px; min-height:44px; font-size:14px; line-height:1; border-radius:999px;
}
#toggle-effects:hover{ background: linear-gradient(180deg, rgba(15,23,42,.98), rgba(2,6,23,.92)); border-color: rgba(255,255,255,.36); }
#toggle-effects:focus-visible{ outline:2px solid #38bdf8; outline-offset:2px; }

/* 3) Delikatne wzmocnienie czytelności drobnych metadanych na ciemnym */
.ai-meta-row, .mini-hero-meta{ color: rgba(226,232,240,.95); }
.ai-icon-clock{ opacity:1; }

/* 4) Coarse pointer — wygodna klikalność */
@media (pointer:coarse){
  #toggle-effects{ padding:12px 16px; min-height:46px; }
}

/* FIX #1 — stabilne metryki i baseline dla #toggle-effects */
#toggle-effects{ display:inline-flex; align-items:center; justify-content:center; height:44px; padding:0 14px; line-height:1; white-space:nowrap; vertical-align:middle; }
html.effects-off #toggle-effects{ display:inline-flex !important; }

/* FIX #2 — wyrównanie paska meta do dołu karty */
.story-card .content{ display:flex; flex-direction:column; }
.story-card .content > .ai-meta-row{ margin-top:auto; }
.ai-meta-row{ align-items:center; }
/* === UX PATCH: focus, mobile glass OFF, type ramp, hubs nav === */
.card-link:focus-visible,
.ai-cta:focus-visible,
.ai-chip:focus-visible,
#hubs-orbit .pill:focus-visible,
#hubs-orbit .lead:focus-visible,
#toggle-effects:focus-visible {
  outline: 2px solid var(--ai-aqua);
  outline-offset: 3px;
  border-radius: 12px;
}

@media (max-width: 767.98px){
  .ai-glass,
  .ai-card { backdrop-filter: none !important; }
  .ai-card { box-shadow: 0 6px 20px rgba(2,8,23,.35); }
}

.ai-card h3{ font-size: clamp(1.0rem, 1.45vw, 1.15rem); }
.card-M h3{ font-size: clamp(1.02rem, 1.6vw, 1.2rem); }
.card-L h3{ font-size: clamp(1.18rem, 2.1vw, 1.6rem); }
.card-S h4{ font-size: clamp(.92rem, 1.2vw, 1.0rem); }

#hubs-orbit.sticky{ top: calc(var(--adminbar-h) + var(--header-h, 56px)); }

#hubs-orbit .track{ scrollbar-gutter: stable both-edges; }

#hubs-orbit .btn{
  position:absolute; top:50%; transform:translateY(-50%);
  width:36px; height:36px; border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(2,6,23,.7);
  backdrop-filter: blur(6px) saturate(160%);
  display:none; z-index:2; cursor:pointer;
}
#hubs-orbit .btn svg{ width:18px; height:18px; }
#hubs-orbit:hover .btn{ display:flex; align-items:center; justify-content:center; }
#hubs-orbit .btn.left{ left:.25rem; }
#hubs-orbit .btn.right{ right:.25rem; }

@media (pointer:coarse){
  #hubs-orbit .pill,
  .ai-cta,
  .ai-chip {
    padding: .6rem 1rem;
    min-height: 44px;
  }
}

@media (forced-colors: none){
  .ai-card:hover{
    box-shadow: 0 8px 24px rgba(2,8,23,.42), 0 0 14px rgba(56,189,248,.08);
    transform: translateY(-1px);
  }
}
/* Radar: kolumny dla M zależnie od liczby kart */
/* PATCH v3: radar layout fix */
.radar-wrap {
  display: grid;
  gap: clamp(1rem, 2vw, 1.25rem);
}
@media (min-width: 1024px) {
  .radar-wrap {
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
    align-items: stretch;
  }
}
.radar-left {
  display: flex;
}
.radar-left .ai-card {
  flex: 1 1 auto;
  display: flex;
}
.radar-right {
  display: grid;
  gap: clamp(1rem, 2vw, 1.25rem);
  grid-template-columns: 1fr;
}
.radar-right .ai-card {
  height: 100%;
}

/* === HOTFIX: Radar L bez pustej dziury + M jedna pod drugą === */

/* 1) Link w karcie = flex kolumna (rozciąga wnętrze na pełną wysokość) */
.story-card > a.card-link{ display:flex; flex-direction:column; height:100%; }

/* 2) W karcie L obrazek wypełnia całą wysokość (bez sztywnego 16/9) */
.card-L .thumb-wrap{
  flex:1 1 auto;
  aspect-ratio:auto !important;   /* nadpisanie poprzedniego 16/9 */
  min-height:0; height:auto;
}
.card-L .thumb-wrap img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }

/* 3) Treść na dole karty, meta przyklejona na dół */
.card-L .content{ display:flex; flex-direction:column; }
.card-L .content .ai-meta-row{ margin-top:auto; }

/* 4) Usuń wymuszanie wysokości, żeby wrapper nie rozdymał karty */
.radar-left, .radar-right{ min-height:auto !important; }
.radar-left .ai-card, .radar-right .ai-card{ height:auto !important; }

/* 5) M – zawsze jedna pod drugą (bez powrotu do dwóch kolumn) */
.radar-right{ display:grid; gap:16px; grid-template-columns:1fr !important; }
@media (min-width:1024px){ .radar-right{ grid-template-columns:1fr !important; } }

/* === HOTFIX v2: L ma obraz i bez dziury === */

/* link w karcie = flex kolumna */
.story-card > a.card-link{
  display:flex;
  flex-direction:column;
  min-height:100%;
}

/* thumb L wypełnia kartę, ma gwarantowaną wysokość */
.card-L .thumb-wrap{
  position:relative;
  flex:1 1 auto;
  min-height: clamp(220px, 44vh, 640px);
  aspect-ratio: auto !important;
  height:auto;
  overflow:hidden;
}

/* obraz na pełno z cover */
.card-L .thumb-wrap img{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
}

/* treść przyklejona do dołu karty */
.card-L .content{ display:flex; flex-direction:column; }
.card-L .content .ai-meta-row{ margin-top:auto; }

/* radar-right = jedna kolumna zawsze */
.radar-right{
  display:grid;
  gap:16px;
  grid-template-columns:1fr !important;
}
@media (min-width:1024px){ .radar-right{ grid-template-columns:1fr !important; } }

/* porządki, żeby nic nie rozpychało karty */
.radar-left, .radar-right{ min-height:auto !important; }
.radar-left .ai-card, .radar-right .ai-card{ height:auto !important; }

/* PATCH v3: flexible card-L hero */
.card-L .thumb-wrap {
  min-height: clamp(220px, 44vh, 640px);
  aspect-ratio: auto;
}
.card-L .content {
  display: flex;
  flex-direction: column;
}
.card-L .content .ai-meta-row {
  margin-top: auto;
}

/* PATCH v3: no-thumb gradient fallback */
.story-card.no-thumb .thumb-wrap {
  position: relative;
  min-height: clamp(180px, 36vh, 520px);
  background: radial-gradient(circle at 15% 20%, rgba(56, 189, 248, 0.35), transparent 60%),
              radial-gradient(circle at 85% 80%, rgba(167, 139, 250, 0.45), transparent 65%),
              linear-gradient(135deg, #0f172a, #1e3a8a 45%, #0ea5e9 100%);
  background-size: 180% 180%;
  animation: aiPlasmaBG 18s ease-in-out infinite;
}
.story-card.no-thumb .thumb-wrap img,
.story-card.no-thumb .img-grad,
.story-card.no-thumb .thumb-wrap::before,
.story-card.no-thumb .thumb-wrap::after {
  display: none;
}
@keyframes aiPlasmaBG {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
/* PATCH v3: flexible card-L hero */
.card-L .thumb-wrap {
  min-height: clamp(220px, 44vh, 640px);
  aspect-ratio: auto;
}
.card-L .content {
  display: flex;
  flex-direction: column;
}
.card-L .content .ai-meta-row {
  margin-top: auto;
}

/* PATCH v4: overlay lead full-row fix */
.ai-block.is-overlay .card-L {
  grid-column: 1 / -1;
}

/* === HERO cockpit / terminal === */
.hero-hud{
  position:absolute;
  right:1.5rem;
  top:1.5rem;
  width:220px;
  max-width:40%;
  padding:.75rem .9rem;
  border-radius:1rem;
  border:1px solid rgba(148,163,184,.45);
  background:radial-gradient(180px 160px at 0% 0%,rgba(56,189,248,.16),transparent 60%),
             radial-gradient(220px 160px at 100% 100%,rgba(167,139,250,.18),transparent 65%),
             rgba(15,23,42,.85);
  box-shadow:0 18px 38px rgba(2,8,23,.7);
  backdrop-filter:blur(14px) saturate(170%);
  font-size:.7rem;
}
.hero-hud-row{ display:flex; align-items:center; justify-content:space-between; gap:.5rem; margin-bottom:.4rem; }
.hero-hud-row:last-child{ margin-bottom:0; }
.hero-hud-label{ text-transform:uppercase; letter-spacing:.07em; color:rgba(226,232,240,.75); font-weight:600; }
.hero-hud-value{ font-weight:700; }
.hero-hud-value--ok{ color:#4ade80; text-shadow:0 0 10px rgba(74,222,128,.55); }
.hero-hud-bar{ flex:1; margin-left:.5rem; height:6px; border-radius:999px; background:rgba(15,23,42,.9); overflow:hidden; position:relative; }
.hero-hud-bar-fill{
  position:absolute; inset:0;
  transform-origin:left center;
  transform:scaleX(var(--fill,1));
  background:linear-gradient(90deg,#22d3ee,#a855f7);
  box-shadow:0 0 12px rgba(56,189,248,.75);
}
.hero-hud-tags{ display:flex; gap:.25rem; flex-wrap:wrap; justify-content:flex-end; }
.hero-hud-tag{
  padding:.15rem .4rem;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.4);
  background:rgba(15,23,42,.9);
  font-size:.65rem;
  color:rgba(226,232,240,.85);
}

/* Terminal pod H1 */
.hero-terminal{
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  padding:.25rem .6rem;
  border-radius:.6rem;
  background:rgba(15,23,42,.85);
  border:1px solid rgba(148,163,184,.5);
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size:.7rem;
  color:#e5e7eb;
}
.hero-terminal-prefix{ color:#22d3ee; font-weight:600; }
.hero-terminal-text{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* Hero meta pill */
.hero-meta-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.18rem .52rem;
  margin-right:.4rem;
  border-radius:999px;
  border:1px solid rgba(56,189,248,.55);
  background:rgba(15,23,42,.9);
  font-size:.65rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:#e0f2fe;
}
.hero-meta-main{
  font-size:.78rem;
  color:rgba(226,232,240,.96);
}
.hero-tts{ background:rgba(15,23,42,.85); border-radius:.75rem; }

/* Mobile hero: HUD mniej agresywny */
@media (max-width:767.98px){
  .hero-hud{
    position:absolute;
    right:.75rem;
    top:.75rem;
    width:auto;
    max-width:70%;
    padding:.55rem .65rem;
  }
  .hero-terminal{ max-width:100%; }
}

/* === Chipowe karty + spotlight (zmiana 6) === */
.ai-card{
  transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));
  transform-style:preserve-3d;
}
.ai-card .content{
  position:relative;
  overflow:hidden;
}
.ai-card .content::after{
  content:"";
  position:absolute;
  inset:-120%;
  background:radial-gradient(circle at var(--mx,50%) var(--my,50%), rgba(148,163,184,.16), transparent 60%);
  opacity:0;
  pointer-events:none;
  transition:opacity .25s ease;
}
.ai-card:hover .content::after{ opacity:1; }

/* === Kolorystyka sekcji (zmiana 5) === */
#poradniki-narzedzia .cat-chip .cat-dot,
#poradniki-narzedzia .card-S .cat-dot{
  --cat-color:#34d399;
  --cat-glow:rgba(52,211,153,.55);
}
#analizy .cat-chip .cat-dot,
#analizy .card-S .cat-dot{
  --cat-color:#38bdf8;
  --cat-glow:rgba(56,189,248,.55);
}
#felietony .cat-chip .cat-dot,
#felietony .card-S .cat-dot{
  --cat-color:#a78bfa;
  --cat-glow:rgba(167,139,250,.55);
}

/* === AI ticker (zmiana 7) === */
#ai-ticker{ position:relative; z-index:1; }
.ai-ticker-rail{
  display:flex;
  align-items:center;
  gap:.75rem;
  padding:.45rem .75rem;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.35);
  background:radial-gradient(140px 140px at 0% 0%,rgba(56,189,248,.18),transparent 70%),
             radial-gradient(180px 140px at 100% 100%,rgba(167,139,250,.18),transparent 70%),
             rgba(15,23,42,.9);
  box-shadow:0 14px 30px rgba(2,8,23,.6);
  overflow:hidden;
}
.ai-ticker-label{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding-right:.6rem;
  border-right:1px solid rgba(148,163,184,.45);
}
.ai-ticker-title{
  font-size:.75rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(226,232,240,.9);
}
.ai-ticker-track{
  --ai-ticker-duration:42s;
  display:flex;
  align-items:center;
  gap:1.75rem;
  min-width:100%;
  white-space:nowrap;
  animation:aiTicker var(--ai-ticker-duration) linear infinite;
}
.ai-ticker-item{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  font-size:.8rem;
  color:rgba(226,232,240,.92);
}
.ai-ticker-item:hover{ text-decoration:underline; }
.ai-ticker-dot{
  width:6px;
  height:6px;
  border-radius:999px;
  background:radial-gradient(circle,#22d3ee 0 40%,transparent 70%);
  box-shadow:0 0 10px rgba(34,211,238,.8);
}
@keyframes aiTicker{
  0%{ transform:translateX(0); }
  100%{ transform:translateX(-50%); }
}
@media (max-width:767.98px){
  .ai-ticker-rail{ border-radius:1rem; padding:.45rem .6rem; }
  .ai-ticker-title{ display:none; }
  .ai-ticker-label{ border-right:0; padding-right:0; }
}

/* === Tools strip (zmiana 8) === */
.tools-strip-track{
  display:flex;
  gap:.75rem;
  overflow-x:auto;
  padding:.25rem .1rem .1rem;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
}
.tools-strip-card{
  scroll-snap-align:start;
  min-width:210px;
  max-width:260px;
  border-radius:1rem;
  border:1px solid rgba(148,163,184,.35);
  background:rgba(15,23,42,.9);
  box-shadow:0 10px 26px rgba(2,8,23,.65);
  display:flex;
  padding:.55rem .65rem;
  gap:.6rem;
}
.tools-strip-thumb{
  flex:0 0 64px;
  height:64px;
  border-radius:.7rem;
  overflow:hidden;
  background:#020617;
}
.tools-strip-thumb img{ width:100%; height:100%; object-fit:cover; }
.tools-strip-body{ flex:1; min-width:0; }
.tools-strip-title{
  font-size:.8rem;
  font-weight:700;
  color:#e5e7eb;
}
.tools-strip-meta{
  margin-top:.25rem;
  font-size:.7rem;
  color:rgba(148,163,184,.9);
}

/* === System log (zmiana 10) === */
.system-log{
  padding:.75rem .9rem;
  border-radius:1rem;
  border:1px solid rgba(148,163,184,.4);
  background:rgba(2,6,23,.95);
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size:.72rem;
  color:#e5e7eb;
}
.system-log-row{
  display:flex;
  flex-wrap:wrap;
  gap:.35rem;
  padding:.2rem 0;
  border-bottom:1px solid rgba(30,64,175,.55);
}
.system-log-row:last-child{ border-bottom:0; }
.system-log-time{ color:#38bdf8; }
.system-log-action{ color:#a5b4fc; }
.system-log-link{
  color:#facc15;
  text-decoration:none;
}
.system-log-link:hover{ text-decoration:underline; }


/* ========================================================================== */
/* === AIHub24 LIGHT MODE — "AI SKY NEBULA" (BRIGHT) ======================== */
/* ========================================================================== */

html:not(.dark) body {
  background:
    radial-gradient(
      900px 700px at 10% 0%,
      rgba(0, 255, 209, 0.30),
      rgba(0, 200, 170, 0.16),
      transparent 74%
    ),
    radial-gradient(
      900px 700px at 90% 6%,
      rgba(205, 175, 255, 0.34),
      rgba(145, 125, 240, 0.18),
      transparent 76%
    ),
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.22) 0%,
      rgba(230, 240, 255, 0.24) 32%,
      rgba(30, 45, 100, 0.94) 100%
    ),
    radial-gradient(
      1500px 1100px at 50% 120%,
      rgba(120, 155, 230, 0.92),
      rgba(35, 48, 110, 0.96)
    );

  background-color: #1f2946;
  background-blend-mode: screen, screen, soft-light, normal;
  background-attachment: fixed;

  overflow-x: hidden;
  color-scheme: light;
}

/* LIGHT MODE: wyłączamy wszystkie canvasy */
html:not(.dark) #neural-bg,
html:not(.dark) canvas[id*="neural"],
html:not(.dark) [data-neural-bg] {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

html:not(.dark) body::before,
html:not(.dark) body::after {
  content: none !important;
  display: none !important;
}

/* Gwiazdy */
#light-stars {
  display: none;
  position: fixed;
  inset: 0;
  z-index: -2;
  pointer-events: none;
}
html:not(.dark) #light-stars { display:block; }
html.dark #light-stars { display:none !important; }

html.dark #light-stars-layer2,
html.dark #light-orbits,
html.dark #light-planets {
  display:none !important;
  opacity:0 !important;
}
html:not(.dark) #light-stars-layer2,
html:not(.dark) #light-orbits,
html:not(.dark) #light-planets {
  display:block;
}

html.dark #light-dust { display:none !important; opacity:0 !important; }
html:not(.dark) #light-dust { display:block; }

html.dark #light-photon,
html.dark #light-bloom,
html.dark #light-constellations {
  display:none !important;
}
html:not(.dark) #light-photon,
html:not(.dark) #light-bloom,
html:not(.dark) #light-constellations {
  display:block;
}

html.dark #light-comet,
html.dark #light-supernova,
html.dark #light-lenswarp {
  display:none !important;
}
html:not(.dark) #light-comet,
html:not(.dark) #light-supernova,
html:not(.dark) #light-lenswarp {
  display:block;
}

html.dark #light-scroll-nebula,
html.dark #light-grid,
html.dark #light-datastream,
html.dark #light-pathfinding,
html.dark #light-navigation {
  display:none !important;
}
html:not(.dark) #light-scroll-nebula,
html:not(.dark) #light-grid,
html:not(..dark) #light-datastream,
html:not(.dark) #light-pathfinding,
html:not(.dark) #light-navigation {
  display:block;
}

/* QUANTUM CANVASES */
html.dark #qc-shockwave,
html.dark #qc-nebula-interact,
html.dark #qc-planet-rot,
html.dark #qc-signal,
html.dark #qc-distort {
  display:none !important;
}
html:not(.dark) #qc-shockwave,
html:not(.dark) #qc-nebula-interact,
html:not(.dark) #qc-planet-rot,
html:not(.dark) #qc-signal,
html:not(.dark) #qc-distort {
  display:block;
}

/* SINGULARITY */
html.dark #qc-aurora,
html.dark #qc-eyetrack,
html.dark #qc-ftl,
html.dark #qc-whisper,
html.dark #qc-darkmatter,
html.dark #qc-tilt {
  display:none !important;
}
html:not(.dark) #qc-aurora,
html:not(.dark) #qc-eyetrack,
html:not(.dark) #qc-ftl,
html:not(.dark) #qc-whisper,
html:not(.dark) #qc-darkmatter,
html:not(.dark) #qc-tilt {
  display:block;
}

/* HOLOGRAPHIC */
html:not(.dark) h1,
html:not(.dark) h2 {
  position: relative;
  color: #ffffff;
  text-shadow: 
    0 0 8px rgba(120,180,255,0.5),
    0 0 18px rgba(80,120,255,0.6),
    0 0 32px rgba(40,200,255,0.4);
}
html:not(.dark) h1:hover,
html:not(.dark) h2:hover {
  text-shadow:
    0 0 16px rgba(140,200,255,0.7),
    0 0 40px rgba(80,180,255,0.8),
    0 0 70px rgba(40,255,255,0.7);
}

/* ULTRAPACK ACTIVATION */
html.dark #qc-aurora,
html.dark #qc-eyetrack,
html.dark #qc-ftl,
html.dark #qc-whisper,
html.dark #qc-darkmatter,
html.dark #qc-tilt,
html.dark #qc-lensing,
html.dark #qc-fluid,
html.dark #qc-glyphs,
html.dark #qc-portal,
html.dark #qc-pulsar,
html.dark #qc-tremble,
html.dark #qc-currents,
html.dark #qc-hud {
  display:none !important;
}

html:not(.dark) #qc-aurora,
html:not(.dark) #qc-eyetrack,
html:not(.dark) #qc-ftl,
html:not(.dark) #qc-whisper,
html:not(.dark) #qc-darkmatter,
html:not(.dark) #qc-tilt,
html:not(.dark) #qc-lensing,
html:not(.dark) #qc-fluid,
html:not(.dark) #qc-glyphs,
html:not(.dark) #qc-portal,
html:not(.dark) #qc-pulsar,
html:not(.dark) #qc-tremble,
html:not(.dark) #qc-currents,
html:not(.dark) #qc-hud {
  display:block;
}

/* GLOBAL CANVAS */
#qc-aurora,
#qc-eyetrack,
#qc-ftl,
#qc-whisper,
#qc-darkmatter,
#qc-tilt,
#qc-lensing,
#qc-fluid,
#qc-glyphs,
#qc-portal,
#qc-pulsar,
#qc-tremble,
#qc-currents,
#qc-hud {
  position: fixed;
  inset: 0;
  pointer-events: none;
  width: 100vw;
  height: 100vh;
}

/* BLEND MODES */
html:not(.dark) #qc-aurora { mix-blend-mode: screen; filter: blur(18px) saturate(1.4); }
html:not(.dark) #qc-eyetrack { mix-blend-mode: screen; filter: blur(36px); }
html:not(.dark) #qc-darkmatter { mix-blend-mode: multiply; filter: blur(40px); }
html:not(.dark) #qc-lensing { mix-blend-mode: overlay; filter: blur(22px) contrast(1.15); }
html:not(.dark) #qc-fluid { mix-blend-mode: soft-light; filter: blur(32px) contrast(1.25) saturate(1.2); }
html:not(.dark) #qc-glyphs { mix-blend-mode: screen; filter: drop-shadow(0 0 10px rgba(0,255,255,0.35)); }

html:not(.dark) #qc-portal,
html:not(.dark) #qc-pulsar,
html:not(.dark) #qc-tremble,
html:not(.dark) #qc-currents,
html:not(.dark) #qc-hud {
  mix-blend-mode: screen;
}

/* LOW-MOTION */
@media (prefers-reduced-motion: reduce) {
  #qc-aurora,
  #qc-eyetrack,
  #qc-ftl,
  #qc-whisper,
  #qc-darkmatter,
  #qc-tilt,
  #qc-lensing,
  #qc-fluid,
  #qc-glyphs,
  #qc-portal,
  #qc-pulsar,
  #qc-tremble,
  #qc-currents {
    transition: opacity 0.4s ease;
    opacity: 0.15 !important;
    filter: blur(10px) !important;
  }
}

/* MOBILE */
@media (max-width:600px){
  #qc-fluid,
  #qc-lensing{ opacity:0.4; }
  #qc-hud{ opacity:0.25; }
}