/* Tema KRISTALI (2026-10-27, prototip — samo index2.php, body.tema-kristali).
   Recept: brušeno ozadje (conic z ostrimi mejami = ploskve kristala) + pastelni prelivi svetlobe na <html>;
   gradniki so »steklo« (prosojna bela + backdrop-filter) s prizmatičnim robom (conic v border-box) in lesketom
   (poševen bel pas). Iskrice: body::before/::after (fiksno, pod vsebino). Spolna žarnica kartic (box-shadow
   .glow-moski/.glow-zenska) je NEDOTAKNJENA — kristal je samo ozadje + rob kartice. */

.tema-kristali {
  --kr-prizma: conic-gradient(from 210deg, #ffb3ec, #c9b6ff, #9fe7ff, #d6ffef, #fff1b0, #ffc2dc, #ffb3ec);
  /* Dovolj neprosojno, da prizma iz border-box ne obarva cele ploskve (le nežen preliv). */
  --kr-steklo: linear-gradient(135deg, rgba(255,255,255,.9), rgba(255,255,255,.74) 45%, rgba(248,240,255,.84));
  --kr-lesk: linear-gradient(115deg, transparent 34%, rgba(255,255,255,.55) 44%, transparent 51%, transparent 63%, rgba(255,255,255,.28) 68%, transparent 73%);
  --kr-senca: 0 12px 32px -14px rgba(118, 76, 196, .38), inset 0 1px 0 rgba(255,255,255,.95), inset 0 -1px 0 rgba(170,140,230,.35);
  --bg: #f4f0fc;
}

/* ── Ozadje: brušen kristal + barvni odsevi ─────────────────────────────── */
html:has(body.tema-kristali) {
  background:
    radial-gradient(42% 32% at 10% 16%, rgba(255,150,225,.38), transparent 70%),
    radial-gradient(36% 30% at 90% 10%, rgba(120,215,255,.36), transparent 70%),
    radial-gradient(50% 40% at 72% 82%, rgba(185,150,255,.32), transparent 70%),
    radial-gradient(40% 34% at 18% 88%, rgba(255,226,150,.26), transparent 70%),
    linear-gradient(115deg, transparent 0 41%, rgba(255,255,255,.55) 45%, transparent 49%),
    linear-gradient(64deg, transparent 0 62%, rgba(255,255,255,.4) 65%, transparent 68%),
    conic-gradient(from 8deg at 50% 30%,
      #f7f2ff 0 9%, #ece3fd 9% 17%, #faf6ff 17% 26%, #e9e0fb 26% 33%, #f5eeff 33% 42%, #eee6ff 42% 51%,
      #fbf8ff 51% 58%, #e8defa 58% 67%, #f4edff 67% 75%, #ede5fd 75% 84%, #f9f5ff 84% 92%, #ebe2fc 92% 100%)
    fixed;
}
body.tema-kristali { background: none; }

/* Iskrice — dve plasti z različnim utripom. */
body.tema-kristali::before, body.tema-kristali::after {
  content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(1.6px 1.6px at 12% 18%, #fff, transparent),
    radial-gradient(2.2px 2.2px at 34% 62%, rgba(255,190,245,.95), transparent),
    radial-gradient(1.4px 1.4px at 58% 28%, #fff, transparent),
    radial-gradient(2px 2px at 76% 74%, rgba(170,225,255,.95), transparent),
    radial-gradient(1.5px 1.5px at 90% 40%, #fff, transparent),
    radial-gradient(1.8px 1.8px at 22% 84%, rgba(255,240,180,.95), transparent);
  background-size: 340px 300px;
  animation: krUtrip 5.5s ease-in-out infinite;
}
body.tema-kristali::after { background-size: 470px 410px; background-position: 120px 80px; animation-duration: 7.5s; animation-delay: -3s; }
@keyframes krUtrip { 0%, 100% { opacity: .35; } 50% { opacity: 1; } }

/* ── Steklo s prizmatičnim robom (skupni recept) ────────────────────────── */
.tema-kristali .nav,
.tema-kristali .noga-fiksna,
.tema-kristali .card,
.tema-kristali .filter-bar,
.tema-kristali .promo-kartica {
  border: 1.5px solid transparent;
  background: var(--kr-lesk) padding-box, var(--kr-steklo) padding-box, var(--kr-prizma) border-box;
  -webkit-backdrop-filter: blur(14px) saturate(160%); backdrop-filter: blur(14px) saturate(160%);
  box-shadow: var(--kr-senca);
}
/* Glava BREZ backdrop-filter (2026-10-27): ta naredi .nav »vsebovalni blok« za position:fixed potomce — hamburger meni
   (.ham-meni, fixed) se je zato umestil v glavo in ga je overflow glave odrezal (meni se ni pokazal). */
.tema-kristali .nav { border-width: 0 0 1.5px; border-radius: 0; -webkit-backdrop-filter: none; backdrop-filter: none; }
.tema-kristali .noga-fiksna { border-width: 1.5px 0 0; border-radius: 0; }
.tema-kristali .pod-kartica { background: var(--kr-lesk) padding-box, linear-gradient(135deg, rgba(var(--pod-barva),.12), rgba(255,255,255,.55)) padding-box, var(--kr-prizma) border-box; }

/* ── Naslov: prizmatično besedilo z lesketom ───────────────────────────── */
.tema-kristali .hero-face {
  background: linear-gradient(90deg, #e040fb, #9d5cff, #4cc3ff, #e040fb, #ff7ad9, #e040fb);
  background-size: 300% 100%; -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 2px 8px rgba(224,64,251,.35));
  animation: krPrelivi 9s linear infinite;
}
/* Slogan ima v style.css prelivno besedilo (background-clip:text) — text-shadow bi ga prekril, zato drop-shadow. */
.tema-kristali .hero-tagline { filter: drop-shadow(0 0 6px rgba(255,255,255,.9)) drop-shadow(0 1px 3px rgba(176,44,198,.25)); }
@keyframes krPrelivi { to { background-position: 300% 0; } }

/* ── Zavihki: kristalni jezički ────────────────────────────────────────── */
.tema-kristali .vstop-zavihki { border-bottom: 2px solid; border-image: linear-gradient(90deg, transparent, #e040fb 15%, #9fe7ff 50%, #e040fb 85%, transparent) 1; }
.tema-kristali .vstop-zavihek {
  border: 1.5px solid transparent; border-bottom: 0; margin-bottom: 0;
  background: var(--kr-lesk) padding-box, linear-gradient(180deg, rgba(255,255,255,.55), rgba(240,228,255,.4)) padding-box, var(--kr-prizma) border-box;
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}
.tema-kristali .vstop-zavihek:hover { background: var(--kr-lesk) padding-box, linear-gradient(180deg, rgba(255,255,255,.8), rgba(248,236,255,.6)) padding-box, var(--kr-prizma) border-box; color: var(--text); }
.tema-kristali .vstop-zavihek.aktiven {
  border: 2px solid transparent; border-bottom: 0; margin-bottom: -2px; color: #c026d3;
  background: var(--kr-lesk) padding-box, linear-gradient(180deg, #fff, #fbf5ff) padding-box,
    conic-gradient(from 200deg, #e040fb, #9d5cff, #4cc3ff, #e040fb, #ff7ad9, #e040fb) border-box;
  box-shadow: 0 -8px 22px -10px rgba(224,64,251,.6), inset 0 1px 0 #fff;
}

/* ── Gumbi: brušen dragulj ─────────────────────────────────────────────── */
.tema-kristali .btn-primary {
  border: 1px solid rgba(255,255,255,.65);
  background:
    linear-gradient(115deg, transparent 38%, rgba(255,255,255,.5) 46%, transparent 54%) 0 0 / 250% 100%,
    linear-gradient(180deg, rgba(255,255,255,.38), rgba(255,255,255,0) 52%),
    linear-gradient(135deg, #f88dea, #e040fb 45%, #9b4dff);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85), inset 0 -3px 8px rgba(90,0,130,.3), 0 8px 20px -6px rgba(224,64,251,.65);
  text-shadow: 0 1px 2px rgba(90,0,130,.35);
  transition: background-position .9s ease, box-shadow .2s;
}
.tema-kristali .btn-primary:hover { background-position: 100% 0, 0 0, 0 0; box-shadow: inset 0 1px 0 #fff, inset 0 -3px 8px rgba(90,0,130,.3), 0 10px 26px -6px rgba(224,64,251,.8); }
.tema-kristali .btn-secondary {
  border: 1px solid transparent;
  background: var(--kr-lesk) padding-box, var(--kr-steklo) padding-box, var(--kr-prizma) border-box;
  box-shadow: 0 6px 16px -8px rgba(118,76,196,.4), inset 0 1px 0 #fff;
}

/* ── Polja: zamrznjeno steklo ──────────────────────────────────────────── */
.tema-kristali input:not([type=checkbox]):not([type=radio]), .tema-kristali select, .tema-kristali textarea {
  background: linear-gradient(180deg, rgba(255,255,255,.5), rgba(255,255,255,.75));
  border: 1px solid rgba(255,255,255,.95);
  box-shadow: inset 0 2px 6px rgba(120,90,200,.18), 0 1px 0 rgba(255,255,255,.9);
}
.tema-kristali input:focus, .tema-kristali select:focus, .tema-kristali textarea:focus {
  border-color: #f0b6ff; box-shadow: inset 0 2px 6px rgba(120,90,200,.15), 0 0 0 3px rgba(224,64,251,.18), 0 0 18px rgba(159,231,255,.6);
}

/* ── Kartice profilov (2026-10-27, 2. različica — uporabnik: »malo transparentnosti in učinke kristalov«).
   Spolna žarnica (box-shadow .glow-*) NEDOTAKNJENA; kartice s skinom ostanejo po skinu (:not([class*="skin-"])).
   - telo: prosojno steklo (ozadje se vidi skozi), okvir = neprosojen prizmatičen obroč (::before z masko)
   - spodnja ploščica z imenom: kristalni dragulj (steklo + mavrični rob + brušen odsev), besedilo kot poslikava
   - lesket: ob prehodu čez kartico + samodejni »blisk« vsakih ~7 s (zamik po kartici, da ne bliskajo hkrati)
   - iskrica ✦ v kotu ploščice počasi utripa */
.tema-kristali .profil-kartica:not([class*="skin-"]) {
  border: 0; /* kartica ima overflow:hidden → obroč (::before) je NOTRANJI, čez rob slike */
  background:
    linear-gradient(112deg, transparent 30%, rgba(255,255,255,.35) 36%, transparent 41%),
    linear-gradient(160deg, rgba(255,255,255,.34), rgba(255,255,255,.1) 55%, rgba(236,220,255,.22));
  -webkit-backdrop-filter: blur(4px) saturate(150%); backdrop-filter: blur(4px) saturate(150%);
}
.tema-kristali .profil-kartica:not([class*="skin-"])::before {
  content: ''; position: absolute; inset: 0; padding: 2px; border-radius: inherit; pointer-events: none; z-index: 2;
  background: conic-gradient(from 210deg, #f59ae6, #b394ff, #7fd8ff, #b8f5dd, #ffe58f, #ff9fcb, #f59ae6);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite: exclude;
}
/* Fotografija: tanka svetla »brušena« meja proti steklu spodaj. */
.tema-kristali .profil-kartica:not([class*="skin-"]) .profil-kartica-foto { box-shadow: 0 1px 0 rgba(255,255,255,.9), 0 2px 6px -2px rgba(120,80,200,.35); }

/* Ploščica z imenom — kristalni dragulj (id v selektorju: style.css ima #profilGridWrap .profil-kartica-info). */
.tema-kristali #profilGridWrap .profil-kartica:not([class*="skin-"]) .profil-kartica-info {
  position: relative; border: 1.5px solid transparent;
  background:
    linear-gradient(118deg, transparent 28%, rgba(255,255,255,.6) 36%, transparent 44%) padding-box,
    linear-gradient(180deg, rgba(255,255,255,.82), rgba(255,255,255,.62) 60%, rgba(244,234,255,.72)) padding-box,
    conic-gradient(from 200deg, #f7a8ea, #c3adff, #9fe2ff, #d4fbe9, #fff0b0, #ffb8d6, #f7a8ea) border-box;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  box-shadow: inset 1px 1px 0 rgba(255,255,255,.95), inset -1px -2px 4px rgba(140,100,220,.25), 0 4px 10px -4px rgba(110,70,190,.4);
}
.tema-kristali #profilGridWrap .profil-kartica:not([class*="skin-"]) .profil-kartica-info:hover {
  box-shadow: inset 1px 1px 0 #fff, inset -1px -2px 4px rgba(140,100,220,.25), 0 8px 16px -6px rgba(110,70,190,.5), 0 0 14px -2px rgba(224,64,251,.45);
}
.tema-kristali #profilGridWrap .profil-kartica:not([class*="skin-"]) .profil-kartica-info:active {
  box-shadow: inset 2px 2px 6px rgba(140,100,220,.35), inset -1px -1px 0 rgba(255,255,255,.9);
}
.tema-kristali .profil-kartica:not([class*="skin-"]) .profil-kartica-info :is(div, span) {
  text-shadow: 0 1px 0 rgba(255,255,255,.85), 0 0 6px rgba(255,255,255,.9);
}
/* Iskrica v kotu ploščice. */
.tema-kristali #profilGridWrap .profil-kartica:not([class*="skin-"]) .profil-kartica-info::after {
  content: '✦'; position: absolute; top: .2rem; right: .35rem; font-size: .7rem; line-height: 1; pointer-events: none;
  color: #fff; text-shadow: 0 0 4px #e9a8ff, 0 0 9px #9fe7ff;
  animation: krIskrica 3.2s ease-in-out infinite;
}
.tema-kristali .profil-kartica:nth-child(3n+2) .profil-kartica-info::after { animation-delay: -1.1s; }
.tema-kristali .profil-kartica:nth-child(3n+3) .profil-kartica-info::after { animation-delay: -2.2s; }
@keyframes krIskrica { 0%, 100% { opacity: .15; transform: scale(.6) rotate(0deg); } 50% { opacity: 1; transform: scale(1.15) rotate(45deg); } }

/* Lesket čez celo kartico: samodejni blisk + ob prehodu. */
.tema-kristali .profil-kartica:not([class*="skin-"])::after {
  content: ''; position: absolute; inset: 0; pointer-events: none; border-radius: inherit; z-index: 1;
  background: linear-gradient(115deg, transparent 42%, rgba(255,255,255,.6) 48%, rgba(200,235,255,.35) 51%, transparent 56%) -150% 0 / 250% 100% no-repeat;
  animation: krBlisk 7s ease-in-out infinite;
}
.tema-kristali .profil-kartica:nth-child(4n+2)::after { animation-delay: -1.8s; }
.tema-kristali .profil-kartica:nth-child(4n+3)::after { animation-delay: -3.6s; }
.tema-kristali .profil-kartica:nth-child(4n+4)::after { animation-delay: -5.4s; }
.tema-kristali .profil-kartica:not([class*="skin-"]):hover::after { animation: krBlisk .9s ease-out 1; }
@keyframes krBlisk { 0%, 78% { background-position: -150% 0; } 100% { background-position: 150% 0; } }
/* ── 3D nagib + slika za steklom (2026-10-27, js/kristali-nagib.js nastavlja --nx/--ny/--mx/--my) ───────────────
   Miška: kartica se nagne proti kazalcu. Telefon: sledi nagibu telefona (body.kr-ziroskop). Fotografija se premakne
   v NASPROTNO smer (paralaksa → videti je globlje, za steklom), notranja senca roba = globina, odsev sledi kazalcu. */
.tema-kristali .profil-kartica, .tema-kristali .promo-kartica { transition: transform .18s ease-out, box-shadow .15s; }
.tema-kristali .profil-kartica.kr-nagnjena, .tema-kristali .promo-kartica.kr-nagnjena,
body.kr-ziroskop.tema-kristali .profil-kartica, body.kr-ziroskop.tema-kristali .promo-kartica {
  transform: perspective(900px) rotateX(calc(var(--ny, 0) * -9deg)) rotateY(calc(var(--nx, 0) * 12deg)) translateY(-3px);
}
.tema-kristali .profil-kartica img.profil-kartica-foto,
.tema-kristali .profil-kartica:hover img.profil-kartica-foto {
  transform: scale(1.09) translate(calc(var(--nx, 0) * -6px), calc(var(--ny, 0) * -6px));
  transition: transform .18s ease-out;
}
.tema-kristali .profil-kartica-foto-wrap::before {
  content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 1;
  box-shadow: inset 0 12px 16px -10px rgba(40,10,80,.5), inset 0 -10px 14px -10px rgba(40,10,80,.4),
    inset 10px 0 14px -12px rgba(40,10,80,.35), inset -10px 0 14px -12px rgba(40,10,80,.35), inset 0 0 0 1px rgba(255,255,255,.55);
}
.tema-kristali .profil-kartica-foto-wrap::after {
  /* 2026-10-27 (uporabnik): premični beli odsev (radial za --mx/--my) odstranjen — »bela meglica na sredini slike je
     odveč«. Ostane le mirujoč nežen sij zgoraj levo (steklo). */
  content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 1;
  background: linear-gradient(160deg, rgba(255,255,255,.18), transparent 30%);
}

/* Kartice profilov 10 % prozorne (2026-10-27, uporabnik): prosojni so OTROCI kartice (slika, ploščica z imenom),
   ne kartica sama — tako ostaneta prizmatični okvir (::before) in spolna žarnica (box-shadow) polno vidna. */
.tema-kristali #profilGridWrap .profil-kartica > * { opacity: .9; }

/* ══ Celoten Blind Magik (2026-10-27, uporabnik: »tema kristali na celotnem blindmagik«) ═══════════════════════════
   body.tema-kristali je na vseh straneh (panel, oseba, login, priznanje, pravna besedila …); body.kr-vstop SAMO na
   vstopni strani. backdrop-filter (zamegljenost skozi steklo) je dovoljen samo na vstopni strani — drugje bi naredil
   gradnik »vsebovalni blok« za position:fixed potomce (modalna okna, ⓘ priznanj, lightbox v .card …), ki bi se
   odrezali/zamaknili (isti hrošč kot hamburger 27.10.). Brez zamegljenosti je steklo dovolj neprosojno. */
body.tema-kristali:not(.kr-vstop) :is(.card, .filter-bar, .promo-kartica, .noga-fiksna, .vstop-zavihek, .kaj-je-face,
  .pod-kartica, .profil-kartica, .profil-kartica-info, .btn, #poudarkiSpol) {
  -webkit-backdrop-filter: none; backdrop-filter: none;
}
/* Vsebinske steklene kartice drugje (npr. Podpora v panelu) brez zamegljenosti malo manj prozorne — berljivost. */
body.tema-kristali:not(.kr-vstop) .pod-kartica {
  background:
    linear-gradient(112deg, transparent 22%, rgba(255,255,255,.42) 27%, rgba(255,255,255,.12) 31%, transparent 33%),
    linear-gradient(135deg, rgba(255,255,255,.62), rgba(255,255,255,.45) 60%, rgba(var(--pod-barva, 224,64,251), .08)) !important;
}

/* Glavni zavihki aplikacije (panel.php) — kristalni žleb + aktivni dragulj. */
.tema-kristali .panel-tabs {
  border: 1.5px solid transparent;
  background: linear-gradient(180deg, rgba(255,255,255,.55), rgba(244,236,255,.7)) padding-box, var(--kr-prizma) border-box;
  box-shadow: inset 0 2px 6px rgba(120,90,200,.18), 0 8px 22px -12px rgba(118,76,196,.4);
}
.tema-kristali .panel-tab:hover { background: rgba(255,255,255,.6); color: var(--text); }
.tema-kristali .panel-tab.active,
.tema-kristali :is(.zm-podzavihek, .chip, .uj-chip):is(.aktiven, .selected) {
  color: #fff; text-shadow: 0 1px 2px rgba(90,0,130,.35);
  background:
    linear-gradient(180deg, rgba(255,255,255,.38), rgba(255,255,255,0) 52%),
    linear-gradient(135deg, #f88dea, #e040fb 45%, #9b4dff);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85), inset 0 -2px 6px rgba(90,0,130,.3), 0 6px 16px -6px rgba(224,64,251,.6);
}
/* Podzavihki in čipi — stekleni kamenčki. */
.tema-kristali :is(.zm-podzavihek, .chip, .uj-chip) {
  border: 1px solid transparent;
  background: var(--kr-lesk) padding-box, var(--kr-steklo) padding-box, var(--kr-prizma) border-box;
  box-shadow: 0 5px 14px -7px rgba(118,76,196,.45), inset 0 1px 0 #fff;
}
/* Prijava / registracija / pozabljeno geslo. */
.tema-kristali .auth-card {
  border: 1.5px solid transparent;
  background: var(--kr-lesk) padding-box, var(--kr-steklo) padding-box, var(--kr-prizma) border-box;
  box-shadow: var(--kr-senca);
}

/* ── Gumbi: nagib ob prehodu miške (js/kristali-nagib.js → .btn.kr-nagnjena), manjši kot pri karticah ─────────── */
.tema-kristali .btn, .tema-kristali .btn-primary { transition: transform .15s ease-out, background-position .9s ease, box-shadow .2s; }
.tema-kristali .btn.kr-nagnjena {
  transform: perspective(600px) rotateX(calc(var(--ny, 0) * -12deg)) rotateY(calc(var(--nx, 0) * 6deg)) translateY(-1px);
}

/* ── Stran profila (oseba.php, 2026-10-27, uporabnik) ───────────────────────────────────────────────────────────
   Glavna kartica 10 % prozorna (otroci, okvir ostane), ime in naslovi razdelkov »3D kristalne črke«:
   brušen preliv (belo → lila → magenta → ledeno modro) v črkah + stopničasta izbočenost (drop-shadow) + senca. */
.tema-kristali .oseba-kartica > * { opacity: .9; }
/* Ozadje kartice zares stekleno (2026-10-27, uporabnik: »kartica ni 10 % prozorna«) — prej ~85 % belo, brušeno ozadje
   se ni videlo skozi. Prizmatični okvir ostane (border-box). */
.tema-kristali .card.oseba-kartica {
  position: relative;
  background:
    var(--kr-lesk) padding-box,
    linear-gradient(135deg, rgba(255,255,255,.62), rgba(255,255,255,.42) 50%, rgba(248,238,255,.55)) padding-box;
}
/* Prizmatični obroč posebej (pod prozornim steklom bi border-box preliv obarval celo kartico). Če ima lastnik izbrano
   barvo obrobe (inline border iz $temaObroba), ostane njegova obroba. */
.tema-kristali .card.oseba-kartica:not([style*="border"])::before {
  content: ''; position: absolute; inset: -1.5px; padding: 1.5px; border-radius: inherit; pointer-events: none;
  background: var(--kr-prizma);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite: exclude;
}
.tema-kristali .oseba-kartica h2,
.tema-kristali .oseba-kartica strong {
  background: linear-gradient(170deg, #ffffff 0%, #f6dcff 16%, #c58cff 36%, #e040fb 50%, #ffc8f2 58%, #7fcfff 76%, #e4f6ff 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent;
}
.tema-kristali .oseba-kartica h2 {
  font-size: 2rem; letter-spacing: .01em;
  filter: drop-shadow(0 1px 0 #fff) drop-shadow(1px 1px 0 #b893f2) drop-shadow(1px 1px 0 #946ae2) drop-shadow(1px 1px 0 #7a4fd0)
    drop-shadow(0 4px 3px rgba(80,30,160,.35));
}
/* Podatkovne vrstice pod imenom (spol·starost·kraj, Poreklo, Želi spoznati, aktivnost, ocene — 2026-10-27, uporabnik):
   temen kristalni preliv v črkah (berljiv), bel brušen rob + mehka senca, čez črke počasi zdrsi svetel blisk. */
.tema-kristali .oseba-kartica p.text-sec.mb-2 {
  background:
    linear-gradient(110deg, transparent 42%, rgba(255,255,255,.95) 50%, transparent 58%) 0 0 / 300% 100% no-repeat,
    linear-gradient(170deg, #4f3d86 0%, #6a37cf 40%, #8a2bb8 62%, #3a54b8 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent;
  font-weight: 600;
  filter: drop-shadow(0 1px 0 rgba(255,255,255,.95)) drop-shadow(0 2px 2px rgba(80,30,160,.28));
  animation: krBliskCrke 6s ease-in-out infinite;
}
.tema-kristali .oseba-kartica p.text-sec.mb-2:nth-of-type(2n) { animation-delay: -1.5s; }
.tema-kristali .oseba-kartica p.text-sec.mb-2:nth-of-type(3n) { animation-delay: -3s; }
@keyframes krBliskCrke { 0%, 60% { background-position: 150% 0, 0 0; } 100% { background-position: -150% 0, 0 0; } }
@media (prefers-reduced-motion: reduce) { .tema-kristali .oseba-kartica p.text-sec.mb-2 { animation: none; } }

/* Manjši naslovi: temnejši, nasičen kristal (svetli preliv bi bil pri majhnih črkah neberljiv). */
.tema-kristali .oseba-kartica strong {
  background: linear-gradient(170deg, #b04ae8 0%, #8a2be2 30%, #c026d3 55%, #6d4ce8 78%, #3b82f6 100%);
  -webkit-background-clip: text; background-clip: text;
  filter: drop-shadow(0 1px 0 rgba(255,255,255,.95)) drop-shadow(0 1px 1px rgba(80,30,160,.35));
}

/* Info vrstica (»Tu niso prikazani vsi …«) berljiva na svetlem kristalu. */
.tema-kristali .info-zarenje { text-shadow: 0 0 10px #fff; }

/* ── Vsebinske kartice (2026-10-27, uporabnik): »Kaj je Blind Magik«, Tehnični podatki, Kako deluje, Za ženske/moške,
   Dodatne vsebine — STEKLENA plošča, vsebina kot POSLIKAVA na steklu: telo skoraj prozorno (ozadje se vidi skozi,
   le rahlo zamegljeno), odsev (poševen pas + svetlejši zgornji rob), okvir NEPROSOJEN prizmatičen (::before z masko),
   debelina stekla = inset svetloba zgoraj levo / senca spodaj desno; besedilo dobi bel »emajl« rob (berljivost). */
.tema-kristali .kaj-je-face,
.tema-kristali .pod-kartica,
.tema-kristali [data-vz-panel] > .card,
.tema-kristali #poudarkiSpol {
  position: relative; border: 2px solid transparent;
  background:
    linear-gradient(112deg, transparent 22%, rgba(255,255,255,.42) 27%, rgba(255,255,255,.12) 31%, transparent 33%,
      transparent 36%, rgba(255,255,255,.22) 38%, transparent 40%),
    radial-gradient(120% 60% at 0% 0%, rgba(255,255,255,.45), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.3), rgba(255,255,255,0) 18%),
    linear-gradient(135deg, rgba(255,255,255,.16), rgba(255,255,255,.05) 60%, rgba(var(--pod-barva, 224,64,251), .06))
    !important; /* #poudarkiSpol ima ozadje v inline slogu */
  -webkit-backdrop-filter: blur(3px) saturate(150%); backdrop-filter: blur(3px) saturate(150%);
  box-shadow:
    inset 2px 2px 0 rgba(255,255,255,.8),
    inset -3px -4px 8px rgba(140,100,220,.22),
    0 2px 0 rgba(255,255,255,.7),
    0 20px 34px -14px rgba(90,50,170,.5),
    0 36px 64px -30px rgba(var(--pod-barva, 224,64,251), .6);
  transition: transform .25s, box-shadow .25s;
}
.tema-kristali .kaj-je-face::before,
.tema-kristali .pod-kartica::before,
.tema-kristali [data-vz-panel] > .card::before,
.tema-kristali #poudarkiSpol::before {
  content: ''; position: absolute; inset: -2px; padding: 2px; border-radius: inherit; pointer-events: none;
  background: conic-gradient(from 210deg, #f59ae6, #b394ff, #7fd8ff, #b8f5dd, #ffe58f, #ff9fcb, #f59ae6);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite: exclude;
}
.tema-kristali .kaj-je-face:hover,
.tema-kristali .pod-kartica:hover,
.tema-kristali [data-vz-panel] > .card:hover,
.tema-kristali #poudarkiSpol:hover {
  transform: translateY(-4px);
  box-shadow:
    inset 2px 2px 0 rgba(255,255,255,.85),
    inset -3px -4px 8px rgba(140,100,220,.22),
    0 2px 0 rgba(255,255,255,.7),
    0 28px 44px -16px rgba(90,50,170,.55),
    0 44px 76px -30px rgba(var(--pod-barva, 224,64,251), .7);
}
/* Poslikava na steklu: bel obris + mehak sij okoli črk, da je besedilo berljivo tudi nad pisanim ozadjem. */
.tema-kristali :is(.kaj-je-face, .pod-kartica, [data-vz-panel] > .card, #poudarkiSpol) :is(p, li, h2, h3, summary, span, b, div, label) {
  text-shadow: 0 1px 0 rgba(255,255,255,.85), 0 0 6px rgba(255,255,255,.9), 0 0 14px rgba(255,255,255,.6);
}
.tema-kristali :is(.kaj-je-face, .pod-kartica, [data-vz-panel] > .card, #poudarkiSpol) :is(.btn, input, select, textarea) { text-shadow: none; }
@media (prefers-reduced-motion: reduce) { .tema-kristali .kaj-je-face:hover, .tema-kristali .pod-kartica:hover { transform: none; } }
@media (prefers-reduced-motion: reduce) {
  body.tema-kristali::before, body.tema-kristali::after, .tema-kristali .hero-face,
  .tema-kristali .profil-kartica::after, .tema-kristali .profil-kartica-info::after { animation: none; }
  .tema-kristali .profil-kartica.kr-nagnjena, .tema-kristali .btn.kr-nagnjena { transform: none; }
}