/* ProBase Trading · join.php (registro + inicio de sesión) */
:root{--ink:#0A1426;--line:#1B3056;--text:#F2F4F7;--muted:#93A3BA;--dim:#62758F;--acc:#6E9BFF;--gold:#F0CB6B}
body{margin:0;background:var(--ink);color:var(--text);font:400 16px/1.6 var(--body);-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}
.jn{position:relative;overflow:hidden;padding:clamp(48px,7vw,96px) 20px clamp(64px,8vw,110px);background:radial-gradient(60% 50% at 80% 10%,rgba(5,82,252,.22),transparent 70%),radial-gradient(50% 40% at 0% 100%,rgba(5,82,252,.12),transparent 70%)}
.jn-wrap{max-width:1160px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(32px,5vw,72px);align-items:center}
.jn-eyebrow{display:inline-flex;align-items:center;gap:12px;margin:0 0 18px;font:500 12px/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--acc)}
.jn-eyebrow::before{content:"";width:26px;height:1px;background:linear-gradient(90deg,transparent,currentColor)}
.jn h1{margin:0 0 18px;font-size:clamp(32px,4.4vw,54px);line-height:1.05}
.jn-lead{margin:0 0 26px;max-width:52ch;font-size:17px;color:#B6C2D6}
.jn-price{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin:0 0 24px;padding:16px 20px;border-radius:16px;background:linear-gradient(90deg,rgba(5,82,252,.14),rgba(240,203,107,.08));border:1px solid rgba(122,160,255,.3)}
.jn-price>div{display:flex;align-items:baseline;gap:10px}
.jn-price s{font:500 20px var(--mono);color:#7F90AA;text-decoration-color:#FF4D4D;text-decoration-thickness:2px}
.jn-price b{font:600 44px/1 var(--display);letter-spacing:-.04em;color:#fff}
.jn-price span{font-size:14px;color:var(--muted)}
.jn-price p{margin:0;flex:1;min-width:220px;font-size:14px;color:#C3CEDF}
.jn-price strong{color:var(--gold)}
.jn-list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.jn-list li{position:relative;padding-left:30px;color:#C3CEDF;font-size:15.5px}
.jn-list li::before{content:"";position:absolute;left:0;top:4px;width:18px;height:18px;border-radius:50%;background:rgba(5,82,252,.2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.3l2.5 2.5L12 5.3' fill='none' stroke='%238FB0FF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat;border:1px solid rgba(110,155,255,.4)}
.jn-list b{color:#fff}
.jn-card{position:relative;border-radius:24px;padding:clamp(22px,3vw,34px);background:linear-gradient(180deg,rgba(18,30,56,.94),rgba(9,16,32,.96));box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 60px 120px -50px rgba(5,40,140,.7),0 30px 60px -40px rgba(0,0,0,.85)}
.jn-card::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;background:linear-gradient(158deg,rgba(200,218,255,.55),rgba(122,160,255,.1) 30%,rgba(122,160,255,.06) 60%,rgba(61,123,255,.55));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.jn-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:5px;margin-bottom:20px;border-radius:14px;background:rgba(0,0,0,.25);border:1px solid rgba(148,170,210,.14)}
.jn-tabs button{all:unset;cursor:pointer;text-align:center;padding:11px 8px;border-radius:10px;font:600 14.5px var(--body);color:var(--muted)}
.jn-tabs button[aria-selected="true"]{color:#fff;background:linear-gradient(180deg,rgba(61,123,255,.3),rgba(5,82,252,.16));box-shadow:inset 0 0 0 1px rgba(122,160,255,.45)}
.jn-tabs button:focus-visible{outline:2px solid #3D7BFF;outline-offset:2px}
.jn-google{all:unset;box-sizing:border-box;cursor:pointer;width:100%;display:flex;align-items:center;justify-content:center;gap:10px;padding:12px;border-radius:11px;background:#fff;color:#1a2233;font:600 14.5px var(--body)}
.jn-google svg{width:18px;height:18px}
.jn-google:hover{background:#EEF2F8}
.jn-or{display:flex;align-items:center;gap:12px;margin:16px 0;font-size:12.5px;color:var(--dim)}
.jn-or::before,.jn-or::after{content:"";flex:1;height:1px;background:rgba(148,170,210,.18)}
.jn-form{display:grid;gap:8px}
.jn-form[hidden]{display:none}
.jn-form label{display:flex;justify-content:space-between;align-items:baseline;font-size:13.5px;font-weight:500;color:#C9D3E1;margin-top:6px}
.jn-form label small{font-weight:400;color:var(--dim);font-size:12px}
.jn-form input[type=text],.jn-form input[type=email],.jn-form input[type=password]{width:100%;padding:13px 14px;border-radius:11px;border:1px solid rgba(148,170,210,.22);background:rgba(4,8,16,.55);color:#fff;font:400 15px var(--body);outline:none;transition:border-color .15s,box-shadow .15s}
.jn-form input:focus{border-color:#3D7BFF;box-shadow:0 0 0 4px rgba(61,123,255,.18)}
.jn-form input.bad{border-color:#FF6B6B;box-shadow:0 0 0 4px rgba(255,92,92,.14)}
.jn-pass{position:relative}
.jn-eye{all:unset;cursor:pointer;position:absolute;right:10px;top:50%;transform:translateY(-50%);font-size:15px;opacity:.6;padding:4px}
.jn-eye:hover{opacity:1}
.jn-check{display:flex!important;justify-content:flex-start!important;align-items:flex-start!important;gap:10px;font-weight:400!important;font-size:13.5px!important;color:#B6C2D6!important;margin-top:10px!important}
.jn-check input{margin-top:3px;accent-color:#0552FC;width:16px;height:16px;flex:none}
.jn-check a,.jn-fine a,.jn-forgot{color:#8FB0FF}
.jn-forgot{font-weight:400;font-size:12.5px}
.jn-submit{width:100%;margin-top:14px;padding:15px 18px!important;font-size:15.5px!important}
.jn-fine{margin:6px 0 0;text-align:center;font-size:12.5px;color:var(--dim)}
.jn-ref{margin:6px 0 0;padding:10px 12px;border-radius:10px;font-size:13px;color:#C3CEDF;background:rgba(240,203,107,.08);border:1px solid rgba(240,203,107,.3)}
.jn-ref b{color:var(--gold);font-family:var(--mono)}
.jn-msg{margin:4px 0 0;min-height:1em;text-align:center;font-size:13.5px;color:#8FB0FF}
.jn-msg.err{color:#FF8A8A}
@media (max-width:900px){.jn-wrap{grid-template-columns:1fr}.jn-card{order:-1}}
@media (max-width:420px){.jn{padding-inline:16px}.jn-price b{font-size:36px}}