:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}
*{box-sizing:border-box}
body{min-height:100vh;margin:0;color:#f5f7fb;background:radial-gradient(circle at 75% 12%,#29415a 0,#101a29 44%,#080e18 100%)}
.cover{position:fixed;inset:0;z-index:0;overflow:hidden;background:#101a29}
.cover img{display:block;width:100%;height:100%;object-fit:cover;opacity:.4}
.cover:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,11,20,.94),rgba(5,11,20,.72) 48%,rgba(5,11,20,.3)),linear-gradient(0deg,rgba(5,11,20,.78),transparent 55%)}
main{position:relative;z-index:1;width:min(100% - 40px,680px);min-height:100vh;margin:auto;display:flex;flex-direction:column;justify-content:center;padding:70px 0}
.eyebrow,.card-label,label{font-size:12px;font-weight:750;letter-spacing:.16em}
.eyebrow{color:#8ee0cc;margin-bottom:18px}
h1{font-size:clamp(38px,7vw,72px);line-height:1.03;letter-spacing:-.055em;margin:0;max-width:650px;text-wrap:balance;text-shadow:0 3px 22px #0007}
.intro{color:#d0d9e4;font-size:18px;margin:18px 0 34px}
.key-card{padding:clamp(26px,5vw,42px);border:1px solid #ffffff30;border-radius:26px;background:linear-gradient(145deg,#182437ef,#101a2ce8);box-shadow:0 26px 85px #0008}
.card-label{display:flex;align-items:center;gap:10px;color:#8ee0cc}
.status-dot{width:8px;height:8px;border-radius:50%;background:#7fe0c1;box-shadow:0 0 13px #7fe0c1}
h2{font-size:clamp(24px,4vw,32px);letter-spacing:-.035em;margin:24px 0 12px}
.warning{color:#c7d1df;line-height:1.65;margin:0 0 28px}
.warning strong{color:#fff}
button,input{font:inherit}
button{border:0;border-radius:12px;padding:15px 22px;background:#9be8cf;color:#09231e;font-weight:750;cursor:pointer;transition:background .2s,transform .2s}
button:hover{background:#c2f6e5;transform:translateY(-1px)}
button:focus-visible,input:focus-visible{outline:3px solid #fff;outline-offset:3px}
button:disabled{opacity:.65;cursor:wait}
#revealKey{min-width:180px;display:flex;justify-content:space-between;gap:25px}
#revealKey[hidden],#keyResult[hidden]{display:none}
#keyResult{display:grid;gap:12px}
#keyResult label{color:#9be8cf}
#shownKey{width:100%;padding:16px;border:1px solid #ffffff40;border-radius:12px;background:#081321;color:#fff;font-size:18px;letter-spacing:.04em}
#copyKey{justify-self:start}
.save-note{margin:4px 0 0;color:#b8c8d6;font-size:14px}
#keyError{color:#ffb2b2;margin:14px 0 0}
#keyError:empty{display:none}
@media(max-width:600px){main{width:min(100% - 32px,680px);padding:48px 0;justify-content:center}.cover:after{background:linear-gradient(0deg,#07101bee,#07101bb8 65%,#07101b91)}.key-card{border-radius:20px}}