:root { --bg:#070b10; --panel:#0c1218; --line:#1d2832; --red:#ff4655; --green:#38d39f; --muted:#687680; color-scheme:dark; }
* { box-sizing:border-box; }
html, body { min-height:100%; }
body { margin:0; color:#f1f4f5; background:radial-gradient(circle at 67% 45%,rgba(255,70,85,.09),transparent 27%),linear-gradient(135deg,#080d12,#05080c 68%); font-family:"Noto Sans SC",sans-serif; overflow:hidden; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.22; background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px); background-size:48px 48px; }
.scan-header { position:relative; z-index:3; display:flex; align-items:center; justify-content:space-between; height:84px; padding:0 5vw; border-bottom:1px solid var(--line); }
.scan-brand { display:grid; grid-template-columns:38px auto; grid-template-rows:auto auto; color:#fff; text-decoration:none; font-family:"Space Grotesk",sans-serif; letter-spacing:.12em; }
.scan-brand > span { grid-row:1/3; width:22px; height:28px; margin-top:3px; background:var(--red); clip-path:polygon(0 0,42% 5%,32% 70%,73% 86%,61% 100%,0 74%); }
.scan-brand strong { font-size:15px; line-height:1; }
.scan-brand small { margin-top:4px; color:#64717a; font-size:7px; }
.scan-session { display:flex; align-items:center; gap:10px; color:#66737c; font:600 9px/1 "Space Grotesk",sans-serif; letter-spacing:.16em; }
.scan-session i { width:6px; height:6px; border-radius:50%; background:#67b7ff; box-shadow:0 0 12px #67b7ff; animation:pulse 1.2s infinite; }
.scan-session b { color:#9eabb3; }
.scan-shell { position:relative; z-index:2; display:grid; grid-template-columns:minmax(390px,.8fr) minmax(480px,1.2fr); gap:5vw; align-items:center; min-height:calc(100vh - 164px); padding:4vh 7vw 8vh; }
.scan-kicker { color:#7b8790; font:600 9px/1 "Space Grotesk",sans-serif; letter-spacing:.2em; }
.scan-kicker span { display:inline-block; margin-right:12px; padding:5px 7px; color:var(--red); border:1px solid rgba(255,70,85,.45); }
.scan-copy h1 { margin:25px 0 18px; font-size:clamp(42px,5vw,76px); line-height:1.05; letter-spacing:-.05em; }
.scan-copy h1 em { color:var(--red); font-style:normal; }
.scan-copy > p { max-width:520px; color:#76838c; font-size:13px; line-height:1.9; }
.scan-steps { margin:35px 0 0; padding:0; list-style:none; border-top:1px solid var(--line); }
.scan-steps li { display:grid; grid-template-columns:40px 1fr 12px; align-items:center; min-height:66px; border-bottom:1px solid var(--line); opacity:.35; transition:.35s ease; }
.scan-steps li > span { color:#52606a; font:600 9px/1 "Space Grotesk",sans-serif; }
.scan-steps strong,.scan-steps small { display:block; }
.scan-steps strong { font-size:12px; }
.scan-steps small { margin-top:5px; color:#53616b; font:600 7px/1 "Space Grotesk",sans-serif; letter-spacing:.12em; }
.scan-steps li > i { width:7px; height:7px; border:1px solid #53616b; transform:rotate(45deg); }
.scan-steps li.active { opacity:1; }
.scan-steps li.active > span,.scan-steps li.active strong { color:#fff; }
.scan-steps li.active > i { border-color:var(--red); background:var(--red); box-shadow:0 0 12px rgba(255,70,85,.7); }
.scan-steps li.done { opacity:.7; }
.scan-steps li.done > i { border-color:var(--green); background:var(--green); }
.scanner-stage { position:relative; width:min(62vh,640px); aspect-ratio:1; justify-self:center; border:1px solid var(--line); background:rgba(8,13,18,.65); overflow:hidden; }
.scanner-grid { position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px); background-size:42px 42px; }
.scanner-orbit { position:absolute; left:50%; top:50%; border:1px solid rgba(255,70,85,.25); border-radius:50%; transform:translate(-50%,-50%); }
.orbit-a { width:68%; height:68%; }
.orbit-b { width:42%; height:42%; border-color:rgba(255,255,255,.11); }
.scanner-stage::before,.scanner-stage::after { content:""; position:absolute; left:50%; top:9%; bottom:9%; width:1px; background:rgba(255,255,255,.07); }
.scanner-stage::after { left:9%; right:9%; top:50%; width:auto; height:1px; }
.scanner-sweep { position:absolute; left:50%; top:50%; width:34%; height:2px; transform-origin:left center; background:linear-gradient(90deg,var(--red),transparent); box-shadow:0 0 14px rgba(255,70,85,.6); animation:sweep 2.4s linear infinite; }
.chase-loader { position:absolute; left:50%; top:50%; width:150px; height:150px; transform:translate(-50%,-50%); animation:rotate 2.2s linear infinite; }
.chase-loader span { position:absolute; inset:0; animation:chase 2.2s ease-in-out infinite; }
.chase-loader span::before { content:""; display:block; width:12px; height:12px; margin:0 auto; background:var(--red); transform:rotate(45deg); box-shadow:0 0 14px rgba(255,70,85,.75); }
.chase-loader span:nth-child(2){transform:rotate(60deg);animation-delay:-1.83s}.chase-loader span:nth-child(3){transform:rotate(120deg);animation-delay:-1.47s}.chase-loader span:nth-child(4){transform:rotate(180deg);animation-delay:-1.1s}.chase-loader span:nth-child(5){transform:rotate(240deg);animation-delay:-.73s}.chase-loader span:nth-child(6){transform:rotate(300deg);animation-delay:-.37s}
.scanner-core { position:absolute; left:50%; top:50%; display:grid; place-items:center; width:104px; height:104px; transform:translate(-50%,-50%); border:1px solid rgba(255,70,85,.42); background:#090e13; clip-path:polygon(15% 0,85% 0,100% 15%,100% 85%,85% 100%,15% 100%,0 85%,0 15%); }
.scanner-core span { font:700 28px/1 "Space Grotesk",sans-serif; }
.scanner-core small { margin-top:-23px; color:#66737c; font:600 7px/1 "Space Grotesk",sans-serif; letter-spacing:.15em; }
.scan-readout { position:absolute; color:#59656f; font:600 7px/1.5 "Space Grotesk",sans-serif; letter-spacing:.12em; }
.scan-readout small,.scan-readout strong { display:block; }.scan-readout strong{color:#9aa5ac;margin-top:3px}.readout-top{left:24px;top:24px}.readout-bottom{right:24px;bottom:24px;text-align:right}
.scan-progress { position:fixed; z-index:4; left:0; right:0; bottom:0; display:grid; grid-template-columns:230px 1fr 55px; align-items:center; gap:24px; height:80px; padding:0 5vw; border-top:1px solid var(--line); background:rgba(6,10,14,.94); }
.scan-progress div span,.scan-progress div strong { display:block; }.scan-progress div span{color:var(--red);font:600 8px/1 "Space Grotesk",sans-serif;letter-spacing:.15em}.scan-progress div strong{margin-top:7px;font-size:11px}.progress-track{height:2px!important;background:#1c2730}.progress-track i{display:block;width:0;height:100%;background:var(--red);box-shadow:0 0 10px rgba(255,70,85,.6);transition:width .18s linear}.scan-progress>span{font:600 11px/1 "Space Grotesk",sans-serif;color:#8d99a1;text-align:right}
.scan-error { position:fixed; z-index:10; inset:0; display:grid; place-content:center; justify-items:center; padding:30px; text-align:center; background:rgba(5,8,12,.96); }.scan-error[hidden]{display:none}.error-code{color:var(--red);font:600 9px/1 "Space Grotesk",sans-serif;letter-spacing:.2em}.scan-error h2{margin:20px 0 10px;font-size:32px}.scan-error p{max-width:560px;color:#76838c;line-height:1.8}.scan-error div{display:flex;gap:10px;margin-top:22px}.scan-error button,.scan-error a{padding:14px 20px;color:#d8dee2;border:1px solid #2a3640;background:transparent;text-decoration:none;font:600 11px/1 inherit;cursor:pointer}.scan-error button{color:#fff;background:var(--red);border-color:var(--red)}
@keyframes sweep{to{transform:rotate(360deg)}}@keyframes rotate{to{transform:translate(-50%,-50%) rotate(360deg)}}@keyframes chase{0%,100%{opacity:.25;transform:scale(.55)}45%{opacity:1;transform:scale(1)}}@keyframes pulse{50%{opacity:.35}}
@media(max-width:900px){body{overflow:auto}.scan-shell{grid-template-columns:1fr;padding:50px 24px 120px}.scanner-stage{width:min(90vw,540px);order:-1}.scan-copy h1{font-size:44px}.scan-progress{grid-template-columns:150px 1fr 42px;padding:0 22px}.scan-header{padding:0 22px}}
@media(prefers-reduced-motion:reduce){.scanner-sweep,.chase-loader,.chase-loader span,.scan-session i{animation-duration:8s}}