/* Strony pojedynczych rozkładów (Faza 17.5) — dokładane do arkusza systemu (tarot/iching/number style.css).
   Kolor systemu: --sp-a / --sp-a2. Grupy pozycji: g1 złoto, g2 kolor systemu, g3 przygaszony. */
[data-system="tarot"]{--sp-a:#0E4F3C;--sp-a2:#0A3B2C;--sp-g3:#4f6a55;--sp-g3b:#344c3c}
[data-system="iching"]{--sp-a:#7A1F1C;--sp-a2:#5A1512;--sp-g3:#8a5a3c;--sp-g3b:#6b4228}
[data-system="number"]{--sp-a:#1E2B55;--sp-a2:#141D3D;--sp-g3:#4f5f86;--sp-g3b:#36456b}
.sp-page{--sp-gold:#A8842E;--sp-gold-soft:#D9B65C;--sp-line:#E4E0D0}
.sp-top{padding-top:18px}
.sp-crumbs{font-size:13px;opacity:.75;margin:0 0 34px;display:flex;gap:8px;flex-wrap:wrap}
.sp-crumbs a{color:var(--sp-a);text-decoration:none}.sp-crumbs a:hover{color:var(--sp-gold)}
.sp-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.sp-hero h1{margin-bottom:20px}
.sp-facts{display:flex;gap:34px;margin:4px 0 34px;padding:18px 0;border-top:1px solid var(--sp-line);border-bottom:1px solid var(--sp-line);flex-wrap:wrap}
.sp-facts b{display:block;font:500 34px/1 'Cormorant Garamond',serif;color:var(--sp-a)}
.sp-facts span{font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;opacity:.7}
.sp-layout{margin:0}
.sp-layout figcaption{display:flex;justify-content:center;gap:8px 18px;flex-wrap:wrap;margin-top:22px;font-size:13px}
/* Tarot: karty na planszy */
.sp-board{position:relative;width:100%;max-width:420px;margin:0 auto}
.sp-c{position:absolute;aspect-ratio:3/5;border-radius:6px;display:flex;align-items:center;justify-content:center;font:500 clamp(15px,2.1vw,22px)/1 'Cormorant Garamond',serif;color:#F3E6BE;
  background:radial-gradient(circle at 50% 42%,rgba(217,182,92,.18),transparent 62%),linear-gradient(160deg,var(--sp-a) 0%,var(--sp-a2) 100%);border:1px solid var(--sp-gold-soft);box-shadow:0 14px 28px -16px rgba(20,40,30,.45)}
.sp-c::before{content:"";position:absolute;inset:5px;border:1px solid rgba(217,182,92,.5);border-radius:3px}
.sp-c.g1{box-shadow:0 0 0 2px #fffdf4,0 0 0 3.5px var(--sp-gold),0 14px 28px -16px rgba(20,40,30,.45)}
.sp-c.g3{background:linear-gradient(160deg,var(--sp-g3) 0%,var(--sp-g3b) 100%)}
.sp-cross{transform:translateY(17%) rotate(90deg) scale(.82);z-index:2}
.sp-cross span{transform:rotate(-90deg);display:block}
.sp-under{align-items:flex-start;padding-top:4%;font-size:clamp(13px,1.7vw,18px)}
/* I Ching / Numerologia: kafelki */
.sp-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:18px;max-width:460px;margin:0 auto}
.sp-tiles-1{max-width:200px}.sp-tiles-2{max-width:300px;grid-template-columns:repeat(2,1fr)}.sp-tiles-3{grid-template-columns:repeat(3,1fr)}.sp-tiles-4{grid-template-columns:repeat(4,1fr);max-width:540px}
.sp-tile{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}
.sp-tile b{font:500 18px/1.2 'Cormorant Garamond',serif}
.sp-glyph{width:100%;max-width:120px;aspect-ratio:1;border-radius:6px;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 50% 40%,rgba(217,182,92,.16),transparent 62%),linear-gradient(160deg,var(--sp-a) 0%,var(--sp-a2) 100%);border:1px solid var(--sp-gold-soft);box-shadow:0 14px 28px -16px rgba(20,20,30,.45);position:relative}
.sp-glyph::before{content:"";position:absolute;inset:6px;border:1px solid rgba(217,182,92,.5);border-radius:3px}
.sp-glyph svg{width:62%;fill:#F3E6BE}
.sp-glyph span{font:500 clamp(34px,4vw,46px)/1 'Cormorant Garamond',serif;color:#F3E6BE}
[data-system="number"] .sp-glyph{border-radius:50%}[data-system="number"] .sp-glyph::before{border-radius:50%}
.sp-tile.g1 .sp-glyph{box-shadow:0 0 0 2px #fffdf4,0 0 0 3.5px var(--sp-gold),0 14px 28px -16px rgba(20,20,30,.45)}
.sp-tile.g3 .sp-glyph{background:linear-gradient(160deg,var(--sp-g3) 0%,var(--sp-g3b) 100%)}
.sp-dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:7px;vertical-align:middle;background:var(--sp-a)}
.sp-dot.g1{background:var(--sp-gold)}.sp-dot.g2{background:var(--sp-a)}.sp-dot.g3{background:var(--sp-g3)}
/* Sekcje */
.sp-sec{padding-top:90px}
.sp-h2{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:38px;line-height:1.2;margin:0 0 46px;text-align:center}
.sp-h2 em{font-style:normal;color:var(--sp-gold)}
.sp-center{text-align:center;max-width:680px;margin-left:auto;margin-right:auto}
.sp-gi{margin-top:-24px;margin-bottom:46px}
.sp-groups{display:grid;grid-template-columns:repeat(var(--n,3),1fr);gap:40px}
.sp-groups-2{--n:2}.sp-groups-3{--n:3}.sp-groups-4{--n:4}
.sp-gh{font:600 13px/1 'Manrope',sans-serif;letter-spacing:.12em;text-transform:uppercase;margin:0 0 4px;padding-bottom:16px}
.sp-pos{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));column-gap:40px;max-width:960px;margin:0 auto}
.sp-pos-1{max-width:560px}
.sp-page .reveal-v{grid-template-columns:44px 1fr;gap:14px;padding:20px 0;max-width:none}
.sp-page .reveal-v .reveal-num{font-size:30px;margin:0}
.sp-page .reveal-v h3{font:500 22px/1.2 'Cormorant Garamond',serif;color:var(--sp-a);margin:0 0 6px}
.sp-page .reveal-v p{font-size:14.5px;line-height:1.65;margin:0;max-width:none}
.sp-chips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;max-width:760px;margin:26px auto 0}
.sp-chips span{border:1px solid var(--sp-line);background:#fff;border-radius:999px;padding:7px 14px;font-size:14px}
.sp-chips b{color:var(--sp-gold);margin-right:6px;font-weight:600}
.sp-h3{font:500 28px/1.2 'Cormorant Garamond',serif;text-align:center;margin:56px 0 20px}
.sp-qs{list-style:none;padding:0;margin:0 auto;max-width:640px}
.sp-qs li{font:italic 400 21px/1.45 'Cormorant Garamond',serif;color:var(--sp-a);padding:13px 0 13px 30px;border-top:1px solid var(--sp-line);position:relative}
.sp-qs li:last-child{border-bottom:1px solid var(--sp-line)}
.sp-qs li::before{content:"✦";position:absolute;left:4px;top:15px;font-size:13px;color:var(--sp-gold);font-style:normal}
.sp-rel a.sp-rel-tarot{border-top-color:#0E4F3C}.sp-rel a.sp-rel-iching{border-top-color:#7A1F1C}.sp-rel a.sp-rel-number{border-top-color:#1E2B55}/* Link „Więcej o tym rozkładzie” na listach rozkładów */
.spread-card a.more{font-size:13px;color:inherit;opacity:.7;text-decoration:none;margin-left:18px;border-bottom:1px dotted currentColor}
.spread-card a.more:hover{opacity:1}
@media(max-width:900px){.sp-hero{grid-template-columns:1fr;gap:40px}.sp-groups{grid-template-columns:1fr;gap:20px}}
@media(max-width:600px){.sp-tiles-4{grid-template-columns:repeat(2,1fr);max-width:300px}.sp-facts{gap:22px}.sp-sec{padding-top:64px}.sp-hero h1{font-size:38px}.sp-h2{font-size:31px}}
/* Karty „Kiedy wybrać” i „Podobne” — istniejący komponent .spread-card systemu; tu tylko lista w środku */
.sp-when{grid-template-columns:1fr 1fr;max-width:920px;margin:0 auto}
.sp-when .spread-card h3{margin-bottom:16px}
.sp-list{list-style:none;margin:0;padding:0;font-size:14.5px;line-height:1.65}
.sp-list li{position:relative;padding:0 0 10px 20px}
.sp-list li::before{content:"";position:absolute;left:2px;top:.62em;width:6px;height:6px;border:1px solid var(--sp-gold);transform:rotate(45deg)}
.sp-list a{color:var(--sp-a);font-weight:600;text-decoration:none;border-bottom:1px solid var(--sp-gold)}
.sp-rel .spread-card h3{color:var(--sp-a)}
.sp-rel .spread-card.sp-rel-tarot h3{color:#0E4F3C}.sp-rel .spread-card.sp-rel-iching h3{color:#7A1F1C}.sp-rel .spread-card.sp-rel-number h3{color:#1E2B55}
.sp-rel .spread-card .meta{flex:1}
@media(max-width:900px){.sp-rel{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.sp-when,.sp-rel{grid-template-columns:1fr}}
/* Tarot: karty na stronach rozkładów w ciepłym kremie jak w I Ching (#FCF8F0) i Numerologii (#FBF8F1) — białe były za jasne */
html[data-system="tarot"] body.sp-page .spread-card{background:#FBF8F1}