:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui, sans-serif; background: #080d16; color: #eef3ff; }
    * { box-sizing: border-box; }
    body { margin: 0; min-height: 100vh; display: grid; place-items: center; padding: 32px 20px; background: radial-gradient(ellipse at 15% 0%, #193147 0, transparent 55%), radial-gradient(ellipse at 95% 85%, #182139 0, transparent 50%); }
    main { width: min(100%, 760px); border: 1px solid #26364a; border-radius: 28px; padding: clamp(24px, 5vw, 48px); background: #0e1725ed; box-shadow: 0 30px 100px #0006; }
    h1 { margin: 22px 0 12px; font-size: clamp(2rem, 5vw, 3rem); letter-spacing: -.045em; line-height: 1.1; }
    h2 { margin: 0 0 14px; font-size: 1.1rem; }
    p { color: #bdc9e9; line-height: 1.5; }
    button, .aea-open { display: inline-block; margin-top: 16px; min-height: 52px; padding: 15px 24px; border-radius: 14px; border: 1px solid #7be0d6; background: #8be9dd; color: #09232c; font: inherit; font-weight: 700; text-decoration: none; cursor: pointer; transition: transform .15s, background .15s; }
    button:hover, .aea-open:hover { background: #b3f6eb; transform: translateY(-1px); }
    button:focus-visible, a:focus-visible, summary:focus-visible { outline: 3px solid #a9c7ff; outline-offset: 4px; }
    button:disabled { opacity: .55; cursor: wait; }
    .status { margin-top: 24px; padding: 16px 18px; border-radius: 14px; border: 1px solid #304257; background: #101e2d; color: #d6e5f4; line-height: 1.5; }
    .status[data-state="error"] { color: #ff9c9c; }
    .aea-screen { margin-top: 20px; padding: 18px; border-radius: 16px; background: #081020; border: 1px solid #1f3155; }
    .aea-qr { display: grid; place-items: center; margin: 12px 0; background: #fff; border-radius: 14px; padding: 14px; overflow: auto; }
    .aea-qr svg { max-width: min(100%, 520px); height: auto; }
    .aea-small { font-size: .92rem; color: #aebce0; word-break: break-all; }
    code { color: #91ffbd; }
    .brand { display:flex; align-items:center; gap:12px; font-weight:700; letter-spacing:.08em; font-size:.85rem; }
    .mark { display:grid; place-items:center; width:38px; height:38px; border-radius:12px; background:#8be9dd; color:#09232c; font-size:1.25rem; }
    .badge { margin-left:auto; border:1px solid #536147; border-radius:99px; padding:6px 10px; color:#e4dbaf; font-size:.7rem; letter-spacing:.03em; }
    .intro { max-width:52ch; font-size:1.05rem; }
    .steps { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:28px 0; }
    .step { padding:16px 12px; border:1px solid #27394e; border-radius:14px; color:#c7d7e8; font-size:.85rem; }
    .step b { display:block; color:#8be9dd; margin-bottom:9px; font-size:.75rem; letter-spacing:.08em; }
    .disclosure { border-top:1px solid #27394e; margin-top:28px; padding-top:18px; font-size:.8rem; color:#97abc2; }
    .suite { color:#acc5df; font-size:.75rem; letter-spacing:.025em; }
    details { margin-top:18px; color:#aebce0; font-size:.8rem; overflow-wrap:anywhere; }
    @media(prefers-reduced-motion:reduce) { button,.aea-open { transition:none; } }