:root{
  --text:#111427;
  --muted:#5b6478;
  --orange:#ff7a00;
  --orange2:#ff9d22;
  --pink:#ff2f7d;
  --pink2:#ff5a4d;
  --cream:#fff8f3;
  --line:rgba(255,122,0,.16);
  --shadow:0 18px 48px rgba(72,24,7,.10);
  --shadow2:0 24px 70px rgba(102,28,12,.13);
  --radius:28px;
}
*{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--text);background:radial-gradient(circle at 10% 0%,rgba(255,122,0,.13),transparent 26%),radial-gradient(circle at 100% 0%,rgba(255,47,125,.12),transparent 24%),linear-gradient(180deg,#fffcf8 0%,#fff7f0 100%)}button,a{font:inherit}button{border:0}a{text-decoration:none;color:inherit}.page{width:min(1160px,calc(100% - 18px));margin:10px auto 26px}.hero,.quiz-card,.results-card,.benefits article{background:rgba(255,255,255,.88);border:1px solid rgba(255,255,255,.86);box-shadow:var(--shadow);backdrop-filter:blur(12px)}
.hero{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(330px,.82fr);gap:18px;align-items:center;overflow:hidden;border-radius:var(--radius);padding:28px 28px 22px}.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:linear-gradient(90deg,var(--orange),var(--pink));color:#fff;font-size:14px;font-weight:900;letter-spacing:.02em;box-shadow:0 10px 24px rgba(255,72,56,.18)}.icon-bolt{width:14px;height:18px;display:inline-block;background:#fff;clip-path:polygon(45% 0,100% 0,62% 38%,95% 38%,35% 100%,50% 55%,12% 55%)}h1{margin:18px 0 0;font-size:clamp(48px,6vw,82px);line-height:.96;letter-spacing:-.08em}h1 span{display:block;background:linear-gradient(90deg,var(--orange),var(--pink));-webkit-background-clip:text;background-clip:text;color:transparent}.hero p{max-width:520px;margin:18px 0 0;color:#31384d;font-size:19px;line-height:1.45}.badges{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.badges span{display:inline-flex;align-items:center;gap:8px;padding:11px 14px;border-radius:15px;background:#fff;border:1px solid var(--line);font-weight:800;color:#252d40}.mini{width:18px;height:18px;display:inline-block}.mini.gift{background:linear-gradient(145deg,var(--orange),var(--pink));border-radius:4px;position:relative}.mini.gift:before{content:"";position:absolute;left:7px;top:0;width:4px;height:18px;background:#ffe08a}.mini.slot{border-radius:5px;background:linear-gradient(145deg,#331022,var(--pink));position:relative}.mini.slot:after{content:"7";position:absolute;inset:1px;display:grid;place-items:center;color:#fff;font-weight:900;font-size:13px}.hero-svg{width:100%;max-width:490px;justify-self:end;filter:drop-shadow(0 20px 38px rgba(255,92,30,.14))}.quiz-grid{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:16px;margin-top:16px;align-items:start}.quiz-card{border-radius:var(--radius);padding:14px}.quiz-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:4px 4px 10px}.quiz-top strong{font-size:15px}.dots{color:#8a8fa0}.back-btn{width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,rgba(255,122,0,.10),rgba(255,47,125,.10));color:#4b1821;cursor:pointer}.back-btn:disabled{opacity:.36;cursor:default}.progress-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--muted);font-size:13px;font-weight:800;padding:4px 4px 0}.progress{height:10px;margin:8px 4px 0;border-radius:999px;background:#f1e6df;overflow:hidden}.progress>div{width:20%;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--orange),var(--pink));transition:width .22s ease}.quiz-body{padding:18px 4px 4px}.question-kicker{margin:0 0 8px;color:var(--orange);font-size:12px;font-weight:900;letter-spacing:.04em;text-transform:uppercase}.question-title{margin:0;font-size:30px;line-height:1.06;letter-spacing:-.045em}.question-helper{margin:10px 0 16px;color:var(--muted);line-height:1.45}.options{display:grid;gap:10px}.option{width:100%;min-height:70px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border-radius:18px;border:1px solid var(--line);background:rgba(255,255,255,.95);text-align:left;color:var(--text);cursor:pointer;transition:.16s ease}.option:hover{transform:translateY(-1px);border-color:rgba(255,47,125,.32);box-shadow:0 10px 22px rgba(62,17,11,.08)}.option.selected{border-color:rgba(255,47,125,.52);box-shadow:0 0 0 3px rgba(255,47,125,.10);background:linear-gradient(180deg,#fff,#fff7f6)}.option-main{display:flex;align-items:center;gap:12px;min-width:0}.option-icon{width:44px;height:44px;flex:0 0 44px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(145deg,#fff7ef,#fff0f5);border:1px solid rgba(255,122,0,.13)}.option-icon svg{width:28px;height:28px;display:block}.option strong{display:block;font-size:16px;line-height:1.22}.option-radio{width:20px;height:20px;flex:0 0 20px;border-radius:50%;border:2px solid #d8d5df}.option.selected .option-radio{border-color:var(--pink);background:radial-gradient(circle,var(--pink) 0 45%,transparent 46%)}.tap-note{text-align:center;padding:10px 4px 4px;color:#7b8191;font-size:13px}.results-card{border-radius:var(--radius);padding:16px;background:linear-gradient(180deg,rgba(42,6,31,.96),rgba(28,6,35,.97));color:#fff}.result-head{padding:6px 2px 14px}.result-head h2,.locked h2{margin:0;font-size:34px;line-height:1.04;letter-spacing:-.05em}.result-head h2 span,.locked h2 span{color:#ffb45d}.result-head p,.locked p{margin:10px 0 0;color:rgba(255,255,255,.82);line-height:1.45}.locked-box{margin-top:12px;padding:20px;border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.10)}.locked-icon{width:70px;height:70px;border-radius:22px;margin-bottom:14px;display:grid;place-items:center;background:linear-gradient(145deg,var(--orange),var(--pink))}.locked-icon svg{width:42px;height:42px}.locked-list{display:grid;gap:10px;margin-top:16px}.locked-list span{display:flex;align-items:center;gap:10px;color:rgba(255,255,255,.92);font-weight:700}.locked-list span:before{content:"✓";width:20px;height:20px;display:grid;place-items:center;border-radius:50%;background:rgba(255,255,255,.14);color:#ffc978;font-size:12px}.offer-list{display:grid;gap:12px;margin-top:12px}.offer{display:grid;grid-template-columns:62px 1fr auto;gap:12px;padding:12px;border-radius:18px;background:#fff;color:var(--text)}.offer-logo{width:62px;height:62px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(145deg,#19021e,#4c0f34 55%,#ff7a00)}.offer-logo svg{width:38px;height:38px}.offer-tag{display:inline-block;margin-bottom:6px;padding:5px 10px;border-radius:999px;background:linear-gradient(90deg,rgba(255,122,0,.14),rgba(255,47,125,.14));color:#a83f00;font-size:11px;font-weight:900;text-transform:uppercase}.offer h4{margin:0;font-size:19px}.offer-bonus{margin:7px 0 0;font-weight:800;color:#2d3344}.offer-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.offer-meta span{font-size:12px;color:#5d6376;font-weight:700}.offer-cta{align-self:center;white-space:nowrap;padding:14px 16px;border-radius:14px;background:linear-gradient(135deg,var(--orange),var(--pink));color:#fff;font-weight:900}.footer-note{display:flex;align-items:center;gap:10px;margin-top:14px;padding:14px 12px 4px;color:rgba(255,255,255,.82);font-size:13px}.footer-note svg{width:22px;height:22px}.benefits{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:16px}.benefits article{border-radius:22px;padding:15px;display:flex;align-items:flex-start;gap:12px}.benefit-svg{width:46px;height:46px;flex:0 0 46px;border-radius:14px;background:linear-gradient(145deg,#fff7ef,#fff0f5);display:grid;place-items:center}.benefit-svg svg{width:30px;height:30px}.benefits h3{margin:3px 0 6px;font-size:16px}.benefits p{margin:0;color:#656d80;line-height:1.4;font-size:14px}
@media(max-width:1024px){.hero,.quiz-grid,.benefits{grid-template-columns:1fr}.hero-svg{justify-self:center}.results-card{order:2}}
@media(max-width:680px){.page{width:calc(100% - 8px);margin:4px auto 14px}.hero{grid-template-columns:minmax(0,1fr) 120px;gap:6px;padding:12px;border-radius:20px;min-height:168px}.eyebrow{padding:7px 10px;font-size:10px}.hero-copy h1{margin-top:8px;font-size:25px;line-height:.95;letter-spacing:-.065em;max-width:235px}.hero p{margin-top:8px;font-size:12px;line-height:1.32;max-width:238px}.badges{margin-top:8px;gap:6px}.badges span{padding:6px 8px;border-radius:10px;font-size:10px}.hero-svg{width:158px;max-width:none;transform:translateX(-9px);filter:drop-shadow(0 10px 18px rgba(255,92,30,.12))}.quiz-grid{margin-top:8px;gap:10px}.quiz-card{padding:10px;border-radius:20px;box-shadow:0 14px 38px rgba(43,11,5,.10)}.quiz-top{padding:2px 2px 8px}.quiz-top strong{font-size:14px}.back-btn{width:36px;height:36px}.progress-meta{font-size:12px;padding:3px 2px 0}.progress{height:9px;margin:7px 2px 0}.quiz-body{padding:12px 2px 2px}.question-kicker{margin-bottom:7px;font-size:11px}.question-title{font-size:22px;line-height:1.05}.question-helper{margin:8px 0 12px;font-size:13px;line-height:1.38}.options{gap:8px}.option{min-height:56px;padding:8px 9px;border-radius:15px}.option-icon{width:36px;height:36px;flex-basis:36px;border-radius:12px}.option-icon svg{width:24px;height:24px}.option strong{font-size:14px}.option-radio{width:18px;height:18px;flex-basis:18px}.tap-note{padding:7px 4px 2px;font-size:12px}.results-card{padding:10px;border-radius:20px}.locked .result-head{display:none}.locked-box{margin-top:0;padding:14px;border-radius:18px}.locked-icon{width:48px;height:48px;margin-bottom:10px;border-radius:16px}.locked-icon svg{width:30px;height:30px}.locked h2{font-size:21px}.locked p{font-size:13px;line-height:1.4}.locked-list{display:none}.result-head h2{font-size:26px}.offer{grid-template-columns:54px 1fr}.offer-logo{width:54px;height:54px}.offer-cta{grid-column:1/-1;text-align:center}.benefits{grid-template-columns:repeat(2,1fr);gap:8px;margin-top:10px}.benefits article{padding:10px;border-radius:16px;gap:9px}.benefit-svg{width:38px;height:38px;flex-basis:38px;border-radius:12px}.benefit-svg svg{width:24px;height:24px}.benefits h3{margin:2px 0 4px;font-size:13px}.benefits p{font-size:11px;line-height:1.3}.badges span:nth-child(3){display:none}}
@media(max-width:390px){.hero{grid-template-columns:minmax(0,1fr) 108px;padding:10px}.hero-copy h1{font-size:23px;max-width:218px}.hero p{font-size:11.5px;max-width:218px}.hero-svg{width:142px;transform:translateX(-12px)}.question-title{font-size:20px}}

.option-icon > span,
.offer-logo > span {
  font-size: 26px;
  line-height: 1;
}

.quiz-uploaded-logo {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: inherit;
}

.benefit-emoji {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  flex: 0 0 46px;
  border-radius: 14px;
  background: linear-gradient(145deg,#fff7ef,#fff0f5);
  font-size: 25px;
}

.quiz-legal {
  margin: 16px auto 0;
  padding: 8px 12px;
  color: #656d80;
  font-size: 12px;
  line-height: 1.5;
  text-align: center;
}

@media(max-width:680px) {
  .benefit-emoji {
    width: 38px;
    height: 38px;
    flex-basis: 38px;
    border-radius: 12px;
    font-size: 21px;
  }
}

.quiz-person-icon {
  width: 28px;
  height: 28px;
  display: block;
  color: var(--pink);
  filter: drop-shadow(0 6px 12px rgba(255, 47, 125, .18));
}

.quiz-person-icon__halo {
  fill: rgba(255, 47, 125, .10);
  stroke: rgba(255, 122, 0, .58);
  stroke-width: 1.4;
}

.quiz-person-icon__head {
  fill: currentColor;
}

.quiz-person-icon__body {
  fill: none;
  stroke: currentColor;
  stroke-width: 3;
  stroke-linecap: round;
}

.hero-art {
  position: relative;
  width: 100%;
  max-width: 490px;
  aspect-ratio: 420 / 300;
  justify-self: end;
}

@keyframes heroFloaty {
  0%, 100% { transform: translateY(0) rotate(-6deg); }
  50% { transform: translateY(-10px) rotate(6deg); }
}

.art-piece {
  position: absolute;
  display: block;
  width: 100%;
  -webkit-mask-image: radial-gradient(closest-side, #000 72%, transparent 100%);
  mask-image: radial-gradient(closest-side, #000 72%, transparent 100%);
}

.art-piece.floating {
  animation: heroFloaty 4.2s ease-in-out infinite;
}

.art-slot {
  z-index: 4;
  width: 88%;
  right: -3%;
  top: 2%;
  filter: drop-shadow(0 20px 30px rgba(79, 30, 0, .28)) drop-shadow(0 0 26px rgba(255, 205, 74, .24));
}

.art-chips {
  z-index: 5;
  width: 44%;
  left: 0;
  bottom: -5%;
  filter: drop-shadow(0 16px 22px rgba(6, 20, 51, .2));
}

.art-coins {
  z-index: 6;
  width: 32%;
  left: -5%;
  top: -2%;
  filter: drop-shadow(0 10px 16px rgba(214, 125, 0, .24));
}

.art-freespins {
  z-index: 6;
  width: 23%;
  right: 6%;
  top: -10%;
  filter: drop-shadow(0 12px 18px rgba(214, 90, 0, .28));
  animation-delay: -.6s;
}

.art-scatter {
  z-index: 6;
  width: 20%;
  left: 34%;
  top: 64%;
  filter: drop-shadow(0 12px 18px rgba(214, 20, 110, .26));
  animation-delay: -1.6s;
}

.art-ticket {
  z-index: 6;
  width: 24%;
  right: -3%;
  bottom: -4%;
  filter: drop-shadow(0 12px 18px rgba(180, 10, 40, .28));
  animation-delay: -2.4s;
}

@media (max-width: 1024px) {
  .hero-art { justify-self: center; }
}

@media (max-width: 680px) {
  .hero-art { max-width: none; width: 120px; transform: translateX(-9px); }
}

@media (max-width: 390px) {
  .hero-art { width: 108px; transform: translateX(-12px); }
}

.offer h4 {
  font-size: 18px;
  line-height: 1.14;
  letter-spacing: -.02em;
}

.offer-bonus {
  font-size: 15px;
  line-height: 1.25;
}

@media(max-width:680px) {
  .offer {
    gap: 10px;
    padding: 10px;
  }

  .offer h4 {
    font-size: 16px;
    line-height: 1.14;
  }

  .offer-bonus {
    margin-top: 5px;
    font-size: 14px;
    line-height: 1.24;
  }

  .offer-tag {
    margin-bottom: 5px;
    padding: 4px 9px;
    font-size: 10px;
  }

  .offer-meta {
    gap: 6px 8px;
    margin-top: 8px;
  }

  .offer-meta span {
    font-size: 11px;
    line-height: 1.2;
  }
}