
:root{
  --bg:#03050d;
  --panel:rgba(6,13,30,.78);
  --panel-solid:#071326;
  --gold:#d8aa45;
  --gold-soft:#f1d589;
  --blue:#1f65b7;
  --blue-soft:#5f9dff;
  --text:#f6f1e4;
  --muted:#aebbd3;
  --danger:#ffcf92;
  --shadow:0 24px 90px rgba(0,0,0,.55);
  --radius:28px;
}

*{box-sizing:border-box}
html,body{min-height:100%;margin:0}
body{
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--text);
  background:var(--bg);
  overflow-x:hidden;
}

#particlesCanvas{
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  z-index:-2;
  background:
    radial-gradient(circle at 20% 10%, rgba(31,101,183,.18), transparent 32%),
    radial-gradient(circle at 80% 20%, rgba(216,170,69,.13), transparent 30%),
    linear-gradient(180deg,#02040a,#03050d 60%,#04070f);
}

.page-shell{
  width:min(1460px, calc(100% - 34px));
  margin:0 auto;
  padding:18px 0 70px;
}

.hero{
  text-align:center;
  padding:10px 12px 22px;
}
.hero-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:1px solid rgba(216,170,69,.45);
  color:var(--gold-soft);
  padding:9px 15px;
  border-radius:999px;
  background:rgba(216,170,69,.08);
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:12px;
}
.hero h1{
  margin:14px 0 0;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(44px, 5.7vw, 78px);
  line-height:.94;
  letter-spacing:.01em;
  text-shadow:0 0 34px rgba(95,157,255,.18);
}
.hero p{
  margin:0 auto;
  max-width:760px;
  color:var(--muted);
  font-size:18px;
  line-height:1.65;
}

.simulator-card{
  display:grid;
  grid-template-columns:minmax(760px, 900px) minmax(300px, 330px);
  gap:30px;
  align-items:start;
  justify-content:center;
}

.deck-zone,
.reading-form,
.result-box{
  border:1px solid rgba(216,170,69,.33);
  background:linear-gradient(145deg,rgba(7,19,38,.88),rgba(3,8,18,.82));
  box-shadow:var(--shadow);
  border-radius:var(--radius);
  backdrop-filter: blur(16px);
}

.deck-zone{padding:22px; min-height:auto;}
.deck-title{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:18px;
  color:var(--muted);
}
.deck-title span{font-size:15px;text-transform:uppercase;letter-spacing:.12em}
.deck-title strong{
  border:1px solid rgba(216,170,69,.42);
  color:var(--gold-soft);
  border-radius:999px;
  padding:7px 12px;
  font-size:13px;
}

.animation-stage{
  position:relative;
  aspect-ratio:16/9;
  min-height:320px;
  border-radius:22px;
  overflow:hidden;
}

.deck-visual{
  position:absolute;
  inset:0;
  border-radius:22px;
  overflow:hidden;
  border:1px solid rgba(216,170,69,.42);
  background:#02040a;
  box-shadow:
    inset 0 0 42px rgba(216,170,69,.10),
    0 18px 44px rgba(0,0,0,.28);
  transition:filter .35s ease, transform .35s ease;
}

.deck-still-image{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}

.deck-visual.video-mode{
  filter:blur(2px) brightness(.45);
  transform:scale(.985);
}

.shuffle-video-box{
  position:absolute;
  inset:0;
  z-index:5;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:22px;
  overflow:hidden;
  border:1px solid rgba(216,170,69,.42);
  background:#02040a url('../video/img.webp') center/cover no-repeat;
  box-shadow:inset 0 0 42px rgba(216,170,69,.12);
}
.shuffle-video-box.hidden{display:none;}
.shuffle-video{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.mini-card{
  aspect-ratio:2/3;
  min-height:76px;
  border-radius:10px;
  background-size:cover;
  background-position:center;
  border:1px solid rgba(216,170,69,.48);
  box-shadow:0 10px 25px rgba(0,0,0,.35);
  transform:translateZ(0) rotate(var(--r,0deg));
  transition:transform .35s ease, opacity .35s ease, filter .35s ease;
}
.mini-card.shuffling{
  animation:cardJitter .24s infinite alternate ease-in-out;
  filter:drop-shadow(0 0 11px rgba(95,157,255,.35));
}

@keyframes cardJitter{
  from{transform:translate3d(-4px,2px,0) rotate(calc(var(--r) - 5deg));}
  to{transform:translate3d(5px,-3px,0) rotate(calc(var(--r) + 6deg));}
}

.reading-table{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px;
  margin-top:24px;
  align-items:start;
}
.slot{
  text-align:center;
}
.slot-label{
  display:block;
  color:var(--muted);
  font-size:13px;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom:12px;
}
.slot-card{
  width:min(190px,100%);
  aspect-ratio:2/3;
  margin:0 auto;
  border-radius:20px;
  border:1px solid rgba(216,170,69,.55);
  background:rgba(255,255,255,.04);
  display:grid;
  place-items:center;
  font-family:Georgia,serif;
  color:var(--gold-soft);
  font-size:54px;
  box-shadow:0 22px 42px rgba(0,0,0,.42);
  overflow:hidden;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.slot-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  animation:revealCard .75s ease both;
  image-rendering:auto;
  -ms-interpolation-mode:bicubic;
  backface-visibility:hidden;
}
.slot-card:not(.empty):hover{
  transform:translateY(-4px) scale(1.03);
  box-shadow:0 28px 54px rgba(0,0,0,.48);
  border-color:rgba(241,213,137,.9);
}
.slot-name{
  margin-top:10px;
  min-height:42px;
  padding:0 4px;
  color:var(--gold-soft);
  font-size:17px;
  font-weight:700;
  line-height:1.22;
  text-align:center;
  text-shadow:0 0 22px rgba(216,170,69,.1);
}

.slot-card.empty{
  font-size:0;
  background:linear-gradient(180deg, rgba(8,16,33,.98), rgba(4,8,18,.98));
}
.slot-card.empty img.card-back{
  animation:none;
  filter:drop-shadow(0 0 14px rgba(216,170,69,.12));
}
@keyframes revealCard{
  from{transform:rotateY(90deg) scale(.92); opacity:.1;}
  to{transform:rotateY(0) scale(1); opacity:1;}
}

.shuffle-status{
  margin-top:18px;
  border-radius:18px;
  padding:13px 16px;
  color:var(--gold-soft);
  background:rgba(216,170,69,.08);
  border:1px solid rgba(216,170,69,.22);
  min-height:48px;
}

.reading-form{padding:22px; position:sticky; top:18px;}
.form-head h2{
  margin:0 0 8px;
  font-family:Georgia,serif;
  font-size:26px;
}
.form-head p{
  margin:0 0 18px;
  color:var(--muted);
  line-height:1.5;
}
.form-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
}
label{display:grid;gap:7px}
label.full{grid-column:1/-1}
label span{
  color:var(--gold-soft);
  font-size:13px;
  letter-spacing:.05em;
  text-transform:uppercase;
}
input,
select{
  width:100%;
  border:1px solid rgba(95,157,255,.35);
  background:rgba(255,255,255,.055);
  color:var(--text);
  border-radius:15px;
  padding:12px 14px;
  outline:none;
  font-size:16px;
}
input:focus,
select:focus{
  border-color:rgba(216,170,69,.8);
  box-shadow:0 0 0 4px rgba(216,170,69,.12);
}
input[readonly]{color:#dce7ff;background:rgba(95,157,255,.08)}
select{appearance:auto; cursor:pointer;}
select option{color:var(--gold-soft);background:#071326;}
select option:checked{color:#071326;background:var(--gold);}

.birth-date-label{
  gap:8px;
}
.birth-date-fields{
  display:grid;
  grid-template-columns:minmax(72px,.8fr) minmax(92px,1fr) minmax(88px,1fr);
  gap:8px;
}
.birth-date-fields select{
  min-height:49px;
  padding:12px 10px;
}
.birth-date-help{
  color:rgba(232,238,252,.68);
  font-size:12px;
  line-height:1.4;
}

.custom-select-ready{position:relative;}
.native-select-hidden{
  position:absolute !important;
  left:0;
  top:28px;
  width:1px !important;
  height:1px !important;
  opacity:0 !important;
  pointer-events:none !important;
}
.gold-select{
  position:relative;
  z-index:12;
}
.gold-select.is-open{
  z-index:80;
}
.gold-select-button{
  width:100%;
  min-height:49px;
  border:1px solid rgba(95,157,255,.35);
  background:
    linear-gradient(145deg, rgba(255,255,255,.07), rgba(255,255,255,.035)),
    rgba(7,19,38,.72);
  color:var(--text);
  border-radius:15px;
  padding:12px 44px 12px 14px;
  outline:none;
  font-size:16px;
  text-align:left;
  cursor:pointer;
  position:relative;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.015);
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.gold-select-button::after{
  content:"⌄";
  position:absolute;
  right:15px;
  top:50%;
  transform:translateY(-54%);
  color:var(--gold-soft);
  font-size:20px;
  line-height:1;
  text-shadow:0 0 16px rgba(216,170,69,.35);
  transition:transform .18s ease;
}
.gold-select.is-open .gold-select-button::after{
  transform:translateY(-44%) rotate(180deg);
}
.gold-select-button:hover,
.gold-select-button:focus-visible,
.gold-select.is-open .gold-select-button{
  border-color:rgba(216,170,69,.84);
  box-shadow:
    0 0 0 4px rgba(216,170,69,.12),
    inset 0 0 30px rgba(216,170,69,.04);
  background:
    radial-gradient(circle at 18% 0%, rgba(216,170,69,.12), transparent 42%),
    linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.04)),
    rgba(7,19,38,.78);
}
.gold-select-menu{
  position:absolute;
  left:0;
  right:0;
  top:calc(100% + 8px);
  max-height:276px;
  overflow:auto;
  padding:8px;
  border:1px solid rgba(216,170,69,.62);
  border-radius:17px;
  background:
    radial-gradient(circle at 22% 0%, rgba(216,170,69,.16), transparent 38%),
    linear-gradient(160deg, rgba(8,18,36,.98), rgba(2,6,15,.98));
  box-shadow:
    0 24px 56px rgba(0,0,0,.58),
    0 0 36px rgba(216,170,69,.12),
    inset 0 0 0 1px rgba(255,255,255,.025);
}
.gold-select-menu.hidden{display:none;}
.gold-select-option{
  width:100%;
  border:0;
  border-radius:12px;
  padding:11px 12px;
  color:var(--text);
  background:transparent;
  text-align:left;
  font-size:15px;
  cursor:pointer;
  transition:background .14s ease, color .14s ease, transform .14s ease;
}
.gold-select-option:hover,
.gold-select-option:focus-visible{
  outline:none;
  color:var(--gold-soft);
  background:rgba(216,170,69,.12);
  transform:translateX(2px);
}
.gold-select-option.is-selected{
  color:#071326;
  font-weight:800;
  background:linear-gradient(135deg, var(--gold-soft), var(--gold));
  box-shadow:0 10px 22px rgba(0,0,0,.22), inset 0 0 0 1px rgba(255,255,255,.18);
}
.gold-select-option.is-placeholder{
  color:rgba(232,238,252,.68);
}

.primary-button{
  width:100%;
  margin-top:20px;
  border:1px solid rgba(216,170,69,.82);
  color:#091120;
  font-weight:800;
  font-size:16px;
  letter-spacing:.02em;
  padding:16px 18px;
  border-radius:18px;
  cursor:pointer;
  background:
    linear-gradient(135deg,var(--gold-soft),var(--gold) 46%,#a67622 100%);
  box-shadow:
    0 0 0 4px rgba(31,101,183,.24),
    0 20px 42px rgba(0,0,0,.36);
  transition:transform .18s ease, filter .18s ease;
}
.primary-button:hover{transform:translateY(-1px);filter:brightness(1.05)}
.primary-button:disabled{opacity:.58;cursor:not-allowed;transform:none}

.result-box{
  margin-top:24px;
  padding:26px;
}
.result-box.hidden{display:none}
.result-head{
  display:flex;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  color:var(--muted);
}
.result-head span{
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:12px;
}
.result-head strong{color:var(--gold-soft)}
.result-box h2{
  margin:12px 0 18px;
  font-family:Georgia,serif;
  font-size:34px;
}
.selected-cards{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:18px;
}
.selected-cards span{
  border:1px solid rgba(216,170,69,.35);
  background:rgba(216,170,69,.08);
  color:var(--gold-soft);
  border-radius:999px;
  padding:8px 12px;
}
.combined-text{
  color:#e8eefc;
  line-height:1.8;
  font-size:18px;
  white-space:pre-line;
}

.download-actions{
  margin-top:22px;
  display:flex;
  justify-content:center;
}
.download-button{
  border:1px solid rgba(216,170,69,.82);
  color:#091120;
  font-weight:800;
  font-size:16px;
  letter-spacing:.02em;
  padding:15px 24px;
  border-radius:18px;
  cursor:pointer;
  background:
    linear-gradient(135deg,var(--gold-soft),var(--gold) 46%,#a67622 100%);
  box-shadow:
    0 0 0 4px rgba(31,101,183,.18),
    0 20px 42px rgba(0,0,0,.34);
  transition:transform .18s ease, filter .18s ease;
}
.download-button:hover{transform:translateY(-1px);filter:brightness(1.05)}
.download-button:disabled{opacity:.58;cursor:not-allowed;transform:none}
.download-button.hidden{display:none}


@media (max-width:1120px){
  .simulator-card{grid-template-columns:1fr; max-width:820px; margin:0 auto;}
  .reading-form{position:relative;top:auto}
}
@media (max-width:640px){
  .animation-stage{min-height:240px; aspect-ratio:4/3;}
  .reading-table{grid-template-columns:1fr}
  .slot-card{width:min(220px,100%);}
  .slot-name{font-size:15px;min-height:34px;}
  .form-grid{grid-template-columns:1fr}
}


/* ==========================================================
   V3 - Visualizzazione carte grande e leggibile
   ========================================================== */
body.lightbox-open{overflow:hidden;}

.simulator-card{
  grid-template-columns:minmax(820px, 980px) minmax(300px, 340px);
}
.deck-zone{padding:clamp(18px, 2vw, 28px);}
.reading-table{gap:clamp(16px, 2.2vw, 30px);}
.slot{cursor:default;}
.slot.is-revealed{cursor:pointer;}
.slot.is-active .slot-card{
  border-color:rgba(241,213,137,.98);
  box-shadow:0 0 0 3px rgba(216,170,69,.18), 0 30px 65px rgba(0,0,0,.55);
}
.slot-card{width:min(230px,100%); border-radius:24px;}
.slot-card[role="button"]{cursor:pointer;}
.slot-card[role="button"]:focus-visible,
.focus-card-button:focus-visible,
.ghost-button:focus-visible,
.focus-tab:focus-visible,
.lightbox-close:focus-visible,
.lightbox-nav:focus-visible{
  outline:3px solid rgba(241,213,137,.75);
  outline-offset:4px;
}

.card-focus-panel{
  margin-top:28px;
  padding:22px;
  border-radius:26px;
  border:1px solid rgba(216,170,69,.38);
  background:
    radial-gradient(circle at 25% 15%, rgba(95,157,255,.15), transparent 35%),
    linear-gradient(145deg, rgba(5,14,29,.95), rgba(2,6,15,.92));
  box-shadow:0 28px 70px rgba(0,0,0,.45), inset 0 0 42px rgba(216,170,69,.06);
}
.card-focus-panel.hidden{display:none;}
.card-focus-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:18px;
  margin-bottom:20px;
}
.focus-kicker{
  display:inline-flex;
  color:var(--gold-soft);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.16em;
  margin-bottom:8px;
}
.card-focus-head h3{
  margin:0;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(25px, 3vw, 39px);
  line-height:1.05;
}
.card-focus-head p{
  margin:4px 0 0;
  max-width:300px;
  color:var(--muted);
  line-height:1.5;
  font-size:14px;
}
.card-focus-layout{
  display:grid;
  grid-template-columns:minmax(340px, min(51vw, 530px)) 1fr;
  gap:24px;
  align-items:start;
}
.focus-card-button{
  width:100%;
  max-width:530px;
  margin:0 auto;
  padding:0;
  border:1px solid rgba(241,213,137,.62);
  border-radius:34px;
  background:rgba(255,255,255,.035);
  overflow:hidden;
  cursor:zoom-in;
  box-shadow:0 34px 80px rgba(0,0,0,.58), 0 0 48px rgba(216,170,69,.11);
}
.focus-card-button img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:2/3;
  object-fit:cover;
  image-rendering:auto;
  -ms-interpolation-mode:bicubic;
  backface-visibility:hidden;
}
.focus-card-side{
  display:grid;
  gap:18px;
  align-content:start;
}

.zodiac-focus-box{
  position:relative;
  min-height:214px;
  border:1px solid rgba(241,213,137,.72);
  border-radius:22px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:8px;
  padding:24px 16px;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 34%, rgba(241,213,137,.28), transparent 34%),
    radial-gradient(circle at 50% 52%, rgba(216,170,69,.17), transparent 58%),
    linear-gradient(145deg, rgba(8,18,36,.92), rgba(2,6,15,.95));
  box-shadow:
    inset 0 0 44px rgba(216,170,69,.13),
    0 24px 62px rgba(0,0,0,.36),
    0 0 32px rgba(216,170,69,.13);
}

.zodiac-focus-box.hidden{
  display:none;
}

.zodiac-orbit{
  position:absolute;
  width:136px;
  height:136px;
  border-radius:50%;
  border:1px solid rgba(241,213,137,.22);
  box-shadow:
    0 0 0 18px rgba(216,170,69,.035),
    0 0 54px rgba(216,170,69,.22);
}

.zodiac-orbit::before,
.zodiac-orbit::after{
  content:"";
  position:absolute;
  inset:14px;
  border-radius:50%;
  border:1px dashed rgba(241,213,137,.19);
}

.zodiac-orbit::after{
  inset:-18px;
  opacity:.45;
}

.zodiac-focus-symbol{
  position:relative;
  z-index:1;
  width:112px;
  height:112px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#071326;
  font-size:70px;
  line-height:1;
  font-family:"Segoe UI Symbol", "Noto Sans Symbols", serif;
  background:
    radial-gradient(circle at 30% 24%, #fff4c2 0 14%, transparent 34%),
    linear-gradient(145deg, #f7df8d, #d8aa45 48%, #8f651e);
  border:1px solid rgba(255,238,175,.86);
  box-shadow:
    inset 0 2px 12px rgba(255,255,255,.28),
    inset 0 -10px 18px rgba(86,54,7,.28),
    0 0 26px rgba(241,213,137,.40),
    0 14px 36px rgba(0,0,0,.48);
  text-shadow:0 2px 8px rgba(255,255,255,.22);
}

.zodiac-focus-name{
  position:relative;
  z-index:1;
  font-family:Georgia,"Times New Roman",serif;
  font-size:25px;
  font-weight:800;
  color:var(--gold-soft);
  text-shadow:0 0 24px rgba(216,170,69,.34);
}

.zodiac-focus-label{
  position:relative;
  z-index:1;
  color:var(--muted);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.14em;
}
.focus-card-tabs{
  display:grid;
  gap:11px;
}
.focus-tab{
  width:100%;
  border:1px solid rgba(216,170,69,.32);
  color:var(--text);
  background:rgba(255,255,255,.055);
  border-radius:16px;
  padding:13px 14px;
  cursor:pointer;
  text-align:left;
  font-weight:800;
  transition:transform .18s ease, border-color .18s ease, background .18s ease;
}
.focus-tab:hover{transform:translateX(2px); border-color:rgba(241,213,137,.72);}
.focus-tab.is-active{
  color:#071326;
  background:linear-gradient(135deg,var(--gold-soft),var(--gold));
  border-color:rgba(241,213,137,.95);
}
.focus-card-keywords{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  min-height:32px;
}
.focus-card-keywords span{
  border:1px solid rgba(95,157,255,.34);
  background:rgba(95,157,255,.09);
  color:#dce7ff;
  border-radius:999px;
  padding:8px 11px;
  font-size:13px;
}
.ghost-button{
  width:100%;
  border:1px solid rgba(216,170,69,.58);
  color:var(--gold-soft);
  background:rgba(216,170,69,.08);
  border-radius:17px;
  padding:14px 16px;
  cursor:pointer;
  font-weight:800;
  transition:transform .18s ease, background .18s ease, border-color .18s ease;
}
.ghost-button:hover{
  transform:translateY(-1px);
  background:rgba(216,170,69,.14);
  border-color:rgba(241,213,137,.82);
}

.card-lightbox{
  position:fixed;
  inset:0;
  z-index:9999;
  display:grid;
  align-items:center;
  justify-items:center;
  overflow:auto;
  padding:54px 76px 54px;
  background:rgba(0,0,0,.9);
  backdrop-filter:blur(16px);
  -webkit-overflow-scrolling:touch;
}
.card-lightbox.hidden{display:none;}
.lightbox-figure{
  margin:0;
  display:grid;
  justify-items:center;
  gap:14px;
  width:min(94vw, 960px);
  transform:translateY(8px);
}
.lightbox-figure img{
  display:block;
  width:auto;
  max-width:min(90vw, 930px);
  max-height:80vh;
  object-fit:contain;
  border-radius:30px;
  border:1px solid rgba(241,213,137,.72);
  box-shadow:0 38px 100px rgba(0,0,0,.8), 0 0 70px rgba(216,170,69,.16);
  touch-action:pinch-zoom;
}
.lightbox-figure figcaption{
  color:var(--gold-soft);
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(20px, 3.1vw, 30px);
  line-height:1.08;
  text-align:center;
  text-shadow:0 0 26px rgba(216,170,69,.24);
}
.lightbox-close,
.lightbox-nav{
  position:fixed;
  border:1px solid rgba(216,170,69,.45);
  background:rgba(7,19,38,.84);
  color:var(--gold-soft);
  cursor:pointer;
  box-shadow:0 18px 48px rgba(0,0,0,.45);
}
.lightbox-close{
  top:18px;
  right:18px;
  width:48px;
  height:48px;
  border-radius:50%;
  font-size:34px;
  line-height:1;
}
.lightbox-nav{
  top:50%;
  transform:translateY(-50%);
  width:54px;
  height:74px;
  border-radius:18px;
  font-size:48px;
  line-height:1;
}
.lightbox-prev{left:18px;}
.lightbox-next{right:18px;}
.lightbox-nav:disabled{opacity:.24; cursor:not-allowed;}

@media (max-width:1120px){
  .simulator-card{grid-template-columns:1fr; max-width:960px; margin:0 auto;}
  .reading-form{position:relative;top:auto;}
}
@media (max-width:760px){
  .page-shell{width:min(100% - 22px, 960px); padding-top:10px;}
  .hero{padding:8px 6px 16px;}
  .hero h1{font-size:clamp(38px, 12vw, 58px);}
  .deck-zone,.reading-form,.result-box{border-radius:22px;}
  .animation-stage{min-height:230px; aspect-ratio:4/3;}
  .reading-table{
    display:flex;
    overflow-x:auto;
    gap:14px;
    padding:2px 2px 14px;
    scroll-snap-type:x mandatory;
  }
  .slot{min-width:138px; scroll-snap-align:center;}
  .slot-card{width:124px; border-radius:17px;}
  .slot-label{font-size:11px; margin-bottom:9px;}
  .slot-name{font-size:13px; min-height:36px;}
  .card-focus-panel{margin-top:18px; padding:16px; border-radius:22px;}
  .card-focus-head{display:grid; gap:9px; margin-bottom:15px;}
  .card-focus-head p{max-width:none; font-size:13px;}
  .card-focus-layout{grid-template-columns:1fr; gap:16px;}
  .focus-card-button{max-width:min(100%, 460px); border-radius:28px;}
  .focus-card-side{gap:14px;}
  .zodiac-focus-box{min-height:150px; padding:18px 14px;}
  .zodiac-orbit{width:104px; height:104px;}
  .zodiac-focus-symbol{width:86px; height:86px; font-size:54px;}
  .zodiac-focus-name{font-size:22px;}
  .focus-card-tabs{grid-template-columns:1fr;}
  .card-lightbox{padding:54px 10px 58px; align-items:center;}
  .lightbox-nav{width:42px; height:58px; font-size:38px; border-radius:15px;}
  .lightbox-prev{left:8px;}
  .lightbox-next{right:8px;}
  .lightbox-close{top:10px; right:10px;}
  .lightbox-figure{width:100%; transform:translateY(4px);}
  .lightbox-figure img{width:min(94vw, 560px); max-width:none; max-height:78vh; border-radius:24px;}
}
@media (max-width:430px){
  .birth-date-fields{grid-template-columns:1fr 1fr 1fr; gap:7px;}
  .birth-date-fields select{font-size:15px; padding:11px 8px;}
  .birth-date-help{font-size:11px;}
  .deck-zone{padding:14px;}
  .animation-stage{min-height:205px;}
  .slot{min-width:124px;}
  .slot-card{width:112px;}
  .card-focus-panel{padding:13px;}
  .focus-card-button{border-radius:24px;}
  .focus-tab{font-size:13px; padding:11px 12px;}
  .focus-card-keywords span{font-size:12px; padding:7px 9px;}
  .card-lightbox{padding:54px 8px 58px; align-items:center;}
  .lightbox-figure{width:100%; transform:translateY(4px);}
  .lightbox-figure img{width:min(94vw, 450px); max-width:none; max-height:78vh; border-radius:18px;}
}

/* Micro fix menu zodiacale: testo leggibile + tendina larga a griglia */
.gold-select-option.is-selected,
.gold-select-option.is-selected.is-placeholder{
  color:#071326;
  font-weight:900;
  text-shadow:none;
}

.gold-select-option.is-selected:hover,
.gold-select-option.is-selected:focus-visible{
  color:#071326;
  background:linear-gradient(135deg, #fff0a8, var(--gold-soft) 34%, var(--gold));
}

.gold-select--zodiacSign{
  position:relative;
}

.gold-select--zodiacSign .gold-select-menu{
  left:auto;
  right:0;
  width:min(760px, calc(100vw - 32px));
  max-height:none;
  overflow:visible;
  display:grid;
  grid-template-columns:repeat(4, minmax(126px, 1fr));
  gap:7px;
  padding:10px;
}

.gold-select--zodiacSign .gold-select-option{
  min-height:42px;
  display:flex;
  align-items:center;
  padding:10px 12px;
  white-space:nowrap;
}

.gold-select--zodiacSign .gold-select-option.is-placeholder{
  grid-column:1 / -1;
  color:rgba(232,238,252,.78);
}

.gold-select--zodiacSign .gold-select-option.is-selected.is-placeholder{
  color:#071326;
}

@media (max-width:760px){
  .gold-select--zodiacSign .gold-select-menu{
    width:min(94vw, 520px);
    grid-template-columns:repeat(2, minmax(120px, 1fr));
    max-height:70vh;
    overflow:auto;
  }
}


/* Fix chiusura menu zodiacale: la classe hidden deve vincere anche sul layout a griglia */
.gold-select--zodiacSign .gold-select-menu.hidden{
  display:none !important;
}

.gold-select--zodiacSign.is-open .gold-select-menu:not(.hidden){
  display:grid;
}
