:root{color-scheme:dark;--purple:#28123f;--yellow:#ffdc25;--paper:#fffaf0;--muted:#d3c4df;--duration:2200ms}
    *{box-sizing:border-box}
    body{margin:0;background:var(--purple);color:var(--paper);font-family:ui-rounded,"SF Pro Rounded","Arial Rounded MT Bold",system-ui,sans-serif}
    main{min-height:100svh;display:grid;place-items:center;padding:40px 24px 76px;overflow:hidden;position:relative;isolation:isolate}
    main::before{content:"";position:absolute;width:min(900px,150vw);aspect-ratio:1;top:50%;left:50%;transform:translate(-50%,-53%);border:1px solid #ffffff09;border-radius:50%;box-shadow:0 0 0 85px #ffffff03,0 0 0 170px #ffffff02;z-index:-1}
    .content{width:100%;max-width:600px;text-align:center}
    .brand{width:min(88%,390px);height:auto;display:block;margin:0 auto 42px;filter:drop-shadow(0 16px 18px #12071d66);transform-origin:50% 75%;animation:arrive 900ms cubic-bezier(.16,1,.3,1) both}
    h1{font-size:clamp(36px,7vw,60px);font-weight:800;letter-spacing:-.055em;line-height:1.06;margin:0 auto 22px;max-width:520px;text-wrap:balance}
    .intro{font-size:clamp(16px,2.5vw,19px);line-height:1.55;color:var(--muted);margin:0 auto 30px;max-width:360px}
    .progress{width:166px;height:4px;background:#fff2;border-radius:10px;overflow:hidden;margin:0 auto 14px}
    .progress::after{content:"";display:block;background:var(--yellow);height:100%;transform-origin:left;animation:progress var(--duration) linear both}
    .status{font-size:14px;color:var(--muted);margin:0 0 27px;min-height:22px}
    .cta{display:inline-flex;align-items:center;justify-content:center;gap:11px;min-height:58px;padding:16px 27px;border-radius:18px;background:var(--yellow);color:#28123f;font-weight:750;font-size:16px;line-height:1.3;text-decoration:none;box-shadow:0 5px 0 #ba9700;transition:transform 150ms,box-shadow 150ms}
    .cta:hover{transform:translateY(-2px);box-shadow:0 7px 0 #ba9700}
    .cta:active{transform:translateY(3px);box-shadow:0 2px 0 #ba9700}
    .cta:focus-visible{outline:3px solid white;outline-offset:6px}
    .cta svg{width:22px;height:22px;flex:none}
    footer{position:absolute;bottom:24px;left:20px;right:20px;text-align:center;color:#bba9ca;font-size:12px;letter-spacing:.025em}
    noscript p{font-size:14px;color:var(--muted)}
    @keyframes arrive{from{opacity:0;transform:perspective(700px) translateY(38px) rotateX(15deg) rotateZ(-5deg) scale(.85)}to{opacity:1;transform:perspective(700px) translateY(0) rotateX(0) rotateZ(0) scale(1)}}
    @keyframes progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
    @media(max-width:480px){main{padding:34px 24px 74px}.brand{margin-bottom:38px}h1{font-size:42px}.intro{max-width:300px}.cta{width:100%;max-width:330px}}
    @media(max-height:640px){main{padding-top:25px}.brand{width:250px;margin-bottom:24px}h1{font-size:36px}.intro{margin-bottom:18px}.status{margin-bottom:18px}}
    @media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.progress::after{transform:scaleX(1)}}
[hidden]{display:none!important}
noscript a{color:var(--yellow)}
