[hidden]{display:none!important}
body{background:#111611}
.welcome{min-height:100vh;padding:34px 22px 55px;background:linear-gradient(#10150f66,#0b100cbb),url('assets/backgrounds/fond-site-bd-franco-belge-v1.png') center/cover fixed;display:flex;flex-direction:column;align-items:center}
.brand{text-align:center;margin-bottom:25px;text-shadow:0 3px 12px #000}
.brand p,.eyebrow{font-size:10px;letter-spacing:3px;color:#b7be99}.brand h1{font:600 52px Georgia;letter-spacing:9px;margin:4px 0}.brand span{letter-spacing:4px;font-size:12px;color:#d1bd87}
.account-card{display:flex;width:min(100%,470px);background:linear-gradient(125deg,#292d23f5,#171d18fa);border:1px solid #8c815255;border-radius:4px;box-shadow:0 18px 80px #0008}
.account-card.registering{width:min(100%,940px)}.account-content{flex:1;padding:32px;min-width:0}.account-content h2{font:500 32px/1.1 Georgia;margin:12px 0 16px;color:#f0e5c7}.account-content p{line-height:1.65;color:#c3c5b6}.account-content .eyebrow{color:#a5b18e}.auth-tabs{display:flex;margin:24px 0 20px;border-bottom:1px solid #756c49}.auth-tabs button{flex:1;border:0;border-radius:0;background:none;font-size:13px;color:#c1c3b3;padding:14px 4px}.auth-tabs button[aria-pressed=true]{color:#e6cd8b;background:none;border-bottom:2px solid #d4b96e}
#join-form>label,#registration-fields>label,fieldset>label{display:block;margin:17px 0 8px}#join-form input:not([type=radio]),#join-form select{width:100%;font:inherit;padding:12px;color:#f3eddb;background:#151d16;border:1px solid #717755;border-radius:2px}#join-form input:focus,#join-form select:focus{outline:2px solid #d4b96e;outline-offset:2px}#join-form small{display:block;font-size:11px;line-height:1.6;color:#b0b59f;margin:16px 0}.primary{width:100%;background:#d1bc81;color:#1c2218;border:0;border-radius:2px;margin-top:6px;padding:15px;text-align:left}.primary:hover{background:#e0cb91}button:disabled{opacity:.6;cursor:wait}fieldset{border:0;padding:0;margin:23px 0 0}legend{text-transform:uppercase;letter-spacing:2px;font-size:10px;color:#a5b18e}.gender-options{display:flex;gap:10px;margin-top:15px}.gender-options label{flex:1;padding:10px;background:#202b1d;border:1px solid #626d48;font-size:13px}.starting-life{font-size:12px}#net-status{font-size:13px;margin-bottom:0}#character-preview{width:43%;align-self:flex-start;text-align:center;padding:44px 8px 20px}#portrait{width:100%;height:auto;aspect-ratio:340/520;cursor:default}#character-preview small{font-size:11px;color:#b0b59f;line-height:1.6}#character-preview p{font:22px Georgia}#player-hud{max-width:1440px;margin:auto;padding:14px 22px;display:flex;align-items:center;gap:20px;flex-wrap:wrap}#online-status{font-size:12px;color:#b0b59f}#logout{margin-left:auto}
@media(max-width:650px){.welcome{padding:20px 14px}.brand h1{font-size:38px}.account-content{padding:24px}.account-card.registering{flex-direction:column}#character-preview{width:100%;padding:8px}#portrait{width:135px}#character-preview p{margin:0}#character-preview small{display:none}}

#portrait{margin:auto}
.character-options{display:grid;grid-template-columns:1fr 1fr;gap:14px}.character-options label{display:block;margin:17px 0 8px}#portrait[aria-busy=true]{opacity:.35}#portrait-status{display:block;min-height:2.8em}



.character-choices{max-width:300px;margin:22px auto 10px;text-align:left}.choice-row{margin:14px 0}.choice-title{display:block;color:#b0b59f;font-size:11px;letter-spacing:2px;text-transform:uppercase;margin-bottom:6px}.choice-controls,#model-choice{display:flex;align-items:center;justify-content:space-between;gap:12px}.choice-controls>span{flex:1;text-align:center}.choice-controls button,#model-choice button{width:42px;min-height:42px;padding:0;font-size:28px;line-height:1}#model-choice{max-width:300px;margin:12px auto;color:#c3c5b6;font-size:13px}@media(max-width:650px){#character-preview{padding:24px}#portrait{width:min(100%,240px)}}

#model-choice{position:relative;display:block;max-width:none;margin:0;padding:0 40px}#model-choice button{position:absolute;top:50%;transform:translateY(-50%);z-index:1}#model-prev{left:0}#model-next{right:0}#model-choice #portrait{width:100%;max-width:340px}