:root{
  --ink:#0a0a0b; --ink-2:#131316; --ink-3:#1b1b20;
  --yellow:#F5D211; --yellow-2:#ffe23a; --yellow-3:#c9a70c;
  --cyan:#35E0E6;
  --t1:#f4f3ee; --t2:#a5a59d; --t3:#6f6f68;
  --line:rgba(245,210,17,.28); --line-2:rgba(255,255,255,.09);
  --hud:"Chakra Petch","Segoe UI",system-ui,sans-serif;
  --num:"Orbitron","Chakra Petch",monospace;
  --maxw:1140px; --gutter:40px;
}
*{box-sizing:border-box;margin:0;padding:0;min-width:0}
html{background:var(--ink)}
body{
  background:
    radial-gradient(58% 40% at 50% 4%, rgba(245,210,17,.17), transparent 62%),
    radial-gradient(70% 50% at 50% 26%, rgba(245,210,17,.07), transparent 66%),
    var(--ink);
  color:var(--t1);font-family:var(--hud);font-size:16px;line-height:1.58;min-height:100vh;overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.45;
  background-image:repeating-linear-gradient(0deg,rgba(0,0,0,.3) 0 1px,transparent 1px 3px)}
img{display:block;max-width:100%}
button{font-family:inherit;color:inherit;cursor:pointer;border:0;background:none}
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter);position:relative;z-index:3}

header .wrap{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-top:24px}
.brandline{display:flex;align-items:center;gap:8px;font-family:var(--hud);font-weight:700;letter-spacing:.2em;text-transform:uppercase;font-size:.9rem;color:var(--t1)}
.brand-icon{width:20px;height:20px;flex:0 0 20px;object-fit:contain;transform:translateY(-1px)}
.fanpill{font-family:var(--hud);font-weight:700;letter-spacing:.18em;text-transform:uppercase;font-size:.62rem;color:var(--ink);
  background:var(--yellow);padding:6px 12px;white-space:nowrap;
  clip-path:polygon(0 0,100% 0,100% 68%,calc(100% - 8px) 100%,0 100%)}
.hazard{height:10px;margin-top:18px;background:repeating-linear-gradient(45deg,var(--yellow) 0 14px,var(--ink) 14px 28px)}

 
.hero{text-align:center;padding-top:clamp(20px,3vw,34px);padding-bottom:clamp(28px,4vw,50px)}
.evt{display:inline-flex;align-items:center;gap:.55em;font-family:var(--hud);font-weight:700;letter-spacing:.24em;text-transform:uppercase;
  font-size:.7rem;color:var(--yellow);border:1px solid var(--line);padding:7px 15px;background:rgba(245,210,17,.07)}
.evt .dot{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px var(--cyan)}
.title{font-family:var(--hud);font-weight:700;text-transform:uppercase;line-height:1.02;letter-spacing:.01em;
  font-size:clamp(2.3rem,6vw,4.2rem);margin-top:.5em}
.title .free{display:inline-block;color:var(--ink);background:linear-gradient(120deg,var(--yellow-2),var(--yellow) 60%,var(--yellow-3));
  padding:0 .3em;box-shadow:6px 7px 0 0 #e0303f;
  clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}
.kick{color:var(--t2);font-size:clamp(.98rem,1.4vw,1.1rem);line-height:1.6;max-width:52ch;margin:1.1em auto 0}
.kick b{color:var(--t1)}

.stage{position:relative;margin:clamp(20px,3vw,34px) auto 0;width:min(780px,100%);height:clamp(300px,40vw,400px)}
.rays{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);width:min(600px,96%);aspect-ratio:1;pointer-events:none;
  background:repeating-conic-gradient(from 0deg,rgba(245,210,17,.22) 0 4deg,transparent 4deg 20deg);
  mask-image:radial-gradient(circle,transparent 0 13%,#000 28%,rgba(0,0,0,.45) 46%,transparent 68%);
  -webkit-mask-image:radial-gradient(circle,transparent 0 13%,#000 28%,rgba(0,0,0,.45) 46%,transparent 68%);
  animation:spin 64s linear infinite;opacity:.9}
@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
.bloom{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);width:min(400px,70%);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(245,210,17,.34),transparent 68%);filter:blur(4px)}

 
.memobj{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);z-index:3;
  width:min(430px,72%);height:auto;
  filter:drop-shadow(0 22px 30px rgba(0,0,0,.8)) drop-shadow(0 0 30px rgba(245,210,17,.34));
  animation:bob 6s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translate(-50%,-50%)}50%{transform:translate(-50%,calc(-50% - 9px))}}
.spark{position:absolute;z-index:4;width:8px;height:8px;pointer-events:none;background:radial-gradient(circle,#fff,rgba(245,210,17,0) 70%)}

.claim{margin-top:clamp(20px,3vw,30px);display:flex;flex-direction:column;align-items:center;gap:.8em}
.cta{position:relative;overflow:hidden;font-family:var(--hud);font-weight:700;text-transform:uppercase;letter-spacing:.16em;
  font-size:clamp(1rem,1.4vw,1.14rem);color:var(--ink);background:linear-gradient(120deg,var(--yellow-2),var(--yellow) 58%,var(--yellow-3));
  padding:1.05em 2.9em;clip-path:polygon(0 0,100% 0,100% 74%,calc(100% - 12px) 100%,0 100%);
  box-shadow:0 16px 36px -14px rgba(245,210,17,.75);transition:transform .16s ease}
.cta:hover{transform:translateY(-2px)}
.cta:active{transform:translateY(0)}
.cta::after{content:"";position:absolute;top:0;bottom:0;width:38%;left:-50%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);animation:sheen 3.2s ease-in-out infinite}
@keyframes sheen{0%{left:-50%}55%,100%{left:120%}}
.cta:focus-visible{outline:3px solid var(--cyan);outline-offset:4px}

 
.gifts{padding-block:clamp(38px,5.5vw,72px)}
.gh{text-align:center}
.gh .lab{font-family:var(--hud);font-weight:700;letter-spacing:.26em;text-transform:uppercase;font-size:.72rem;color:var(--yellow)}
.gh h2{font-family:var(--hud);font-weight:700;text-transform:uppercase;font-size:clamp(1.6rem,3.2vw,2.4rem);margin-top:.3em}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.6vw,18px);margin-top:clamp(20px,3vw,32px)}
.card{position:relative;text-align:center;padding:clamp(20px,2.6vw,30px) 16px;background:var(--ink-2);
  box-shadow:0 0 0 1px var(--line-2);
  clip-path:polygon(0 0,100% 0,100% 100%,14px 100%,0 calc(100% - 14px))}
.card.big{background:var(--ink-3);box-shadow:0 0 0 1px var(--line)}
.card .ico{width:72px;height:72px;margin:0 auto;display:grid;place-items:center;background:#0b0b0d;box-shadow:0 0 0 1px var(--line-2)}
.card .ico img{width:48px;height:48px;object-fit:contain}
.card .amt{display:block;font-family:var(--num);font-weight:900;font-size:clamp(1.9rem,3.8vw,2.7rem);line-height:1;margin-top:.55em;color:var(--t1);font-variant-numeric:tabular-nums}
.card.big .amt{color:var(--yellow)}
.card .nm{display:block;font-family:var(--hud);font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:.8rem;margin-top:.5em}
.card .when{display:block;color:var(--t3);font-size:.8rem;margin-top:.35em;line-height:1.45}
.total-line{text-align:center;color:var(--t2);font-size:.94rem;margin-top:clamp(16px,2.2vw,24px)}
.total-line b{color:var(--yellow)}

 
.how{padding-block:clamp(32px,4.6vw,60px);border-top:1px solid var(--line-2)}
.how h3{text-align:center;font-family:var(--hud);font-weight:700;text-transform:uppercase;font-size:clamp(1.25rem,2.5vw,1.75rem)}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2.2vw,26px);margin-top:clamp(18px,2.6vw,28px)}
.step{text-align:center}
.step .n{width:44px;height:44px;margin:0 auto;display:grid;place-items:center;font-family:var(--num);font-weight:900;font-size:1.1rem;
  color:var(--ink);background:var(--yellow);clip-path:polygon(0 0,100% 0,100% 74%,78% 100%,0 100%)}
.step .st{display:block;font-family:var(--hud);font-weight:700;letter-spacing:.1em;text-transform:uppercase;font-size:.9rem;margin-top:.65em}
.step .sd{display:block;color:var(--t3);font-size:.86rem;margin-top:.35em;line-height:1.5;max-width:30ch;margin-inline:auto}

footer{border-top:1px solid var(--line-2);margin-top:clamp(18px,3vw,36px)}
footer .wrap{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:center;padding-block:22px 38px}
.f-mark{font-family:var(--hud);font-weight:700;letter-spacing:.16em;text-transform:uppercase;font-size:.76rem;color:var(--t2)}
.f-mark b{color:var(--yellow)}
.f-disc{font-size:.76rem;color:var(--t3);max-width:62ch}

.rise{opacity:1}
html.cap .rise{opacity:1!important;transform:none!important}
html.cap .rays,html.cap .cta::after,html.cap .memobj{animation:none!important}
@media (prefers-reduced-motion:reduce){.rays,.cta::after,.memobj{animation:none!important}}

@media (max-width:900px){
  .cards{grid-template-columns:1fr;max-width:400px;margin-inline:auto}
  .steps{grid-template-columns:1fr;gap:24px}
}
@media (max-width:560px){
  :root{--gutter:18px}
  .stage{height:clamp(250px,58vw,310px)}
  .memobj{width:min(330px,88%)}
  .cta{width:100%;padding-inline:1.1em}
  


  .brandline{font-size:.72rem;letter-spacing:.1em}
}




@media (max-width:430px){
  header .wrap{flex-wrap:wrap;row-gap:8px}
  .brandline,.f-mark{font-size:.68rem;letter-spacing:.08em}
  .fanpill{font-size:.58rem;letter-spacing:.1em;padding:5px 10px}
}

@keyframes my-widget-opening-spin{to{transform:rotate(360deg)}}