@import url('https://fonts.googleapis.com/css2?family=Heebo:wght@100;200;300;400;500;600;700&display=swap');

:root{
  --cream:#E7C77E;
  --ivory:#F1DFA0;
  --ink:#2B2420;
  --ink-deep:#1C1712;
  --gold:#B08A3E;
  --gold-dark:#8A6C2E;
  --gold-light:#E3C378;
  --gold-pale:#EEDCA6;
  --gold-glow:rgba(173,138,78,0.28);
  --line:#D8B96C;
  --green-wa:#3FA772;
  --danger:#B65B4A;
  --text-gold:#6B4E14;
  --taupe:#8A6C2E;
  --rose:#B5665A;
  --rose-light:#D99C8E;
  --rose-pale:#F0DAD3;
  --paper:#FBF7EE;
  --paper-deep:#F1E9D6;
  --white:#FFFDF8;
  --shadow:0 20px 50px -20px rgba(43,36,32,0.25);
  --shadow-gold:0 14px 34px -12px rgba(138,108,57,0.45);
  --radius:999px;
  --radius-lg:22px;
  --radius-md:14px;
  --radius-sm:9px;
  --radius-btn:15px;
  --radius-swatch:30px 8px 30px 8px;
  --font:'Heebo',sans-serif;
  --font-display:'Heebo',sans-serif;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font);
  font-weight:300;
  color:var(--text-gold);
  direction:rtl;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  background:
    radial-gradient(1100px 620px at 50% -8%, rgba(255,250,240,0.9), transparent 62%),
    radial-gradient(900px 520px at 100% 15%, rgba(238,220,166,0.28), transparent 58%),
    radial-gradient(900px 600px at 0% 85%, rgba(216,185,108,0.22), transparent 60%),
    linear-gradient(180deg, var(--white) 0%, var(--paper) 38%, #F6F0E1 72%, var(--paper-deep) 100%);
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;}
h1,h2,h3,h4{font-family:var(--font);font-weight:400;letter-spacing:0.01em;margin:0;color:var(--ink);}
.hero h1, .section-head h2, .results-hero h1, .needle-card h3, .modal h3{font-family:var(--font-display);font-weight:500;letter-spacing:0;}
p{margin:0;}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;}
@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.001ms !important;animation-iteration-count:1 !important;transition-duration:0.001ms !important;}
}

.wrap{max-width:1180px;margin:0 auto;padding:0 32px;}

/* ---------- Top bar ---------- */
.topbar{position:sticky;top:0;z-index:40;padding:18px 0 0;transition:padding .35s ease;}
.topbar-inner{
  max-width:1180px;margin:0 auto;padding:10px 18px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  background:linear-gradient(180deg, rgba(248,236,201,0.94) 0%, rgba(230,200,119,0.88) 100%);
  border:1px solid rgba(138,108,46,0.22);
  border-radius:var(--radius);
  box-shadow:0 10px 30px -18px rgba(43,36,32,0.35);
  backdrop-filter:blur(10px);
  transition:padding .35s ease, box-shadow .35s ease, background .35s ease;
}
.topbar.is-scrolled{padding:8px 0 0;}
.topbar.is-scrolled .topbar-inner{padding:7px 16px;box-shadow:0 14px 34px -16px rgba(43,36,32,0.45);}
.topbar.is-scrolled .brand img{height:32px;}
.brand{
  display:flex;align-items:center;gap:10px;
  font-size:16px;font-weight:700;letter-spacing:0.02em;color:var(--ink-deep);
  text-decoration:none;cursor:pointer;
  padding:8px 16px 8px 20px;border-radius:var(--radius);
  border:1px solid rgba(176,138,62,0.3);
  background:linear-gradient(135deg, rgba(255,253,248,0.6) 0%, rgba(238,220,166,0.5) 100%);
  box-shadow:0 2px 10px -4px rgba(138,108,57,0.25);
  position:relative;overflow:hidden;isolation:isolate;
  transition:transform .3s cubic-bezier(.19,1,.22,1), box-shadow .3s ease, border-color .3s ease;
}
.brand::before{
  content:"";position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(115deg, transparent 20%, rgba(255,255,255,0.75) 45%, transparent 65%);
  transform:translateX(-130%);transition:transform .7s ease;pointer-events:none;
}
.brand:hover{
  transform:translateY(-1px);
  border-color:var(--gold);
  box-shadow:0 12px 26px -10px rgba(138,108,57,0.45);
}
.brand:hover::before{transform:translateX(130%);}
.brand img{height:38px;width:auto;transition:transform .3s cubic-bezier(.34,1.56,.64,1);}
.brand:hover img{transform:scale(1.06);}
.nav-tabs{display:flex;gap:4px;background:rgba(255,248,224,0.55);border:1px solid rgba(138,108,46,0.22);border-radius:var(--radius);padding:4px;}
.nav-tab{padding:9px 18px;border-radius:var(--radius);font-size:13.5px;font-weight:600;color:var(--text-gold);transition:all .2s ease;white-space:nowrap;position:relative;}
.nav-tab:hover{color:var(--ink-deep);}
.nav-tab.active{background:none;color:var(--ink-deep);}
.nav-tab.active::after{content:"";position:absolute;left:16px;right:16px;bottom:2px;height:2px;background:var(--rose);border-radius:2px;}

/* ---------- Buttons ---------- */
.btn{
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:16px 34px;border-radius:var(--radius-btn);border:1px solid transparent;
  background:linear-gradient(135deg, var(--gold-light) 0%, var(--gold) 45%, var(--gold-dark) 100%);
  color:#fff;font-size:14.5px;letter-spacing:0.03em;font-weight:600;
  box-shadow:var(--shadow-gold);overflow:hidden;
  transition:transform .3s cubic-bezier(.19,1,.22,1), box-shadow .3s ease;
}
.btn::after{
  content:"";position:absolute;top:0;left:0;width:0;height:0;
  border-style:solid;border-width:0 14px 14px 0;
  border-color:transparent rgba(255,253,248,0.35) transparent transparent;
}
.btn::before{
  content:"";position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(115deg, transparent 20%, rgba(255,255,255,0.55) 45%, transparent 65%);
  transform:translateX(-120%);transition:transform .7s ease;pointer-events:none;
}
.btn:hover{transform:translateY(-2px);box-shadow:0 20px 40px -14px rgba(138,108,57,0.55);}
.btn:hover::before{transform:translateX(120%);}
.btn:disabled{opacity:.4;cursor:not-allowed;transform:none;box-shadow:none;}
.btn-outline{background:transparent;color:var(--text-gold);border-color:var(--ink);box-shadow:none;}
.btn-outline:hover{background:var(--ink);color:#fff;border-color:var(--ink);box-shadow:0 16px 32px -14px rgba(43,36,32,0.45);}
.btn-outline::before{display:none;}
.btn-light{background:var(--white);color:var(--text-gold);border-color:var(--line);box-shadow:var(--shadow);}
.btn-light::before{display:none;}
.btn-block{width:100%;}
.btn-sm{padding:9px 18px;font-size:12.5px;}

/* ---------- Cards ---------- */
.card{background:var(--white);color:var(--ink);border-radius:var(--radius-swatch);box-shadow:var(--shadow);border:1px solid rgba(216,185,108,0.35);}
.card-gold{background:linear-gradient(135deg, var(--gold-pale) 0%, var(--gold-light) 100%);color:var(--ink-deep);border-radius:var(--radius-swatch);border:1px solid rgba(138,108,46,0.25);}

/* ---------- Stitched thread divider ---------- */
.thread{position:relative;height:1px;background:repeating-linear-gradient(90deg,var(--gold) 0 10px,transparent 10px 18px);margin:0 auto;}
.thread::after{
  content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(45deg);
  width:9px;height:9px;background:var(--gold);
  box-shadow:0 0 0 5px var(--paper), 0 0 14px 2px rgba(176,138,62,0.45);
}
.thread-v{width:1px;background:repeating-linear-gradient(180deg,var(--gold) 0 10px,transparent 10px 18px);margin:0 auto;}

/* ---------- Hero ---------- */
.hero{padding:64px 0 40px;position:relative;overflow:hidden;}
.hero-grid{display:grid;grid-template-columns:1.05fr 0.95fr;gap:56px;align-items:center;}
.eyebrow{font-size:12px;letter-spacing:0.22em;color:var(--gold-dark);font-weight:600;text-transform:uppercase;display:inline-flex;align-items:center;gap:10px;margin-bottom:22px;}
.eyebrow::before{content:"";display:inline-block;width:28px;height:1px;background:var(--gold);}
.eyebrow .dot{position:relative;width:6px;height:6px;border-radius:50%;background:var(--rose);flex:none;}
.eyebrow .dot::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:1px solid var(--rose);opacity:.55;animation:rs-dot-pulse 2.4s ease-out infinite;}
@keyframes rs-dot-pulse{0%{transform:scale(.4);opacity:.6;}100%{transform:scale(1.9);opacity:0;}}
.hero h1{font-size:50px;line-height:1.16;color:var(--ink);margin-bottom:20px;}
.hero h1 em{font-style:normal;color:var(--gold-dark);}
.hero-ornament{width:64px;height:1px;background:linear-gradient(90deg,transparent,var(--gold-dark),transparent);position:relative;margin:0 0 24px;}
.hero-ornament::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(45deg);width:7px;height:7px;background:var(--gold);}
.hero p.lead{font-size:18px;color:var(--taupe);max-width:520px;margin-bottom:30px;font-weight:400;}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap;align-items:center;}

/* Slim, modern meta line (replaces the old emoji bullet points) */
.trust-line{margin-top:26px;font-size:12.5px;color:var(--taupe);display:flex;gap:22px;flex-wrap:wrap;font-weight:400;letter-spacing:.01em;}
.trust-line span{display:flex;align-items:center;gap:7px;}
.trust-line svg{width:15px;height:15px;stroke:var(--gold-dark);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex:none;}

.needle-visual{position:relative;padding:10px;}
@media (min-width:981px){
  .needle-visual{transform:translateX(-90px);}
}
.badge-pill{display:inline-block;background:var(--ink);color:var(--gold-pale);font-size:11.5px;font-weight:600;letter-spacing:.04em;padding:5px 14px;border-radius:var(--radius);}

/* ---------- Hero prize showcase (rotating visual) ---------- */
.showcase-card{position:relative;background:var(--white);border-radius:var(--radius-swatch);box-shadow:var(--shadow);padding:16px 16px 26px;border:1px solid rgba(216,185,108,0.35);}
.showcase-top{display:flex;justify-content:space-between;align-items:center;padding:6px 8px 14px;}
.showcase-top .badge-pill{margin:0;}
.showcase-counter{font-size:12px;color:var(--taupe);font-weight:500;}
.showcase-counter strong{color:var(--ink);font-family:var(--font-display);font-size:16px;font-weight:600;}

.showcase-stage{position:relative;aspect-ratio:4/3.1;border-radius:var(--radius-lg);overflow:hidden;background:var(--paper-deep);box-shadow:inset 0 0 0 1px rgba(138,108,46,0.12);}
.showcase-slide{position:absolute;inset:0;opacity:0;transform:scale(1.055);transition:opacity 1.1s cubic-bezier(.19,1,.22,1), transform 5.5s cubic-bezier(.19,1,.22,1);pointer-events:none;}
.showcase-slide.active{opacity:1;transform:scale(1);transition:opacity 1.1s cubic-bezier(.19,1,.22,1), transform 5.5s cubic-bezier(.19,1,.22,1);z-index:2;pointer-events:auto;}
.showcase-slide img{width:100%;height:100%;object-fit:cover;}
.showcase-slide.illustrated{display:flex;align-items:center;justify-content:center;}
.showcase-slide.illustrated .ill-medal{width:96px;height:96px;}
.showcase-slide.illustrated .ill-medal svg{width:44px;height:44px;}
.showcase-slide.illustrated .hero-scene{width:72%;max-width:280px;height:auto;filter:drop-shadow(0 12px 20px rgba(28,23,18,0.28));}
.showcase-caption{position:absolute;inset:auto 0 0 0;padding:38px 20px 18px;background:linear-gradient(0deg, rgba(28,23,18,0.82) 0%, rgba(28,23,18,0.5) 45%, transparent 100%);color:var(--white);}
.showcase-caption .sc-tag{display:inline-block;background:var(--rose);color:#fff;font-size:10.5px;font-weight:600;letter-spacing:.03em;padding:4px 11px;border-radius:6px;margin-bottom:9px;}
.showcase-caption h4{font-family:var(--font-display);font-weight:600;font-size:17px;color:var(--white);margin-bottom:3px;letter-spacing:0;}
.showcase-caption p{font-size:11.5px;color:rgba(255,253,248,0.78);line-height:1.5;max-width:88%;}

.showcase-arrow{
  position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,253,248,0.4);
  background:rgba(28,23,18,0.4);backdrop-filter:blur(3px);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:18px;line-height:1;
  transition:background .2s ease, transform .2s ease;
}
.showcase-arrow:hover{background:rgba(28,23,18,0.68);}
.showcase-arrow:active{transform:translateY(-50%) scale(.92);}
.showcase-arrow.prev{right:12px;}
.showcase-arrow.next{left:12px;}

.showcase-dots{display:flex;justify-content:center;gap:7px;margin:16px 0 4px;}
.showcase-dot{width:7px;height:7px;border-radius:50%;background:var(--line);border:none;padding:0;transition:all .3s ease;}
.showcase-dot.active{width:22px;border-radius:4px;background:var(--gold);}

.showcase-foot{padding:10px 10px 0;}
.kicker-sm{display:block;font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-dark);margin-bottom:8px;}
.stat-row-mini{display:flex;justify-content:space-between;align-items:baseline;padding:9px 0;border-bottom:1px solid rgba(216,185,108,0.28);font-size:13px;}
.stat-row-mini:last-child{border-bottom:none;}
.stat-row-mini span{color:var(--taupe);font-weight:400;}
.stat-row-mini b{color:var(--ink);font-weight:500;letter-spacing:.01em;}
@media (prefers-reduced-motion:reduce){
  .showcase-slide{transition:opacity .01ms;}
  .showcase-slide.active{transform:scale(1);}
}

/* ---------- Section headers ---------- */
.section{padding:56px 0;}
.section-head{text-align:center;max-width:640px;margin:0 auto 42px;}
.section-head .kicker{color:var(--gold-dark);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;display:block;margin-bottom:10px;}
.section-head h2{font-size:32px;color:var(--ink);}
.section-head p{color:var(--taupe);margin-top:12px;font-size:15px;}

/* ---------- Steps ---------- */
.steps{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:10px;}
.steps::before{content:"";position:absolute;top:27px;right:12.5%;left:12.5%;height:1px;background:repeating-linear-gradient(90deg,var(--gold) 0 10px,transparent 10px 18px);z-index:0;}
.step{position:relative;z-index:1;text-align:center;}
.step .num{width:54px;height:54px;border-radius:50%;background:var(--white);border:2px solid var(--gold);color:var(--gold-dark);font-weight:700;font-size:18px;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;box-shadow:var(--shadow);}
.step h4{font-size:15px;color:var(--ink);margin-bottom:6px;}
.step p{font-size:13px;color:var(--taupe);}

/* ---------- Prize preview / product-style cards ---------- */
.prize-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:36px;}
.prize-card{overflow:hidden;background:var(--ivory);}
.prize-media{aspect-ratio:4/3;position:relative;overflow:hidden;border-radius:var(--radius-lg) var(--radius-lg) 0 0;}
.prize-media img{width:100%;height:100%;object-fit:cover;}
.prize-media .tag{position:absolute;top:14px;left:14px;z-index:2;background:var(--rose);color:#fff;font-size:11px;padding:6px 12px;border-radius:6px;letter-spacing:.03em;}
.prize-body{padding:18px 20px 20px;}
.prize-body h4{font-size:15px;color:var(--ink);margin-bottom:6px;}
.prize-body p{font-size:12.5px;color:var(--taupe);margin-bottom:14px;}

/* ---------- Winners section (revealed once the draw date passes) ---------- */
.winners-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:20px;margin-top:36px;}
.winner-card{padding:32px 24px;text-align:center;background:var(--ivory);}
.wc-icon{font-size:32px;margin-bottom:14px;}
.wc-name{font-size:16px;font-weight:700;color:var(--ink);margin-bottom:8px;}
.wc-prize{font-size:13.5px;color:var(--gold-dark);font-weight:600;}
@media (max-width:900px){.winners-grid{grid-template-columns:1fr;}}

/* ---------- Modal ---------- */
.modal-overlay{position:fixed;inset:0;background:rgba(28,23,18,0.72);backdrop-filter:blur(3px);display:none;align-items:center;justify-content:center;z-index:100;padding:20px;}
.modal-overlay.open{display:flex;}
.modal{background:var(--white);color:var(--ink);border-radius:24px;padding:34px;max-width:440px;width:100%;box-shadow:var(--shadow);position:relative;border:1px solid rgba(216,185,108,0.35);}
.modal h3{font-size:22px;margin-bottom:6px;}
.modal .sub{font-size:14px;color:var(--taupe);margin-bottom:22px;}
.modal-close{position:absolute;top:16px;left:16px;background:none;border:none;font-size:20px;color:var(--taupe);}
.field{margin-bottom:16px;}
.field label{display:block;font-size:13px;font-weight:600;margin-bottom:7px;color:var(--ink);}
.field input{width:100%;padding:13px 15px;border-radius:var(--radius-sm);border:1.5px solid var(--line);background:var(--paper);font-size:15px;font-family:inherit;color:var(--ink);}
.field input:focus{border-color:var(--gold);outline:none;}
.field-error{font-size:12px;color:var(--danger);margin-top:5px;display:none;}
.field-check{display:flex;align-items:flex-start;gap:8px;font-size:12px;color:var(--taupe);margin-bottom:16px;}
.field-check input{margin-top:3px;}

/* ---------- Quiz ---------- */
.quiz-shell{max-width:720px;margin:0 auto;padding:44px 28px 80px;}
.quiz-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;flex-wrap:wrap;gap:10px;}
.quiz-progress-label{font-size:13px;color:var(--taupe);}
.score-chip{background:var(--ink);border:1px solid var(--gold-dark);color:var(--gold-pale);padding:8px 16px;border-radius:var(--radius);font-weight:700;font-size:13.5px;display:flex;align-items:center;gap:8px;}
.progress-track{height:7px;border-radius:var(--radius);background:var(--paper-deep);overflow:hidden;margin-bottom:36px;}
.progress-fill{height:100%;background:linear-gradient(90deg,var(--gold),var(--gold-dark));border-radius:var(--radius);transition:width .4s ease;}
.q-card{padding:34px;}
.q-kicker{font-size:12px;font-weight:600;color:var(--taupe);letter-spacing:.05em;margin-bottom:10px;}
.q-card h2{font-size:22px;line-height:1.4;margin-bottom:26px;color:var(--ink);font-weight:600;}
.options{display:flex;flex-direction:column;gap:12px;}
.option{text-align:right;padding:16px 18px;border-radius:var(--radius-sm);border:1.5px solid var(--line);background:var(--white);font-size:15px;font-weight:500;color:var(--ink);transition:all .15s ease;display:flex;justify-content:flex-start;align-items:center;gap:12px;}
.option .opt-text{flex:1;}
.option .opt-letter{
  flex:none;width:26px;height:26px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:800;color:var(--gold-dark);
  background:var(--gold-pale);border:1px solid var(--line);
  transition:all .15s ease;
}
.option.correct .opt-letter{background:var(--green-wa);color:#fff;border-color:var(--green-wa);}
.option.incorrect .opt-letter{background:var(--danger);color:#fff;border-color:var(--danger);}
.option:hover:not(:disabled){border-color:var(--gold);background:var(--gold-pale);}
.option:disabled{cursor:default;}
.option.correct{background:rgba(63,167,114,0.13);border-color:var(--green-wa);color:#215c3e;}
.option.incorrect{background:rgba(182,91,74,0.12);border-color:var(--danger);color:#8f3a32;}
.option .mark-icon{font-weight:800;font-size:15px;opacity:0;}
.option.correct .mark-icon,.option.incorrect .mark-icon{opacity:1;}
.q-footer{margin-top:26px;display:flex;justify-content:space-between;align-items:center;}
.feedback-line{font-size:13.5px;font-weight:600;min-height:20px;color:var(--taupe);}
.feedback-line.correct{color:var(--green-wa);}
.feedback-line.incorrect{color:var(--danger);}

/* ---------- Results ---------- */
.results-hero{text-align:center;padding:70px 0 40px;}
.results-hero .kicker{color:var(--gold-dark);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;}
.results-hero h1{font-size:44px;color:var(--ink);margin:14px 0;}
.results-hero p{color:var(--taupe);font-size:15.5px;}
.results-score{display:inline-flex;align-items:center;gap:16px;margin-top:30px;padding:20px 34px;background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid rgba(216,185,108,0.35);}
.results-score .num{font-size:32px;font-weight:700;color:var(--ink);}
.results-score .label{font-size:12.5px;color:var(--taupe);}
.timeline{max-width:640px;margin:50px auto 0;position:relative;padding-inline-start:34px;}
.timeline::before{content:"";position:absolute;top:6px;bottom:6px;right:11px;width:1px;background:repeating-linear-gradient(180deg,var(--gold) 0 10px,transparent 10px 18px);}
.tl-item{position:relative;margin-bottom:22px;padding:20px 24px;}
.tl-item::before{content:"";position:absolute;top:24px;right:-34px;width:13px;height:13px;border-radius:50%;background:var(--gold);border:3px solid var(--paper);}
.tl-item .cat{font-size:11.5px;color:var(--gold-dark);font-weight:600;margin-bottom:6px;text-transform:uppercase;letter-spacing:.06em;}
.tl-item h4{font-size:16.5px;color:var(--ink);margin-bottom:6px;}
.tl-item .meta{font-size:13px;color:var(--taupe);}

/* ---------- Dashboard ---------- */
.dash-grid{display:grid;grid-template-columns:1.15fr 0.85fr;gap:24px;margin-top:26px;}
.stat-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:20px;}
.stat-card{padding:20px;text-align:center;}
.stat-card .n{font-size:25px;font-weight:700;color:var(--ink);}
.stat-card .l{font-size:12px;color:var(--taupe);margin-top:4px;}
.panel{padding:26px;margin-bottom:20px;}
.panel h3{font-size:17px;color:var(--ink);margin-bottom:16px;}
.ref-box{display:flex;gap:10px;align-items:center;background:var(--paper);border:1.5px dashed var(--line);border-radius:var(--radius-sm);padding:12px 14px;margin-bottom:14px;}
.ref-box input{flex:1;border:none;background:transparent;font-size:13px;color:var(--taupe);font-family:inherit;}
.share-row{display:flex;gap:10px;flex-wrap:wrap;}
.progress-list{display:flex;flex-direction:column;gap:14px;}
.progress-item .top{display:flex;justify-content:space-between;font-size:13px;margin-bottom:6px;color:var(--taupe);}
.progress-item .top strong{color:var(--ink);}
.mini-track{height:6px;border-radius:var(--radius);background:var(--paper-deep);overflow:hidden;}
.mini-fill{height:100%;background:var(--gold);}

/* ---------- Catalog / Prizes ---------- */
.promo-banner{display:flex;align-items:center;justify-content:center;gap:12px;background:linear-gradient(135deg,var(--gold-light),var(--gold) 60%,var(--gold-dark));color:var(--ink-deep);padding:15px 24px;border-radius:var(--radius-lg);box-shadow:var(--shadow-gold);margin:0 0 26px;text-align:center;}
.promo-banner .pb-icon{font-size:22px;line-height:1;flex:none;}
.promo-banner p{margin:0;font-size:14.5px;font-weight:700;letter-spacing:.01em;}
.promo-banner p strong{font-size:16px;}
@media (max-width:560px){.promo-banner{padding:13px 16px;}.promo-banner p{font-size:13px;}.promo-banner p strong{font-size:14.5px;}}

.balance-banner{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;padding:22px 28px;margin-bottom:30px;}
.balance-banner .left h3{font-size:16px;color:var(--ink-deep);margin-bottom:4px;}
.balance-banner .left p{font-size:13px;color:var(--ink-deep);opacity:.85;}
.balance-num{display:flex;align-items:baseline;gap:8px;}
.balance-num .n{font-size:28px;font-weight:700;color:var(--ink-deep);}
.balance-num .l{font-size:12px;color:var(--ink-deep);opacity:.8;}
.catalog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.gift-card{overflow:hidden;display:flex;flex-direction:column;background:var(--ivory);}
.gift-media{aspect-ratio:4/3;position:relative;overflow:hidden;border-radius:var(--radius-lg) var(--radius-lg) 0 0;}
.gift-media img{width:100%;height:100%;object-fit:cover;}
.gift-media .left-tag{position:absolute;top:12px;right:12px;z-index:2;background:var(--rose);color:#fff;font-size:11px;font-weight:600;padding:5px 12px;border-radius:6px;}
.gift-body{padding:18px 20px;flex:1;display:flex;flex-direction:column;}
.gift-body h4{font-size:15px;color:var(--ink);margin-bottom:6px;}
.gift-body p{font-size:12px;color:var(--taupe);margin-bottom:14px;flex:1;}
.qty-row{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;}
.qty-control{display:flex;align-items:center;gap:10px;background:var(--paper);border-radius:var(--radius);padding:6px 10px;border:1px solid var(--line);}
.qty-control button{width:26px;height:26px;border-radius:50%;border:none;background:var(--gold-pale);color:var(--ink);font-weight:700;font-size:15px;line-height:1;}
.qty-control span{min-width:18px;text-align:center;font-weight:700;}
.entries-note{font-size:11px;color:var(--taupe);margin-top:8px;}

/* ---------- Footer ---------- */
.site-footer{border-top:1px solid var(--line);padding:26px 0;margin-top:40px;}
.site-footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:12px;color:var(--taupe);}

/* ---------- Toast ---------- */
.toast{
  position:fixed;bottom:26px;left:50%;transform:translateX(-50%) translateY(20px);
  background:var(--ink);color:var(--gold-pale);padding:13px 24px;border-radius:var(--radius);
  font-size:13.5px;font-weight:600;box-shadow:var(--shadow);opacity:0;pointer-events:none;
  transition:all .3s ease;z-index:200;border:1px solid var(--gold-dark);
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

/* ---------- Back to top ---------- */
.back-to-top{
  position:fixed;bottom:26px;right:26px;z-index:150;
  width:46px;height:46px;border-radius:50%;
  background:var(--ink);color:var(--gold-pale);border:1px solid var(--gold-dark);
  display:flex;align-items:center;justify-content:center;font-size:17px;
  box-shadow:var(--shadow);opacity:0;transform:translateY(14px) scale(.9);pointer-events:none;
  transition:opacity .3s ease, transform .3s ease;
}
.back-to-top.show{opacity:1;transform:translateY(0) scale(1);pointer-events:auto;}
.back-to-top:hover{background:var(--gold-dark);}
.back-to-top svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
@media (max-width:640px){.back-to-top{bottom:18px;right:18px;width:42px;height:42px;}}

/* ---------- Responsive ---------- */
@media (max-width:980px){
  .hero-grid{grid-template-columns:1fr;}
  .hero h1{font-size:36px;}
  .steps{grid-template-columns:repeat(2,1fr);}
  .steps::before{display:none;}
  .prize-grid,.catalog-grid{grid-template-columns:repeat(2,1fr);}
  .dash-grid{grid-template-columns:1fr;}
  .stat-cards{grid-template-columns:1fr;}
}
@media (max-width:640px){
  .topbar-inner{flex-direction:column;gap:12px;align-items:stretch;border-radius:22px;}
  .nav-tabs{justify-content:center;}
  .hero{padding:30px 0 20px;}
  .hero h1{font-size:28px;}
  .prize-grid,.catalog-grid{grid-template-columns:1fr;}
  .q-card{padding:24px 20px;}
  .results-hero h1{font-size:30px;}
  .wrap{padding:0 18px;}
}

/* ---------- Scroll reveal ---------- */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.19,1,.22,1), transform .7s cubic-bezier(.19,1,.22,1);}
.reveal.in{opacity:1;transform:translateY(0);}
.reveal-1.in{transition-delay:.08s;}
.reveal-2.in{transition-delay:.16s;}
.reveal-3.in{transition-delay:.24s;}
.reveal-4.in{transition-delay:.32s;}
.reveal-5.in{transition-delay:.4s;}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none;}
}

/* ---------- Hero background photo ---------- */
.hero{position:relative;}
.hero-bg{
  position:absolute;inset:-20px -32px auto -32px;height:calc(100% + 20px);
  background-size:cover;background-position:center 30%;
  -webkit-mask-image:linear-gradient(180deg, rgba(0,0,0,0.16) 0%, rgba(0,0,0,0.05) 55%, transparent 88%);
  mask-image:linear-gradient(180deg, rgba(0,0,0,0.16) 0%, rgba(0,0,0,0.05) 55%, transparent 88%);
  z-index:0;pointer-events:none;
}
.hero .wrap{position:relative;z-index:1;}

/* floating motion on the hero stat card */
@keyframes rs-float{
  0%,100%{transform:translateY(0);}
  50%{transform:translateY(-9px);}
}
.needle-visual{animation:rs-float 6s ease-in-out infinite;}
@media (prefers-reduced-motion:reduce){
  .needle-visual{animation:none;}
}

/* ---------- Countdown chip ---------- */
.countdown-chip{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--ink);color:var(--gold-pale);
  padding:8px 18px;border-radius:var(--radius);
  font-size:12.5px;font-weight:600;letter-spacing:.02em;
  box-shadow:var(--shadow);
}
.countdown-chip::before{content:"⏳";}

/* ---------- Trust badges (from reposestyle.com) ---------- */
.trust-strip{padding:44px 0 8px;}
.trust-badges{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;max-width:920px;margin:0 auto;}
.trust-badge{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;}
.trust-badge .tb-icon{
  width:56px;height:56px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--paper);border:1px solid var(--line);
  transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.trust-badge:hover .tb-icon{transform:translateY(-3px);border-color:var(--gold-light);box-shadow:0 14px 28px -10px rgba(173,138,78,0.4);}
.trust-badge .tb-icon svg{width:26px;height:26px;stroke:var(--gold-dark);fill:none;stroke-width:1.6;}
.trust-badge p{font-size:12.5px;color:var(--taupe);line-height:1.5;}
@media (max-width:640px){.trust-badges{grid-template-columns:repeat(2,1fr);row-gap:28px;}}

/* ---------- Accordion (FAQ) ---------- */
.accordion{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:12px;}
.accordion-item{background:var(--white);border:1px solid rgba(216,185,108,0.35);border-radius:var(--radius-md);overflow:hidden;}
.accordion-q{
  width:100%;text-align:right;background:none;border:none;padding:18px 22px;
  display:flex;justify-content:space-between;align-items:center;gap:14px;
  font-size:15px;font-weight:600;color:var(--ink);
}
.accordion-q .chev{transition:transform .3s ease;color:var(--rose);font-size:14px;}
.accordion-item.open .accordion-q .chev{transform:rotate(180deg);}
.accordion-a{max-height:0;overflow:hidden;transition:max-height .35s ease, padding .35s ease;padding:0 22px;}
.accordion-item.open .accordion-a{max-height:220px;padding:0 22px 20px;}
.accordion-a p{font-size:13.5px;color:var(--taupe);line-height:1.7;}

/* ---------- Confetti ---------- */
.confetti-root{position:relative;overflow:visible;}
.confetti-piece{
  position:absolute;top:-10px;border-radius:2px;
  animation-name:rs-confetti-fall;
  animation-timing-function:ease-in;
  animation-fill-mode:forwards;
  pointer-events:none;
}
@keyframes rs-confetti-fall{
  0%{transform:translateY(0) rotate(0deg);opacity:1;}
  100%{transform:translateY(320px) rotate(340deg);opacity:0;}
}
@media (prefers-reduced-motion:reduce){
  .confetti-piece{display:none;}
}

/* ---------- Answer review list (results page) ---------- */
.review-list{max-width:700px;margin:0 auto;display:flex;flex-direction:column;gap:10px;}
.review-item{padding:16px 20px;display:flex;gap:14px;align-items:flex-start;}
.review-item .ri-icon{
  flex:none;width:26px;height:26px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;color:#fff;margin-top:2px;
}
.review-item.is-correct .ri-icon{background:var(--green-wa);}
.review-item.is-wrong .ri-icon{background:var(--danger);}
.review-item .ri-q{font-size:14px;font-weight:600;color:var(--ink);margin-bottom:5px;}
.review-item .ri-a{font-size:12.5px;color:var(--taupe);}
.review-item .ri-a strong{color:var(--ink);}

/* ---------- Micro press feedback on buttons/qty ---------- */
.btn:active, .qty-control button:active, .accordion-q:active{transform:scale(.97);}

/* ---------- Fade-in page shell ---------- */
main{animation:rs-page-in .5s ease both;}
@keyframes rs-page-in{from{opacity:0;}to{opacity:1;}}
@media (prefers-reduced-motion:reduce){main{animation:none;}}

/* ---------- Quiz question transition ---------- */
.q-card.q-anim{animation:rs-q-in .35s cubic-bezier(.19,1,.22,1);}
@keyframes rs-q-in{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}
@media (prefers-reduced-motion:reduce){.q-card.q-anim{animation:none;}}

/* ---------- Illustrated prize art (no stock photo needed) ---------- */
.prize-media.illustrated, .gift-media.illustrated{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  position:relative;
}
.ill-medal{
  position:relative;width:72px;height:72px;border-radius:50%;
  background:rgba(255,253,248,0.94);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 12px 26px -10px rgba(43,36,32,0.4);
}
.ill-medal svg{width:34px;height:34px;stroke:var(--ink-deep);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.il-getaway{background:linear-gradient(155deg,#7C9A82 0%,#3F5E52 55%,#22362E 100%);}
.il-cash{background:linear-gradient(155deg,#3E7C5C 0%,#1F4A38 60%,#122E22 100%);}
.il-cash2{background:linear-gradient(155deg,#3E7C5C 0%,#B08A3E 62%,#6B4E14 100%);}
.il-voucher{background:linear-gradient(155deg,var(--gold-light) 0%,var(--gold) 55%,var(--rose) 130%);}

/* Eye-catching finish on the illustrated prize tiles: a slow diagonal
   shine sweep, plus a soft pulsing gold glow on the cash medallions. */
.prize-media.illustrated, .gift-media.illustrated, .showcase-slide.illustrated{
  position:relative;overflow:hidden;
}
.prize-media.illustrated::after, .gift-media.illustrated::after, .showcase-slide.illustrated::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(115deg, transparent 35%, rgba(255,255,255,0.32) 48%, transparent 62%);
  transform:translateX(-140%);
  animation:rs-ill-shine 5s ease-in-out infinite;
}
@keyframes rs-ill-shine{
  0%,55%{transform:translateX(-140%);}
  100%{transform:translateX(140%);}
}
.il-cash .ill-medal, .il-cash2 .ill-medal{animation:rs-coin-glow 3.2s ease-in-out infinite;}
@keyframes rs-coin-glow{
  0%,100%{box-shadow:0 12px 26px -10px rgba(43,36,32,0.4), 0 0 0 0 rgba(224,184,101,0.45);}
  50%{box-shadow:0 12px 26px -10px rgba(43,36,32,0.4), 0 0 0 9px rgba(224,184,101,0);}
}
@media (prefers-reduced-motion:reduce){
  .prize-media.illustrated::after, .gift-media.illustrated::after, .showcase-slide.illustrated::after{animation:none;display:none;}
  .il-cash .ill-medal, .il-cash2 .ill-medal{animation:none;}
}

/* =========================================================
   Quiz v2 — categories, "preparing question" loader,
   category cutscenes, points-fly + score-pop animations
   ========================================================= */

.is-hidden{display:none !important;}

.quiz-stage{position:relative;min-height:340px;}

/* ---------- Category progress dots ---------- */
.cat-dots{display:flex;gap:5px;margin:-24px 0 24px;justify-content:flex-start;}
.cat-dot{
  flex:1;height:5px;border-radius:var(--radius);
  background:var(--paper-deep);
  transition:background .35s ease, transform .35s ease;
}
.cat-dot.is-done{background:var(--dot-color, var(--gold));}
.cat-dot.is-active{background:var(--dot-color, var(--gold));transform:scaleY(1.6);}

/* ---------- Category chip + streak chip inside q-card ---------- */
.q-card-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap;}
.cat-chip{
  display:inline-flex;align-items:center;gap:7px;
  padding:6px 14px;border-radius:var(--radius);
  font-size:12.5px;font-weight:700;
  background:var(--chip-color-soft, var(--gold-pale));
  color:var(--chip-color, var(--gold-dark));
  border:1px solid var(--chip-color, var(--gold));
  animation:rs-chip-in .4s cubic-bezier(.19,1,.22,1);
}
.cat-chip svg{width:13px;height:13px;fill:none;stroke:var(--chip-color, var(--gold-dark));stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;}
.score-chip svg{width:13px;height:13px;fill:none;stroke:var(--gold-dark);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;vertical-align:-2px;}
@keyframes rs-chip-in{from{opacity:0;transform:translateY(-6px) scale(.9);}to{opacity:1;transform:translateY(0) scale(1);}}
.streak-chip{
  display:inline-flex;align-items:center;gap:5px;
  padding:5px 12px;border-radius:var(--radius);
  font-size:12px;font-weight:700;color:var(--taupe);
  background:var(--paper-deep);
  opacity:.55;
  transition:all .3s ease;
}
.streak-chip.is-hot{
  opacity:1;color:#8f4a1c;background:linear-gradient(90deg,#FFE7B8,#FFD584);
  animation:rs-streak-shake .5s ease;
  box-shadow:0 6px 16px -8px rgba(200,120,20,0.6);
}
@keyframes rs-streak-shake{
  0%,100%{transform:rotate(0);}
  25%{transform:rotate(-6deg) scale(1.08);}
  75%{transform:rotate(6deg) scale(1.08);}
}

/* ---------- Score chip pop ---------- */
.score-chip{transition:transform .2s ease;}
.score-chip.score-pop{animation:rs-score-pop .5s cubic-bezier(.34,1.56,.64,1);}
@keyframes rs-score-pop{
  0%{transform:scale(1);}
  35%{transform:scale(1.22);box-shadow:0 0 0 8px rgba(176,138,62,0.18);}
  100%{transform:scale(1);}
}

/* ---------- Flying "+points" element (appended to body) ---------- */
.fly-point{
  position:fixed;z-index:999;
  transform:translate(-50%,-50%) scale(.8);
  font-family:var(--font-display);
  font-weight:700;font-size:20px;color:var(--green-wa);
  text-shadow:0 2px 10px rgba(63,167,114,0.35);
  pointer-events:none;
  opacity:0;
}
.fly-point.fly-point-go{
  animation:rs-fly-point .8s cubic-bezier(.22,.61,.36,1) forwards;
}
@keyframes rs-fly-point{
  0%{opacity:0;transform:translate(-50%,-50%) scale(.8);}
  18%{opacity:1;transform:translate(-50%,-50%) scale(1.2);}
  100%{opacity:0;transform:translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))) scale(.5);}
}

/* ---------- Answer button micro-animations ---------- */
.option.pulse-correct{animation:rs-pulse-correct .5s ease;}
@keyframes rs-pulse-correct{
  0%{transform:scale(1);}
  40%{transform:scale(1.03);}
  100%{transform:scale(1);}
}
.option.shake{animation:rs-shake .45s ease;}
@keyframes rs-shake{
  0%,100%{transform:translateX(0);}
  20%{transform:translateX(-6px);}
  40%{transform:translateX(5px);}
  60%{transform:translateX(-4px);}
  80%{transform:translateX(3px);}
}

/* ---------- "Preparing your next question" loader ---------- */
.q-loading{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;
  min-height:340px;text-align:center;position:relative;overflow:hidden;
  opacity:0;transition:opacity .28s ease;
}
.q-loading.is-visible{opacity:1;}
.q-loading::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(360px 240px at 50% 50%, var(--gold-glow), transparent 72%);
  opacity:.35;
  animation:rs-loading-glow-pulse 1.7s ease-in-out infinite;
}
@keyframes rs-loading-glow-pulse{
  0%,100%{opacity:.22;}
  50%{opacity:.5;}
}
.q-loading-spinner{display:flex;gap:12px;position:relative;z-index:1;}
.q-loading-spinner span{
  width:16px;height:16px;border-radius:50%;
  background:linear-gradient(135deg,var(--gold),var(--gold-dark));
  animation:rs-dot-bounce 1s ease-in-out infinite;
}
.q-loading-spinner span:nth-child(2){animation-delay:.15s;}
.q-loading-spinner span:nth-child(3){animation-delay:.3s;}
@keyframes rs-dot-bounce{
  0%,80%,100%{transform:translateY(0);opacity:.5;}
  40%{transform:translateY(-16px);opacity:1;}
}
.q-loading-text{
  position:relative;z-index:1;
  font-family:var(--font-display);
  font-size:clamp(26px,5.2vw,44px);
  font-weight:600;
  color:var(--text-gold);
  letter-spacing:0.01em;
  line-height:1.3;
  max-width:90%;
  opacity:0;
  transform:scale(.82) translateY(14px);
}
.q-loading-text.anim-in{
  animation:rs-loading-text-in .7s cubic-bezier(.19,1,.22,1) forwards;
}
@keyframes rs-loading-text-in{
  0%{opacity:0;transform:scale(.8) translateY(16px);}
  55%{opacity:1;transform:scale(1.05) translateY(-3px);}
  100%{opacity:1;transform:scale(1) translateY(0);}
}
.q-loading-underline{
  position:relative;z-index:1;
  width:0;height:3px;border-radius:2px;
  background:linear-gradient(90deg, transparent, var(--gold-dark), var(--gold), var(--gold-dark), transparent);
  opacity:0;
}
.q-loading-underline.anim-in{
  animation:rs-loading-underline .95s ease forwards .18s;
}
@keyframes rs-loading-underline{
  0%{width:0;opacity:0;}
  55%{width:240px;opacity:1;}
  100%{width:190px;opacity:.85;}
}

/* ---------- Full-screen question reveal (before settling into the card) ---------- */
.q-focus{
  position:fixed;inset:0;z-index:60;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;
  text-align:center;padding:40px;
  background:
    radial-gradient(680px 420px at 50% 40%, rgba(238,220,166,0.5), transparent 68%),
    var(--paper);
  opacity:0;transition:opacity .32s ease;
}
.q-focus.is-visible{opacity:1;}
.qf-kicker{
  font-size:13px;font-weight:600;letter-spacing:.06em;color:var(--gold-dark);
  opacity:0;transform:translateY(10px);
}
.qf-text{
  font-family:var(--font-display);
  font-size:clamp(28px,5.4vw,50px);font-weight:600;line-height:1.32;
  color:var(--ink);max-width:820px;margin:0;
  opacity:0;transform:scale(.88) translateY(18px);
}
.q-focus.is-visible .qf-kicker{
  animation:rs-qf-kicker-in .5s cubic-bezier(.19,1,.22,1) forwards;
}
.q-focus.is-visible .qf-text{
  animation:rs-qf-text-in .75s cubic-bezier(.19,1,.22,1) forwards .12s;
}
@keyframes rs-qf-kicker-in{
  0%{opacity:0;transform:translateY(10px);}
  100%{opacity:1;transform:translateY(0);}
}
@keyframes rs-qf-text-in{
  0%{opacity:0;transform:scale(.85) translateY(20px);}
  55%{opacity:1;transform:scale(1.035) translateY(-3px);}
  100%{opacity:1;transform:scale(1) translateY(0);}
}
.qf-skip{
  font-family:var(--font-body);
  font-size:13.5px;font-weight:600;letter-spacing:.01em;
  color:var(--text-gold);background:transparent;
  border:1px solid var(--line);border-radius:999px;
  padding:9px 20px;cursor:pointer;
  opacity:0;transform:translateY(8px);
  animation:rs-qf-skip-in .5s cubic-bezier(.19,1,.22,1) forwards .55s;
  transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease;
}
.qf-skip:hover{background:var(--ink);color:#fff;border-color:var(--ink);transform:translateY(-1px);}
.qf-skip:active{transform:translateY(0) scale(.97);}
@keyframes rs-qf-skip-in{
  0%{opacity:0;transform:translateY(8px);}
  100%{opacity:.85;transform:translateY(0);}
}
@media (prefers-reduced-motion:reduce){
  .q-focus,.qf-kicker,.qf-text,.qf-skip{animation:none !important;transition:none !important;opacity:1 !important;transform:none !important;}
}

/* ---------- Answers fade in one by one, after the card has settled ---------- */
.options.opts-stagger .option{opacity:0;transform:translateY(14px);pointer-events:none;}
.options.opts-stagger.opts-in .option{
  opacity:1;transform:translateY(0);pointer-events:auto;
  transition:opacity .4s ease, transform .4s cubic-bezier(.19,1,.22,1);
}
.options.opts-stagger.opts-in .option:nth-child(1){transition-delay:.05s;}
.options.opts-stagger.opts-in .option:nth-child(2){transition-delay:.15s;}
.options.opts-stagger.opts-in .option:nth-child(3){transition-delay:.25s;}
.options.opts-stagger.opts-in .option:nth-child(4){transition-delay:.35s;}
@media (prefers-reduced-motion:reduce){
  .options.opts-stagger .option{opacity:1;transform:none;pointer-events:auto;}
}

/* ---------- Custom "leave mid-quiz?" confirmation modal ---------- */
.exit-modal-overlay{position:fixed;inset:0;background:rgba(28,23,18,0.72);backdrop-filter:blur(3px);display:none;z-index:110;}
.exit-modal-overlay.open{display:block;}
.exit-modal{
  display:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-46%);
  background:var(--white);color:var(--ink);border-radius:24px;padding:34px;
  max-width:400px;width:calc(100% - 40px);text-align:center;
  box-shadow:var(--shadow);border:1px solid rgba(216,185,108,0.35);z-index:111;
}
.exit-modal.open{display:block;animation:rs-exit-modal-in .28s cubic-bezier(.19,1,.22,1);}
@keyframes rs-exit-modal-in{
  0%{opacity:0;transform:translate(-50%,-42%) scale(.94);}
  100%{opacity:1;transform:translate(-50%,-46%) scale(1);}
}
.exit-modal-icon{font-size:30px;display:block;margin-bottom:10px;}
.exit-modal h3{font-size:19px;margin-bottom:10px;}
.exit-modal p{font-size:13.5px;color:var(--taupe);line-height:1.6;margin-bottom:24px;}
.exit-modal-actions{display:flex;flex-direction:column;gap:10px;}
.exit-modal-actions .btn{width:100%;justify-content:center;}
@media (prefers-reduced-motion:reduce){.exit-modal.open{animation:none;}}

/* ---------- Category intro "cutscene" ---------- */
.cat-intro{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  text-align:center;min-height:320px;padding:20px;border-radius:var(--radius-lg);
  position:relative;overflow:hidden;
  background:
    radial-gradient(420px 260px at 50% 20%, var(--cat-color-soft, var(--gold-pale)), transparent 70%),
    var(--white);
  border:1.5px solid var(--cat-color-soft, var(--line));
  opacity:0;transform:scale(.96);
  transition:opacity .32s ease, transform .32s cubic-bezier(.19,1,.22,1);
}
.cat-intro.is-visible{opacity:1;transform:scale(1);}
.cat-intro-glow{
  position:absolute;inset:-40%;
  background:conic-gradient(from 0deg, transparent, var(--cat-color, var(--gold)), transparent 30%);
  opacity:.14;
  animation:rs-cat-spin 6s linear infinite;
}
@keyframes rs-cat-spin{to{transform:rotate(360deg);}}
.cat-intro-icon{
  width:74px;height:74px;display:flex;align-items:center;justify-content:center;
  position:relative;z-index:1;
  animation:rs-cat-icon-in .6s cubic-bezier(.34,1.56,.64,1);
}
.cat-intro-icon svg{
  width:40px;height:40px;fill:none;
  stroke:var(--cat-color, var(--gold-dark));stroke-width:1.5;
  stroke-linecap:round;stroke-linejoin:round;
  filter:drop-shadow(0 6px 14px rgba(0,0,0,0.12));
}
@keyframes rs-cat-icon-in{
  0%{transform:scale(0) rotate(-30deg);opacity:0;}
  60%{transform:scale(1.2) rotate(8deg);opacity:1;}
  100%{transform:scale(1) rotate(0);}
}
.cat-intro-kicker{
  position:relative;z-index:1;
  font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--cat-color, var(--gold-dark));
}
.cat-intro-name{
  position:relative;z-index:1;
  font-size:28px;color:var(--ink);margin:2px 0 0;
}
.cat-intro-tagline{
  position:relative;z-index:1;
  font-size:14px;color:var(--taupe);max-width:340px;
}
.cat-intro-badge{
  position:relative;z-index:1;margin-top:6px;
  padding:6px 16px;border-radius:var(--radius);
  font-size:12.5px;font-weight:700;color:#fff;
  background:var(--cat-color, var(--gold));
}

@media (prefers-reduced-motion:reduce){
  .fly-point, .score-chip.score-pop, .option.pulse-correct, .option.shake,
  .streak-chip.is-hot, .cat-intro-icon, .cat-intro-glow, .q-loading-spinner span{
    animation:none !important;
  }
}

@media (max-width:640px){
  .cat-intro-name{font-size:23px;}
  .cat-intro-icon{width:58px;height:58px;}
  .cat-intro-icon svg{width:32px;height:32px;}
  .cat-dots{margin-top:-16px;}
}

/* =========================================================
   Quiz v3 — luxury category cutscenes, category-complete seal,
   countdown timer ring, sound toggle, tickets chip
   ========================================================= */

.quiz-top-right{display:flex;align-items:center;gap:10px;}
.tickets-chip{
  background:var(--paper-deep);border:1px solid var(--line);color:var(--gold-dark);
  padding:8px 14px;border-radius:var(--radius);font-weight:700;font-size:13px;
  display:flex;align-items:center;gap:6px;transition:transform .2s ease;
}
.tickets-chip.score-pop{animation:rs-score-pop .5s cubic-bezier(.34,1.56,.64,1);}
.sound-toggle{
  width:38px;height:38px;border-radius:50%;border:1px solid var(--line);
  background:var(--white);font-size:16px;display:flex;align-items:center;justify-content:center;
  transition:all .2s ease;flex:none;
}
.sound-toggle:hover{background:var(--gold-pale);border-color:var(--gold);}
.sound-toggle.is-muted{opacity:.55;}

/* ---------- Timer ring ---------- */
.timer-ring{position:relative;width:40px;height:40px;flex:none;display:flex;align-items:center;justify-content:center;}
.timer-ring svg{width:40px;height:40px;transform:scaleX(-1);}
.timer-ring .tr-bg{fill:none;stroke:var(--paper-deep);stroke-width:3.4;}
.timer-ring .tr-fg{fill:none;stroke:var(--gold);stroke-width:3.4;stroke-linecap:round;}
.timer-ring.is-low .tr-fg{stroke:var(--danger);}
.timer-ring.is-low{animation:rs-timer-pulse .6s ease-in-out infinite;}
@keyframes rs-timer-pulse{0%,100%{transform:scale(1);}50%{transform:scale(1.08);}}
.timer-num{position:absolute;font-size:11px;font-weight:800;color:var(--ink);}

/* ---------- Category intro corners + sparkles + extra motion ---------- */
.cat-corner{
  position:absolute;width:34px;height:34px;z-index:2;
  border:2px solid var(--cat-color, var(--gold));
  opacity:0;
}
.cat-intro.is-visible .cat-corner{
  animation:rs-corner-in .5s cubic-bezier(.19,1,.22,1) forwards;
}
.cat-corner.tl{top:14px;right:14px;border-bottom:none;border-left:none;--tx:14px;--ty:-14px;}
.cat-corner.tr{top:14px;left:14px;border-bottom:none;border-right:none;--tx:-14px;--ty:-14px;}
.cat-corner.bl{bottom:14px;right:14px;border-top:none;border-left:none;--tx:14px;--ty:14px;}
.cat-corner.br{bottom:14px;left:14px;border-top:none;border-right:none;--tx:-14px;--ty:14px;}
.cat-intro.is-visible .cat-corner.tr{animation-delay:.08s;}
.cat-intro.is-visible .cat-corner.bl{animation-delay:.16s;}
.cat-intro.is-visible .cat-corner.br{animation-delay:.24s;}
@keyframes rs-corner-in{
  0%{opacity:0;transform:scale(.4) translate(var(--tx,0),var(--ty,0));}
  100%{opacity:1;transform:scale(1) translate(0,0);}
}

.cat-intro-sparkles{position:absolute;inset:0;overflow:hidden;pointer-events:none;border-radius:var(--radius-lg);}
.cat-spark{
  position:absolute;bottom:20%;border-radius:50%;
  opacity:0;
  animation-name:rs-spark-rise;
  animation-timing-function:ease-out;
  animation-fill-mode:forwards;
}
@keyframes rs-spark-rise{
  0%{opacity:0;transform:translateY(0) scale(.4);}
  15%{opacity:1;}
  100%{opacity:0;transform:translateY(-160px) scale(1.1);}
}

.cat-intro-count{
  position:relative;z-index:1;font-size:11px;font-weight:700;letter-spacing:.18em;
  color:var(--cat-color, var(--gold-dark));opacity:.75;margin-bottom:4px;
}
.cat-intro-rule{
  position:relative;z-index:1;width:0;height:2px;margin:10px 0;
  background:linear-gradient(90deg, transparent, var(--cat-color, var(--gold)), transparent);
  animation:rs-rule-grow 1s cubic-bezier(.19,1,.22,1) .35s forwards;
}
@keyframes rs-rule-grow{from{width:0;}to{width:120px;}}

.cat-intro-name{
  animation:rs-track-in .8s cubic-bezier(.19,1,.22,1) both;
}
@keyframes rs-track-in{
  0%{opacity:0;letter-spacing:.5em;filter:blur(6px);transform:translateY(6px);}
  100%{opacity:1;letter-spacing:normal;filter:blur(0);transform:translateY(0);}
}
.cat-intro-tagline{animation:rs-fade-up .6s ease .5s both;}
.cat-intro-badge{animation:rs-fade-up .6s cubic-bezier(.34,1.56,.64,1) .7s both;}
@keyframes rs-fade-up{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}

.cat-intro.is-leaving{
  transform:scale(1.04);opacity:0;
  transition:opacity .38s ease, transform .38s cubic-bezier(.5,0,.75,0);
}

/* ---------- Category-completed seal celebration ---------- */
.cat-badge{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  text-align:center;min-height:320px;padding:20px;border-radius:var(--radius-lg);
  position:relative;overflow:hidden;
  background:radial-gradient(420px 260px at 50% 15%, var(--cat-color-soft, var(--gold-pale)), transparent 70%), var(--white);
  border:1.5px solid var(--cat-color-soft, var(--line));
  opacity:0;transform:scale(.94);
  transition:opacity .3s ease, transform .3s cubic-bezier(.19,1,.22,1);
}
.cat-badge.is-visible{opacity:1;transform:scale(1);}
.cat-badge-glow{
  position:absolute;inset:-30%;
  background:conic-gradient(from 90deg, transparent, var(--cat-color, var(--gold)), transparent 25%);
  opacity:.12;animation:rs-cat-spin 7s linear infinite;
}
.cat-badge-seal{
  position:relative;z-index:1;width:88px;height:88px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(150deg, var(--cat-color, var(--gold)), var(--gold-dark));
  color:#fff;font-size:38px;font-weight:800;
  box-shadow:0 16px 30px -10px rgba(0,0,0,0.35), 0 0 0 6px rgba(255,255,255,0.5) inset;
  animation:rs-seal-stamp .55s cubic-bezier(.2,1.4,.4,1) both;
}
@keyframes rs-seal-stamp{
  0%{transform:scale(2.4) rotate(-18deg);opacity:0;}
  60%{transform:scale(.92) rotate(4deg);opacity:1;}
  100%{transform:scale(1) rotate(0);}
}
.cat-badge-title{position:relative;z-index:1;font-size:12px;font-weight:700;letter-spacing:.1em;color:var(--taupe);margin-top:6px;text-transform:uppercase;}
.cat-badge-name{position:relative;z-index:1;font-size:24px;color:var(--ink);margin:0;}
.cat-badge-stat{position:relative;z-index:1;font-size:14px;color:var(--cat-color, var(--gold-dark));font-weight:700;}

@media (prefers-reduced-motion:reduce){
  .cat-corner, .cat-spark, .cat-intro-rule, .cat-intro-name, .cat-intro-tagline,
  .cat-intro-badge, .cat-badge-seal, .cat-badge-glow, .timer-ring.is-low{
    animation:none !important;
  }
}

@media (max-width:640px){
  .quiz-top-right{gap:6px;}
  .tickets-chip{padding:6px 10px;font-size:12px;}
  .cat-badge-name{font-size:20px;}
}

/* =========================================================
   Prizes v2 — bigger, more enticing cards + featured hero +
   spotlight lightbox + favorites + odds indicator
   ========================================================= */

.prizes-countdown-bar{
  display:flex;align-items:center;justify-content:center;gap:10px;
  background:linear-gradient(90deg, var(--ink) 0%, var(--ink-deep) 100%);
  color:var(--gold-pale);border-radius:var(--radius);
  padding:12px 20px;margin-bottom:24px;font-size:13px;font-weight:700;
  border:1px solid var(--gold-dark);
}
.pcb-icon{font-size:15px;}

/* ---------- Featured hero prize ---------- */
.featured-prize{
  display:grid;grid-template-columns:1.1fr 1fr;overflow:hidden;
  margin-bottom:28px;background:var(--ivory);
}
.featured-media{position:relative;min-height:320px;overflow:hidden;}
.featured-media img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.19,1,.22,1);}
.featured-prize:hover .featured-media img{transform:scale(1.06);}
.featured-tag{
  position:absolute;top:18px;right:18px;z-index:2;background:var(--rose);color:#fff;
  font-size:12.5px;font-weight:700;padding:7px 16px;border-radius:var(--radius);
  box-shadow:0 8px 18px -8px rgba(0,0,0,0.4);
}
.featured-body{padding:32px 34px;display:flex;flex-direction:column;justify-content:center;gap:10px;}
.featured-kicker{font-size:12px;font-weight:700;color:var(--gold-dark);letter-spacing:.06em;}
.featured-body h3{font-family:var(--font-display);font-size:28px;color:var(--ink);}
.featured-body p{font-size:14.5px;color:var(--taupe);line-height:1.7;margin-bottom:6px;}

/* ---------- Bigger catalog grid ---------- */
.catalog-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px;}
.gift-card{overflow:hidden;display:flex;flex-direction:column;background:var(--ivory);
  transition:transform .3s cubic-bezier(.19,1,.22,1), box-shadow .3s ease;}
.gift-card:hover{transform:translateY(-6px);box-shadow:0 26px 50px -18px rgba(43,36,32,0.32);}
.gift-media, .gift-media-lg{aspect-ratio:16/11;position:relative;overflow:hidden;
  border-radius:var(--radius-lg) var(--radius-lg) 0 0;cursor:pointer;}
.gift-media img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.19,1,.22,1);}
.gift-card:hover .gift-media img{transform:scale(1.08);}
.gift-media .left-tag{position:absolute;top:14px;right:14px;z-index:2;background:var(--rose);color:#fff;font-size:11.5px;font-weight:700;padding:6px 14px;border-radius:7px;}
.gift-body{padding:22px 24px 24px;flex:1;display:flex;flex-direction:column;}
.gift-body h4{font-size:18px;color:var(--ink);margin-bottom:8px;}
.gift-body p{font-size:13px;color:var(--taupe);margin-bottom:16px;flex:1;line-height:1.6;}

.qty-row{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;}
.qty-control{display:flex;align-items:center;gap:10px;background:var(--paper);border-radius:var(--radius);padding:6px 10px;border:1px solid var(--line);}
.qty-control button{width:28px;height:28px;border-radius:50%;border:none;background:var(--gold-pale);color:var(--ink);font-weight:700;font-size:16px;line-height:1;transition:background .2s ease;}
.qty-control button:hover{background:var(--gold);color:#fff;}
.qty-control span{min-width:20px;text-align:center;font-weight:700;font-size:15px;}
.qty-control span.qty-pop{animation:rs-score-pop .4s cubic-bezier(.34,1.56,.64,1);}
.entries-note{font-size:11px;color:var(--taupe);margin-top:8px;}
.odds-note{font-size:12px;color:var(--gold-dark);margin-top:12px;font-weight:600;line-height:1.5;}

/* ---------- Favorite heart ---------- */
.fav-btn{
  position:absolute;top:14px;left:14px;z-index:3;width:36px;height:36px;border-radius:50%;
  background:rgba(255,253,248,0.92);border:none;font-size:16px;display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 14px -6px rgba(0,0,0,0.35);transition:transform .2s cubic-bezier(.34,1.56,.64,1);
}
.fav-btn:hover{transform:scale(1.14);}
.fav-btn:active{transform:scale(.9);}
.fav-btn-lg{width:44px;height:44px;font-size:19px;top:18px;left:18px;}

/* ---------- Zoom hint on hover ---------- */
.media-zoom-hint{
  position:absolute;bottom:12px;left:14px;z-index:2;
  background:rgba(28,23,18,0.72);color:#fff;font-size:11px;font-weight:600;
  padding:6px 12px;border-radius:var(--radius);
  opacity:0;transform:translateY(6px);transition:all .25s ease;
  pointer-events:none;
}
.gift-media:hover .media-zoom-hint, .featured-media:hover .media-zoom-hint{opacity:1;transform:translateY(0);}

/* ---------- Bigger illustration medallions ---------- */
.gift-media-lg .ill-medal{width:110px;height:110px;}
.gift-media-lg .ill-medal svg{width:50px;height:50px;}
.ill-medal-xl{width:150px;height:150px;}
.ill-medal-xl svg{width:66px;height:66px;}

/* ---------- Quick "allocate all" buttons ---------- */
.allocate-all-btn{
  background:var(--ink);color:var(--gold-pale);border:1px solid var(--gold-dark);
  padding:11px 18px;border-radius:var(--radius);font-size:12.5px;font-weight:700;
  transition:all .2s ease;flex:none;
}
.allocate-all-btn:hover{background:var(--ink-deep);}
.allocate-all-sm{width:100%;margin-top:12px;padding:9px 14px;font-size:12px;}

/* ---------- Spotlight lightbox ---------- */
.spotlight-modal{max-width:640px;padding:0;overflow:hidden;}
.spotlight-media{aspect-ratio:16/9;position:relative;overflow:hidden;}
.spotlight-media img{width:100%;height:100%;object-fit:cover;}
.spotlight-body{padding:26px 30px 30px;}
.spotlight-tag{
  display:inline-flex;background:var(--rose);color:#fff;font-size:11.5px;font-weight:700;
  padding:5px 13px;border-radius:var(--radius);margin-bottom:10px;
}
.spotlight-body h3{font-family:var(--font-display);font-size:24px;color:var(--ink);margin-bottom:6px;}
.spotlight-modal .modal-close{
  background:rgba(255,253,248,0.9);width:34px;height:34px;border-radius:50%;
  top:14px;left:14px;z-index:4;box-shadow:0 6px 14px -6px rgba(0,0,0,0.4);
}

@media (max-width:900px){
  .featured-prize{grid-template-columns:1fr;}
  .featured-media{min-height:240px;}
  .catalog-grid{grid-template-columns:1fr;}
}

/* ---------- Site-wide scroll progress bar ---------- */
.scroll-progress{
  position:fixed;top:0;right:0;height:3px;width:0%;z-index:300;
  background:linear-gradient(90deg,var(--gold-light),var(--gold),var(--rose));
  box-shadow:0 0 8px rgba(176,138,62,0.6);
  transition:width .1s linear;
}
@media (prefers-reduced-motion:reduce){.scroll-progress{transition:none;}}

/* =========================================================
   Results page — medal badge, category mastery, tip card
   ========================================================= */
.medal-badge{
  position:relative;width:96px;height:96px;margin:0 auto 14px;
  display:flex;align-items:center;justify-content:center;
  animation:rs-seal-stamp .6s cubic-bezier(.2,1.4,.4,1) both;
}
.medal-glow{
  position:absolute;inset:-14px;border-radius:50%;
  background:radial-gradient(circle, var(--gold-glow), transparent 70%);
  animation:rs-coin-glow 2.6s ease-in-out infinite;
}
.medal-icon{position:relative;z-index:1;font-size:58px;filter:drop-shadow(0 10px 16px rgba(0,0,0,0.25));}
.medal-badge.medal-platinum .medal-glow{background:radial-gradient(circle, rgba(180,210,255,0.55), transparent 70%);}
.medal-badge.medal-bronze .medal-glow{background:radial-gradient(circle, rgba(200,140,90,0.4), transparent 70%);}

.cat-mastery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.cat-mastery-card{padding:20px 22px;}
.cm-top{display:flex;align-items:center;gap:11px;margin-bottom:12px;}
.cm-icon{
  width:34px;height:34px;border-radius:50%;flex-shrink:0;
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--paper);border:1px solid var(--line);
}
.cm-icon svg{width:17px;height:17px;stroke:var(--cat-color,var(--gold-dark));fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
.cm-name{font-size:14.5px;font-weight:700;color:var(--ink);}
.cm-track{height:8px;border-radius:var(--radius);background:var(--paper-deep);overflow:hidden;margin-bottom:8px;}
.cm-fill{height:100%;border-radius:var(--radius);background:linear-gradient(90deg,var(--cat-color,var(--gold)),var(--cat-color,var(--gold-dark)));width:0%;transition:width 1s cubic-bezier(.19,1,.22,1);}
.cm-stat{font-size:12px;color:var(--taupe);font-weight:600;}

.tip-card h3{font-size:15px;color:var(--ink);margin-bottom:8px;}
.tip-card p{font-size:13.5px;color:var(--taupe);line-height:1.7;}

@media (max-width:900px){
  .cat-mastery-grid{grid-template-columns:1fr;}
}

/* =========================================================
   Dashboard — achievement badges + favorites preview
   ========================================================= */
.badges-row{display:flex;flex-wrap:wrap;gap:10px;margin:-8px 0 26px;}
.badge-pill-lg{
  display:inline-flex;align-items:center;gap:8px;
  padding:9px 16px;border-radius:var(--radius);font-size:12.5px;font-weight:700;
  border:1.5px solid var(--line);transition:all .2s ease;
}
.badge-pill-lg.is-unlocked{
  background:linear-gradient(135deg,var(--gold-pale),var(--gold-light));
  color:var(--ink-deep);border-color:var(--gold);
  box-shadow:0 8px 16px -8px rgba(176,138,62,0.5);
}
.badge-pill-lg.is-locked{background:var(--paper-deep);color:var(--taupe);opacity:.55;filter:grayscale(.6);}
.bpl-icon{font-size:15px;}

.fav-mini-row{
  display:flex;align-items:center;gap:10px;padding:10px 4px;
  border-bottom:1px solid var(--line);font-size:13px;color:var(--ink);font-weight:600;
  transition:opacity .2s ease;
}
.fav-mini-row:last-child{border-bottom:none;}
.fav-mini-row:hover{opacity:.7;}
.fmr-icon{display:inline-flex;}
.fmr-icon svg{width:16px;height:16px;fill:none;stroke:var(--gold-dark);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}

/* =========================================================
   Prizes v3 — toolbar/filter, allocation distribution, skeletons
   ========================================================= */
.alloc-distribution-panel{margin-bottom:22px;}
.ad-empty{font-size:12.5px;color:var(--taupe);}
.ad-bar{display:flex;height:12px;border-radius:var(--radius);overflow:hidden;background:var(--paper-deep);margin-bottom:10px;}
.ad-seg{height:100%;transition:width .5s cubic-bezier(.19,1,.22,1);}
.ad-legend{display:flex;flex-wrap:wrap;gap:10px 16px;}
.ad-legend-item{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--taupe);font-weight:600;}
.ad-dot{width:8px;height:8px;border-radius:50%;flex:none;}

.catalog-toolbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-bottom:18px;}
.catalog-toolbar-title{font-size:16px;color:var(--ink);font-family:var(--font-display);}
.fav-filter-btn{
  display:inline-flex;align-items:center;gap:6px;
  padding:9px 16px;border-radius:var(--radius);border:1.5px solid var(--line);
  background:var(--white);font-size:12.5px;font-weight:700;color:var(--ink);
  transition:all .2s ease;
}
.fav-filter-btn:hover{border-color:var(--rose);}
.fav-filter-btn.is-active{background:linear-gradient(135deg,var(--rose-pale),var(--rose-light));border-color:var(--rose);color:#7a352b;}
.catalog-empty{grid-column:1/-1;text-align:center;font-size:13.5px;color:var(--taupe);padding:40px 20px;}

/* ---------- Image skeleton shimmer ---------- */
.gift-media, .featured-media, .spotlight-media{background:var(--paper-deep);}
.gift-media img, .featured-media img, .spotlight-media img{opacity:0;transition:opacity .45s ease;}
.gift-media.img-loaded img, .featured-media.img-loaded img, .spotlight-media.img-loaded img{opacity:1;}
.gift-media:not(.img-loaded)::before,
.featured-media:not(.img-loaded)::before,
.spotlight-media:not(.img-loaded)::before{
  content:'';position:absolute;inset:0;z-index:1;
  background:linear-gradient(100deg, var(--paper-deep) 30%, var(--paper) 50%, var(--paper-deep) 70%);
  background-size:200% 100%;
  animation:rs-skeleton 1.3s ease-in-out infinite;
}
@keyframes rs-skeleton{
  0%{background-position:200% 0;}
  100%{background-position:-200% 0;}
}
@media (prefers-reduced-motion:reduce){
  .gift-media:not(.img-loaded)::before,
  .featured-media:not(.img-loaded)::before,
  .spotlight-media:not(.img-loaded)::before{animation:none;}
}

/* =========================================================
   Site-wide controls — dark theme, text size, misc extras
   ========================================================= */
.site-controls{
  position:fixed;bottom:26px;left:78px;z-index:250;
  display:flex;gap:8px;
}
.sc-btn{
  width:42px;height:42px;border-radius:50%;
  background:var(--white);border:1px solid var(--line);
  box-shadow:0 10px 22px -10px rgba(43,36,32,0.35);
  font-size:15px;font-weight:700;color:var(--ink);
  display:flex;align-items:center;justify-content:center;
  transition:transform .2s cubic-bezier(.34,1.56,.64,1);
}
.sc-btn:hover{transform:scale(1.1);}
.sc-btn:active{transform:scale(.92);}
@media (max-width:640px){
  .site-controls{left:auto;right:18px;bottom:70px;}
}

/* ---------- Text size ---------- */
html[data-fontsize="sm"] main{zoom:0.93;}
html[data-fontsize="lg"] main{zoom:1.12;}

/* ---------- Dark theme ---------- */
html[data-theme="dark"]{
  --ink:#F1E9D6;
  --ink-deep:#FBF7EE;
  --paper:#1E1811;
  --paper-deep:#261F16;
  --white:#241D16;
  --ivory:#2A2219;
  --line:#4a3c28;
  --taupe:#c9b98f;
  --text-gold:#E3C378;
}
html[data-theme="dark"] body{
  background:
    radial-gradient(1100px 620px at 50% -8%, rgba(60,48,26,0.55), transparent 62%),
    radial-gradient(900px 520px at 100% 15%, rgba(80,64,32,0.25), transparent 58%),
    radial-gradient(900px 600px at 0% 85%, rgba(60,48,26,0.3), transparent 60%),
    linear-gradient(180deg, #1E1811 0%, #221B13 40%, #16110B 100%);
  color:var(--text-gold);
}
html[data-theme="dark"] .card, html[data-theme="dark"] .q-card,
html[data-theme="dark"] .gift-card, html[data-theme="dark"] .featured-prize{
  box-shadow:0 20px 50px -20px rgba(0,0,0,0.55);
}
html[data-theme="dark"] .hero-bg{opacity:.35;}
html[data-theme="dark"] .sc-btn{background:var(--paper-deep);color:var(--gold-pale);}

/* ---------- Print-friendly results ---------- */
@media print{
  .topbar, .back-to-top, .site-controls, .scroll-progress, footer, #shareResultBtn, #confettiAgainBtn{display:none !important;}
  body{background:#fff !important;}
  .card{box-shadow:none !important;border:1px solid #ddd;}
}

/* ---------- Quiz ETA + keyboard hint ---------- */
.quiz-eta{font-size:12px;color:var(--taupe);font-weight:600;}
.kbd-hint{text-align:center;font-size:11px;color:var(--taupe);opacity:.65;margin-top:14px;}

/* ---------- Results — extra stats row + speed badge ---------- */
.extra-stats-row{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;max-width:520px;margin:0 auto;}
.extra-stat-card{padding:22px;text-align:center;}
.esc-icon{font-size:24px;margin-bottom:8px;}
.esc-n{font-size:26px;font-weight:700;color:var(--ink);font-family:var(--font-display);}
.esc-l{font-size:12px;color:var(--taupe);margin-top:4px;}
.ri-speed{font-size:11px;color:var(--gold-dark);font-weight:700;margin-right:6px;}
@media (max-width:640px){.extra-stats-row{grid-template-columns:1fr;}}

/* =========================================================
   Dashboard v2 — name edit, referral code, consent toggle, danger zone
   ========================================================= */
.edit-name-btn{
  background:none;border:none;font-size:16px;cursor:pointer;opacity:.55;
  vertical-align:middle;transition:opacity .2s ease;
}
.edit-name-btn:hover{opacity:1;}
.edit-name-row{display:flex;gap:8px;margin-top:10px;align-items:center;}
.edit-name-row.is-hidden{display:none;}
.edit-name-row input{
  padding:9px 14px;border-radius:var(--radius);border:1px solid var(--line);
  font-family:inherit;font-size:13.5px;background:var(--white);color:var(--ink);
}

.ref-code-row{
  display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;
  font-size:12.5px;color:var(--taupe);margin-bottom:14px;
}
.ref-code-row strong{color:var(--ink);letter-spacing:.04em;}

.consent-toggle-row{display:flex;align-items:center;justify-content:space-between;gap:14px;cursor:pointer;font-size:13px;color:var(--ink);}
.toggle-switch{
  flex:none;width:44px;height:24px;border-radius:var(--radius);background:var(--paper-deep);
  border:1px solid var(--line);position:relative;transition:background .25s ease;
}
.toggle-switch .ts-knob{
  position:absolute;top:2px;right:2px;width:18px;height:18px;border-radius:50%;
  background:var(--white);box-shadow:0 2px 6px rgba(0,0,0,0.25);
  transition:transform .25s cubic-bezier(.34,1.56,.64,1);
}
.toggle-switch.is-on{background:var(--gold);border-color:var(--gold-dark);}
.toggle-switch.is-on .ts-knob{transform:translateX(-20px);}

.danger-panel{border:1px solid rgba(182,91,74,0.35);}
.btn-danger{color:var(--danger);border-color:var(--danger);}
.btn-danger:hover{background:var(--danger);color:#fff;}

/* ---------- Catalog toolbar actions group ---------- */
.catalog-toolbar-actions{display:flex;gap:10px;flex-wrap:wrap;}

/* =========================================================
   Index — FAQ search + returning-visitor welcome banner
   ========================================================= */
.faq-search-box{
  display:flex;align-items:center;gap:10px;max-width:420px;margin:0 auto 22px;
  background:var(--white);border:1.5px solid var(--line);border-radius:var(--radius);
  padding:11px 18px;
}
.faq-search-icon{font-size:14px;opacity:.6;}
.faq-search-box input{
  flex:1;border:none;background:transparent;font-family:inherit;font-size:13.5px;color:var(--ink);
}
.faq-search-box input:focus{outline:none;}
.accordion-item.is-hidden{display:none;}
.faq-empty{text-align:center;font-size:13px;color:var(--taupe);padding:20px 0 4px;}
.faq-empty.is-hidden{display:none;}

.welcome-back-banner{
  display:inline-flex;align-items:center;gap:8px;
  background:linear-gradient(135deg,var(--gold-pale),var(--gold-light));
  color:var(--ink-deep);border:1px solid var(--gold);
  padding:10px 18px;border-radius:var(--radius);
  font-size:13px;font-weight:700;margin-bottom:16px;
  animation:rs-fade-up .5s ease both;
}

/* ---------- Luxurious page-transition before leaving to the shop ---------- */

.shop-transition-overlay{
  position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:0;
}
.shop-transition-overlay.active{opacity:1;pointer-events:all;}
.stx-panel{
  position:absolute;left:0;right:0;height:52%;
  background:linear-gradient(180deg, var(--ink) 0%, var(--ink-deep) 100%);
}
.stx-panel.top{top:0;transform:translateY(-100%);border-bottom:1px solid var(--gold);box-shadow:0 6px 30px rgba(176,138,62,0.25);}
.stx-panel.bottom{bottom:0;transform:translateY(100%);border-top:1px solid var(--gold);box-shadow:0 -6px 30px rgba(176,138,62,0.25);}
.shop-transition-overlay.active .stx-panel.top,
.shop-transition-overlay.active .stx-panel.bottom{
  transform:translateY(0);
  transition:transform .6s cubic-bezier(.7,0,.3,1);
}
.stx-flash{
  position:absolute;top:50%;left:50%;width:6px;height:6px;border-radius:50%;
  transform:translate(-50%,-50%) scale(0);opacity:0;
  background:radial-gradient(circle, #fff 0%, var(--gold-light) 25%, var(--gold) 50%, transparent 72%);
  filter:blur(0.5px);
}
.shop-transition-overlay.active .stx-flash{
  animation:rs-stx-flash .75s .48s cubic-bezier(.16,1,.3,1) forwards;
}
@keyframes rs-stx-flash{
  0%{transform:translate(-50%,-50%) scale(0);opacity:0;}
  35%{opacity:1;}
  100%{transform:translate(-50%,-50%) scale(220);opacity:0;}
}
.stx-center{
  position:absolute;top:50%;left:50%;text-align:center;
  transform:translate(-50%,-50%);opacity:0;width:100%;padding:0 20px;
}
.shop-transition-overlay.active .stx-center{
  opacity:1;transition:opacity .5s .62s ease;
}
.stx-center .stx-line{
  display:block;width:46px;height:1px;background:var(--gold);margin:0 auto 14px;
  transform:scaleX(0);transform-origin:center;
}
.shop-transition-overlay.active .stx-center .stx-line{
  transform:scaleX(1);transition:transform .5s .7s cubic-bezier(.65,0,.35,1);
}
.stx-center p{
  margin:0;color:var(--gold-light);font-weight:600;font-size:15px;
  letter-spacing:0.14em;text-transform:uppercase;
  text-shadow:0 2px 14px rgba(0,0,0,0.5);
}
@media (prefers-reduced-motion:reduce){
  .shop-transition-overlay, .stx-panel, .stx-flash, .stx-center, .stx-center .stx-line{transition:none !important;animation:none !important;}
  .shop-transition-overlay.active{opacity:1;}
  .shop-transition-overlay.active .stx-panel.top,
  .shop-transition-overlay.active .stx-panel.bottom{transform:translateY(0);}
}
