:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;background:#000;color:#fff}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#000}
body{min-height:100dvh}
main{min-height:100dvh;display:grid;place-items:center;padding:max(24px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left))}
.card{width:min(100%,620px);padding:clamp(26px,6vw,52px);border:1px solid #3b3b3b;border-radius:28px;background:linear-gradient(145deg,#171717,#080808 68%);box-shadow:0 28px 80px rgba(0,0,0,.55)}
.eyebrow{margin:0 0 20px;color:#c9c9c9;text-transform:uppercase;letter-spacing:.22em;font-size:12px;font-weight:700}
.icon{display:block;border-radius:25%;margin:0 0 26px;box-shadow:0 12px 30px rgba(0,0,0,.45)}
h1{margin:0;font-size:clamp(34px,8vw,58px);line-height:1.02;letter-spacing:-.035em}
.summary{margin:22px 0 26px;color:#d0d0d0;font-size:18px;line-height:1.55}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:10px}
.actions a,.actions button{appearance:none;min-height:50px;border-radius:999px;padding:14px 22px;font:inherit;font-size:16px;font-weight:700;text-decoration:none;cursor:pointer;touch-action:manipulation}
.primary{background:#fff;color:#000;border:1px solid #fff}
.secondary{background:#171717;color:#fff;border:1px solid #777}
.actions a:focus-visible,.actions button:focus-visible{outline:3px solid #fff;outline-offset:4px}
.status{min-height:1.5em;margin:8px 0 24px;color:#d5d5d5;line-height:1.5}
.instructions{border-top:1px solid #343434;padding-top:22px}
.instructions h2{font-size:18px;margin:0 0 14px}
.instructions p{color:#c7c7c7;line-height:1.55;margin:0 0 12px}
.connection{margin:20px 0 0;color:#949494;font-size:14px}
@media(max-width:520px){main{display:block;padding:0}.card{min-height:100dvh;border:0;border-radius:0;padding:calc(30px + env(safe-area-inset-top)) max(22px,env(safe-area-inset-right)) calc(30px + env(safe-area-inset-bottom)) max(22px,env(safe-area-inset-left));box-shadow:none}.actions{display:grid}.actions a,.actions button{text-align:center;width:100%}}
@media(prefers-reduced-motion:no-preference){.card{animation:arrive .35s ease-out both}@keyframes arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}}
