:root { --orange:#df813e; --bright:#ff8a13; }
* { box-sizing:border-box; }
body { margin:0; min-width:1120px; color:#171717; background:#252526 url("assets/web_bg.png") center top / max(1920px,100vw) auto no-repeat fixed; font-family:"Microsoft YaHei","Noto Sans SC",sans-serif; }
button,input,a { font:inherit; } a { color:inherit; text-decoration:none; }
.register-shell { min-height:100vh; }
.topbar { height:92px; display:grid; grid-template-columns:360px 1fr 268px; align-items:stretch; color:#fff; background:rgba(20,15,16,.97); border-bottom:2px solid rgba(255,255,255,.07); }
.brand { display:grid; place-items:center start; padding-left:20px; }.brand img { width:175px; height:65px; object-fit:contain; }
.topbar > nav { display:flex; justify-content:space-around; align-items:stretch; } .topbar > nav > a { min-width:180px; display:grid; place-items:center; position:relative; font-size:29px; font-weight:bold; letter-spacing:5px; } .topbar > nav > a:hover { color:var(--bright); }
.download { background:url("assets/web_download_btn.png") center / 268px 91px no-repeat; }
.register-title { height:73px; padding:0 max(100px,calc((100vw - 1720px)/2)); display:flex; align-items:center; color:#eee; background:rgba(0,0,0,.3); }
.register-title h1 { margin:0; display:flex; align-items:center; font-size:31px; }.register-title h1::before { content:""; width:56px; height:22px; margin-right:16px; flex:0 0 56px; background:url("assets/web_title_arrow.png") center / 56px 22px no-repeat; }
.register-card { width:min(1554px,calc(100vw - 366px)); min-height:915px; margin:0 auto; padding:59px 220px 90px; background:rgba(255,255,255,.97); }
.register-form { width:860px; margin:0 auto; }
.register-field { display:block; margin-bottom:26px; font-size:21px; }
.register-label { display:flex; justify-content:space-between; margin:0 3px 7px; }.register-hint { color:#777; }
.register-input-wrap { position:relative; }.register-field input { width:100%; height:58px; padding:0 28px; border:1px solid #d89565; border-radius:0; outline:0; background:#eee; font-size:22px; }.register-field input:focus { border-color:var(--orange); box-shadow:0 0 0 2px rgba(223,129,62,.15); }
.register-field input[readonly] { color:#171717; background:#d0d0d0; cursor:not-allowed; }
.register-password input { padding-right:70px; }.register-eye { position:absolute; top:-4px; right:0; width:70px; height:58px; border:0; background:transparent; cursor:pointer; }
.register-confirm-field[hidden],[data-standard-registration][hidden] { display:none; }
.register-form.is-phone-verified .register-field { margin-bottom:31px; }
.register-form.is-phone-verified .register-submit { margin-top:61px; }
.register-captcha-row { min-height:48px; margin:9px 0 24px 3px; display:flex; align-items:center; gap:18px; }
.register-captcha { width:142px; height:48px; display:grid; place-items:center; flex:0 0 142px; color:#275f9d; border:1px solid #cfd7da; background:repeating-linear-gradient(12deg,#eaf0ef 0 2px,#f7faf9 2px 5px); font:italic 36px/1 Georgia,serif; letter-spacing:5px; user-select:none; }
.register-captcha-refresh { padding:0; color:#168fcf; border:0; border-bottom:1px solid currentColor; background:transparent; font-size:17px; line-height:1.35; cursor:pointer; }
.register-captcha-refresh:hover { color:#0d76b0; }
.register-sms-row { display:grid; grid-template-columns:1fr 208px; gap:22px; }.register-sms-row button { color:#fff; border:0; background:#159fe9; font-size:19px; font-weight:bold; cursor:pointer; }
.register-error { min-height:26px; margin:0 3px 15px; color:#d92323; font-size:17px; }
.register-agreement-field { width:100%; margin:4px 0 8px; }
.register-agreement { width:max-content; max-width:100%; margin:0 auto; display:flex; align-items:flex-start; justify-content:center; gap:11px; color:#333; font-size:17px; line-height:1.6; cursor:pointer; }
.register-agreement input { width:20px; height:20px; margin:4px 0 0; flex:0 0 20px; accent-color:var(--orange); cursor:pointer; }
.register-agreement a { color:#168fcf; border-bottom:1px solid currentColor; text-underline-offset:2px; }
.register-agreement a:hover,.register-agreement a:focus-visible { color:#d66f28; }
.register-agreement-error { min-height:0; margin:5px 0 0; text-align:center; }
.register-submit { width:238px; height:68px; margin:18px auto 0; display:block; color:#fff; border:0; background:var(--orange); font-size:29px; font-weight:bold; cursor:pointer; }.register-submit:hover { filter:brightness(1.08); }
.back-login { display:block; width:max-content; margin:22px auto 0; padding:0; color:#159fe9; border:0; border-bottom:1px solid currentColor; outline:0; background:transparent; line-height:1.35; cursor:pointer; }
.register-agreement-dialog { width:min(480px,calc(100vw - 32px)); padding:0; color:#171717; border:1px solid #d89565; border-radius:4px; background:#fff; box-shadow:0 18px 50px rgba(0,0,0,.4); }
.register-agreement-dialog:not([open]) { display:none; }
.register-agreement-dialog::backdrop { background:rgba(0,0,0,.64); }
.register-agreement-dialog form { position:relative; padding:32px 34px 28px; text-align:center; }
.register-agreement-dialog h2 { margin:0 38px 16px; font-size:24px; line-height:1.35; }
.register-agreement-dialog p { margin:0; color:#444; font-size:18px; line-height:1.7; }
.register-dialog-close { position:absolute; top:9px; right:10px; width:36px; height:36px; padding:0; color:#666; border:0; background:transparent; font-size:30px; line-height:34px; cursor:pointer; }
.register-dialog-close:hover,.register-dialog-close:focus-visible { color:var(--orange); }
.register-dialog-actions { margin-top:26px; display:flex; justify-content:center; gap:16px; }
.register-dialog-button { width:112px; height:44px; border:1px solid var(--orange); font-size:18px; font-weight:bold; cursor:pointer; }
.register-dialog-button.is-secondary { color:#555; border-color:#aaa; background:#f3f3f3; }
.register-dialog-button.is-primary { color:#fff; background:var(--orange); }
.register-dialog-button:hover { filter:brightness(1.06); }
@media(max-width:1400px){.register-card{width:calc(100vw - 180px);padding-left:120px;padding-right:120px}.topbar{grid-template-columns:270px 1fr 210px}.topbar > nav > a{min-width:110px}}
@media(max-width:900px){.register-agreement{font-size:15px}.register-agreement-dialog form{padding:30px 20px 24px}.register-agreement-dialog p{font-size:16px}.register-dialog-button{width:min(112px,38vw)}}