/* WiemWiecej — Rozkłady Tarota: „Karta dnia". Styl scoped pod .wwr-app.
   Tokeny z design systemu (granat #101C3F, złoto #BB9A57, Playfair/EB Garamond/Montserrat). */

.wwr-app{
  --ww-cream:#FBF8F2; --ww-ink:#101C3F; --ww-ink-2:#1B2A55; --ww-ink-3:#263566;
  --ww-gold:#BB9A57; --ww-gold-soft:#D8C48A; --ww-white:#FFFFFF; --ww-cream-70:rgba(251,248,242,.70);
  --wwr-font-display:'Playfair Display',Georgia,serif;
  --wwr-font-serif:'EB Garamond',Georgia,serif;
  --wwr-font-sans:'Montserrat','Helvetica Neue',Arial,sans-serif;
  --wwr-ease:cubic-bezier(0.22,0.61,0.36,1);
  display:flex;justify-content:center;padding:16px 0;
}
.wwr-app *{box-sizing:border-box;}

.wwr-card{position:relative;width:100%;max-width:560px;
  background:radial-gradient(1200px 500px at 85% -10%,#1B2A55 0%,#101C3F 55%);
  background-color:var(--ww-ink);border:1px solid var(--ww-ink-3);border-radius:24px;
  box-shadow:0 30px 80px rgba(8,14,35,.45);overflow:hidden;}
.wwr-starfield{position:absolute;inset:0;pointer-events:none;background-image:
  radial-gradient(1.4px 1.4px at 12% 22%,rgba(216,196,138,.7),transparent),
  radial-gradient(1.2px 1.2px at 78% 12%,rgba(251,248,242,.6),transparent),
  radial-gradient(1.3px 1.3px at 32% 68%,rgba(216,196,138,.45),transparent),
  radial-gradient(1px 1px at 62% 82%,rgba(251,248,242,.5),transparent),
  radial-gradient(1.5px 1.5px at 88% 60%,rgba(216,196,138,.4),transparent);}
.wwr-moon{position:absolute;top:-60px;right:-60px;width:220px;height:220px;border-radius:50%;
  background:radial-gradient(circle at 60% 40%,rgba(216,196,138,.28),rgba(216,196,138,0) 68%);
  animation:wwr-glow 6s ease-in-out infinite;pointer-events:none;}
.wwr-tw{position:absolute;border-radius:50%;background:var(--ww-gold-soft);}
.wwr-tw1{top:40px;left:44px;width:3px;height:3px;animation:wwr-twinkle 3.4s ease-in-out infinite;}
.wwr-tw2{top:120px;left:30px;width:2px;height:2px;background:var(--ww-white);animation:wwr-twinkle 2.6s .6s ease-in-out infinite;}
.wwr-tw3{top:180px;right:60px;width:2.5px;height:2.5px;animation:wwr-twinkle 4s 1.2s ease-in-out infinite;}
.wwr-body{position:relative;padding:40px 28px 34px;}
.wwr-center{text-align:center;}

/* Reset motywu (…,section{display:block}) jako CSS autorski BIJE regułę UA
   [hidden]{display:none}, więc ukryte fazy (shuffle/result) pokazywałyby się
   przed submitem. Wymuszamy ukrycie dla elementów z atrybutem hidden. */
.wwr-app [hidden]{display:none !important;}

.wwr-eyebrow{font-family:var(--wwr-font-sans);font-size:12px;font-weight:600;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ww-gold-soft);display:inline-flex;align-items:center;gap:12px;}
.wwr-eyebrow::before,.wwr-eyebrow::after{content:"";width:26px;border-top:1px dashed var(--ww-gold-soft);opacity:.6;}

.wwr-title{font-family:var(--wwr-font-display);font-weight:700;font-size:34px;line-height:1.15;
  letter-spacing:-.01em;color:var(--ww-white);text-align:center;margin:0 0 12px;}
.wwr-title i,.wwr-card-name i{font-style:italic;color:var(--ww-gold-soft);}
.wwr-lead{font-family:var(--wwr-font-serif);font-size:17px;line-height:1.6;color:var(--ww-cream-70);
  text-align:center;max-width:400px;margin:0 auto 26px;font-feature-settings:'onum' 1,'pnum' 1;}

.wwr-deck{position:relative;height:178px;margin-bottom:30px;}
.wwr-deck .wwr-cb{--rot:0deg;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(var(--rot));animation:wwr-float 5.5s ease-in-out infinite;}
.wwr-deck .wwr-cb:nth-child(n+4){display:none;}
.wwr-deck .wwr-cb:nth-child(1){--rot:-11deg;}
.wwr-deck .wwr-cb:nth-child(2){--rot:0deg;animation-delay:.4s;z-index:2;}
.wwr-deck .wwr-cb:nth-child(3){--rot:11deg;animation-delay:.8s;}

.wwr-cardback{border-radius:9px;background:linear-gradient(160deg,#223066 0%,#101C3F 100%);
  border:1px solid rgba(216,196,138,.55);
  box-shadow:inset 0 0 0 4px rgba(216,196,138,.10),0 8px 24px rgba(0,0,0,.35);
  position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.wwr-cardback .ring{border-radius:50%;box-shadow:inset -14px 5px 0 0 var(--ww-gold-soft);}
.wwr-cardback .cbs{position:absolute;border-radius:50%;background:var(--ww-gold-soft);}
.wwr-cardback .cbe{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);line-height:1;}

.wwr-form{display:flex;flex-direction:column;gap:12px;max-width:380px;margin:0 auto;}
.wwr-fld{width:100%;height:52px;border-radius:999px;background:rgba(255,255,255,.04);
  border:1px solid var(--ww-ink-3);color:var(--ww-white);font-family:var(--wwr-font-sans);
  font-size:15px;padding:0 16px;outline:none;transition:border-color .2s;}
.wwr-fld::placeholder{color:rgba(251,248,242,.45);}
.wwr-fld:focus{border-color:var(--ww-gold);}
.wwr-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;}
.wwr-microcopy{font-family:var(--wwr-font-serif);font-size:13px;line-height:1.5;color:var(--ww-cream-70);
  text-align:center;margin:2px 0 4px;font-style:italic;}
.wwr-cbx{display:flex;align-items:flex-start;gap:10px;cursor:pointer;margin:2px 2px;}
.wwr-cbx input{margin-top:3px;width:16px;height:16px;accent-color:var(--ww-gold);flex-shrink:0;cursor:pointer;}
.wwr-cbx span{font-family:var(--wwr-font-sans);font-size:12px;line-height:1.5;color:var(--ww-cream-70);}
.wwr-cbx a{color:var(--ww-gold-soft);}
.wwr-cbx b{color:var(--ww-cream);font-weight:600;}

.wwr-btn{height:52px;border:none;border-radius:999px;background:#f4ecd8;color:var(--ww-ink);
  font-family:var(--wwr-font-sans);font-weight:600;font-size:12px;letter-spacing:.18em;text-transform:uppercase;
  cursor:pointer;transition:background .2s,transform .1s;box-shadow:0 10px 30px rgba(0,0,0,.3);}
.wwr-btn:hover{background:#fff;}
.wwr-btn:active{transform:translateY(1px);}
.wwr-btn[disabled]{opacity:.4;cursor:not-allowed;box-shadow:none;}
/* Link w skórce przycisku (np. „Postaw inny rozkład"). Scope .wwr-app: kaskada
   Bimbera stylami elementu `a` przebijałaby pojedynczą klasę (kolor/underline). */
.wwr-app a.wwr-btn{display:inline-flex;align-items:center;justify-content:center;
  padding:0 36px;text-decoration:none;color:var(--ww-ink);line-height:1;}
.wwr-app a.wwr-btn:hover{color:var(--ww-ink);background:#fff;}
.wwr-error{font-family:var(--wwr-font-sans);font-size:13px;color:#e7a17a;text-align:center;margin:2px 0 0;}

.wwr-teaser{display:flex;align-items:center;justify-content:center;gap:8px;margin:22px auto 0;
  padding:10px 18px;border:1px dashed var(--ww-ink-3);border-radius:999px;width:fit-content;}
.wwr-teaser .wwr-dot{width:6px;height:6px;border-radius:50%;background:var(--ww-gold);}
.wwr-teaser span{font-family:var(--wwr-font-sans);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ww-gold-soft);}

.wwr-shuffle-deck{position:relative;height:210px;margin:8px 0 22px;}
.wwr-shuffle-deck .wwr-cb{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);}
.wwr-shuffle-deck .wwr-cb:nth-child(1){animation:wwr-shuffle-a 1.15s ease-in-out infinite;}
.wwr-shuffle-deck .wwr-cb:nth-child(2){animation:wwr-shuffle-b 1.15s ease-in-out infinite;z-index:3;}
.wwr-shuffle-deck .wwr-cb:nth-child(3){animation:wwr-shuffle-c 1.15s ease-in-out infinite;z-index:2;}
.wwr-shuffle-title{font-family:var(--wwr-font-display);font-style:italic;font-size:22px;color:var(--ww-white);margin:0 0 6px;}
.wwr-shuffle-sub{font-family:var(--wwr-font-serif);font-size:15px;color:var(--ww-cream-70);margin:0;}

.wwr-result{animation:wwr-rise .6s var(--wwr-ease) both;}
.wwr-flip-wrap{perspective:1200px;width:214px;margin:0 auto 26px;}
.wwr-flip{position:relative;width:214px;height:336px;transform-style:preserve-3d;
  transition:transform 1s var(--wwr-ease);transform:rotateY(180deg);}
.wwr-flip.revealed{transform:rotateY(0deg);}
.wwr-flip .face,.wwr-flip .back{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;}
.wwr-flip .back{transform:rotateY(180deg);}
.wwr-flip .face{background:var(--ww-ink-2);border:1px solid var(--ww-gold-soft);border-radius:12px;
  padding:12px;display:flex;flex-direction:column;box-shadow:0 0 40px rgba(216,196,138,.18),0 20px 50px rgba(0,0,0,.4);}
.wwr-flip .face .imgwrap{flex:1;overflow:hidden;border-radius:4px;border:1px solid rgba(216,196,138,.6);}
.wwr-flip .face img{width:100%;height:100%;object-fit:cover;display:block;}
.wwr-flip .face .suit{text-align:center;padding-top:10px;font-family:var(--wwr-font-sans);font-size:10px;
  font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--ww-gold-soft);}

.wwr-greeting{font-family:var(--wwr-font-sans);font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ww-cream-70);margin:0 0 8px;}
.wwr-card-name{font-family:var(--wwr-font-display);font-weight:700;font-size:32px;line-height:1.12;
  color:var(--ww-white);margin:0 0 12px;}
.wwr-desc{font-family:var(--wwr-font-serif);font-size:17px;line-height:1.65;color:var(--ww-cream-70);
  max-width:440px;margin:0 auto;font-feature-settings:'onum' 1;}
.wwr-desc p{margin:0 0 10px;}
.wwr-chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;}
.wwr-kw{font-family:var(--wwr-font-sans);font-size:11px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ww-gold-soft);border:1px solid var(--ww-ink-3);border-radius:999px;padding:7px 16px;}

.wwr-aspects{border-top:1px solid var(--ww-ink-3);padding-top:26px;margin-top:30px;}
.wwr-aspect-chip{font-family:var(--wwr-font-sans);font-size:11px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;padding:10px 20px;border-radius:999px;cursor:pointer;background:transparent;
  color:var(--ww-cream);border:1px solid var(--ww-ink-3);transition:all .2s var(--wwr-ease);}
.wwr-aspect-chip.sel{background:var(--ww-gold);color:var(--ww-ink);border-color:var(--ww-gold);}
.wwr-aspect-panel{background:rgba(255,255,255,.04);border:1px solid var(--ww-ink-3);border-radius:16px;
  padding:22px 24px;min-height:120px;margin-top:20px;}
.wwr-aspect-panel .pl{display:flex;align-items:center;gap:10px;margin-bottom:12px;}
.wwr-aspect-panel .pl .wwr-dot{width:7px;height:7px;border-radius:50%;background:var(--ww-gold);flex-shrink:0;}
.wwr-aspect-panel .pl span{font-family:var(--wwr-font-sans);font-size:12px;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ww-white);}
.wwr-aspect-panel .txt{font-family:var(--wwr-font-serif);font-size:17px;line-height:1.7;color:var(--ww-cream-70);
  margin:0;font-feature-settings:'onum' 1;}
.wwr-aspect-panel .txt p{margin:0 0 12px;}
.wwr-aspect-panel .txt p:last-child{margin-bottom:0;}
.wwr-aspect-panel .txt strong{color:var(--ww-cream);font-weight:600;}
.wwr-accent{color:var(--ww-gold-soft);}

.wwr-actions{display:flex;flex-direction:column;align-items:center;gap:16px;margin-top:28px;}
.wwr-link{font-family:var(--wwr-font-sans);font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ww-gold-soft);text-decoration:none;border-bottom:1px solid var(--ww-ink-3);padding-bottom:3px;}
.wwr-share{border-top:1px solid var(--ww-ink-3);margin-top:28px;padding-top:22px;text-align:center;}
.wwr-share .lbl{font-family:var(--wwr-font-sans);font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ww-cream-70);margin:0 0 16px;}
.wwr-social{display:inline-flex;flex-wrap:wrap;gap:10px;justify-content:center;}
.wwr-social button{height:40px;padding:0 18px;border-radius:999px;background:transparent;
  border:1px solid var(--ww-ink-3);color:var(--ww-cream);font-family:var(--wwr-font-sans);font-size:12px;
  font-weight:500;letter-spacing:.04em;cursor:pointer;transition:border-color .2s;}
.wwr-social button:hover{border-color:var(--ww-gold);}

@keyframes wwr-float{0%,100%{transform:translate(-50%,-50%) rotate(var(--rot)) translateY(0);}50%{transform:translate(-50%,-50%) rotate(var(--rot)) translateY(-9px);}}
@keyframes wwr-twinkle{0%,100%{opacity:.18;}50%{opacity:.9;}}
@keyframes wwr-glow{0%,100%{opacity:.55;}50%{opacity:.85;}}
@keyframes wwr-rise{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:translateY(0);}}
@keyframes wwr-shuffle-a{0%,100%{transform:translate(-50%,-50%) rotate(-9deg);}25%{transform:translate(-118%,-60%) rotate(-26deg);}50%{transform:translate(-50%,-50%) rotate(6deg);}75%{transform:translate(10%,-44%) rotate(20deg);}}
@keyframes wwr-shuffle-b{0%,100%{transform:translate(-50%,-50%) rotate(0deg);}30%{transform:translate(6%,-58%) rotate(18deg);}60%{transform:translate(-108%,-42%) rotate(-20deg);}}
@keyframes wwr-shuffle-c{0%,100%{transform:translate(-50%,-50%) rotate(9deg);}25%{transform:translate(8%,-40%) rotate(24deg);}55%{transform:translate(-120%,-56%) rotate(-22deg);}80%{transform:translate(-50%,-50%) rotate(-4deg);}}

@media (prefers-reduced-motion: reduce){
  .wwr-deck .wwr-cb,.wwr-moon,.wwr-tw,.wwr-shuffle-deck .wwr-cb{animation:none !important;}
  .wwr-flip{transition:opacity .3s ease;}
}
@media (max-width:480px){ .wwr-body{padding:32px 18px 28px;} .wwr-title{font-size:28px;} }

/* --- Popyt: rozkłady „wkrótce" (v0.3.0) --- */
.wwr-soon{margin:24px auto 0;text-align:center;}
.wwr-soon-q{font-family:var(--wwr-font-sans);font-size:11px;font-weight:600;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ww-cream-70);margin:0 0 12px;}
.wwr-soon-chip{font-family:var(--wwr-font-sans);font-size:11px;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;padding:8px 14px;border-radius:999px;background:transparent;cursor:pointer;
  color:var(--ww-cream);border:1px dashed var(--ww-ink-3);transition:all .2s var(--wwr-ease);}
.wwr-soon-chip:hover{border-color:var(--ww-gold-soft);color:var(--ww-gold-soft);}
.wwr-soon-chip.sel{background:var(--ww-gold);color:var(--ww-ink);border:1px solid var(--ww-gold);}
.wwr-soon-thanks{font-family:var(--wwr-font-serif);font-size:13px;color:var(--ww-gold-soft);margin:10px 0 0;}

/* --- Rozkład wielokartowy: lista pozycji (v0.7.2) ---
   Poziome wiersze zamiast 3 kolumn: mała karta poglądowa z lewej, duży opis
   z prawej. Wszystkie teksty na wspólnej lewej krawędzi — nic się nie rozjeżdża
   przy różnej długości opisów. --- */
.wwr-spread-board{display:flex;flex-direction:column;margin-bottom:8px;}
.wwr-pos{display:grid;grid-template-columns:132px minmax(0,1fr);column-gap:30px;
  align-items:start;text-align:left;padding:30px 0;border-top:1px solid var(--ww-ink-3);}
.wwr-pos:first-child{border-top:none;padding-top:4px;}
.wwr-pos-label{grid-column:1/-1;display:flex;align-items:center;gap:14px;
  font-family:var(--wwr-font-sans);font-size:12px;font-weight:600;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ww-gold-soft);margin:0 0 18px;}
.wwr-pos-label::after{content:"";flex:1;border-top:1px dashed var(--ww-ink-3);}
.wwr-spread-board .wwr-flip-wrap{width:132px;margin:4px 0 0;}
.wwr-spread-board .wwr-flip{width:132px;height:208px;}
.wwr-spread-board .wwr-flip .face{padding:8px;}
.wwr-spread-board .wwr-flip .face .suit{padding-top:7px;font-size:8px;}
/* Rewers z JS ma sztywne px (cardBack) — skaluj do rozmiaru flipa. */
.wwr-spread-board .wwr-flip .wwr-cardback{width:100% !important;height:100% !important;}
.wwr-flip.is-rev .face .imgwrap img{transform:rotate(180deg);}
.wwr-pos-card{min-width:0;}
.wwr-pos-name{font-family:var(--wwr-font-display);font-weight:700;font-size:26px;line-height:1.2;
  color:var(--ww-white);margin:0 0 12px;}
.wwr-orient{display:inline-block;font-family:var(--wwr-font-sans);font-size:9px;font-weight:600;
  letter-spacing:.1em;text-transform:uppercase;color:var(--ww-ink);background:var(--ww-gold-soft);
  border-radius:4px;padding:2px 6px;vertical-align:middle;}
.wwr-pos-card .wwr-chips{justify-content:flex-start;margin-bottom:14px;}
.wwr-pos-card .wwr-desc{font-size:19px;line-height:1.75;text-align:left;max-width:66ch;margin:0;}
.wwr-pos-card .wwr-link{display:inline-block;margin-top:14px;}
.wwr-pos-card .wwr-desc strong{color:var(--ww-cream);font-weight:600;}
@media (max-width:560px){
  .wwr-pos{display:block;padding:24px 0;overflow:hidden;}
  .wwr-pos-label{margin-bottom:14px;}
  .wwr-spread-board .wwr-flip-wrap{float:left;width:100px;margin:4px 18px 10px 0;}
  .wwr-spread-board .wwr-flip{width:100px;height:158px;}
  .wwr-pos-name{font-size:22px;}
  .wwr-pos-card .wwr-desc{font-size:17px;line-height:1.7;}
}

/* „Przesłanie rozkładu" — synteza kombinacji kart */
.wwr-summary{margin:34px auto 12px;max-width:800px;padding:32px 36px;
  border:1px solid rgba(216,196,138,.4);border-radius:16px;
  background:linear-gradient(180deg,rgba(216,196,138,.09) 0%,rgba(216,196,138,.02) 100%);
  box-shadow:0 0 34px -12px rgba(216,196,138,.25);}
.wwr-summary-head{font-family:var(--wwr-font-sans);font-size:14px;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:var(--ww-gold-soft);display:flex;align-items:center;justify-content:center;
  gap:10px;margin-bottom:14px;}
.wwr-summary-body{font-family:var(--wwr-font-serif);font-size:19px;line-height:1.75;color:var(--ww-cream-70);}
.wwr-summary-body p{margin:0 0 12px;}
.wwr-summary-body p:last-child{margin:0;}
.wwr-summary-body strong{color:var(--ww-cream);font-weight:600;}

/* ============================================================
   v0.5.0 — WYBÓR KART (wachlarz) — faza data-phase="pick"
   ============================================================ */
.wwr-pick-title{font-family:var(--wwr-font-display);font-style:italic;font-size:22px;color:var(--ww-white);margin:0 0 6px;}
.wwr-pick-sub{font-family:var(--wwr-font-serif);font-size:15px;color:var(--ww-cream-70);margin:0 0 6px;}
.wwr-pick-slots{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin:10px 0 0;}
.wwr-slot{font-family:var(--wwr-font-sans);font-size:10px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(251,248,242,.42);display:inline-flex;align-items:center;gap:6px;
  transition:color .25s var(--wwr-ease);}
.wwr-slot .m{color:transparent;font-size:12px;transition:color .25s var(--wwr-ease);}
.wwr-slot.filled{color:var(--ww-gold-soft);}
.wwr-slot.filled .m{color:var(--ww-gold);}
/* Wachlarz po ŁUKU: pozycje (--tx/--ty/--a) i wymiary kart liczy JS z realnej
   szerokości kontenera (buildFan). Karty „rozdają się" animacją z opóźnieniem. */
.wwr-fan{position:relative;margin-top:16px;}
.wwr-fan--scroll{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:rgba(216,196,138,.35) transparent;}
.wwr-fan--scroll::-webkit-scrollbar{height:6px;}
.wwr-fan--scroll::-webkit-scrollbar-thumb{background:rgba(216,196,138,.4);border-radius:999px;}
.wwr-fan--scroll::-webkit-scrollbar-track{background:rgba(255,255,255,.05);border-radius:999px;}
/* Scope 2 klasy (kaskada Bimbera: [type=button] remisuje z 1 klasą i wygrywa kolejnością). */
.wwr-fan .wwr-fan-card{position:absolute;left:50%;top:6px;
  transform-origin:50% 85%;
  transform:translate(var(--tx),var(--ty)) rotate(var(--a));
  background:transparent;border:none;padding:0;cursor:pointer;
  animation:wwr-deal .45s var(--wwr-ease) backwards;
  transition:transform .28s var(--wwr-ease),opacity .28s var(--wwr-ease);}
.wwr-fan--scroll .wwr-fan-card{left:0;top:40px;}
/* visibility:hidden w 'from' + backwards fill => nierozdana karta nie łapie
   kliknięć/fokusa w czasie swojego animation-delay (opacity:0 samo nie wyłącza
   hit-testingu — szybki klik trafiałby niewidzialną kartę na środku talii). */
@keyframes wwr-deal{from{opacity:0;visibility:hidden;transform:translate(0,34px) rotate(0deg) scale(.86);}}
.wwr-fan .wwr-fan-card .wwr-cardback{width:100%;height:100%;box-shadow:0 10px 26px rgba(6,11,30,.5);}
.wwr-fan .wwr-fan-card:hover,.wwr-fan .wwr-fan-card:focus-visible{
  transform:translate(var(--tx),calc(var(--ty) - 14px)) rotate(var(--a));outline:none;z-index:3;}
.wwr-fan .wwr-fan-card:focus-visible .wwr-cardback{box-shadow:0 0 0 2px var(--ww-gold-soft),0 10px 26px rgba(6,11,30,.5);}
.wwr-fan .wwr-fan-card.sel{transform:translate(var(--tx),calc(var(--ty) - 24px)) rotate(var(--a)) scale(1.06);z-index:5;}
.wwr-fan .wwr-fan-card.sel .wwr-cardback{box-shadow:0 0 0 2px var(--ww-gold),0 18px 40px rgba(6,11,30,.6);}
.wwr-fan.locked .wwr-fan-card:not(.sel){opacity:.35;pointer-events:none;}
.wwr-phase[data-phase="pick"]{position:relative;}
.wwr-reshuffle{position:absolute !important;top:0;right:0;z-index:5;width:46px;height:46px;padding:0;
  display:inline-flex;align-items:center;justify-content:center;border-radius:50%;
  background:rgba(38,53,102,.55);border:1px solid var(--ww-ink-3);color:var(--ww-gold-soft);
  cursor:pointer;transition:border-color .2s var(--wwr-ease),color .2s var(--wwr-ease),background .2s var(--wwr-ease),transform .1s;}
.wwr-reshuffle:hover{border-color:var(--ww-gold);color:var(--ww-white);background:rgba(38,53,102,.85);}
.wwr-reshuffle:active{transform:scale(.94);}
.wwr-reshuffle-ic{font-size:20px;line-height:1;}
.wwr-place{margin-top:26px;padding:0 40px;background:rgba(38,53,102,.55);color:var(--ww-gold-soft);
  border:1px solid var(--ww-gold);border-radius:999px;box-shadow:none;transition:background .2s,color .2s,border-color .2s,transform .1s;}
.wwr-place:hover{background:rgba(38,53,102,.85);color:var(--ww-white);border-color:var(--ww-gold);}
.wwr-place[disabled]{opacity:.5;box-shadow:none;cursor:not-allowed;}
@media(max-width:520px){.wwr-reshuffle{width:42px;height:42px;}.wwr-place{padding:0 28px;}}

/* ============================================================
   v0.5.0 — LANDING ROZKŁADU (.wwr-landing) — pełny ekran,
   mobile-first; sekcje: hero / kroki / losowanie.
   Renderowane przez szablon motywu wwr-landing.php + WWR_Landing.
   ============================================================ */
.wwr-landing{position:relative;width:100%;min-height:100vh;
  overflow:hidden;color:#FBF8F2;background:#101C3F;
  --ww-cream:#FBF8F2;--ww-ink:#101C3F;--ww-ink-2:#1B2A55;--ww-ink-3:#263566;
  --ww-gold:#BB9A57;--ww-gold-soft:#D8C48A;--ww-white:#FFFFFF;--ww-cream-70:rgba(251,248,242,.70);
  --wwr-font-display:'Playfair Display',Georgia,serif;
  --wwr-font-serif:'EB Garamond',Georgia,serif;
  --wwr-font-sans:'Montserrat','Helvetica Neue',Arial,sans-serif;
  --wwr-ease:cubic-bezier(0.22,0.61,0.36,1);}
.wwr-landing *{box-sizing:border-box;}

/* Kosmiczne tło — absolutne w obrębie landingu (nie nachodzi na header/footer). */
.wwrl-bg{position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(1400px 700px at 82% -8%,#1F2F5E 0%,rgba(31,47,94,0) 60%),
    radial-gradient(1100px 900px at 10% 110%,#16244C 0%,rgba(22,36,76,0) 55%),
    linear-gradient(180deg,#0E193A 0%,#101C3F 45%,#0C1533 100%);}
.wwrl-stars{position:absolute;inset:0;opacity:.9;background-image:
  radial-gradient(1.5px 1.5px at 12% 18%,rgba(216,196,138,.75),transparent),
  radial-gradient(1.5px 1.5px at 78% 12%,rgba(255,255,255,.65),transparent),
  radial-gradient(1.2px 1.2px at 35% 30%,rgba(216,196,138,.55),transparent),
  radial-gradient(1.6px 1.6px at 62% 40%,rgba(255,255,255,.55),transparent),
  radial-gradient(1.1px 1.1px at 88% 55%,rgba(216,196,138,.6),transparent),
  radial-gradient(1.3px 1.3px at 20% 62%,rgba(255,255,255,.5),transparent),
  radial-gradient(1.5px 1.5px at 50% 78%,rgba(216,196,138,.5),transparent),
  radial-gradient(1.2px 1.2px at 8% 88%,rgba(255,255,255,.45),transparent),
  radial-gradient(1.4px 1.4px at 70% 90%,rgba(216,196,138,.5),transparent);}
.wwrl-moon{position:absolute;top:-120px;right:-100px;width:420px;height:420px;border-radius:50%;
  background:radial-gradient(circle at 60% 40%,rgba(216,196,138,.20),rgba(216,196,138,0) 66%);filter:blur(2px);}
.wwrl-tw{position:absolute;border-radius:50%;background:var(--ww-gold-soft);}
.wwrl-tw1{top:16%;left:14%;width:3px;height:3px;animation:wwrl-tw 3.6s ease-in-out infinite;}
.wwrl-tw2{top:30%;right:18%;width:2px;height:2px;background:var(--ww-white);animation:wwrl-tw 2.8s .6s ease-in-out infinite;}
.wwrl-tw3{top:64%;left:22%;width:2.5px;height:2.5px;animation:wwrl-tw 4.2s 1.1s ease-in-out infinite;}
.wwrl-tw4{top:52%;right:12%;width:2px;height:2px;animation:wwrl-tw 3.2s .3s ease-in-out infinite;}
@keyframes wwrl-tw{0%,100%{opacity:.25;transform:scale(.8)}50%{opacity:1;transform:scale(1.25)}}

.wwrl-wrap{position:relative;z-index:1;width:100%;max-width:1080px;margin:0 auto;padding:0 20px 72px;}

.wwrl-eyebrow{font-family:var(--wwr-font-sans);font-size:11px;font-weight:600;letter-spacing:.22em;
  text-transform:uppercase;color:var(--ww-gold-soft);display:inline-flex;align-items:center;gap:12px;}
.wwrl-eyebrow::before,.wwrl-eyebrow::after{content:"";width:26px;border-top:1px dashed var(--ww-gold-soft);opacity:.55;}
.wwrl-eyebrow.wwrl-solo::before,.wwrl-eyebrow.wwrl-solo::after{display:none;}

/* HERO */
.wwrl-hero{text-align:center;padding:56px 4px 40px;max-width:760px;margin:0 auto;}
.wwrl-hero .wwrl-eyebrow{margin-bottom:22px;}
.wwrl-hero h1{font-family:var(--wwr-font-display);font-weight:700;line-height:1.08;
  font-size:clamp(34px,8.5vw,60px);letter-spacing:-.01em;color:var(--ww-white);margin:0 0 18px;text-wrap:balance;}
.wwrl-hero h1 .wwr-accent,.wwrl-hero h1 i{font-style:italic;font-weight:500;color:var(--ww-gold-soft);}
.wwrl-hero p{font-family:var(--wwr-font-serif);font-size:clamp(17px,4.2vw,20px);line-height:1.65;
  color:var(--ww-cream-70);margin:0 auto;max-width:34em;}
.wwrl-scroll{margin-top:28px;display:inline-flex;flex-direction:column;align-items:center;gap:8px;
  font-family:var(--wwr-font-sans);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:rgba(251,248,242,.46);}
.wwrl-scroll span{width:1px;height:34px;background:linear-gradient(var(--ww-gold-soft),transparent);}

/* 3 KROKI */
.wwrl-steps{padding:16px 0 6px;}
.wwrl-steps-head{text-align:center;margin-bottom:32px;}
.wwrl-steps-head h2{font-family:var(--wwr-font-display);font-weight:600;color:var(--ww-white);
  font-size:clamp(24px,6vw,34px);margin:14px 0 0;text-wrap:balance;}
.wwrl-steps-grid{display:flex;flex-direction:column;gap:16px;}
.wwrl-step{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;
  padding:22px 22px 22px 20px;border:1px solid var(--ww-ink-3);border-radius:16px;
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.015));}
.wwrl-step-num{font-family:var(--wwr-font-display);font-weight:700;font-size:34px;line-height:1;
  color:var(--ww-gold-soft);min-width:44px;}
.wwrl-step h3{font-family:var(--wwr-font-sans);font-weight:600;font-size:13px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ww-cream);margin:5px 0 8px;}
.wwrl-step p{font-family:var(--wwr-font-serif);font-size:16.5px;line-height:1.6;color:var(--ww-cream-70);margin:0;}

/* LOSOWANIE (osadzony widget) — na landingu widget ma szerokość sekcji kroków.
   margin-bottom: panel „pływa" nad kolejną sekcją — widać zaokrąglone DOLNE rogi
   (bez tego jasna sekcja pod spodem zasłaniała dół karty na każdym rozkładzie). */
.wwrl-draw{margin-top:40px;margin-bottom:56px;}
.wwrl-draw .wwr-app{padding:0;}
.wwrl-draw .wwr-card{max-width:none;width:100%;border-radius:24px;
  background:radial-gradient(1000px 420px at 85% -10%,rgba(46,64,121,.55) 0%,rgba(16,28,63,.4) 55%),rgba(255,255,255,.028);
  box-shadow:0 40px 90px rgba(6,11,30,.55);}

/* Desktop */
@media (min-width:680px){
  .wwrl-wrap{padding:0 28px 88px;}
  .wwrl-hero{padding:84px 8px 52px;}
  .wwrl-steps{padding:24px 0 8px;}
  .wwrl-steps-grid{flex-direction:row;gap:20px;}
  .wwrl-step{flex:1;grid-template-columns:1fr;gap:0;padding:28px 24px;}
  .wwrl-step-num{font-size:40px;margin-bottom:14px;}
  .wwrl-draw .wwr-body{padding:48px 44px 42px;}
}

@media (prefers-reduced-motion:reduce){
  .wwrl-tw{animation:none;}
  .wwr-fan .wwr-fan-card{transition:none;animation:none;}
}

/* a11y: fokus programowy (tabindex=-1) na tytułach faz — bez wizualnej ramki. */
.wwr-pick-title:focus,.wwr-shuffle-title:focus{outline:none;}
