@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400;0,500;1,400&family=Montserrat:wght@400;600;800&display=swap');

:root { --bg:#050505; --paper:#f5f5f5; --muted:rgba(255,255,255,.5); --soft:rgba(255,255,255,.75); --line:rgba(255,255,255,.18); --accent:#fff; --red:#f0796e; }
* { box-sizing:border-box; }
html,body { margin:0; min-height:100%; font-family:Montserrat,Arial,sans-serif; }
body { min-height:100dvh; overflow-x:hidden; overflow-y:auto; background:var(--bg); color:var(--paper); }
.grain { position:fixed; inset:0; z-index:20; pointer-events:none; opacity:.035; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.orb { position:fixed; width:32vw; height:32vw; border-radius:50%; filter:blur(100px); opacity:.08; pointer-events:none; }
.orb-one { background:#fff; right:25%; top:-20%; animation:float 9s ease-in-out infinite; }
.orb-two { background:#fff; left:-18%; bottom:-25%; animation:float 12s ease-in-out infinite reverse; }
.signup-shell { min-height:100dvh; display:grid; grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr); }
.visual { position:relative; min-height:100dvh; padding:clamp(26px,4vh,44px) clamp(28px,4vw,54px); display:flex; flex-direction:column; justify-content:space-between; overflow:hidden; border-right:1px solid var(--line); background:radial-gradient(circle at 72% 45%,rgba(255,255,255,.1),transparent 38%),var(--bg); }
.visual:after { content:'P'; position:absolute; right:-.08em; bottom:-.34em; font-size:55vw; line-height:.7; font-weight:800; color:rgba(255,255,255,.035); pointer-events:none; animation:appear 1.2s ease both; }
.brand { position:relative; z-index:2; color:inherit; text-decoration:none; font-size:15px; font-weight:800; letter-spacing:.18em; }
.brand span { color:var(--accent); }
.visual-content { position:relative; z-index:2; max-width:620px; animation:rise .8s .1s ease both; }
.eyebrow { margin:0 0 14px; color:var(--muted); font:500 10px/1.4 ui-monospace,'Courier New',monospace; letter-spacing:.16em; text-transform:uppercase; }
.visual h1 { margin:0; font-size:clamp(54px,7vw,105px); line-height:.86; letter-spacing:-.07em; }
.visual h1 em { color:var(--paper); font-family:'EB Garamond',Georgia,serif; font-size:1.08em; font-style:normal; font-weight:400; letter-spacing:-.04em; }
.visual-content>p:last-child { max-width:430px; margin:28px 0 0; color:var(--soft); font-family:'EB Garamond',Georgia,serif; font-size:1.2rem; line-height:1.45; }
.visual-footer { position:relative; z-index:2; display:flex; gap:25px; color:rgba(255,255,255,.38); font:10px ui-monospace,'Courier New',monospace; letter-spacing:.12em; }
.form-panel { min-height:100dvh; display:grid; place-items:center; padding:48px clamp(28px,6vw,90px); border-left:1px solid rgba(255,255,255,.04); background:#111110; color:var(--paper); }
.form-wrap { width:min(100%,570px); animation:formIn .7s .08s ease both; }
.back { display:inline-block; margin-bottom:20px; color:var(--muted); text-decoration:none; font:500 10px ui-monospace,'Courier New',monospace; letter-spacing:.1em; text-transform:uppercase; transition:transform .2s,color .2s; }
.back:hover { color:var(--paper); transform:translateX(-3px); }
.form-panel .eyebrow { margin-bottom:8px; }
.form-panel h2 { margin:0; font-size:clamp(34px,4vw,48px); line-height:1; letter-spacing:-.055em; }
.intro { margin:8px 0 14px; color:var(--muted); font-family:'EB Garamond',Georgia,serif; font-size:1.15rem; }
.progress { height:1px; margin-bottom:16px; overflow:hidden; background:var(--line); }
.progress span { display:block; width:42%; height:100%; background:var(--paper); animation:progress 1.1s ease; }
form { font-size:10px; }
.field-row { display:grid; grid-template-columns:1.15fr .85fr; gap:20px; }
.field { margin-bottom:7px; }
.field label,fieldset legend { display:block; font-size:9px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; }
.field label span,.check b { color:var(--red); }
input { width:100%; border:0; border-bottom:1px solid var(--line); outline:0; background:transparent; color:var(--paper); padding:7px 0 6px; font:400 12px Montserrat,sans-serif; transition:border-color .2s; }
input:focus { border-color:var(--paper); }
input::placeholder { color:rgba(255,255,255,.32); }
.error { min-height:9px; margin:2px 0 0; color:var(--red); font-size:9px; }
.password-wrap { display:flex; align-items:center; border-bottom:1px solid var(--line); }
.password-wrap input { border-bottom:0; }
.password-wrap button { border:0; background:none; padding:8px 0 8px 12px; color:var(--muted); cursor:pointer; font:500 9px ui-monospace,'Courier New',monospace; letter-spacing:.1em; }
.strength { display:flex; gap:4px; margin-top:5px; }
.strength span { height:2px; flex:1; background:var(--line); transition:background .25s,transform .25s; }
.strength.good span:nth-child(1),.strength.good span:nth-child(2) { background:rgba(255,255,255,.6); }
.strength.strong span { background:var(--paper); transform:scaleY(1.5); }
.password-hint { margin:4px 0 0; color:var(--muted); font-size:9px; }
.consents { border:0; border-top:1px solid var(--line); margin:10px 0 8px; padding:9px 0 0; }
.consents legend { padding:0; margin-bottom:7px; }
.check { display:flex; align-items:flex-start; gap:9px; margin:5px 0; color:var(--soft); font-size:9px; line-height:1.35; }
.check input { width:14px; height:14px; flex:0 0 14px; margin:0; padding:0; accent-color:var(--paper); }
.check a { color:var(--paper); text-underline-offset:3px; }
.check.optional { color:var(--muted); }
.legal-note { margin:8px 0 9px; color:var(--muted); font-family:'EB Garamond',Georgia,serif; font-size:1rem; line-height:1.35; }
.submit { width:100%; border:1px solid var(--paper); background:var(--paper); color:var(--bg); padding:12px 16px; display:flex; align-items:center; justify-content:space-between; cursor:pointer; font:600 10px Montserrat,sans-serif; letter-spacing:.1em; transition:transform .2s,background .2s,color .2s; }
.submit span:last-child { font-size:18px; }
.submit:hover { transform:translateY(-2px); background:transparent; color:var(--paper); }
.status { min-height:14px; margin:7px 0 0; color:#b9df67; font-size:10px; }
.status.error-status { color:var(--red); }
.security { margin:8px 0 0; color:var(--muted); font-family:'EB Garamond',Georgia,serif; font-size:1rem; line-height:1.35; }
.security span { font-size:8px; }
@keyframes float { 50% { transform:translate(30px,25px) scale(1.08); } }
@keyframes appear { from { opacity:0; transform:translateY(25px); } to { opacity:1; transform:none; } }
@keyframes rise { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:none; } }
@keyframes formIn { from { opacity:0; transform:translateX(18px); } to { opacity:1; transform:none; } }
@keyframes progress { from { width:0; } to { width:42%; } }
@media(max-width:900px) { .signup-shell { grid-template-columns:1fr; grid-template-rows:auto auto; } .visual { min-height:250px; height:30dvh; max-height:330px; border-right:0; border-bottom:1px solid var(--line); padding:18px 24px; } .visual h1 { font-size:clamp(40px,10vw,68px); } .visual-content>p:last-child { display:none; } .visual-footer { font-size:8px; } .form-panel { min-height:70dvh; padding:36px 24px 44px; align-items:start; } .back { margin-bottom:14px; } .field-row { grid-template-columns:1fr; gap:0; } .field { margin-bottom:6px; } .orb { width:60vw; height:60vw; filter:blur(60px); } }
@media(max-width:520px) { .visual-footer span:nth-child(3) { display:none; } .visual { min-height:220px; height:29dvh; padding:18px 20px; } .form-panel { padding:32px 20px 40px; } .form-wrap { width:100%; } .form-panel h2 { font-size:32px; } .intro { margin-bottom:12px; } .progress { margin-bottom:14px; } .check { font-size:8.5px; } .legal-note,.security { font-size:.95rem; } }
@media (min-width:901px) { body { overflow:hidden; } .form-panel { padding-top:clamp(16px,3vh,48px); padding-bottom:clamp(16px,3vh,48px); } }
@media (min-width:901px) and (max-height:720px) { .visual { padding-top:24px; padding-bottom:24px; } .visual-content>p:last-child { margin-top:18px; font-size:1.05rem; } .form-panel { padding-top:14px; padding-bottom:14px; } .back { margin-bottom:12px; } .intro { margin-top:6px; margin-bottom:10px; } .progress { margin-bottom:11px; } .field { margin-bottom:4px; } .consents { margin-top:7px; margin-bottom:5px; padding-top:7px; } .check { margin:3px 0; } .legal-note { margin:5px 0 6px; } .security { margin-top:5px; } }
@media(prefers-reduced-motion:reduce) { .orb,.visual:after,.visual-content,.form-wrap,.progress span { animation:none; } }