/* ==========================================================
   Y17K — Y2K cyber-chrome design system
   ========================================================== */
:root{
  --void:#04051A; --space:#0B0C33; --electric:#0A2BFF; --electric-2:#3D6BFF;
  --ice:#9FD8FF; --lavender:#B7A6FF;
  --chrome-edge:#23264A;
  --uv:#4B00D9; --hot-pink:#FF4FD8; --acid:#FFE600; --pixel-blue:#1a1aff;
  --win-gray:#C0C0C0; --win-dark:#808080; --win-title:linear-gradient(90deg,#000A80,#1084D0);
  --ink:#0A0A14; --text:#E9ECFF; --muted:#A9B0D6;
  --chrome:linear-gradient(180deg,#fff 0%,#eef0f8 30%,#8d94b3 50%,#f4f6ff 60%,#c3c8da 82%,#fff 100%);
  --f-display:"Archivo",system-ui,sans-serif;
  --f-pixel:"VT323",ui-monospace,monospace;
  --f-win:Tahoma,Verdana,"Segoe UI",sans-serif;
  --ease:cubic-bezier(.2,.8,.2,1);
  --gutter:clamp(16px,4vw,48px);
  --maxw:1180px;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--void);color:var(--text);font-family:var(--f-display);font-size:16px;line-height:1.55;overflow-x:hidden}
body.is-booting{overflow:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--ice)}
:focus-visible{outline:3px solid var(--ice);outline-offset:3px}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:300;background:#fff;color:#000;padding:8px 14px;border-radius:6px}
.skip:focus{top:12px}
section[id]{scroll-margin-top:56px}

/* pixel cursors (mouse only) */
@media (pointer:fine){
  body{cursor:url(assets/cursor-arrow.png) 0 0,auto}
  a,button,summary,label,.btn,.btn98,.file{cursor:url(assets/cursor-hand.png) 10 0,pointer}
  body.is-busy,body.is-busy *{cursor:url(assets/cursor-wait.png) 8 8,wait!important}
}

/* film grain, like the posters */
.grain{position:fixed;inset:-50%;z-index:90;pointer-events:none;opacity:.06;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 1.2s steps(4) infinite}
@keyframes grain{0%{transform:translate(0,0)}25%{transform:translate(-3%,2%)}50%{transform:translate(2%,-3%)}75%{transform:translate(-1%,3%)}100%{transform:translate(0,0)}}

/* ---------------- type ---------------- */
.kicker{font-family:var(--f-pixel);font-size:clamp(15px,1.4vw,19px);letter-spacing:.3em;text-transform:lowercase;color:var(--ice);margin:0 0 10px;text-shadow:0 0 12px rgba(159,216,255,.6)}
.kicker--blue{color:var(--pixel-blue);text-shadow:none}
.display{font-family:var(--f-display);font-stretch:125%;font-weight:900;text-transform:uppercase;line-height:.92;letter-spacing:-.01em;margin:0;font-size:clamp(30px,5vw,64px)}
.display--md{font-size:clamp(26px,4.2vw,52px)}
.display span{display:block}
.chrome-text{background:var(--chrome);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 2px 0 var(--chrome-edge)) drop-shadow(0 0 18px rgba(159,216,255,.35))}

/* ---------------- buttons ---------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;font-family:var(--f-display);font-stretch:125%;font-weight:800;text-transform:uppercase;letter-spacing:.04em;border:0;border-radius:999px;padding:13px 24px;font-size:14px;position:relative;overflow:hidden;white-space:nowrap;transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.btn--chrome{color:var(--ink);background:var(--chrome);box-shadow:inset 0 1px 0 #fff,inset 0 -2px 0 rgba(35,38,74,.45),0 0 0 2px var(--chrome-edge),0 10px 30px rgba(61,107,255,.35),0 0 40px rgba(159,216,255,.22)}
.btn--chrome::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.95) 50%,transparent 65%);transform:translateX(-120%);animation:shine 5s var(--ease) infinite 1s}
.btn--chrome:hover{transform:translateY(-2px);box-shadow:inset 0 1px 0 #fff,inset 0 -2px 0 rgba(35,38,74,.45),0 0 0 2px var(--chrome-edge),0 16px 40px rgba(61,107,255,.5),0 0 60px rgba(159,216,255,.45)}
.btn--lg{padding:16px 32px;font-size:15px}
.btn--sm{padding:9px 16px;font-size:12px}
@keyframes shine{0%,70%{transform:translateX(-120%)}100%{transform:translateX(120%)}}

/* ---------------- Win98 kit ---------------- */
.win{background:var(--win-gray);color:#000;font-family:var(--f-win);font-size:14px;border:2px solid;border-color:#fff #000 #000 #fff;box-shadow:inset -1px -1px 0 var(--win-dark),inset 1px 1px 0 #dfdfdf,0 24px 60px rgba(0,0,20,.55);padding:3px}
.win__bar{display:flex;align-items:center;justify-content:space-between;gap:8px;background:var(--win-title);color:#fff;padding:4px 4px 4px 8px;font-weight:700;font-size:13px;list-style:none;min-width:0}
.win__bar::-webkit-details-marker{display:none}
.win__title{display:flex;align-items:center;gap:6px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.win__btns{display:flex;gap:2px;flex:none}
.win__btns b{display:grid;place-items:center;width:20px;height:18px;background:var(--win-gray);color:#000;font-size:11px;line-height:1;border:1px solid;border-color:#fff #000 #000 #fff;box-shadow:inset -1px -1px 0 var(--win-dark)}
.win__body{padding:16px}
.win__h{font-family:var(--f-win);font-size:17px;margin:0 0 12px}
.win__actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end;margin-top:14px}
.btn98{font-family:var(--f-win);font-size:14px;color:#000;background:var(--win-gray);min-width:88px;min-height:36px;padding:6px 14px;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;border:2px solid;border-color:#fff #000 #000 #fff;box-shadow:inset -1px -1px 0 var(--win-dark),inset 1px 1px 0 #dfdfdf}
.btn98:active{border-color:#000 #fff #fff #000;box-shadow:inset 1px 1px 0 var(--win-dark)}
.btn98--default{outline:1px solid #000;outline-offset:-5px;font-weight:700}
.btn98:focus-visible{outline:2px dotted #000;outline-offset:-6px}
.btn98[disabled]{color:var(--win-dark);text-shadow:1px 1px 0 #fff}
.erricon{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ff8a8a,#d10000 60%,#800);color:#fff;font-weight:900;font-size:13px;margin-right:10px;vertical-align:middle;box-shadow:0 1px 0 #000}
.erricon--gift{background:radial-gradient(circle at 35% 30%,#fff3a0,#f2b600 60%,#8a6400);color:#000}
.infoicon{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#bfe0ff,#1d5cff 60%,#002a8a);color:#fff;font:italic 900 16px Georgia,serif;box-shadow:0 1px 0 #000}
.folder{display:inline-block;flex:none;width:16px;height:12px;background:linear-gradient(#ffe680,#e5b800);border:1px solid #7a6000;border-radius:1px;position:relative}
.folder::before{content:"";position:absolute;left:-1px;top:-4px;width:7px;height:4px;background:#e5b800;border:1px solid #7a6000;border-bottom:0}

/* ================= LOADER (zigzag colour-changing name) ================= */
.boot{position:fixed;inset:0;z-index:200;display:grid;place-items:center;background:#02030f;overflow:hidden;transition:opacity .35s var(--ease) .35s,visibility .35s .35s}
.boot__glow{position:absolute;inset:-20%;background:radial-gradient(40% 35% at 50% 50%,rgba(61,107,255,.45),transparent 70%),radial-gradient(30% 25% at 50% 55%,rgba(255,79,216,.25),transparent 70%);animation:pulse 1.6s ease-in-out infinite alternate}
@keyframes pulse{to{opacity:.55;transform:scale(1.08)}}
.boot::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.35) 0 1px,transparent 1px 3px)}
.boot__inner{position:relative;z-index:1;width:min(560px,84vw);display:flex;flex-direction:column;align-items:center;transition:transform .35s cubic-bezier(.7,0,.3,1)}
.boot__mark{position:relative;width:100%;aspect-ratio:944/482;filter:drop-shadow(0 0 18px rgba(159,216,255,.55)) drop-shadow(0 0 40px rgba(255,79,216,.35));animation:bootin .6s var(--ease) both}
.boot__zig,.boot__chrome{position:absolute;inset:0;width:100%;height:100%}
.boot__zig{
  --a:#FF4FD8; --b:#0A2BFF;
  -webkit-mask:url(assets/logo.webp) center/contain no-repeat;mask:url(assets/logo.webp) center/contain no-repeat;
  background:
    linear-gradient(135deg,var(--a) 25%,transparent 25%) -18px 0/36px 36px,
    linear-gradient(225deg,var(--a) 25%,transparent 25%) -18px 0/36px 36px,
    linear-gradient(315deg,var(--a) 25%,transparent 25%) 0 0/36px 36px,
    linear-gradient(45deg,var(--a) 25%,transparent 25%) 0 0/36px 36px,
    linear-gradient(90deg,#0A2BFF,#9FD8FF,#FFE600,#FF4FD8,#0A2BFF);
  background-color:var(--b);
  animation:zig .6s linear infinite,hue 1.6s linear infinite;
  transition:opacity .35s}
.boot__chrome{object-fit:contain;opacity:0;transform:scale(1.04);transition:opacity .35s,transform .5s var(--ease)}
.boot.is-done .boot__chrome{opacity:1;transform:none}
.boot.is-done .boot__zig{opacity:0}
@keyframes zig{to{background-position:18px 0,18px 0,36px 0,36px 0,0 0}}
@keyframes hue{to{filter:hue-rotate(360deg)}}
@keyframes bootin{from{opacity:0;transform:scale(.85);filter:blur(8px)}}
.boot__bolt{width:100%;height:22px;margin-top:26px;overflow:visible}
.boot__bolt polyline{fill:none;stroke-width:4;stroke-linejoin:miter;vector-effect:non-scaling-stroke}
.boot__bolt-bg{stroke:rgba(159,216,255,.15)}
.boot__bolt-fg{stroke:url(#boltGrad);filter:drop-shadow(0 0 6px #9FD8FF);animation:hue 1.6s linear infinite;stroke-dasharray:1 1;stroke-dashoffset:1}
.boot__meta{width:100%;display:flex;justify-content:space-between;margin:12px 0 0;font-family:var(--f-pixel);font-size:18px;letter-spacing:.12em;color:#cfe0ff}
.boot__skip{position:absolute;bottom:calc(20px + env(safe-area-inset-bottom));left:0;right:0;text-align:center;margin:0;font-family:var(--f-pixel);font-size:16px;letter-spacing:.2em;color:rgba(207,224,255,.45)}
.boot.is-off{opacity:0;visibility:hidden}
.boot.is-off .boot__inner{transform:scaleY(.01) scaleX(1.2)}

/* ---------------- nav ---------------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;gap:16px;padding:10px var(--gutter);background:linear-gradient(180deg,rgba(4,5,26,.85),rgba(4,5,26,0))}
.nav__logo img{height:34px;width:auto;filter:drop-shadow(0 0 10px rgba(159,216,255,.4))}
.nav__links{display:flex;gap:22px;margin-left:auto;font-family:var(--f-pixel);font-size:19px}
.nav__links a{color:var(--text);text-decoration:none;opacity:.8}
.nav__links a:hover{opacity:1;color:var(--ice)}
.nav .btn--sm{margin-left:4px}
@media (max-width:720px){.nav__links{display:none}.nav .btn--sm{margin-left:auto}}

/* ================= HERO (compact) ================= */
.hero{position:relative;display:grid;place-items:center;padding:88px 16px 44px;overflow:hidden;isolation:isolate;text-align:center}
.hero__bg{position:absolute;inset:0;z-index:-1;background:#07071f}
.hero__sky{position:absolute;inset:0 0 auto 0;width:100%;height:72%;object-fit:cover;object-position:50% 85%}
.hero__floor{position:absolute;inset:auto 0 0 0;width:100%;height:50%;object-fit:cover;object-position:50% 10%;-webkit-mask:linear-gradient(180deg,transparent,#000 30%);mask:linear-gradient(180deg,transparent,#000 30%)}
.hero__bg::after{content:"";position:absolute;inset:0;background:radial-gradient(70% 60% at 50% 45%,transparent 30%,rgba(4,5,26,.6) 100%),linear-gradient(180deg,rgba(4,5,26,.5),transparent 22%,transparent 78%,var(--void))}
.hero__stars{position:absolute;inset:0;background-image:radial-gradient(1.5px 1.5px at 12% 22%,#fff,transparent),radial-gradient(1px 1px at 34% 30%,#cfe,transparent),radial-gradient(2px 2px at 58% 12%,#fff,transparent),radial-gradient(1px 1px at 82% 34%,#fff,transparent),radial-gradient(1px 1px at 6% 40%,#fff,transparent),radial-gradient(1px 1px at 92% 18%,#dff,transparent);animation:twinkle 5s ease-in-out infinite alternate}
@keyframes twinkle{to{opacity:.35}}
.spark{position:absolute;width:20px;height:20px;background:#fff;clip-path:polygon(50% 0,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 42%);filter:drop-shadow(0 0 8px #9FD8FF);animation:sparkle 3.2s ease-in-out infinite}
.spark--1{left:16%;top:24%}.spark--2{right:14%;top:30%;width:14px;height:14px;animation-delay:1.1s}.spark--3{left:9%;top:78%;width:12px;height:12px;animation-delay:2s}
@keyframes sparkle{0%,100%{transform:scale(.4) rotate(0);opacity:.3}50%{transform:scale(1) rotate(45deg);opacity:1}}
.hero__inner{--lw:min(clamp(210px,27vw,360px),34svh*1.96);width:100%;max-width:760px;display:flex;flex-direction:column;align-items:center}
.hero__inner .kicker{margin-bottom:6px}
.hero__logo{position:relative;margin:0;width:var(--lw);animation:float 7s ease-in-out infinite}
.hero__logo img{width:100%;height:auto;filter:drop-shadow(0 0 22px rgba(183,166,255,.55)) drop-shadow(0 10px 18px rgba(0,0,30,.6))}
.hero__reflect{width:var(--lw);height:auto;transform:scaleY(-1);opacity:.25;margin:-2px 0 calc(var(--lw) * -0.4);-webkit-mask:linear-gradient(0deg,#000 0%,transparent 40%);mask:linear-gradient(0deg,#000 0%,transparent 40%);pointer-events:none;filter:blur(1px)}
@keyframes float{0%,100%{translate:0 0}50%{translate:0 -8px}}
.hero__tag{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:4px 12px;margin:0;font-stretch:125%;font-weight:800;font-size:clamp(11px,1.15vw,13px);letter-spacing:.3em;text-transform:uppercase;color:#fff}
.hero__tag i{font-style:normal;color:var(--acid);letter-spacing:0}
.hero__line{margin:6px 0 18px;font-family:var(--f-pixel);font-size:clamp(17px,1.7vw,20px);letter-spacing:.06em;color:var(--lavender)}
.hero__row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 22px}
.countdown{display:flex;gap:7px;width:290px;max-width:100%}
.countdown__cell{flex:1;min-width:0;padding:6px 3px 4px;text-align:center;background:linear-gradient(180deg,rgba(7,16,71,.85),rgba(2,6,36,.85));border:1px solid rgba(159,216,255,.35);border-radius:10px;box-shadow:inset 0 0 14px rgba(10,43,255,.5),0 0 14px rgba(10,43,255,.22)}
.countdown__cell span{display:block;font-family:var(--f-pixel);font-size:30px;line-height:1;color:#dff2ff;text-shadow:0 0 10px #3D6BFF,0 0 22px rgba(61,107,255,.8)}
.countdown__cell small{font-family:var(--f-pixel);font-size:12px;letter-spacing:.16em;color:var(--lavender);text-transform:uppercase}
.hero__cta{display:flex;flex-direction:column;align-items:center;gap:6px}
.hero__note{margin:0;font-family:var(--f-pixel);font-size:16px;color:var(--muted);max-width:34ch}
.hero__cursor{position:absolute;right:max(16px,calc(50% - 340px));bottom:16%;width:46px;image-rendering:pixelated;pointer-events:none;filter:drop-shadow(0 6px 10px rgba(0,0,0,.5));animation:tap 2.4s ease-in-out infinite}
@keyframes tap{0%,100%{transform:translate(0,0)}50%{transform:translate(-8px,-6px)}}
@media (max-width:640px){
  .hero{padding:76px 16px 36px}
  .hero__inner{--lw:min(72vw,300px)}
  .hero__cursor{display:none}
  .hero__tag{letter-spacing:.2em}
  .btn--lg{padding:14px 28px}
}

/* ---------------- marquee ---------------- */
.marquee{overflow:hidden;background:var(--electric);border-block:2px solid #fff;padding:8px 0;font-family:var(--f-pixel);font-size:22px;color:#fff;white-space:nowrap}
.marquee__track{display:inline-flex;gap:24px;animation:marquee 32s linear infinite;padding-left:24px}
.marquee i{font-style:normal;color:var(--acid)}
@keyframes marquee{to{transform:translateX(-50%)}}

/* ---------------- dont blink ---------------- */
.blink{position:relative;overflow:hidden;background:var(--uv);padding:clamp(56px,8vw,100px) var(--gutter);display:grid;grid-template-columns:1fr 1fr;grid-template-areas:"title art" "or art" "body art";gap:0 40px;align-items:center;isolation:isolate}
.blink__halftone{position:absolute;inset:0;z-index:-1;opacity:.35;background:radial-gradient(circle,#2a0080 1.2px,transparent 1.6px) 0 0/7px 7px,repeating-linear-gradient(0deg,rgba(255,255,255,.04) 0 1px,transparent 1px 4px)}
.blink__title{grid-area:title;align-self:end;position:relative;z-index:2;font-family:var(--f-display);font-stretch:125%;font-weight:900;font-size:clamp(40px,7vw,100px);line-height:.86;color:var(--acid);margin:0;text-shadow:0 4px 0 rgba(0,0,0,.25)}
.blink__or{grid-area:or;position:relative;z-index:2;font-family:var(--f-display);font-stretch:125%;font-weight:900;font-size:clamp(32px,5.4vw,76px);line-height:.88;color:var(--acid);margin:20px 0 0;text-transform:uppercase}
.blink__or small{display:block;font-size:.42em}
.blink__body{grid-area:body;max-width:42ch;color:#efe6ff;font-size:16px;margin:22px 0 0;align-self:start}
.blink__art{grid-area:art;position:relative;aspect-ratio:1;width:min(100%,520px);justify-self:center}
.blink__star{position:absolute;inset:0;width:100%;height:100%;filter:drop-shadow(0 30px 60px rgba(30,0,80,.5));animation:spin 40s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.blink__monkey{position:absolute;left:50%;bottom:0;height:94%;width:auto;max-width:none;transform:translateX(-46%);filter:saturate(1.1) contrast(1.05) drop-shadow(0 20px 30px rgba(20,0,60,.55))}
.glitch::before,.glitch::after{content:attr(data-text);position:absolute;left:0;top:0;width:100%;opacity:0;pointer-events:none}
.glitch::before{color:var(--hot-pink);clip-path:inset(0 0 55% 0)}
.glitch::after{color:#00e5ff;clip-path:inset(55% 0 0 0)}
.glitch.is-on::before{opacity:.9;transform:translate(-6px,-2px)}
.glitch.is-on::after{opacity:.9;transform:translate(6px,2px)}
@media (max-width:820px){
  .blink{grid-template-columns:1fr;grid-template-areas:"title" "art" "or" "body"}
  .blink__art{width:min(100%,360px);margin:18px auto 0}
  .blink__or{text-align:right}
}

/* ---------------- info / electric ---------------- */
.info{position:relative;overflow:hidden;padding:clamp(72px,9vw,120px) var(--gutter);background:#000a5c url(assets/electric.webp) center/cover;isolation:isolate}
.electric{position:absolute;inset:0;width:100%;height:100%;z-index:-2}
.info::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.18) 0 1px,transparent 1px 3px),radial-gradient(ellipse at center,transparent 50%,rgba(0,0,30,.55))}
.info__wall{position:absolute;left:var(--gutter);top:0;bottom:0;width:120px;z-index:-1;font-family:var(--f-pixel);font-size:14px;line-height:1.05;color:#fff;opacity:.7;overflow:hidden;white-space:pre}
.info__grid{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,64px);align-items:center}
.info__crt{position:relative;max-width:520px;justify-self:center;width:100%}
.info__crt>img{filter:drop-shadow(0 30px 50px rgba(0,0,40,.6));animation:float 9s ease-in-out infinite}
.oct-stack{position:absolute;left:50%;top:100%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;font-family:var(--f-pixel);font-size:22px;line-height:.95;color:#fff}
.oct-stack span:nth-child(2){opacity:.7}.oct-stack span:nth-child(3){opacity:.45}.oct-stack span:nth-child(4){opacity:.25}.oct-stack span:nth-child(5){opacity:.1}
.info__win{max-width:520px;width:100%;justify-self:center}
.specs{width:100%;border-collapse:collapse;font-size:14px;background:#fff;border:2px solid;border-color:var(--win-dark) #fff #fff var(--win-dark)}
.specs th,.specs td{text-align:left;padding:8px 10px;border-bottom:1px solid #d8d8d8;vertical-align:top}
.specs th{width:32%;font-weight:700;color:#000080;background:#f2f2f2}
.errstack{position:absolute;right:calc(var(--gutter) - 10px);top:36px;width:250px;transform:rotate(-4deg)}
.errstack .win{position:relative;font-size:12px}
.errstack::before,.errstack::after{content:"";position:absolute;inset:0;background:var(--win-gray);border:2px solid;border-color:#fff #000 #000 #fff;border-top:20px solid #0f2fa5}
.errstack::before{transform:translate(-14px,-14px);opacity:.85}
.errstack::after{transform:translate(-28px,-28px);opacity:.6;z-index:-1}
.win--mini .win__body{padding:12px}
.cdstack{position:absolute;right:-30px;bottom:30px;width:180px;height:180px}
.cdstack i{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle,#0b0c33 0 9%,#c9d6ff 9.5% 13%,transparent 13.5%),conic-gradient(from 20deg,#b9c6ff,#e6f3ff,#7aa0ff,#f2d0ff,#9ef0ff,#b9c6ff);box-shadow:inset 0 0 0 2px rgba(255,255,255,.7),0 10px 20px rgba(0,0,40,.35);opacity:.9}
.cdstack i:nth-child(1){transform:translate(-80px,40px) scale(.9)}.cdstack i:nth-child(2){transform:translate(-60px,30px) scale(.92)}.cdstack i:nth-child(3){transform:translate(-40px,20px) scale(.94)}.cdstack i:nth-child(4){transform:translate(-20px,10px) scale(.97)}
.cdstack i:nth-child(5){animation:spin 6s linear infinite}
.qmarks{position:absolute;left:10px;bottom:10px;width:200px;height:200px;font-family:var(--f-display);font-weight:900;font-stretch:125%;line-height:1;pointer-events:none}
.qmarks span{position:absolute;-webkit-text-stroke:2px #0820b8;text-shadow:4px 6px 0 #0614a0;background:linear-gradient(160deg,#9bb5ff,#1a3dff 50%,#0614a0);-webkit-background-clip:text;background-clip:text;color:transparent}
.qmarks span:nth-child(1){font-size:130px;left:0;bottom:-24px;transform:rotate(-12deg)}
.qmarks span:nth-child(2){font-size:80px;left:96px;bottom:70px;transform:rotate(14deg)}
.qmarks span:nth-child(3){font-size:60px;left:106px;bottom:-6px;transform:rotate(-6deg)}
@media (max-width:900px){
  .info__grid{grid-template-columns:1fr}
  .info__crt{max-width:420px;margin-bottom:96px}
  .errstack,.info__wall,.qmarks{display:none}
  .cdstack{width:120px;height:120px;right:-50px;bottom:auto;top:30px}
}

/* ---------------- section heads ---------------- */
.section-head{position:relative;max-width:var(--maxw);margin:0 auto 36px;text-align:center}
.section-head__sub{color:var(--muted);margin:14px auto 0;max-width:50ch;font-size:16px}
.section-head__sub--dark{color:#2a2a6a;font-weight:500}
.section-head--light .section-head__sub{color:#eaf2ff}

/* ================= DRESS CODE — Win98 Explorer on the "sixteen certified" wall ================= */
.dress{position:relative;overflow:hidden;background:#fff;color:var(--ink);padding:clamp(72px,9vw,120px) var(--gutter);isolation:isolate}
.dress__wall{position:absolute;inset:0;z-index:-2;font-family:var(--f-pixel);font-size:18px;line-height:1.05;white-space:pre;overflow:hidden;color:#dcd6ff}
.dress__wall b{color:var(--pixel-blue);font-weight:400}
.dress::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 50% at 50% 50%,rgba(255,255,255,.85),rgba(255,255,255,.2) 80%)}
.dress .section-head{width:fit-content;max-width:min(100%,760px);padding:18px clamp(14px,3vw,30px);background:rgba(255,255,255,.92);box-shadow:0 0 0 2px var(--pixel-blue),6px 6px 0 var(--pixel-blue)}
.blue3d{margin:0;font-family:var(--f-display);font-stretch:125%;font-weight:900;text-transform:uppercase;line-height:.95;font-size:clamp(26px,4.6vw,56px);color:#1a3dff;
  text-shadow:1px 1px 0 #0b2bd8,2px 2px 0 #0b2bd8,3px 3px 0 #0820b8,4px 4px 0 #0614a0,5px 5px 0 #0614a0,0 0 30px rgba(26,61,255,.3)}
.explorer{position:relative;z-index:1;max-width:980px;margin:0 auto}
.explorer__menu{display:flex;flex-wrap:wrap;gap:2px;padding:3px 4px;font-size:13px;border-bottom:1px solid var(--win-dark);box-shadow:0 1px 0 #fff}
.explorer__menu span{padding:2px 8px}
.explorer__addr{display:flex;align-items:center;gap:8px;padding:5px 6px;font-size:13px}
.explorer__path{flex:1;min-width:0;display:flex;align-items:center;gap:6px;background:#fff;padding:4px 6px;border:2px solid;border-color:var(--win-dark) #fff #fff var(--win-dark);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.explorer__grid{list-style:none;margin:0;padding:14px;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:6px;background:#fff;border:2px solid;border-color:var(--win-dark) #fff #fff var(--win-dark)}
.file{padding:14px 10px 12px;text-align:center;border:1px dotted transparent;transition:background .2s}
.file:hover,.file:focus-within{background:#eef2ff;border-color:#000080}
.file__ico{width:60px;height:60px;margin:0 auto 8px;display:block;filter:drop-shadow(2px 3px 0 rgba(0,0,40,.18));transition:transform .3s var(--ease)}
.file:hover .file__ico{transform:translateY(-4px) rotate(-4deg)}
.file__name{display:inline-block;margin:0 0 6px;padding:1px 4px;font:700 13px var(--f-win);color:#000;overflow-wrap:anywhere}
.file:hover .file__name{background:#000080;color:#fff}
.file p{margin:0;font:13px/1.45 var(--f-win);color:#333}
.explorer__status{display:flex;gap:3px;margin-top:3px;font-size:12px}
.explorer__status span{padding:3px 8px;border:1px solid;border-color:var(--win-dark) #fff #fff var(--win-dark)}
.explorer__status span:last-child{flex:1;text-align:right}
.sw{display:inline-block;width:12px;height:12px;border-radius:2px;vertical-align:-1px;margin-right:2px;border:1px solid #23264A}
.sw--1{background:#C7CCDA}.sw--2{background:#0A2BFF}.sw--3{background:#000}.sw--4{background:#fff}.sw--5{background:#FF4FD8}
.qmarks--dress{left:auto;right:calc(50% + 420px);bottom:auto;top:90px;z-index:0}
.dress__cd{position:absolute;right:calc(50% - 600px);top:70px;width:150px;height:150px;border-radius:50%;z-index:0;background:radial-gradient(circle,#fff 0 9%,#c9d6ff 9.5% 13%,transparent 13.5%),conic-gradient(from 20deg,#b9c6ff,#e6f3ff,#7aa0ff,#f2d0ff,#9ef0ff,#b9c6ff);box-shadow:inset 0 0 0 2px rgba(255,255,255,.8),0 14px 26px rgba(26,26,255,.25);animation:spin 8s linear infinite}
.dress__crush{position:relative;z-index:1;margin:44px auto 0;width:min(560px,100%);transform:rotate(-2.5deg);border:3px solid #fff;box-shadow:0 0 0 2px var(--pixel-blue),0 16px 40px rgba(26,26,255,.3)}
.dress__cursor{position:absolute;z-index:2;right:calc(50% - 470px);top:46%;width:44px;image-rendering:pixelated;pointer-events:none;animation:tap 2.4s ease-in-out infinite}
@media (max-width:1100px){.qmarks--dress,.dress__cursor{display:none}.dress__cd{right:-50px;top:30px;width:110px;height:110px}}
@media (max-width:560px){
  .explorer__grid{grid-template-columns:1fr 1fr;padding:8px;gap:4px}
  .file{padding:10px 4px}
  .file__ico{width:46px;height:46px}
  .file__name{font-size:11.5px}
  .file p{font-size:12px}
  .explorer__status span:last-child{display:none}
}

/* ---------------- register ---------------- */
.register{position:relative;padding:clamp(72px,9vw,120px) var(--gutter);isolation:isolate;overflow:hidden}
.register__sky{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,var(--void) 0%,rgba(4,5,26,.2) 22%,rgba(4,5,26,.15) 80%,var(--void) 100%),url(assets/computer-clouds.webp) center 20%/cover;filter:saturate(1.15)}
.register__sky::after{content:"";position:absolute;inset:0;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);background:rgba(10,43,255,.18)}
.wizard{max-width:860px;margin:0 auto;scroll-margin-top:72px}
.wizard__body{display:grid;grid-template-columns:220px 1fr}
.wizard__side{position:relative;overflow:hidden;border:2px solid;border-color:var(--win-dark) #fff #fff var(--win-dark);margin:12px 0 12px 12px;background:#0A2BFF}
.wizard__side img{width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.wizard__main{padding:16px 20px 18px;min-width:0}
.demo-badge{background:#ffffe1;border:1px solid #000;padding:7px 10px;font-size:12.5px;margin-bottom:12px}
.step__h{font-family:var(--f-win);font-size:17px;font-weight:700;margin:0 0 10px}
.progress98{height:20px;border:2px solid;border-color:var(--win-dark) #fff #fff var(--win-dark);background:#fff;padding:2px;margin-bottom:16px}
.progress98 span{display:block;height:100%;width:6%;background:repeating-linear-gradient(90deg,#000080 0 12px,transparent 12px 15px);transition:width .5s var(--ease)}
.field{margin:0 0 13px;min-width:0}
.field label{display:block;font-weight:700;margin-bottom:5px;font-size:14px}
.field input{width:100%;font:16px var(--f-win);color:#000;background:#fff;padding:8px 9px;border:2px solid;border-color:var(--win-dark) #fff #fff var(--win-dark);box-shadow:inset 1px 1px 0 #000;border-radius:0;-webkit-appearance:none;appearance:none}
.field input:focus{outline:2px solid #000080;outline-offset:1px}
.field input[aria-invalid=true]{background-color:#fff0f0;box-shadow:inset 1px 1px 0 #000,0 0 0 2px #c00000}
.field__hint{margin:4px 0 0;font-size:12.5px;color:#333}
.field__err{margin:4px 0 0;font-size:13px;color:#a00000;font-weight:700}
.field__err:empty{display:none}
.field__err:not(:empty)::before{content:"⚠ "}
.privacy{font-size:12.5px;color:#333;margin:4px 0 0}
.errsum{background:#fff;border:2px solid #c00000;padding:10px 12px;margin-bottom:14px;font-size:14px}
.errsum strong{display:block;margin-bottom:4px;color:#a00000}
.errsum ul{margin:0;padding-left:18px}
.errsum a{color:#000080}
.wizard__btns{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:16px;padding-top:14px;border-top:1px solid var(--win-dark);box-shadow:0 1px 0 #fff inset}
.spacer{flex:1}
.status{min-height:18px;margin:10px 0 0;font-size:13px;color:#000080}
@media (max-width:760px){
  .wizard__body{grid-template-columns:1fr}
  .wizard__side{display:none}
  .wizard__main{padding:14px 12px}
  .btn98{min-height:44px}
}
@media (max-width:400px){.wizard__btns .btn98{flex:1 1 100%}.wizard__btns .spacer{display:none}}

/* success + ticket */
.done__h{font-family:var(--f-win);font-size:18px;margin:0 0 6px}
.done__h:focus{outline:none}
.done__p{margin:0 0 14px;font-size:14px}
.done__hint{font-size:13px;margin:12px 0 0;text-align:center}
.pass-wrap{display:flex;justify-content:center;padding:6px 0}
.pass-img{width:min(100%,600px);height:auto;border-radius:14px;box-shadow:0 18px 40px rgba(0,0,40,.45);animation:poweron .7s var(--ease) both}
@keyframes poweron{0%{transform:scaleY(.01);filter:brightness(4)}50%{transform:scaleY(1);filter:brightness(2)}100%{filter:none}}
.notice{display:flex;gap:12px;align-items:flex-start;background:#ffffe1;border:1px solid #000;padding:12px;margin-bottom:14px;font-size:14px}
.notice p{margin:3px 0 0}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---------------- FAQ ---------------- */
.faq{padding:clamp(72px,9vw,120px) var(--gutter);background:linear-gradient(180deg,var(--void),#081063 60%,var(--void))}
.faq__list{max-width:720px;margin:0 auto;display:grid;gap:14px}
.faqd>summary{cursor:inherit;padding:7px 6px 7px 10px}
.faqd .win__body{display:flex;gap:12px;align-items:flex-start}
.faqd .win__body p{margin:0;font-size:14.5px;line-height:1.5}
.faqd:nth-child(odd){transform:rotate(-.4deg)}.faqd:nth-child(even){transform:rotate(.4deg)}

/* ---------------- sponsors ---------------- */
.sponsors{padding:60px var(--gutter);text-align:center;background:var(--electric) url(assets/electric.webp) center/cover;position:relative;isolation:isolate}
.sponsors::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(0,10,80,.55)}
.sponsors__title{font-family:var(--f-pixel);font-size:clamp(22px,3.4vw,36px);letter-spacing:clamp(.15em,1.2vw,.5em);color:#ff7be4;margin:0 0 24px;text-shadow:0 0 14px rgba(255,79,216,.6)}
.sponsors__co{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:12px 40px;font-family:var(--f-pixel);font-size:clamp(17px,2vw,22px);letter-spacing:.25em;color:#fff}

/* ---------------- closing banner ---------------- */
.outro{padding:clamp(56px,8vw,96px) var(--gutter);background:var(--void)}
.outro__card{position:relative;max-width:var(--maxw);margin:0 auto;border-radius:28px;overflow:hidden;isolation:isolate;padding:3px;background:var(--chrome);box-shadow:0 0 0 2px var(--chrome-edge),0 30px 80px rgba(10,20,120,.45),0 0 90px rgba(183,166,255,.18)}
.outro__bg{position:absolute;inset:3px;z-index:-1;border-radius:25px;background:linear-gradient(180deg,rgba(4,5,26,.15),rgba(4,5,26,.75)),url(assets/hero-sky.webp) center 70%/cover,#07071f}
.outro__bg::after{content:"";position:absolute;inset:0;border-radius:inherit;background:repeating-linear-gradient(0deg,rgba(0,0,0,.14) 0 1px,transparent 1px 3px)}
.outro__body{border-radius:25px;padding:clamp(36px,6vw,64px) clamp(18px,5vw,56px);text-align:center;display:flex;flex-direction:column;align-items:center}
.outro__logo{width:clamp(150px,20vw,230px);margin:4px 0 14px;filter:drop-shadow(0 0 22px rgba(183,166,255,.55))}
.outro__title{margin:0;font-stretch:125%;font-weight:900;text-transform:uppercase;font-size:clamp(22px,3.4vw,40px);line-height:1;background:var(--chrome);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 0 var(--chrome-edge))}
.outro__sub{margin:12px auto 20px;max-width:46ch;color:#dfe5ff;font-size:16px}
.outro__facts{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:0 0 24px;padding:0}
.outro__facts li{padding:8px 16px;border-radius:12px;background:rgba(4,5,26,.55);border:1px solid rgba(159,216,255,.3);font-family:var(--f-pixel);font-size:22px;line-height:1.1;color:#fff}
.outro__facts small{display:block;font-size:14px;letter-spacing:.2em;text-transform:uppercase;color:var(--ice)}

/* ---------------- footer ---------------- */
.foot{background:#02030f;border-top:1px solid rgba(159,216,255,.14);padding:48px var(--gutter) calc(24px + env(safe-area-inset-bottom))}
.foot__grid{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px}
.foot__brand img{width:120px;margin-bottom:10px;filter:drop-shadow(0 0 12px rgba(159,216,255,.35))}
.foot__brand p{margin:0;color:var(--muted);font-size:14px}
.foot__col h3{margin:0 0 12px;font-family:var(--f-pixel);font-weight:400;font-size:18px;letter-spacing:.2em;text-transform:uppercase;color:var(--ice)}
.foot__col a,.foot__col p{display:block;margin:0 0 8px;color:#cfd5f5;text-decoration:none;font-size:14px}
.foot__col a:hover{color:#fff}
.foot__bar{max-width:var(--maxw);margin:36px auto 0;padding-top:18px;border-top:1px solid rgba(255,255,255,.08);display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;font-family:var(--f-pixel);font-size:16px;color:var(--muted)}
@media (max-width:720px){
  .foot{padding-bottom:calc(84px + env(safe-area-inset-bottom))}
  .foot__grid{grid-template-columns:1fr 1fr;gap:26px}
  .foot__brand{grid-column:1/-1}
}

/* phone-only pieces (styled in phone.css) */
.taskbar,.section-head--phone{display:none}

/* ---------------- sticky cta ---------------- */
.sticky-cta{position:fixed;left:16px;right:16px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:60;display:none;justify-content:center;gap:8px;padding:14px;border-radius:999px;text-decoration:none;color:var(--ink);font-size:14px;font-stretch:125%;font-weight:800;text-transform:uppercase;background:var(--chrome);box-shadow:0 0 0 2px var(--chrome-edge),0 10px 30px rgba(0,0,0,.5);transform:translateY(160%);transition:transform .35s var(--ease)}
.sticky-cta.is-on{transform:none}
@media (max-width:720px){.sticky-cta{display:flex}}

/* ---------------- egg ---------------- */
.egg{position:fixed;inset:0;z-index:150;display:grid;place-items:center;background:rgba(0,0,20,.5);padding:16px}
.egg .win{max-width:360px}

/* ---------------- reveal ---------------- */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* ---------------- very small phones ---------------- */
@media (max-width:360px){
  body{font-size:15px}
  .nav{gap:8px}
  .nav__logo img{height:28px}
  .btn--sm{padding:8px 12px;font-size:11px}
  .btn--lg{padding:14px 22px;font-size:13px}
  .countdown{gap:5px}
  .countdown__cell small{font-size:11px;letter-spacing:.1em}
  .hero__note{font-size:15px}
  .hero__tag{font-size:11px;letter-spacing:.14em}
  .blue3d{font-size:24px}
  .blue3d{text-shadow:1px 1px 0 #0b2bd8,2px 2px 0 #0820b8,3px 3px 0 #0614a0}
  .marquee{font-size:19px}
  .win__body{padding:12px}
  .specs th,.specs td{padding:6px 7px;font-size:13px}
}

/* ---------------- reduced motion ---------------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none}
}