/* Palette taken from the supplied logo: midnight navy, ocean blue, ice white. */
:root{--pink:#42b7ff;--aqua:#a2e3ff;--muted:#8da7bd;--surface:#0b1e30;--blue:#078ff0;--ice:#edf8ff;--navy:#061321}
body{background:var(--navy);color:var(--ice)}
.page-title{color:#f2f9ff;text-shadow:0 2px 0 #020b14,0 0 24px #168ade24}
.slash{color:#54baff}
.registration{background:radial-gradient(ellipse 35vw 65vh at -8% 90%,#087ed34d,transparent 75%),radial-gradient(ellipse 30vw 48vh at 5% -10%,#075ba94d,transparent 75%),radial-gradient(ellipse 45vw 65vh at 90% 80%,#06396559,transparent 80%),linear-gradient(125deg,#061321,#07111b 62%,#04101c)}
.brand{width:242px;display:flex;align-items:center;gap:11px}
.brand-logo{display:block;width:52px;height:52px;object-fit:cover;flex:none;border-radius:12px;border:1px solid #4bb6ff50;box-shadow:0 4px 18px #0005,0 0 18px #087ed324}
.brand>span{font-size:23px;letter-spacing:.2px;font-style:normal;text-shadow:0 0 15px #4bb6ff40;transform:translateY(-5px)}
.brand em{top:32px;left:65px;font-size:19px;color:#83d1ff;text-shadow:0 0 12px #128de755;transform:rotate(-5deg)}
.intro{color:#b5c9da}
.field{background:linear-gradient(115deg,#0c2033,#0a1929);border-color:#244058;box-shadow:inset 0 1px 0 #ffffff03}
.field:focus-within{background:#0e263d;border-color:#42b7ff;box-shadow:0 0 0 2px #42b7ff14,0 0 15px #0a82d512}
.field label{color:#8faac0}
.field input,.field input::placeholder{color:#edf8ff}
.field.invalid{border-color:#73c9ff;box-shadow:0 0 0 2px #42b7ff14}
.field-icon,.password-toggle{background:#15334b;border-color:#2a4e68;color:#9bccec}
.agreement>input{background:#eaf6ff;border-color:#adcce2}
.agreement>input:checked{background:#42b7ff;border-color:#77caff}
.agreement>input:checked:after{color:#031522}
.agreement label{color:#c6d8e6}
.submit{color:#f4fbff;background:linear-gradient(110deg,#087cda,#139ff3);border-color:#47b5ff;box-shadow:0 4px 14px #008af02b,inset 0 1px 0 #ffffff24;text-shadow:0 1px 2px #00467b80;letter-spacing:.3px}
.submit:hover{background:linear-gradient(110deg,#1094ef,#40b6ff);box-shadow:0 5px 20px #008af047}
.back{background:#0b1e2e;color:#b8d4e8;border:1px solid #1c354b}
.back:hover{background:#122d43;color:#fff}
.notification{background:linear-gradient(125deg,#102e48f5,#091b2cfa);border-color:#42b7ff66;color:#dfF2ff;box-shadow:0 5px 20px #0005,0 0 16px #139ff315,inset 2px 0 0 #42b7ff}
.notice-icon{background:#42b7ff12;border-color:#42b7ff70;color:#7ed0ff;box-shadow:0 0 8px #42b7ff26}
.dismiss{color:#8db6d4}
.notification.success{background:linear-gradient(125deg,#123542f5,#091d2dfa);border-color:#a2e3ff66;color:#e4f8ff;box-shadow:0 5px 20px #0005,0 0 16px #a2e3ff15,inset 2px 0 0 #a2e3ff}
.notification.success .notice-icon{background:#a2e3ff12;border-color:#a2e3ff70;color:#a2e3ff;box-shadow:0 0 8px #a2e3ff26}
.copyright{color:#cee4f4}
.footer-description{color:#7795ad}
.tiny-orbits i{border-color:#4cbaff;box-shadow:0 0 10px #139ff32b}
.moon{background:#edf8ff;box-shadow:0 0 85px #62baff24}
.aqua-ring{border-color:#8cd8ff;filter:drop-shadow(0 0 8px #138ef01c)}
.pink-orbit{background:linear-gradient(115deg,#063a73,#078fee 56%,#35adff);box-shadow:inset 0 0 45px #43b5ff1f,0 0 100px #078fee12}
.pink-orbit>div{background:linear-gradient(110deg,#075499,#139ff3 58%,#0870be);box-shadow:0 0 25px #03274b24}
.pink-orbit>div>div{background:linear-gradient(110deg,#0869b5,#3cb9ff);box-shadow:0 0 25px #03274b24}
.pink-orbit>div>div>div{background:#061321}
dialog{background:linear-gradient(135deg,#10283d,#071522);border-color:#2e6185;color:#edf8ff}
dialog::backdrop{background:#020c17c4}
dialog ol{color:#b5cddd}
.dialog-close{color:#9dbed5}
@media(max-width:600px){.registration:after{background:linear-gradient(90deg,#06132166,#061321c9 50%,#06132166)}}

/* Account creation leads into the in-game character details. */
.registration-steps{display:flex;align-items:center;gap:16px;list-style:none;padding:0;margin:0 0 14px;color:#65839a;font-size:8px;font-weight:600}
.registration-steps li{display:flex;align-items:center;gap:5px}
.registration-steps li span{display:grid;place-items:center;border:1px solid #25445d;border-radius:50%;width:19px;height:19px;font-size:7px}
.registration-steps li.current{color:#e6f5ff}
.registration-steps li.current span{background:#0d88d52b;border-color:#42b7ff;color:#7bd1ff;box-shadow:0 0 12px #078ff020}
.registration-steps li.completed{color:#87c9e9}
.registration-steps li.completed span{border-color:#3681ac;background:#0c3650}
#form-title:focus{outline:none}
#character-form{position:relative}
.character-field{position:relative;margin:0 0 13px}
.character-field>label,.character-field legend{display:flex;align-items:center;gap:7px;width:100%;font-size:10px;font-weight:600;color:#d7e9f7;margin:0 0 6px}
.character-field .field{height:34px;padding:6px 8px;margin-bottom:0}
.character-field .field input{height:20px;font-size:10px;font-weight:500}
.field-hint{font-size:7px;line-height:1.5;color:#7795ad;margin:4px 0 0}
.field-check{margin-left:auto;display:grid;place-items:center;border:1px solid #27465d;background:#10283a;width:15px;height:15px;border-radius:3px;color:#567a93;font-size:9px;transition:color .2s,border-color .2s,background .2s}
.character-field.is-valid .field-check{color:#a2e3ff;border-color:#42b7ff8c;background:#1085c52b;box-shadow:0 0 9px #078ff014}
.character-field.has-error .field,.character-field.has-error .gender-option span{border-color:#70c7ff}
.character-field select{width:100%;height:20px;min-width:0;padding:0 16px 0 0;font:inherit;font-size:10px;border:0;outline:none;background:transparent;color:#edf8ff;color-scheme:dark;cursor:pointer}
.character-field select option{background:#0b1e30;color:#edf8ff}
.character-field input[type=date]{color-scheme:dark}
.character-field input[type=date]::-webkit-calendar-picker-indicator{opacity:.75;cursor:pointer}
#other-nationality-field{margin-top:7px;height:38px}
#other-nationality-field label{font-size:7px}
.gender-field{padding:0;border:0;min-width:0}
.gender-field legend{padding:0;position:relative;line-height:15px}
.gender-field legend .field-check{position:absolute;right:0;top:0}
.gender-options{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.gender-option{position:relative;cursor:pointer}
.gender-option input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.gender-option span{display:flex;align-items:center;justify-content:center;gap:9px;min-height:35px;border:1px solid #244058;border-radius:3px;background:#0b1e30;color:#8da7bd;font-size:9px;font-weight:700;transition:background .2s,border-color .2s,color .2s}
.gender-option b{font-size:18px;font-weight:400;line-height:1}
.gender-option input:checked+span{border-color:#42b7ff;background:linear-gradient(110deg,#123d60,#0b2841);color:#eff9ff;box-shadow:inset 0 0 15px #078ff015}
.gender-option input:focus-visible+span{outline:2px solid #a2e3ff;outline-offset:3px}
.gender-option:hover span{background:#12314b;color:#e6f5ff}
.character-feedback{font-size:8px;line-height:1.6;padding:8px 10px;color:#d4edff;background:#102e48;border:1px solid #42b7ff66;border-radius:4px;margin:0 0 10px}
.character-feedback.success{border-color:#a2e3ff70;color:#d9f5ff;background:#103140}
#character-form>.submit{margin-top:2px}
#verification-form{position:relative}
@media(min-width:601px){.email-step .left-column{width:270px}.email-step .intro{max-width:270px}}
.registration-steps{gap:12px}
.verification-emblem{position:relative;display:grid;place-items:center;width:55px;height:55px;margin:0 0 16px;border:1px solid #43b6ff50;border-radius:15px;background:linear-gradient(140deg,#124a713d,#0b2438);color:#94dbff;box-shadow:0 0 32px #058fee13,inset 0 1px 0 #ffffff08}
.verification-emblem svg{width:38px;height:38px}
.verification-address{display:flex;flex-direction:column;align-items:flex-start;padding:11px 12px;margin-bottom:20px;border:1px solid #25465e;border-radius:5px;background:linear-gradient(115deg,#102c424d,#091b2c80)}
.verification-address>span{font-size:6px;color:#749bb7;letter-spacing:1.1px;font-weight:600}
.verification-address strong{display:block;max-width:100%;overflow-wrap:anywhere;font-size:10px;line-height:1.5;font-weight:600;color:#e2f4ff;margin:4px 0 6px}
#edit-email{padding:0;background:none;border:0;font-size:7px;color:#69c7ff;line-height:1.6}
#edit-email:hover{color:#bceaff}
#edit-email span{margin-left:3px}
.otp-fieldset{border:0;padding:0;margin:0 0 17px;min-width:0}
.otp-fieldset legend{font-size:9px;font-weight:500;color:#c8e2f4;padding:0;margin-bottom:8px}
.otp-inputs{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}
.otp-inputs input{width:100%;min-width:0;height:42px;padding:0;text-align:center;font-family:Inter,Arial,sans-serif;font-size:19px;font-weight:600;border:1px solid #2c506b;border-radius:5px;color:#edf8ff;background:linear-gradient(130deg,#0f2940,#0a1c2c);caret-color:#75d2ff;outline:none;transition:border-color .2s,box-shadow .2s}
.otp-inputs input:focus{border-color:#60c4ff;box-shadow:0 0 0 2px #149aef1a,0 0 15px #078ff01a;background:#102f49}
.otp-inputs input:focus-visible{outline:0}
#verification-form.has-error .otp-inputs input{border-color:#7bcfff}
.verification-feedback{font-size:8px;line-height:1.6;color:#c7e7fc;border-left:2px solid #48b7fb;background:#0e2c43;padding:8px 10px;margin:0 0 13px;border-radius:0 4px 4px 0}
#verification-form>.submit{display:flex;align-items:center;justify-content:center;gap:12px}
#verification-form>.submit span{font-size:13px;font-weight:400}
.verification-resend{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:5px;margin:13px 0 18px;font-size:7px;color:#819fb6}
#resend-code{border:0;background:none;padding:2px 0;color:#75ceff;font-size:7px;font-weight:600}
#resend-code:hover:enabled{color:#c0ebff;text-decoration:underline}
#resend-code:disabled{cursor:default;color:#6e8ba2}
.resend-timer{font-variant-numeric:tabular-nums;color:#82c5eb;background:#10314b;border:1px solid #25465e;border-radius:3px;padding:1px 4px;font-size:6px;min-width:25px;text-align:center}
.verification-demo{border-top:1px solid #24415880;padding-top:11px;margin-bottom:11px}
.verification-demo>span{font-size:5.5px;letter-spacing:1px;color:#76a5c5;border:1px solid #294b64;background:#0d2638;border-radius:3px;padding:3px 5px;display:inline-block}
.verification-demo p{color:#7997ae;font-size:7px;line-height:1.7;margin:6px 0 0}
#verification-back{height:24px;font-size:8px}
@media(max-width:600px){.verification-emblem{width:60px;height:60px}.verification-address{padding:13px;margin-bottom:24px}.verification-address>span{font-size:8px}.verification-address strong{font-size:13px}#edit-email{font-size:10px}.otp-fieldset legend{font-size:11px}.otp-inputs{gap:7px}.otp-inputs input{height:49px;font-size:23px}.verification-feedback{font-size:10px}.verification-resend,#resend-code{font-size:10px}.resend-timer{font-size:9px}.verification-demo>span{font-size:7px}.verification-demo p{font-size:9px}#verification-back{height:28px;font-size:10px}}
#character-back{height:23px;margin-top:5px;font-size:8px}
@media(max-width:600px){.registration-steps{font-size:10px;margin-bottom:17px}.registration-steps li span{width:23px;height:23px;font-size:8px}.character-field{margin-bottom:16px}.character-field>label,.character-field legend{font-size:12px}.character-field .field{height:43px;padding:10px}.character-field .field input,.character-field select{font-size:12px;height:22px}.field-hint{font-size:9px}.gender-option span{min-height:43px;font-size:11px}.gender-option b{font-size:22px}.character-feedback{font-size:10px}#character-back{height:29px;font-size:10px}.registration{min-height:850px}}