:root{--gold:#e8b84a;--cy:#34e1ff;--mu:#9aa0ac;--d:'Barlow Condensed','Arial Narrow',Impact,sans-serif;--b:'Inter',system-ui,sans-serif;color-scheme:dark}
    *{box-sizing:border-box;margin:0;padding:0}
    body{min-height:100svh;background:#07080a;color:#f4f5f7;font:400 16px/1.6 var(--b);overflow:hidden;animation:in .7s ease}
    @keyframes in{from{opacity:0}}
    body::after{content:"";position:fixed;inset:0;pointer-events:none;opacity:.05;z-index:5;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E")}
    .stage{position:relative;min-height:100svh;display:grid;place-items:center;padding:24px;overflow:hidden;
      background:radial-gradient(55% 50% at 80% 12%,rgba(52,225,255,.13),transparent),radial-gradient(55% 55% at 12% 92%,rgba(232,184,74,.16),transparent),#07080a}
    .grid{position:absolute;inset:-10% 0;background:repeating-linear-gradient(115deg,transparent 0 60px,rgba(255,255,255,.035) 60px 61px)}
    .beam{position:absolute;width:140%;height:220px;left:-20%;top:34%;background:linear-gradient(90deg,transparent,rgba(232,184,74,.12),rgba(52,225,255,.1),transparent);transform:rotate(-14deg);filter:blur(30px);animation:sw 9s ease-in-out infinite alternate}
    @keyframes sw{to{transform:rotate(-14deg) translateX(14%)}}
    .bgcrown{position:absolute;left:50%;top:50%;font-size:min(95vw,760px);line-height:1;color:rgba(232,184,74,.06);transform:translate(-50%,-50%);text-shadow:0 0 120px rgba(232,184,74,.22);animation:fl 8s ease-in-out infinite;pointer-events:none;user-select:none}
    @keyframes fl{50%{transform:translate(-50%,-53%)}}
    #pt{position:absolute;inset:0;width:100%;height:100%}
    .card{position:relative;z-index:3;width:100%;max-width:440px;padding:40px 36px 34px;background:rgba(14,16,20,.88);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.09);
      clip-path:polygon(0 0,calc(100% - 26px) 0,100% 26px,100% 100%,26px 100%,0 calc(100% - 26px));box-shadow:0 0 80px -20px rgba(232,184,74,.25)}
    .card::before{content:"";position:absolute;left:0;top:0;height:2px;width:100%;background:linear-gradient(90deg,var(--gold),var(--cy),transparent)}
    .ring{width:84px;height:84px;margin:0 auto 18px;display:grid;place-items:center;position:relative;font-size:38px;color:var(--gold);text-shadow:0 0 24px rgba(232,184,74,.7)}
    .ring::before{content:"";position:absolute;inset:0;border-radius:50%;border:1px solid rgba(232,184,74,.5);box-shadow:0 0 40px rgba(232,184,74,.2)}
    .ring::after{content:"";position:absolute;inset:-7px;border-radius:50%;border:2px solid transparent;border-top-color:var(--cy);animation:rot 2.4s linear infinite}
    @keyframes rot{to{transform:rotate(360deg)}}
    .eyebrow{text-align:center;font:700 13px var(--d);letter-spacing:.3em;text-transform:uppercase;color:var(--cy)}
    h1{text-align:center;font:800 54px/1 var(--d);text-transform:uppercase;margin:6px 0 24px;background:linear-gradient(90deg,#fff 40%,var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent}
    label{display:block;font:700 13px var(--d);letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin:14px 0 6px}
    input{width:100%;background:#0a0c10;border:1px solid rgba(255,255,255,.1);color:#fff;padding:14px;font:inherit;transition:.2s}
    input:focus{outline:0;border-color:var(--cy);box-shadow:0 0 0 3px rgba(52,225,255,.15)}
    button{width:100%;margin-top:24px;font:700 18px var(--d);letter-spacing:.16em;text-transform:uppercase;color:#0a0a0a;background:var(--gold);border:0;padding:15px;cursor:pointer;transition:.25s;
      clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px))}
    button:hover{background:#fff;box-shadow:0 0 28px rgba(232,184,74,.5)}
    .err{background:rgba(255,90,90,.08);border:1px solid rgba(255,90,90,.35);border-left:3px solid #ff5a5a;color:#ffc2c2;padding:12px 14px;margin-bottom:6px;font-size:14px}
    .back{display:block;text-align:center;margin-top:20px;color:var(--mu);font:600 14px var(--d);letter-spacing:.18em;text-transform:uppercase;text-decoration:none;transition:.2s}.back:hover{color:var(--gold)}
    @media(prefers-reduced-motion:reduce){*{animation:none!important}}
  
    .ok{background:rgba(61,220,132,.08);border:1px solid rgba(61,220,132,.35);border-left:3px solid #3ddc84;color:#c8f7da;padding:12px 14px;margin-bottom:6px;font-size:14px}
    .forgot{display:block;text-align:right;margin-top:12px;color:var(--mu);font-size:13px;text-decoration:none;transition:.2s}.forgot:hover{color:var(--cy)}
    .hint{color:var(--mu);font-size:14px;text-align:center;margin:-10px 0 8px}