:root{
  --royal:#1b0a3c; --royal2:#2e0f5e; --royal3:#4a1890;
  --gold1:#fff3a8; --gold2:#ffc93c; --gold3:#c47d00; --gold-ink:#3a1a00;
  --red:#ff2d55; --blue:#2f6bff; --ink:#fff; --muted:#d8c6ff;
  --panel:linear-gradient(180deg,rgba(66,22,120,.94),rgba(30,8,66,.94));
  color-scheme:dark;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){color-scheme:dark}}
:root[data-theme="dark"]{color-scheme:dark}
*{box-sizing:border-box}
:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
html{scroll-padding-top:env(safe-area-inset-top,0px);background:var(--royal)}
body{margin:0;min-height:100vh;color:var(--ink);font-family:'Nunito','Trebuchet MS','Segoe UI',system-ui,sans-serif;font-weight:700;line-height:1.5;
  background:radial-gradient(rgba(255,255,255,.05) 2px,transparent 2.5px) 0 0/28px 28px,radial-gradient(ellipse at 50% 0%,#3b1c8c,#1b0a3c 60%,#110628);background-attachment:fixed}
img{max-width:100%;display:block}
a{color:var(--gold2)}
.d{font-family:'Lilita One','Arial Rounded MT Bold','Trebuchet MS',sans-serif;font-weight:400;letter-spacing:.4px}
.wrap{width:min(100%,1060px);margin:0 auto;padding:0 18px}

/* nav */
.nav{position:sticky;top:0;z-index:20;background:linear-gradient(180deg,rgba(17,6,40,.95),rgba(17,6,40,.8));backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:2px solid rgba(255,201,60,.35)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:21;background:rgba(17,6,40,.95)}
.nav .wrap{display:flex;align-items:center;gap:14px;height:66px}
.nav .logo{height:52px;width:auto}
.nav .sp{flex:1}
.nav a.link{color:#fff;text-decoration:none;font-size:15px;padding:8px 10px;border-radius:10px}
.nav a.link:hover{background:rgba(255,255,255,.08)}
@media (max-width:640px){.nav a.link.hide-sm{display:none}}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:'Lilita One','Arial Rounded MT Bold',sans-serif;font-size:22px;letter-spacing:.5px;text-decoration:none;cursor:pointer;
  border:3px solid #fff7c8;border-radius:999px;padding:13px 38px;color:var(--gold-ink);
  background:linear-gradient(180deg,#fff6b8,#ffd84a 45%,#ffb21c);box-shadow:0 6px 0 #9a5a00,0 12px 26px rgba(0,0,0,.45),inset 0 3px 0 rgba(255,255,255,.7);transition:transform .08s,box-shadow .08s}
.btn:active{transform:translateY(4px);box-shadow:0 2px 0 #9a5a00,0 6px 12px rgba(0,0,0,.4)}
.btn.blue{color:#fff;border-color:#c4d6ff;background:linear-gradient(180deg,#8fb3ff,#2f6bff 55%,#1840b8);box-shadow:0 6px 0 #0c2470,0 12px 26px rgba(0,0,0,.45);text-shadow:0 2px 0 rgba(0,0,0,.3)}
.btn.sm{font-size:17px;padding:9px 22px}
.btn[disabled]{opacity:.6;pointer-events:none}
.btn:focus-visible,input:focus-visible{outline:3px solid var(--gold2);outline-offset:3px}

/* hero */
.hero{position:relative;overflow:hidden;min-height:min(92vh,860px);display:flex;align-items:stretch;justify-content:center;text-align:center;
  background:#14063a center 40%/cover no-repeat}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(17,6,40,.55),rgba(17,6,40,.05) 30%,rgba(17,6,40,.15) 60%,#1b0a3c 98%)}
.hero .in{position:relative;z-index:2;padding:22px 18px 40px;width:min(100%,640px);display:flex;flex-direction:column;justify-content:space-between;gap:20px}
.hero .wm{width:min(86%,460px);margin:0 auto 10px;filter:drop-shadow(0 8px 16px rgba(0,0,0,.6))}
.tagline{font-size:clamp(22px,4.6vw,32px);margin:0 0 14px;color:#fff;-webkit-text-stroke:2px #3a1200;paint-order:stroke fill;text-shadow:0 3px 0 #7a3d00}
.chip{display:inline-block;font-size:15px;font-weight:900;padding:8px 16px;border-radius:999px;color:var(--gold1);background:rgba(14,3,40,.78);border:2px solid var(--gold2);margin-bottom:18px}
.cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.hero-top{position:absolute;top:0;left:0;right:0;z-index:2;padding-top:26px}

/* sections */
section{padding:56px 0}
h2.sec{font-family:'Lilita One',sans-serif;font-weight:400;font-size:clamp(30px,6vw,44px);line-height:1.05;margin:0 0 10px;text-align:center;color:#ffd84a;-webkit-text-stroke:3px #3a1200;paint-order:stroke fill;text-shadow:0 4px 0 #7a3d00}
.lead{text-align:center;color:var(--muted);font-size:18px;max-width:640px;margin:0 auto 30px}
.panel{background:var(--panel);border:3px solid var(--gold2);border-radius:26px;box-shadow:0 0 0 3px #3a1200,0 18px 40px rgba(0,0,0,.5)}

/* must register banner */
.must{position:relative;padding:28px 24px 26px 24px;display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:center;max-width:860px;margin:0 auto}
.must img{width:110px}
.must h3{font-family:'Lilita One',sans-serif;font-weight:400;font-size:clamp(24px,4.6vw,32px);margin:0 0 6px;color:#fff}
.must h3 em{font-style:normal;color:#ffd84a}
.must p{margin:0;color:var(--muted);font-size:17px}
.must p b{color:#fff}
@media (max-width:560px){.must{grid-template-columns:1fr;text-align:center}.must img{margin:0 auto;width:96px}}

/* steps */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media (max-width:900px){.steps{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.steps{grid-template-columns:1fr}}
.step{padding:26px 18px 22px;text-align:center}
.num{width:64px;height:64px;margin:-58px auto 10px;border-radius:50%;display:grid;place-items:center;font-family:'Lilita One',sans-serif;font-size:32px;color:var(--gold-ink);
  background:radial-gradient(circle at 35% 28%,#fff6c0,#ffc93c 55%,#c47d00);border:4px solid #fff3b0;box-shadow:0 4px 0 #7a3d00,0 8px 16px rgba(0,0,0,.4)}
.step h4{font-family:'Lilita One',sans-serif;font-weight:400;font-size:22px;margin:0 0 6px;color:#fff}
.step p{margin:0;color:var(--muted);font-size:15px}
.steps{margin-top:40px}

/* leaderboard */
.lb{max-width:640px;margin:0 auto;padding:18px}
.lb-row{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:14px;margin-bottom:6px;background:rgba(255,255,255,.06)}
.lb-row.win{background:linear-gradient(90deg,rgba(255,201,60,.28),rgba(255,201,60,.06))}
.lb-row .rk{width:38px;text-align:center;font-family:'Lilita One',sans-serif;font-size:21px;color:var(--gold1);flex:none}
.lb-row .rk img{width:38px}
.lb-row .nm{flex:1;min-width:0}
.lb-row .nm b{display:block;font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pbar{height:8px;border-radius:6px;background:rgba(0,0,0,.4);margin-top:5px;overflow:hidden}
.pbar i{display:block;height:100%;background:linear-gradient(90deg,#ff2d55,#ffc93c)}
.lb-row .st{text-align:right;flex:none;line-height:1.2}
.lb-row .st span{display:block;font-family:'Lilita One',sans-serif;font-size:18px}
.lb-row .st small{display:block;font-size:12px;color:var(--muted)}
.empty{text-align:center;color:var(--muted);padding:24px 0}

/* flavors strip */
.flavors{display:flex;gap:14px;overflow-x:auto;padding:6px 18px 18px;scroll-snap-type:x mandatory}
.flavors img{width:180px;flex:none;border-radius:18px;border:4px solid var(--gold2);box-shadow:0 0 0 3px #3a1200,0 10px 20px rgba(0,0,0,.45);scroll-snap-align:center}

/* faq */
.faq{max-width:760px;margin:0 auto}
.faq details{padding:16px 20px;margin-bottom:12px;border-radius:18px;background:rgba(255,255,255,.06);border:2px solid rgba(255,201,60,.4)}
.faq summary{cursor:pointer;font-size:18px;font-weight:900;color:#fff;list-style:none;display:flex;justify-content:space-between;gap:12px}
.faq summary::after{content:"+";color:var(--gold2);font-size:24px;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq p{color:var(--muted);margin:10px 0 0}

/* forms */
.form-card{max-width:480px;margin:28px auto 60px;padding:28px 22px 26px}
.form-card .crown{width:120px;margin:-8px auto 6px;filter:drop-shadow(0 6px 10px rgba(0,0,0,.5))}
.form-card h1{font-family:'Lilita One',sans-serif;font-weight:400;font-size:clamp(30px,7vw,40px);line-height:1.05;text-align:center;margin:0 0 8px;color:#ffd84a;-webkit-text-stroke:3px #3a1200;paint-order:stroke fill;text-shadow:0 4px 0 #7a3d00}
.form-card .sub{text-align:center;color:var(--muted);margin:0 0 18px}
label{display:block;font-size:15px;color:var(--gold1);margin:14px 0 6px}
.hint{font-size:13px;color:var(--muted);margin-top:5px}
input.txt{width:100%;font:inherit;font-size:18px;padding:13px 15px;border-radius:14px;border:2px solid var(--gold2);background:rgba(0,0,0,.35);color:#fff}
input.code{font-family:'Lilita One',sans-serif;letter-spacing:3px;text-transform:uppercase;font-size:22px;text-align:center}
.check{display:flex;gap:10px;align-items:flex-start;font-size:15px;color:var(--muted);margin:18px 0 6px}
.check input{width:22px;height:22px;flex:none;margin-top:2px;accent-color:#ffc93c}
.err{color:#ff8aa3;font-size:15px;min-height:22px;margin:10px 0 0;text-align:center}
.ok{color:#7dff6a}
.form-card .btn{width:100%;margin-top:12px}
.note{border-radius:14px;padding:12px 14px;background:rgba(255,201,60,.12);border:2px solid rgba(255,201,60,.5);color:#fff;font-size:14px;margin-top:16px}
.demo{position:fixed;left:50%;bottom:calc(14px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:30;background:#ff2d55;color:#fff;border:2px solid #fff;border-radius:999px;padding:6px 14px;font-size:13px;white-space:nowrap}

footer{padding:30px 0 50px;text-align:center;color:var(--muted);font-size:14px;border-top:2px solid rgba(255,201,60,.25)}
footer a{margin:0 8px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

.policy h3{font-family:'Lilita One',sans-serif;font-weight:400;font-size:22px;color:#ffd84a;margin:22px 0 6px}
.policy p{color:var(--muted);margin:8px 0}
.policy p b{color:#fff}

/* --- Terp Kingz branding --- */
.nav .brand{font-family:'Lilita One',system-ui,sans-serif;font-size:20px;letter-spacing:.04em;margin-left:10px;background:linear-gradient(#fff6c8,#ffc93c 60%,#e08a00);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 0 rgba(60,20,0,.6))}
.presents{margin:6px 0 0;font-weight:900;letter-spacing:.06em;text-transform:uppercase;font-size:14px;color:#ffe9a8}
.presents b{color:#fff}
.brandline{margin:0 0 10px;opacity:.85}
.flavs{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:20px}
.flav{margin:0;text-align:center}
.flav img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:16px;border:3px solid rgba(255,201,60,.7);box-shadow:0 10px 24px rgba(0,0,0,.45);transition:transform .2s}
.flav img:hover{transform:translateY(-4px) rotate(-1deg)}
.flav figcaption{margin-top:8px;font-weight:900;font-size:14px;color:#fff}
@media (max-width:700px){.flavs{grid-template-columns:repeat(2,1fr);gap:12px}.nav .brand{font-size:16px}}
/* --- register tabs --- */
.tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;background:rgba(0,0,0,.25);padding:5px;border-radius:999px;margin-top:18px}
.tab{border:0;border-radius:999px;padding:11px 8px;font:900 15px Nunito,system-ui,sans-serif;color:#e9dcff;background:transparent;cursor:pointer}
.tab.on{background:linear-gradient(#ffe68a,#ffb81f);color:#2a1400;box-shadow:0 3px 0 #b86f00}
