:root{--bg:#11101a;--ink:#f5f1ff;--muted:#aaa3bb;--accent:#c4a0ff;--lilac:#e0ceff;--line:#373044}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(ellipse at 85% 5%,#38245070 0,transparent 52%),var(--bg);color:var(--ink);font:16px/1.6 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
main{max-width:1180px;min-height:100svh;margin:auto;padding:42px 36px 28px;display:flex;flex-direction:column;justify-content:center}
.brand{display:flex;align-items:center;gap:12px;margin:0 0 28px;font-size:12px;font-weight:750;letter-spacing:2.5px;text-transform:uppercase}
.brand svg{width:30px;height:30px;color:var(--accent)}
.brand span{color:var(--muted);font-weight:450;letter-spacing:1.5px}
.hero{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:40px;align-items:center}
h1{font-size:clamp(37px,4.5vw,60px);font-weight:800;line-height:1.1;letter-spacing:-2.4px;margin:0 0 20px}
h1 span{display:block}h1 .power{color:var(--accent)}h1 .boss{color:var(--lilac)}
.intro{max-width:600px;color:var(--muted);font-size:19px;margin:0}
.qr-card{padding:22px;background:#211a2f;border:1px solid #534064;border-radius:15px;text-align:center}
.qr-label{margin:0 0 12px;font-size:15px;font-weight:750}
.qr-card a.qr{display:block;width:176px;max-width:100%;margin:auto;background:#fff;border-radius:5px;overflow:hidden}
.qr-card img{display:block;width:100%;height:auto;image-rendering:pixelated}
.qr-card p{font-size:13px;line-height:1.5;color:var(--muted);margin:12px 0 0}
.qr-card strong{color:var(--ink)}
.status-link{display:inline-block;margin-top:10px;color:var(--accent);font-size:13px;text-underline-offset:4px}
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;list-style:none;padding:0;margin:44px 0 24px}
.step{position:relative;padding:25px 23px 22px;background:#211a2f;color:var(--ink);border:1px solid #534064;border-radius:10px;box-shadow:4px 7px 0 #0003}
.step:nth-child(2){background:#291e39}.step:nth-child(3){background:#241c33}
.step:before{content:"";position:absolute;top:-7px;left:calc(50% - 25px);width:50px;height:15px;background:#c4a0ff55;transform:rotate(-4deg)}
.number{font-size:12px;letter-spacing:2px;font-weight:800;color:var(--accent)}
.step h2{font-size:23px;letter-spacing:-.5px;line-height:1.2;margin:10px 0 12px}
.step p{font-size:15px;line-height:1.6;margin:0}
.step a{display:inline-block;color:var(--accent);margin-top:18px;font-size:14px;font-weight:800;text-underline-offset:5px}
footer{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:18px;font-size:13px;color:var(--muted)}
footer strong{color:var(--ink)}
a:focus-visible{outline:3px solid currentColor;outline-offset:5px}
@media(max-width:820px){main{padding:30px 22px}.hero{grid-template-columns:minmax(0,1fr) 210px;gap:20px}.qr-card{padding:18px 15px}.qr-card a.qr{width:150px}h1{letter-spacing:-1.5px;font-size:clamp(34px,5.8vw,47px)}.intro{font-size:17px}.steps{gap:14px}.step{padding:22px 17px}.step h2{font-size:21px}}
@media(max-width:620px){main{justify-content:flex-start}.brand{flex-wrap:wrap;font-size:11px;margin-bottom:23px}.hero{grid-template-columns:1fr}.intro{max-width:100%}.qr-card{display:grid;grid-template-columns:120px 1fr;gap:0 18px;align-items:center;text-align:left;padding:18px}.qr-card .qr-label{grid-column:2;grid-row:1;margin:0;align-self:end}.qr-card a.qr{grid-column:1;grid-row:1/4;width:120px}.qr-card p{grid-column:2;grid-row:2;margin:5px 0}.status-link{grid-column:2;grid-row:3;margin:2px 0;align-self:start}.steps{grid-template-columns:1fr;gap:23px;margin-top:28px}.step{padding:22px}.step h2{display:inline;margin-left:10px}.step p{margin-top:12px}footer{font-size:12px}h1{font-size:clamp(34px,8vw,46px)}}
@media print{body{background:#fff;color:#221232}main{min-height:0;max-width:none;padding:12px}.hero{grid-template-columns:1fr 220px}.brand span,.intro,footer{color:#534064}h1 .power{color:#65418d}h1 .boss{color:#65418d}.qr-card{background:#fff;color:#221232}.qr-card p,.qr-card strong,.status-link{color:#221232}.steps{margin-top:30px}.step,.step:nth-child(2),.step:nth-child(3){background:#f3edfc;color:#221232;box-shadow:none;border:1px solid #b9a8cd;break-inside:avoid;-webkit-print-color-adjust:exact;print-color-adjust:exact}footer strong{color:#221232}}
