/* 登录 / 注册（颜色走 tokens.css 变量，随系统深浅色自动切换；蓝色渐变左板为品牌色，两种主题一致） */
body{min-height:100vh;display:flex;background:var(--bg)}
.left{flex:1.15;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding:60px 7% 60px 6%;background:var(--grad-hero);color:#fff}
.left:before{content:'';position:absolute;width:520px;height:520px;border-radius:50%;background:rgba(255,255,255,.08);top:-220px;right:-160px}
.left:after{content:'';position:absolute;width:360px;height:360px;border-radius:50%;background:rgba(255,122,0,.22);bottom:-180px;left:-100px}
.brand{position:absolute;top:34px;left:6%;display:flex;align-items:center;gap:11px;font-size:19px;font-weight:800}
.brand .mark{width:40px;height:40px;border-radius:var(--radius-m);background:#fff;display:flex;align-items:center;justify-content:center;color:var(--deep);box-shadow:0 8px 20px rgba(0,0,0,.18)}
.brand .mark svg{width:22px;height:22px}
.brand small{font-size:10.5px;font-weight:600;opacity:.75;letter-spacing:2px;display:block}
.l-c{position:relative;z-index:1;max-width:560px}
.l-c h1{font-size:42px;font-weight:900;line-height:1.25;margin-bottom:18px}
.l-c h1 em{font-style:normal;color:var(--gold-soft)}
.l-c p{font-size:15.5px;opacity:.92;line-height:1.9;margin-bottom:30px}
.l-feats{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:520px}
.lf{background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.22);border-radius:14px;padding:14px 16px;backdrop-filter:blur(6px)}
.lf .t{font-weight:800;font-size:14px;margin-bottom:3px;display:flex;align-items:center;gap:8px}
.lf .t svg{width:16px;height:16px;color:var(--gold-soft)}
.lf .d{font-size:12px;opacity:.85;line-height:1.6}
.gift{margin-top:30px;display:inline-flex;align-items:center;gap:12px;background:var(--grad-orange);border-radius:16px;padding:14px 20px;box-shadow:0 12px 30px rgba(255,122,0,.4)}
.gift .coin{display:inline-flex;align-items:center;justify-content:center}
.gift .coin svg{width:20px;height:20px}
.gift b{font-size:16px}
.gift span{font-size:12.5px;opacity:.9;display:block}
.right{flex:1;display:flex;align-items:center;justify-content:center;padding:40px 5%;background:
 radial-gradient(600px 300px at 110% -10%,var(--bgblue),transparent 60%),var(--bg)}
.card{width:100%;max-width:420px}
.tabs{display:flex;background:var(--bg-tab);border-radius:13px;padding:5px;margin-bottom:26px}
.tab{flex:1;text-align:center;padding:10px 0;border-radius:10px;font-weight:700;font-size:15px;color:var(--mut);cursor:pointer;transition:.25s;border:none;background:none;font-family:inherit}
.tab.on{background:var(--bg-elev);color:var(--deep);box-shadow:0 4px 12px rgba(11,77,230,.14)}
.f{margin-bottom:16px}
.f label{display:block;font-size:13px;font-weight:700;margin-bottom:7px;color:var(--text-2)}
.inp{width:100%;padding:12px 14px;border:1.5px solid var(--line);border-radius:var(--radius-m);font-size:14.5px;font-family:inherit;transition:.2s;background:var(--bg-elev);color:var(--ink)}
.inp:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 4px rgba(46,123,249,.14)}
.inp::placeholder{color:var(--mut);opacity:.75}
.row{display:flex;gap:10px}
.row .inp{flex:1}
.codebtn{white-space:nowrap;padding:0 18px;border:none;border-radius:var(--radius-m);background:var(--bgblue);color:var(--deep);font-weight:700;font-size:13.5px;cursor:pointer;font-family:inherit;transition:.2s}
.codebtn:hover{background:var(--line-strong)}
.codebtn:disabled{opacity:.5;cursor:not-allowed}
.btn{width:100%;padding:13px 0;border:none;border-radius:13px;background:var(--grad);color:#fff;font-size:16px;font-weight:800;cursor:pointer;font-family:inherit;box-shadow:0 10px 24px rgba(11,77,230,.3);transition:.25s;margin-top:6px}
.btn:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(11,77,230,.38)}
.btn:disabled{opacity:.6;cursor:not-allowed;transform:none}
.err,.ok-msg{display:none;background:var(--warn-bg);border:1.5px solid var(--warn-line);color:var(--warn);border-radius:11px;padding:10px 14px;font-size:13px;margin-bottom:14px}
.ok-msg{background:var(--ok-bg);border-color:var(--ok-line);color:var(--ok)}
.agree{display:flex;gap:9px;align-items:flex-start;font-size:12.5px;color:var(--mut);margin:4px 0 10px}
.agree input{margin-top:3px;accent-color:var(--blue)}
.agree a{color:var(--deep);font-weight:600}
.tip1000{display:flex;align-items:center;gap:10px;background:var(--bgorange);border:1.5px dashed var(--dash);border-radius:var(--radius-m);padding:11px 14px;font-size:13px;color:var(--gold);margin-bottom:20px;font-weight:600}
.tip1000.blue{background:var(--bgblue);border-color:var(--line-strong);color:var(--deep)}
.switch{margin-top:22px;text-align:center;font-size:13.5px;color:var(--mut)}
.switch a{color:var(--deep);font-weight:800;cursor:pointer}
.backhome{position:absolute;top:34px;right:5%;font-size:13.5px;color:var(--mut);font-weight:600}
.backhome:hover{color:var(--deep)}
.right{position:relative}
.pane{display:none}.pane.on{display:block}
.toast{position:fixed;top:26px;left:50%;transform:translateX(-50%) translateY(-80px);background:var(--toast-bg);color:var(--toast-fg);padding:11px 22px;border-radius:var(--radius-m);font-size:14px;font-weight:600;transition:.35s;z-index:99;box-shadow:0 14px 34px rgba(0,0,0,.25);max-width:90%;text-align:center}
@media(max-width:960px){.left{display:none}.right{background:var(--bg)}}
@media(max-width:480px){.card{max-width:100%}}

/* 拼图验证码联动：倒计时文案变长不撑破按钮布局；拼图弹窗置于 toast 之上 */
.codebtn{min-width:96px}
.cap-modal{z-index:120}
@media(max-width:480px){.cap-box{padding:16px 12px}}