:root{--bg:#050A26;--ink:#F4EEE3;--ink-2:#B4B8C9;--ink-3:#8F95AB;--label:#C9CCDA;--line:#5C6285;--gold:#DC9629;--gold-soft:#E8C27E;color-scheme:dark;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
*,*::before,*::after{box-sizing:border-box}
html{height:100%;background:var(--bg)}
body{margin:0;min-height:100%;background:var(--bg);color:var(--ink);font-family:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;-webkit-font-smoothing:antialiased}
.wrap{display:flex;min-height:100vh}
main{flex:1 1 520px;display:flex;flex-direction:column;align-items:center;padding:64px 48px 40px;gap:56px}
aside{flex:1 1 520px;position:relative;overflow:hidden;border-left:1px solid rgba(220,150,41,.45);min-height:420px}
aside img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.scrim{position:absolute;left:0;right:0;bottom:0;height:46%;background:linear-gradient(to top,rgba(5,10,38,.96) 0%,rgba(5,10,38,.85) 38%,rgba(5,10,38,0) 100%)}
.cap{position:absolute;right:56px;bottom:56px;margin:0;padding-left:18px;border-left:2px solid var(--gold);font-size:14px;font-weight:600;letter-spacing:.22em;line-height:1.9;color:#fff;text-shadow:0 1px 12px rgba(5,10,38,.9)}
.logo{display:flex;flex-direction:column;align-items:center;gap:16px;margin-top:auto}
.mark{position:relative;width:104px;height:104px}
.mark svg,.mark img{position:absolute;inset:0;width:100%;height:100%}
.word{width:228px;height:auto;display:block}
.form{display:flex;flex-direction:column;gap:36px;max-width:420px;width:100%}
.head{display:flex;flex-direction:column;gap:10px;text-align:center}
.eyebrow{margin:0 0 4px;font-size:11px;font-weight:600;letter-spacing:.32em;color:var(--gold)}
h1{margin:0;font-family:'Fraunces',Georgia,serif;font-weight:500;font-size:44px;line-height:1.05;letter-spacing:-.02em;color:var(--ink)}
.sub{margin:0;font-size:15px;color:var(--ink-2)}
.fields{display:flex;flex-direction:column;gap:20px}
.lbl{display:flex;flex-direction:column;gap:8px}
.lt{font-size:12px;font-weight:600;letter-spacing:.08em;color:var(--label)}
.fld{position:relative;display:flex;align-items:center}
.din{width:100%;height:52px;padding:0 48px 0 16px;border:1px solid var(--line);border-radius:4px;background:rgba(255,255,255,.025);font:inherit;font-size:15px;color:var(--ink);transition:border-color .2s,background .2s}
.din::placeholder{color:#7D839B}
.din:focus{border-color:var(--gold);background:rgba(220,150,41,.05);outline:none}
.eye{position:absolute;right:4px;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border:0;background:none;color:#AEB3C7;cursor:pointer;border-radius:4px}
.row{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:14px}
.rem{display:inline-flex;align-items:center;gap:10px;min-height:44px;color:#D9DCE6;cursor:pointer}
.rem input{width:18px;height:18px;accent-color:var(--gold);margin:0}
.fg{color:#D9DCE6;text-decoration:underline;text-decoration-color:rgba(217,220,230,.35);text-underline-offset:4px;transition:color .2s,text-decoration-color .2s}
.fg:hover{color:var(--gold-soft);text-decoration-color:var(--gold-soft)}
.bp{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;height:52px;border:0;border-radius:4px;background:linear-gradient(135deg,#F0CB82 0%,#DC9629 52%,#B9842F 100%);color:#050A26;font:inherit;font-weight:600;font-size:15px;letter-spacing:.04em;text-decoration:none;cursor:pointer;box-shadow:0 1px 0 rgba(255,255,255,.25) inset,0 8px 24px rgba(220,150,41,.18);transition:filter .2s,box-shadow .2s}
.bp:hover{filter:brightness(1.06);box-shadow:0 1px 0 rgba(255,255,255,.3) inset,0 10px 28px rgba(220,150,41,.28);color:#050A26}
.bp svg{transition:transform .25s cubic-bezier(.2,.7,.2,1)}
.bp:hover svg{transform:translateX(4px)}
.bp[disabled]{opacity:.7;cursor:progress}
.alert{margin:0;padding:12px 14px;border-radius:4px;font-size:14px;line-height:1.45}
.alert.error{background:rgba(220,80,60,.12);border:1px solid rgba(240,120,100,.45);color:#FFD7CF}
.alert.info{background:rgba(220,150,41,.08);border:1px solid rgba(220,150,41,.35);color:var(--gold-soft)}
.foot{margin:auto 0 0;font-size:12px;letter-spacing:.08em;color:var(--ink-3);text-align:center}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
a{color:var(--gold-soft)}
button:focus-visible,input:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.ring-draw{stroke-dasharray:594;stroke-dashoffset:594;animation:ringDraw 1.6s cubic-bezier(.65,0,.35,1) .2s forwards}
@keyframes ringDraw{to{stroke-dashoffset:0}}
.inner{animation:rise .9s cubic-bezier(.2,.7,.2,1) 1.2s both}
@keyframes rise{from{clip-path:inset(100% 0 0 0);transform:translateY(6px)}to{clip-path:inset(0 0 0 0);transform:none}}
.run{opacity:0;animation:dotIn .6s ease-out 1.8s forwards}
.run circle{animation:dot 4.5s linear 1.8s infinite}
@keyframes dotIn{to{opacity:1}}
@keyframes dot{from{stroke-dashoffset:0}to{stroke-dashoffset:-594}}
@media (prefers-reduced-motion: reduce){.ring-draw{animation:none;stroke-dashoffset:0}.inner{animation:none}.run{display:none}}
@media (max-width: 860px){aside{display:none}main{padding:48px 24px 32px;gap:44px}h1{font-size:38px}}
.shell{max-width:560px;text-align:center;display:flex;flex-direction:column;gap:28px;align-items:center}
.ghost{display:inline-flex;align-items:center;justify-content:center;height:48px;padding:0 22px;border:1px solid var(--line);border-radius:4px;color:var(--ink);text-decoration:none;font-weight:600;font-size:14px}
.ghost:hover{border-color:var(--gold);color:var(--gold-soft)}
.actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}