:root{
  --bg:#0d0d16;
  --bg2:#12121c;
  --surface:#15151f;
  --surface2:#1c1c2a;
  --line:rgba(230,180,80,.16);
  --line2:rgba(255,255,255,.08);
  --gold:#e6b450;
  --gold2:#f9e29c;
  --gold3:#c4922f;
  --text:#ececf2;
  --muted:#9292a4;
  --muted2:#67677a;
  --green:#5fd08a;
  --radius:8px;
  --serif:"Playfair Display",Georgia,serif;
  --sans:"Inter",system-ui,sans-serif;
  --gold-grad:linear-gradient(135deg,#f9e29c 0%,#e6b450 48%,#c4922f 100%);
}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;background:var(--bg);color:var(--text);font-family:var(--sans);background-image:radial-gradient(900px 520px at 80% -12%,rgba(230,180,80,.09),transparent 60%),radial-gradient(720px 520px at -12% 110%,rgba(121,183,255,.07),transparent 60%);background-attachment:fixed}
a{color:inherit;text-decoration:none}
button,input{font:inherit}
.auth-bg{position:fixed;inset:0;pointer-events:none;background:linear-gradient(120deg,rgba(255,255,255,.03),transparent 36%,rgba(230,180,80,.035));opacity:.9}
.auth-page{min-height:100vh;display:grid;grid-template-columns:1.04fr .96fr}
.auth-page.single{display:grid;place-items:center;padding:28px}
.auth-panel{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:52px 58px;border-right:1px solid var(--line2);overflow:hidden}
.auth-panel:before{content:"";position:absolute;right:-160px;bottom:-160px;width:420px;height:420px;border:1px solid var(--line);border-radius:50%;box-shadow:0 0 90px rgba(230,180,80,.08) inset}
.brand-row{display:flex;align-items:center;gap:13px;position:relative}
.brand-row.compact{justify-content:center;margin-bottom:24px}
.brand-mark{width:48px;height:48px;border-radius:14px;background:var(--bg2);border:1px solid var(--line);display:grid;place-items:center;color:var(--gold2);font-family:var(--serif);font-weight:800;box-shadow:inset 0 0 30px rgba(230,180,80,.08)}
.brand-name{font-family:var(--serif);font-size:24px;font-weight:800}
.brand-name span{color:var(--gold)}
.auth-copy{position:relative;max-width:520px}
.eyebrow{color:var(--gold);font-size:11px;text-transform:uppercase;font-weight:800;letter-spacing:2px;margin-bottom:12px}
.auth-copy h1{font-family:var(--serif);font-size:clamp(38px,4.8vw,62px);line-height:1.05;margin:0 0 18px}
.auth-copy p{color:var(--muted);font-size:16px;max-width:430px;margin:0}
.feature-list{display:grid;gap:16px;margin-top:38px}
.feature-item{display:flex;gap:13px;align-items:center}
.feature-item>span{width:38px;height:38px;border-radius:10px;background:rgba(230,180,80,.1);color:var(--gold);display:grid;place-items:center;flex:none}
.feature-item strong{display:block;font-size:14px}
.feature-item small{display:block;color:var(--muted);font-size:12px}
footer{color:var(--muted2);font-size:12px;position:relative}
.auth-card{align-self:center;justify-self:center;width:min(420px,calc(100vw - 36px));background:var(--surface);border:1px solid var(--line2);border-radius:12px;padding:30px;box-shadow:0 30px 90px rgba(0,0,0,.28)}
.auth-card h2{font-family:var(--serif);font-size:30px;line-height:1.1;margin:0 0 8px}
.auth-subtitle{margin:0 0 22px;color:var(--muted);font-size:14px}
.tab-row{display:grid;grid-template-columns:1fr 1fr;gap:7px;background:var(--bg2);border:1px solid var(--line2);border-radius:10px;padding:5px;margin-bottom:18px}
.tab-btn{text-align:center;border-radius:8px;padding:9px 12px;color:var(--muted);font-weight:800;font-size:13px}
.tab-btn.active{background:var(--surface2);color:var(--gold2)}
.auth-messages{display:grid;gap:8px;margin-bottom:14px}
.auth-message{display:flex;align-items:center;gap:9px;border:1px solid var(--line2);background:var(--surface2);border-radius:var(--radius);padding:11px 12px;font-size:13px}
.auth-message.success i{color:var(--green)}
.auth-message.error i{color:#ff8080}
.auth-form{display:block}
.role-tabs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:18px}
.role-tab{cursor:pointer;border:1px solid var(--line2);background:var(--bg2);border-radius:10px;padding:13px 12px;text-align:center;display:block}
.role-tab input{position:absolute;opacity:0;pointer-events:none}
.role-tab span{width:34px;height:34px;border-radius:9px;background:var(--surface2);color:var(--muted);display:grid;place-items:center;margin:0 auto 8px}
.role-tab:has(input:checked){border-color:var(--gold);background:rgba(230,180,80,.08)}
.role-tab:has(input:checked) span{background:var(--gold-grad);color:#1b1306}
.role-tab b{display:block;font-size:14px}
.role-tab small{display:block;color:var(--muted);font-size:11px}
.form-field{display:block;margin-bottom:16px}
.form-field>span{display:block;color:var(--muted);font-size:12px;text-transform:uppercase;font-weight:800;margin-bottom:7px}
.field-control{position:relative}
.field-control>i{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--gold);font-size:14px}
.field-control input{width:100%;border:1px solid var(--line2);border-radius:10px;background:var(--bg2);color:var(--text);padding:12px 42px;outline:0}
.field-control input:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(230,180,80,.12)}
.password-toggle{position:absolute;right:7px;top:50%;transform:translateY(-50%);width:34px;height:34px;border:0;border-radius:8px;background:transparent;color:var(--muted);cursor:pointer}
.password-toggle:hover{background:var(--surface2);color:var(--gold)}
.form-field small{display:block;color:#ff9b9b;margin-top:6px;font-size:12px}
.auth-extra{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:4px 0 18px;color:var(--muted);font-size:13px}
.auth-extra a,.auth-footer a{color:var(--gold2);font-weight:800}
.primary-btn{width:100%;border:0;border-radius:10px;padding:13px 18px;background:var(--gold-grad);color:#1b1306;font-weight:900;cursor:pointer;box-shadow:0 18px 40px -24px rgba(230,180,80,.8)}
.auth-footer{text-align:center;color:var(--muted);font-size:13px;margin:16px 0 0}
.trust-row{margin-top:18px;color:var(--muted2);font-size:12px;text-align:center;border-top:1px solid var(--line2);padding-top:16px}
.otp-form .field-control input{text-align:center;letter-spacing:8px;font-size:22px;font-weight:800;padding-left:42px}
.company-register-page .auth-card{width:min(760px,calc(100vw - 36px));margin:28px auto}
.company-form{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.company-form .form-field:first-child,.company-form .form-field:nth-child(2),.company-form .form-field:last-of-type{grid-column:1/-1}
.subscribe-page{min-height:100vh;display:grid;grid-template-columns:.85fr 1.15fr;gap:28px;padding:42px;align-items:start}
.subscribe-intro,.subscribe-plans{background:var(--surface);border:1px solid var(--line2);border-radius:12px;padding:30px}
.subscribe-intro>span{display:block;color:var(--gold);font-size:11px;text-transform:uppercase;letter-spacing:2px;font-weight:800;margin-top:18px}
.subscribe-intro h1,.subscribe-plans h2{font-family:var(--serif);line-height:1.1;margin:10px 0 12px}
.subscribe-intro h1{font-size:38px}.subscribe-plans h2{font-size:26px}
.subscribe-intro p{color:var(--muted)}
.subscribe-intro ul,.front-plan-card ul{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:10px;color:var(--muted)}
.subscribe-intro li i,.front-plan-card li i{color:var(--gold);margin-right:8px}
.plan-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.front-plan-card{position:relative;background:var(--bg2);border:1px solid var(--line2);border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:12px}
.front-plan-card.featured{border-color:var(--line);box-shadow:0 20px 50px -35px rgba(230,180,80,.8)}
.front-plan-card>i{width:42px;height:42px;border-radius:10px;background:rgba(230,180,80,.1);display:grid;place-items:center;color:var(--gold)}
.front-plan-card h3{font-family:var(--serif);font-size:22px;margin:0}
.front-plan-price{font-size:24px;font-weight:900;color:var(--gold2)}
.front-plan-price span{display:block;font-size:12px;color:var(--muted);font-weight:600}
.plan-badge{position:absolute;top:12px;right:12px;border-radius:999px;background:rgba(230,180,80,.12);color:var(--gold2);padding:5px 10px;font-size:11px}
@media(max-width:900px){
  .auth-page{display:block}.auth-panel{display:none}.auth-card{margin:42px auto}.auth-page.single{display:grid}.subscribe-page{display:block;padding:28px 18px}.subscribe-intro{margin-bottom:16px}
}
@media(max-width:480px){
  .auth-card{padding:24px}.role-tabs{grid-template-columns:1fr}.auth-extra{display:block}.auth-extra a{display:block;margin-top:8px}.company-form{grid-template-columns:1fr}
}
