/* Registration-only surface. Legacy auth styles cannot leak into this form. */
body.rakion-eternal.silkroad-reskin.portal-refined.portal-register-page .public-shell { max-width: 1168px !important; }
body.rakion-eternal.silkroad-reskin.portal-refined.portal-register-page .reg-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; align-items: stretch; gap: 0; background: #151a1e; border: 1px solid var(--rp-line); border-top: 2px solid var(--rp-gold); border-radius: 4px; overflow: hidden; }
#registerForm.reg-card { min-width: 0; padding: 36px 40px; border: 0 !important; border-radius: 0; box-shadow: none !important; background: #151a1e !important; overflow: visible; }
#registerForm .reg-heading { margin-bottom: 28px; }
#registerForm .reg-heading h1 { margin: 0 0 10px; color: var(--rp-ink); font: 400 clamp(30px, 3vw, 38px)/1.2 var(--rp-heading); text-transform: none; letter-spacing: 0; text-wrap: balance; }
#registerForm .reg-heading p { margin: 0; font: 15px/1.6 var(--rp-font); color: #b7b7b1; }
#registerForm .reg-heading .reg-signin { display: flex; flex-wrap: wrap; align-items: center; gap: 0 8px; margin-top: 8px; font-size: 14px; }
#registerForm .reg-signin a, .portal-register-page .reg-help a { display: inline-flex; gap: 10px; align-items: center; min-height: 44px; color: #d9bc87; font: 600 14px/1.5 var(--rp-font); text-decoration: none; }
#registerForm .reg-group { padding: 0; margin: 0 0 24px; border: 0; min-width: 0; }
#registerForm .reg-group legend { display: block; float: none; width: 100%; padding: 0 0 12px; margin: 0 0 16px; border-bottom: 1px solid var(--rp-line); color: #e3d7bf; font: 600 15px/1.5 var(--rp-font); }
#registerForm .auth-grid { gap: 0 20px; }
#registerForm .auth-field { margin: 0; }
#registerForm .auth-field > label { display: block; color: #d8d8d1 !important; font: 600 14px/1.5 var(--rp-font); margin: 0 0 8px; }
#registerForm .auth-input { display: flex; align-items: center; position: relative; border: 1px solid #555f64 !important; background: #0e1418 !important; min-height: 52px; transition: border-color 180ms, background-color 180ms; }
#registerForm .auth-input:focus-within { border-color: #d9bc87 !important; }
#registerForm .auth-input.is-bad { border-color: #db8c83 !important; }
#registerForm .auth-input input { width: 100%; min-width: 0; height: 50px; padding: 12px 14px 12px 40px; color: #eee7da; font: 16px/1.5 var(--rp-font); caret-color: #dfc393; }
#registerForm .auth-input input[data-pw] { padding-right: 48px; }
#registerForm .auth-input input::placeholder { color: #989f9e !important; opacity: 1; font-size: 15px; }
#registerForm .auth-input-ico { position: absolute; left: 14px; color: #a4aaa6; font-size: 14px; pointer-events: none; }
#registerForm .auth-eye { position: absolute; top: 1px; right: 1px; width: 48px; height: 48px; min-height: 48px; padding: 0; margin: 0; border: 0; background: transparent; color: #bfc2b9; transform: none; }
#registerForm .auth-eye:hover { color: #ecd19f; background: #232b2e; }
#registerForm .auth-hint { margin: 8px 0 0; font: 13px/1.55 var(--rp-font); color: #b2b6b0; }
#registerForm .reg-feedback { display: block; position: static; min-height: 21px; margin: 4px 0 0; color: #b2b6b0; font: 13px/1.55 var(--rp-font); }
#registerForm .reg-feedback[data-state="success"] { color: #92cea8; }
#registerForm .reg-feedback[data-state="error"] { color: #f0a29a; }
#registerForm .reg-feedback[data-state="checking"] { color: #d9bc87; }
#registerForm .reg-guidance { margin: 0 0 16px; color: #b2b6b0; font: 14px/1.6 var(--rp-font); max-width: 65ch; }
#registerForm .reg-strength { height: 3px; margin-top: 8px; background: #333c40; overflow: hidden; border-radius: 2px; }
#registerForm .reg-strength span { display: block; height: 100%; width: 0; background: #d9bc87; transition: width 220ms ease-out, background-color 220ms; }
#registerForm .reg-match { margin-top: 12px; }
#registerForm .reg-auto { display: flex; gap: 14px; margin: 0; padding: 16px; background: #1c2428; color: #c9cec4; font: 14px/1.65 var(--rp-font); }
#registerForm .reg-auto i { padding-top: 5px; color: var(--rp-gold); }
#registerForm .reg-referral { margin: 0 0 24px; border-top: 1px solid var(--rp-line); border-bottom: 1px solid var(--rp-line); }
#registerForm .reg-referral summary { display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 10px 0; cursor: pointer; list-style: none; color: #d9d5ca; font: 14px/1.5 var(--rp-font); }
#registerForm .reg-referral summary::-webkit-details-marker { display: none; }
#registerForm .reg-referral summary > span:first-child { flex: 1; }
#registerForm .reg-optional { color: #adb3ab; font-size: 13px; }
#registerForm .reg-referral summary i { color: var(--rp-gold); font-size: 12px; transition: transform 180ms; }
#registerForm .reg-referral[open] summary i { transform: rotate(180deg); }
#registerForm .reg-referral .auth-field { margin: 6px 0 20px; }
#registerForm .reg-group.reg-legal { margin-bottom: 20px; }
#registerForm .auth-consents { display: grid; gap: 0; padding: 0; margin: -6px 0 0; border: 0; background: transparent !important; box-shadow: none; }
#registerForm .consent { display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 8px 0; margin: 0; border: 0; background: transparent !important; cursor: pointer; }
#registerForm .consent input { appearance: auto; position: static; opacity: 1; display: block; flex: 0 0 19px; width: 19px; height: 19px; margin: 0; accent-color: #c4a36b; cursor: pointer; }
#registerForm .consent-text { font: 14px/1.6 var(--rp-font); color: #bec3bb; }
#registerForm .consent-text a { color: #d9bc87 !important; text-decoration: underline; text-decoration-color: #7d7059; text-underline-offset: 3px; }
.portal-register-page :where(a:hover) { color: #f3d6a3 !important; }
#registerForm .auth-submit { display: flex; align-items: center; justify-content: center; gap: 16px; width: 100%; min-height: 54px; margin: 0; background: #c4a36b !important; border: 1px solid #dfc393 !important; color: #171713 !important; font: 700 16px/1.5 var(--rp-font); box-shadow: none; transition: background-color 180ms, box-shadow 180ms; }
#registerForm .auth-submit:hover { background: #dbbb87 !important; box-shadow: 0 6px 18px #0004; }
#registerForm .auth-submit:disabled { opacity: .65; cursor: wait; }
#registerForm .reg-submit-note { margin: 12px 0 0; color: #adb3ab; text-align: center; font: 13px/1.55 var(--rp-font); }
.portal-register-page .reg-welcome { display: flex; flex-direction: column; min-width: 0; position: relative; isolation: isolate; background: #10171b; border-left: 1px solid var(--rp-line); }
.portal-register-page .reg-welcome-copy { padding: 38px 28px 0; position: relative; z-index: 1; }
.portal-register-page .reg-welcome h2 { margin: 0 0 16px; color: #e1c697; font: 400 32px/1.25 var(--rp-heading); letter-spacing: 0; }
.portal-register-page .reg-welcome p { margin: 0; color: #bec1b8; font: 14px/1.7 var(--rp-font); }
.portal-register-page .reg-welcome-art { min-height: 310px; flex: 1; background: linear-gradient(#10171b, transparent 10%, transparent 90%, #10171b), url('/assets/images/rakion-register-swordsman-v1.webp') center / contain no-repeat; opacity: 1; }
.portal-register-page .reg-help { padding: 24px 28px 32px; }
.portal-register-page .reg-help h3 { color: #e3d7bf; font: 600 15px/1.5 var(--rp-font); font-family: var(--rp-font) !important; margin: 0 0 8px; }
.portal-register-page .reg-help a { margin-top: 12px; }
#registerForm .reg-errors { padding: 18px; margin-bottom: 24px; border: 1px solid #a96d67; background: #30201f; color: #f6c2ba; }
#registerForm .reg-errors[hidden] { display: none; }
#registerForm .reg-errors h2 { margin: 0 0 8px; color: #f6d8d1; font: 600 16px/1.5 var(--rp-font); }
#registerForm .reg-errors h2 { font-family: var(--rp-font) !important; }
#registerForm .reg-errors ul { padding-left: 20px; margin: 0; font: 14px/1.6 var(--rp-font); }
.portal-register-page :where(.reg-layout a, .reg-layout button, .reg-layout summary, .reg-layout input[type="checkbox"]):focus-visible { outline: 2px solid #efd09a; outline-offset: 4px; border-radius: 2px; }
#registerForm .reg-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.portal-register-page .reg-layout ::selection { color: #111713; background: #d9bc87; }
@media (max-width: 1050px) {
    body.rakion-eternal.silkroad-reskin.portal-refined.portal-register-page .reg-layout { grid-template-columns: minmax(0, 1fr) 250px; }
    #registerForm.reg-card { padding: 32px 28px; }
    #registerForm .auth-grid { grid-template-columns: 1fr; gap: 20px; }
}
@media (max-width: 800px) {
    body.rakion-eternal.silkroad-reskin.portal-refined.portal-register-page .reg-layout { grid-template-columns: minmax(0, 1fr); }
    #registerForm .auth-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .portal-register-page .reg-welcome { border-left: 0; border-top: 1px solid var(--rp-line); }
    .portal-register-page .reg-welcome-copy, .portal-register-page .reg-welcome-art { display: none; }
    .portal-register-page .reg-help { padding: 24px 28px; }
}
@media (max-width: 580px) {
    #registerForm.reg-card { padding: 26px 20px; }
    #registerForm .auth-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; }
    #registerForm .reg-heading { margin-bottom: 24px; }
    #registerForm .reg-referral summary { flex-wrap: wrap; gap: 4px 8px; }
    #registerForm .reg-referral summary > span:first-child { flex-basis: calc(100% - 28px); }
    #registerForm .reg-referral summary i { order: 1; }
    #registerForm .reg-referral summary .reg-optional { order: 2; flex-basis: 100%; }
    .portal-register-page .reg-help { padding: 24px 20px; }
}