:root { color: #172033; background: #f7f9fc; font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-synthesis: none; }
* { box-sizing: border-box; }
body { min-width: 320px; margin: 0; }
.access-shell { min-height: 100vh; display: grid; place-items: center; padding: 28px 18px; background: radial-gradient(circle at 20% 10%, rgba(73,108,255,.1), transparent 30%), radial-gradient(circle at 85% 85%, rgba(64,202,166,.1), transparent 28%), #f7f9fc; }
.access-card { width: min(100%, 470px); padding: 34px; background: rgba(255,255,255,.97); border: 1px solid #dae0ea; border-radius: 24px; box-shadow: 0 30px 90px rgba(29,40,70,.12); }
.access-mark { display: flex; width: 32px; height: 28px; align-items: center; gap: 3px; }
.access-mark i { width: 6px; height: 6px; background: #00aa63; border-radius: 50%; }.access-mark i:nth-child(2){background:#00a4e8}.access-mark i:nth-child(3){background:#ff4f64}.access-mark i:nth-child(4){background:#ff9c00}
.access-eyebrow { display: block; margin-top: 24px; color: #335cff; font-size: 11px; font-weight: 800; letter-spacing: 1.4px; text-transform: uppercase; }
.access-purchase { display: grid; gap: 7px; margin: 18px 0 25px; padding: 16px; color: #3f4d64; background: #f5f7ff; border: 1px solid #e0e7ff; border-radius: 13px; }.access-purchase b{color:#25324a;font-size:13px;line-height:1.45}.access-purchase span{font-size:12px;font-weight:650}.access-purchase a{color:#315ae9;font-size:11px;line-height:1.4;overflow-wrap:anywhere;text-decoration:none}.access-purchase a:hover{text-decoration:underline}
h1 { margin: 0 0 19px; font-size: 28px; line-height: 1.18; letter-spacing: -.7px; }.access-card label{display:block;margin:0 0 7px;color:#3d485d;font-size:13px;font-weight:700}.access-card input{width:100%;height:48px;padding:0 14px;border:1px solid #dce2eb;border-radius:11px;color:#172033;font:650 14px ui-monospace, SFMono-Regular, Menlo, monospace;letter-spacing:.7px;outline:none}.access-card input:focus{border-color:#7690ff;box-shadow:0 0 0 4px rgba(51,92,255,.1)}.access-card button{width:100%;height:49px;margin-top:14px;border:0;border-radius:10px;color:white;background:#335cff;box-shadow:0 7px 16px rgba(51,92,255,.18);font-size:14px;font-weight:750}.access-card button:active{background:#2348e4}.access-note{margin:21px 0 0;color:#8490a2;font-size:12px;line-height:1.45;text-align:center}.access-error{margin:-4px 0 14px;padding:10px 12px;color:#b83243;background:#fff1f3;border:1px solid #ffd7dc;border-radius:10px;font-size:12px;line-height:1.4}
@media (max-width:500px){.access-shell{padding:18px}.access-card{padding:27px 22px;border-radius:18px}h1{font-size:25px}}