:root { --bg: #07070a; --panel: #111117; --line: rgba(212, 175, 55, .22); --gold: #d4af37; --gold-hi: #ffe8a3; --text: #ece9e1; --muted: #9b978c;
  --grad: linear-gradient(180deg, #fff3c4 0%, #f5d36b 35%, #d4af37 60%, #9a7b1c 100%); }
* { box-sizing: border-box; }
body { margin: 0; background: radial-gradient(1200px 600px at 80% -10%, #2a220b 0%, transparent 60%), var(--bg); color: var(--text); font: 16px/1.6 "Segoe UI", system-ui, sans-serif; }
a { color: var(--gold-hi); }
h1, h2, h3 { font-family: Bahnschrift, "Segoe UI", sans-serif; letter-spacing: .5px; line-height: 1.15; }
.gold { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
section, .top, .foot { max-width: 1100px; margin: 0 auto; padding: 0 24px; }
.top { display: flex; align-items: center; justify-content: space-between; padding-top: 18px; padding-bottom: 18px; }
.brand { display: flex; align-items: center; gap: 10px; text-decoration: none; font: 700 20px Bahnschrift, sans-serif; letter-spacing: 1px; }
.brand img { width: 40px; border-radius: 10px; }
nav { display: flex; align-items: center; gap: 18px; }
nav a { text-decoration: none; color: var(--text); }
.btn { display: inline-block; padding: 12px 22px; border-radius: 999px; background: var(--grad); color: #141005; font-weight: 700; text-decoration: none; }
.btn.small { padding: 7px 16px; color: #141005; }
.btn.ghost { background: none; color: var(--gold-hi); border: 1px solid var(--line); }
.btn.disabled { opacity: .55; pointer-events: none; }
.hero { display: grid; grid-template-columns: 1.3fr 1fr; gap: 40px; align-items: center; padding-top: 50px; padding-bottom: 60px; }
.hero h1 { font-size: clamp(36px, 6vw, 60px); margin: 0 0 16px; }
.hero p { color: #cfcabd; font-size: 18px; }
.hero-logo { width: 100%; max-width: 380px; justify-self: center; border-radius: 28px; filter: drop-shadow(0 0 60px rgba(212, 175, 55, .35)); }
.cta { display: flex; gap: 12px; flex-wrap: wrap; margin: 22px 0 10px; }
.fine { color: var(--muted); font-size: 14px; }
.features { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 16px; padding-bottom: 60px; }
.feature, .card, .ai, details { background: var(--panel); border: 1px solid var(--line); border-radius: 16px; }
.feature { padding: 20px; }
.feature h3 { margin: 0 0 6px; font-size: 22px; }
.feature p { margin: 0; color: #cfcabd; }
.ai { display: flex; gap: 28px; align-items: center; padding: 28px; margin-bottom: 60px; }
.robot { width: 120px; flex: none; filter: drop-shadow(0 0 24px rgba(212, 175, 55, .4)); }
.ai h2 { margin: 0 0 8px; font-size: 32px; }
.plans { padding-bottom: 60px; }
.plans h2, .download h2, .faq h2 { font-size: 36px; margin: 0 0 6px; }
.sub { color: var(--muted); margin-top: 0; }
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(165px, 1fr)); gap: 14px; margin: 22px 0; }
.card { position: relative; display: flex; flex-direction: column; gap: 8px; padding: 20px 16px; }
.card.popular { border-color: var(--gold); box-shadow: 0 0 30px rgba(212, 175, 55, .18); }
.card h3 { margin: 0; font-size: 22px; }
.card .price { font: 700 32px Bahnschrift, sans-serif; }
.card .price span { font-size: 14px; color: var(--muted); font-weight: 400; }
.card ul { margin: 0; padding-left: 18px; flex: 1; }
.card .btn { text-align: center; padding: 9px 14px; }
.badge { position: absolute; top: -11px; right: 12px; padding: 2px 10px; border-radius: 999px; background: var(--grad); color: #141005; font-size: 12px; font-weight: 700; }
.rules { color: var(--muted); padding-left: 20px; }
.download { padding-bottom: 60px; }
.faq { padding-bottom: 60px; display: grid; gap: 10px; }
details { padding: 14px 18px; }
summary { cursor: pointer; font-weight: 600; }
details p { color: #cfcabd; margin-bottom: 0; }
.foot { padding-top: 24px; padding-bottom: 40px; color: var(--muted); font-size: 14px; border-top: 1px solid var(--line); }
/* The robot video */
.video { padding-bottom: 60px; }
.video h2 { font-size: 36px; margin: 0 0 16px; }
.player { position: relative; border-radius: 18px; overflow: hidden; border: 1px solid var(--line); background: #050507; box-shadow: 0 30px 80px rgba(0, 0, 0, .6); }
.screen { position: relative; aspect-ratio: 16 / 9; overflow: hidden; container-type: inline-size;
  background: radial-gradient(70% 90% at 30% 60%, #2a220b 0%, #0b0a07 55%, #050507 100%); }
.v-sparks i { position: absolute; bottom: -10px; width: 4px; height: 4px; border-radius: 50%; background: #ffe8a3; opacity: 0; animation: v-rise linear infinite; }
@keyframes v-rise { 0% { transform: translateY(0); opacity: 0; } 15% { opacity: .7; } 100% { transform: translateY(-60cqw); opacity: 0; } }
.v-bot { position: absolute; left: 4%; bottom: 4%; height: 86%; filter: drop-shadow(0 0 30px rgba(212, 175, 55, .35)); }
.v-bot .v-arm, .v-bot .v-head { transform-box: view-box; transition: transform .6s cubic-bezier(.4, .1, .2, 1); }
.v-left { transform-origin: 41px 146px; }
.v-right { transform-origin: 159px 146px; }
.v-head { transform-origin: 100px 120px; animation: v-bob 3s ease-in-out infinite; }
.pose-wave .v-right { animation: v-wave 1.2s ease-in-out infinite; }
.pose-point .v-right { transform: rotate(-115deg); }
.pose-point .v-head { animation: none; transform: rotate(5deg); }
.pose-open .v-left { transform: rotate(35deg); }
.pose-open .v-right { transform: rotate(-35deg); }
.pose-think .v-right { transform: rotate(-150deg); }
.pose-think .v-head { animation: none; transform: rotate(-6deg); }
.v-eyes { transform-box: fill-box; transform-origin: center; animation: v-blink 4.5s infinite; }
.v-mouth { transform-box: fill-box; transform-origin: center; }
.talking .v-mouth { animation: v-talk .22s ease-in-out infinite alternate; }
.v-antenna, .v-core { animation: v-pulse 2s ease-in-out infinite; }
@keyframes v-wave { 0%, 100% { transform: rotate(-140deg); } 50% { transform: rotate(-170deg); } }
@keyframes v-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
@keyframes v-blink { 0%, 93%, 100% { transform: scaleY(1); } 96% { transform: scaleY(.1); } }
@keyframes v-talk { from { transform: scaleY(.6) scaleX(.9); } to { transform: scaleY(2.6) scaleX(1.05); } }
@keyframes v-pulse { 0%, 100% { opacity: .6; } 50% { opacity: 1; } }
.v-panel { position: absolute; left: 40%; right: 4%; top: 8%; bottom: 22%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1.6cqw; text-align: center; font-size: 1.7cqw; opacity: 0; transform: translateX(30px); transition: opacity .5s, transform .5s; }
.v-panel.in { opacity: 1; transform: none; }
.v-big { font: 700 4.2cqw/1.15 Bahnschrift, "Segoe UI", sans-serif; }
.v-stack { display: flex; flex-direction: column; gap: 1cqw; }
.v-stack span { opacity: 0; animation: v-in .6s forwards; }
.v-stack span:nth-child(2) { animation-delay: 1.6s; }
.v-stack span:nth-child(3) { animation-delay: 3.4s; }
.v-sub { color: var(--muted); font-size: 1.8cqw; }
.v-title { font: 700 3cqw Bahnschrift, sans-serif; color: var(--gold-hi); }
.v-card { position: relative; padding: 2cqw 3cqw; border-radius: 1.4cqw; background: #f4f2ec; color: #1b1b20; min-width: 40%; }
.v-prod { font-weight: 700; font-size: 2.2cqw; }
.v-price { font: 700 3cqw Bahnschrift, sans-serif; }
.v-stamp { position: absolute; inset: 0; display: grid; place-items: center; font: 900 4cqw Bahnschrift, sans-serif; color: #dc2626; transform: rotate(-12deg) scale(2); opacity: 0; animation: v-stamp .5s 1.2s forwards; }
@keyframes v-stamp { to { opacity: .9; transform: rotate(-12deg) scale(1); } }
.v-resell { font-size: 2.2cqw; opacity: 0; animation: v-in .5s 2.6s forwards; }
.v-resell b { color: #f87171; }
.v-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: .8cqw; }
.v-chips span { padding: .5cqw 1.2cqw; border-radius: 999px; border: 1px solid var(--line); background: #141419; opacity: 0; animation: v-in .4s forwards; }
.v-counter { font: 700 5cqw Consolas, monospace; color: var(--gold-hi); }
.v-flow { display: flex; align-items: center; flex-wrap: wrap; justify-content: center; gap: 1cqw; }
.v-flow div { padding: 1.2cqw 1.6cqw; border-radius: 1cqw; background: #141419; border: 1px solid #2c2c36; color: var(--muted); animation: v-light .4s forwards; animation-play-state: running; }
.v-flow div:last-child { animation-name: v-done; }
.v-flow i { color: var(--gold); font-style: normal; }
@keyframes v-light { to { background: #1d1a10; border-color: var(--gold); color: var(--gold-hi); } }
@keyframes v-done { to { background: #15803d; border-color: #22c55e; color: #fff; } }
.v-lock { font-size: 6cqw; }
.v-list { text-align: left; font-size: 2.1cqw; margin: 0; }
.v-list li { opacity: 0; animation: v-in .5s forwards; }
.v-list li:nth-child(2) { animation-delay: 1.4s; } .v-list li:nth-child(3) { animation-delay: 2.8s; } .v-list li:nth-child(4) { animation-delay: 4.2s; }
.v-alert { display: flex; flex-direction: column; gap: .8cqw; padding: 2cqw; border-radius: 1.2cqw; background: #141419; border: 1px solid var(--gold); text-align: left; max-width: 80%; animation: v-shake .5s 1s 2; }
.v-alert b { color: var(--gold-hi); font-size: 2.2cqw; }
@keyframes v-shake { 25% { transform: translateX(-6px); } 75% { transform: translateX(6px); } }
.v-answer { display: flex; flex-direction: column; gap: .8cqw; padding: 2.2cqw 2.6cqw; border-radius: 1.4cqw; background: #fbfaf6; color: #3d2f07; text-align: left; }
.v-answer small { color: #6b675c; letter-spacing: .1cqw; }
.v-answer b { font: 700 2.8cqw Bahnschrift, sans-serif; }
.v-src { display: flex; gap: .8cqw; }
.v-src i { font-style: normal; padding: .3cqw 1cqw; border-radius: 999px; background: #fdf0c4; font-size: 1.4cqw; }
.v-tabs { display: flex; gap: .6cqw; align-items: center; padding: 1cqw; border-radius: 1cqw; background: #1a1a20; }
.v-group { padding: .6cqw 1.2cqw; border-radius: .8cqw; background: #d4af37; color: #141005; font-weight: 700; }
.v-tab { padding: .6cqw 1.2cqw; border-radius: .8cqw .8cqw 0 0; background: #2c2c36; animation: v-tuck .6s forwards; }
@keyframes v-tuck { to { opacity: 0; transform: translateX(-8cqw) scale(.4); width: 0; padding: 0; } }
.v-plans { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1cqw; width: 90%; }
.v-plan { display: flex; flex-direction: column; padding: 1.2cqw; border-radius: 1cqw; background: #141419; border: 1px solid var(--line); opacity: 0; animation: v-in .4s forwards; }
.v-plan:nth-child(2) { animation-delay: .4s; } .v-plan:nth-child(3) { animation-delay: .8s; } .v-plan:nth-child(4) { animation-delay: 1.2s; } .v-plan:nth-child(5) { animation-delay: 1.6s; } .v-plan:nth-child(6) { animation-delay: 2s; }
.v-plan.hot { border-color: var(--gold); }
.v-plan span { font: 700 2.6cqw Bahnschrift, sans-serif; color: var(--gold-hi); }
.v-plan small { color: var(--muted); }
.v-logo { width: 22cqw; border-radius: 3cqw; filter: drop-shadow(0 0 30px rgba(212, 175, 55, .5)); animation: v-in .8s forwards; }
@keyframes v-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.caption { position: absolute; left: 4%; right: 4%; bottom: 4%; padding: .8cqw 1.4cqw; border-radius: .8cqw; background: rgba(0, 0, 0, .7); color: #fff; font-size: 1.6cqw; text-align: center; }
.player .caption { font-size: clamp(12px, 1.6vw, 18px); }
.screen { cursor: pointer; }
.v-paused { position: absolute; left: 50%; top: 45%; width: 9cqw; height: 9cqw; margin: -4.5cqw 0 0 -4.5cqw; border-radius: 50%; background: rgba(0, 0, 0, .65); border: 2px solid var(--gold); }
.v-paused::after { content: ''; position: absolute; left: 38%; top: 28%; border-style: solid; border-width: 2.2cqw 0 2.2cqw 3.4cqw; border-color: transparent transparent transparent var(--gold-hi); }
.v-paused[hidden] { display: none; }
.bar { position: relative; height: 8px; background: #1d1d24; cursor: pointer; touch-action: none; }
.bar:hover { height: 10px; }
.bar i { display: block; height: 100%; width: 0; background: var(--grad); pointer-events: none; }
.controls select.reset { outline: 2px solid var(--gold); box-shadow: 0 0 14px rgba(212, 175, 55, .7); transition: box-shadow .3s; }
.controls { display: flex; gap: 24px; align-items: center; padding: 10px 16px; background: #0b0b0f; color: var(--muted); font-size: 14px; }
.controls label { display: flex; align-items: center; gap: 8px; }
.controls select { background: #141419; color: var(--text); border: 1px solid var(--line); border-radius: 6px; padding: 3px 6px; }
.controls input[type=range] { accent-color: var(--gold); }
.v-end { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(0, 0, 0, .55); }
.v-end[hidden] { display: none; }

/* Terms before download */
body.no-scroll { overflow: hidden; }
.terms-back { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 20px; background: rgba(0, 0, 0, .75); backdrop-filter: blur(4px); }
.terms-back[hidden] { display: none; }
.terms-box { width: min(760px, 100%); max-height: 92vh; display: flex; flex-direction: column; gap: 10px; padding: 24px; border-radius: 18px; background: var(--panel); border: 1px solid var(--gold); box-shadow: 0 30px 80px rgba(0, 0, 0, .7); }
.terms-box h2 { margin: 0; font-size: 28px; }
.terms-text { flex: 1; min-height: 200px; max-height: 46vh; overflow: auto; margin: 0; padding: 14px 16px; border-radius: 10px; background: #fbfaf6; color: #1b1b20; font: 13px/1.55 "Segoe UI", system-ui, sans-serif; white-space: pre-wrap; }
.terms-hint { margin: 0; color: var(--gold-hi); font-size: 14px; }
.terms-check { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; color: #cfcabd; }
.terms-check input { margin-top: 4px; accent-color: var(--gold); }
.terms-name { display: flex; flex-direction: column; gap: 6px; font-size: 14px; color: #cfcabd; }
.terms-name input { padding: 10px 12px; border-radius: 8px; border: 1px solid var(--line); background: #0b0b0f; color: var(--text); font-size: 15px; }
.terms-check input:disabled + *, .terms-name input:disabled { opacity: .5; }
.terms-actions { display: flex; justify-content: flex-end; gap: 10px; }
.terms-actions .btn:disabled { opacity: .45; cursor: not-allowed; }
button.btn { border: 0; cursor: pointer; font: inherit; font-weight: 700; }

@media (max-width: 760px) { .hero { grid-template-columns: 1fr; } nav a:not(.btn) { display: none; } .ai { flex-direction: column; text-align: center; } }