:root{color-scheme:dark;font-family:Georgia,serif;color:#f3ead5;background:#111316}*{box-sizing:border-box}body{margin:0;min-height:100vh;display:grid;place-items:center;padding:32px 16px;background:radial-gradient(ellipse at top,#383022 0,#14181d 55%,#0d1014 100%)}.portal{width:100%;max-width:480px;padding:36px;border:1px solid #66533a;border-radius:16px;background:#171b20;box-shadow:0 24px 80px #0008}.eyebrow{letter-spacing:.2em;color:#d6af69;font:11px system-ui;margin:0 0 14px}h1{font-weight:500;font-size:32px;margin:0 0 12px}h2{font-size:23px;font-weight:500}.intro{color:#b7b4ad;line-height:1.5;margin-bottom:24px}label{display:block;font:14px system-ui;margin:16px 0 8px}input,select{width:100%;padding:12px;border:1px solid #515252;border-radius:7px;background:#101418;color:#fff;font:16px system-ui}input:focus,select:focus,button:focus-visible,a:focus-visible{outline:2px solid #e7c580;outline-offset:3px}button{font:600 14px system-ui;cursor:pointer;border:1px solid #766244;border-radius:7px;padding:12px;color:#ebd6ab;background:#242a30}button:disabled{opacity:.55;cursor:wait}.primary{width:100%;margin-top:12px;background:#dcc08a;color:#232017;border-color:#dcc08a}.tabs{display:flex;gap:8px}.tabs button{flex:1}.tabs button[aria-pressed=true]{border-color:#d6af69;background:#3b3428}.hint{font:12px/1.6 system-ui;color:#a5aaa9;margin:10px 0}.divider{display:flex;align-items:center;gap:12px;color:#7d827f;margin:22px 0;font:12px system-ui}.divider:before,.divider:after{content:'';height:1px;background:#3b4142;flex:1}#google-button{display:flex;justify-content:center}#message{font:14px/1.5 system-ui;color:#ebc890;overflow-wrap:anywhere}#account-email,#character-summary{font:15px/1.7 system-ui;overflow-wrap:anywhere}#logout{margin-top:18px}.staging{font:12px/1.6 system-ui;border-top:1px solid #394047;margin-top:28px;padding-top:18px;color:#9ba5a7}.staging strong{color:#c9b88e}.staging p{margin:6px 0 18px}a{display:block;color:#e0c18b;font:14px/1.5 system-ui;text-decoration:none}.back{margin-top:12px;color:#939b9d;font-size:12px}[hidden]{display:none!important}@media(max-width:420px){.portal{padding:24px}h1{font-size:28px}}

#character-list{display:grid;gap:12px;margin:18px 0}.character-card{padding:16px;border:1px solid #66533a;border-radius:10px;background:#101418;overflow-wrap:anywhere}.character-card strong{color:#ebd6ab}.character-card p{font:13px system-ui;color:#b7b4ad}.character-card button{width:100%}.character-card button:disabled{cursor:default}#unlock-slots{margin:16px 0}

/* Test phase notice: readable on mobile and visible before contributing. */
.test-phase-notice{position:relative;padding:14px 18px;margin:0 0 18px;border:1px solid #d6af69;border-left:4px solid #d6af69;border-radius:8px;background:#241c12;color:#f3ead5;font:13px/1.6 system-ui,sans-serif;overflow-wrap:anywhere;text-align:left}
.test-phase-notice strong{display:block;color:#ffe1a1;font-size:14px}.test-phase-notice p{margin:6px 0 0}


/* Character hall: occupied, available and locked account slots. */
body.has-roster{display:block;padding:36px 24px;background:radial-gradient(ellipse at 50% 0,#243342 0,transparent 58%),#0c1118}
.has-roster .portal{max-width:1160px;margin:auto;padding:36px;background:linear-gradient(145deg,#16222df5,#101820);border-color:#65717a;box-shadow:0 30px 100px #0008}
.has-roster .portal>h1{font-size:36px}.has-roster .portal>.intro{margin-bottom:24px}
.has-roster .test-phase-notice{margin-bottom:26px;background:#33271966;border-color:#9b7b45}
.account-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-bottom:20px;border-bottom:1px solid #70808b33}
.account-heading .eyebrow{margin:0 0 8px;font-size:10px}.account-heading h2{margin:0;font-size:29px}.account-heading #account-email{margin:5px 0 0;color:#a7b4be;font-size:12px}
.enter-world{display:flex;align-items:center;gap:24px;padding:15px 20px;border:1px solid #dfbe76;border-radius:8px;background:linear-gradient(120deg,#e4c283,#bea15d);color:#191d21;font-weight:750;white-space:nowrap}
#character-summary{font-size:13px;color:#c1d1da;margin:18px 0 24px}.roster-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px}.roster-heading h3{margin:0;color:#e4d9c2;font-size:17px;font-weight:500}.roster-heading .hint{margin:0;color:#8fa5b7}
#character-list{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:16px 0}
.character-card{position:relative;display:flex;flex-direction:column;align-items:center;min-width:0;min-height:310px;padding:14px 12px 12px;background:radial-gradient(ellipse at 50% 45%,#28445466,transparent 68%),#101b25;border:1px solid #65768466;border-radius:11px;text-align:center;overflow:hidden}
.character-card.is-active{border-color:#d9b878;box-shadow:inset 0 0 0 1px #e5c48c33,0 4px 20px #0003}
.slot-number{align-self:flex-start;font:600 9px/1.4 system-ui;letter-spacing:.16em;color:#7d96a8}.is-active .slot-number{color:#dec088}
.character-card>strong{font:600 16px/1.35 Georgia,serif;color:#eee3cd;max-width:100%;overflow-wrap:anywhere}
.character-card>p{margin:7px 0 16px;font:11px/1.5 system-ui;color:#9fb3c3;max-width:100%}.character-card>button{margin-top:auto;padding:10px 6px;font-size:11px;border-color:#5a7485;background:#203343;color:#dae8f1}
.character-card.is-active>button{color:#e1c78f;background:#393123;border-color:#9c834f;opacity:1}
.slot-art{position:relative;width:100%;height:185px;flex-shrink:0;isolation:isolate;overflow:hidden}
.slot-art:after{content:'';position:absolute;bottom:8px;left:20%;right:20%;height:9px;border-radius:50%;background:#0008;filter:blur(5px);z-index:-1}
.slot-art img{position:absolute;width:230px;height:185px;max-width:none;left:50%;top:0;transform:translateX(-50%);object-fit:contain;filter:drop-shadow(0 7px 5px #0006)}
.slot-art img.base-art{width:340px;height:226.67px;top:-26px;object-fit:fill}
.character-card.slot-empty,.character-card.slot-locked{justify-content:center;border-style:dashed;background:linear-gradient(145deg,#18283355,#0d1720);min-height:310px}
.slot-empty .slot-number,.slot-locked .slot-number{position:absolute;left:14px;top:14px}.slot-symbol{display:grid;place-items:center;width:50px;height:50px;margin:15px 0 20px;border:1px solid #64859866;border-radius:50%;color:#9ac0d4;font:30px Georgia}
.slot-empty>strong,.slot-locked>strong{font-size:15px}.slot-empty>button{margin-top:12px}.slot-empty>p,.slot-locked>p{font-size:11px;margin-bottom:7px}.slot-locked{opacity:.65}.slot-locked>small{font:11px system-ui;color:#c7b483;margin-top:8px}.slot-locked .slot-symbol{color:#8895a0;border-color:#4d657455}
.roster-note{max-width:850px}#unlock-slots{font-size:12px;color:#d4b979;margin:12px 0 24px}
#create-character{margin-top:32px;padding-top:28px;border-top:1px solid #70808b33}.creation-heading .eyebrow{font-size:10px;margin:0 0 8px}.creation-heading h2{font-size:28px;margin:0 0 6px}.creation-heading .hint{margin:0 0 22px}
.creation-layout{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:30px;align-items:stretch}
.creation-preview{position:relative;display:flex;align-items:center;justify-content:flex-end;flex-direction:column;min-height:400px;margin:0;border:1px solid #71829555;border-radius:12px;background:radial-gradient(ellipse at 50% 40%,#36566a88,transparent 65%),linear-gradient(150deg,#182d3c,#0a1722);overflow:hidden;isolation:isolate}
.preview-glow{position:absolute;width:230px;height:230px;top:30px;border:1px solid #bba57444;border-radius:50%;box-shadow:0 0 0 15px #9eacb807,0 0 0 45px #9eacb804;background:radial-gradient(ellipse,#d4bd7b19,transparent 65%);z-index:-1}
.creation-preview>img{position:absolute;width:540px;height:360px;top:-65px;left:50%;transform:translateX(-50%);max-width:none;object-fit:fill;filter:drop-shadow(0 12px 10px #0009)}
.creation-preview figcaption{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;width:100%;padding:20px 18px 24px;background:linear-gradient(transparent,#0b1722e6 25%);text-align:center}
.creation-preview figcaption .eyebrow{font-size:8px;color:#b4a275;margin:0}.creation-preview strong{font-size:23px;font-weight:500;color:#f5e7c7;overflow-wrap:anywhere;max-width:100%}#preview-class{font:12px system-ui;color:#c8d4df}#preview-detail{font:11px system-ui;color:#899fb0}
.creation-fields{padding:0 2px}.creation-fields>label:first-child{margin-top:0}.creation-fields input,.creation-fields select{background:#0c1721;border-color:#526879}.creation-fields input::placeholder{font-size:13px;color:#758c9d}
.gender-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;border:0;padding:0;margin:20px 0 12px;min-width:0}.gender-options legend{font:14px system-ui;padding:0;margin-bottom:10px}.gender-options label{position:relative;margin:0;cursor:pointer}.gender-options input{position:absolute;opacity:0;width:1px;height:1px;padding:0}.gender-options span{display:block;padding:13px;border:1px solid #526879;border-radius:7px;text-align:center;font:13px system-ui;color:#a9bfce;background:#142330}.gender-options input:checked+span{border-color:#dcbb7d;background:#483d2c;color:#f5dcab;box-shadow:inset 0 0 0 1px #d9b36b33}.gender-options input:focus-visible+span{outline:2px solid #f1ce8b;outline-offset:3px}.creation-fields .primary{margin-top:16px;padding:14px;background:linear-gradient(120deg,#e4c283,#c1a36b)}.creation-footnote{text-align:center;font-size:11px}
.has-roster #logout{margin-top:28px;font-size:12px;padding:10px 16px}.has-roster .staging{margin-top:22px}.has-roster #message:empty{display:none}
@media(max-width:900px){#character-list{grid-template-columns:repeat(3,minmax(0,1fr))}.creation-layout{gap:20px}.creation-preview{min-height:390px}.has-roster .portal{padding:26px}}
@media(max-width:600px){body.has-roster{padding:14px 10px}.has-roster .portal{padding:20px 14px;border-radius:12px}.has-roster .portal>h1{font-size:29px}.account-heading{align-items:flex-start;flex-direction:column;gap:16px}.enter-world{width:100%;justify-content:space-between;padding:13px 16px}.roster-heading{display:block}.roster-heading .hint{margin-top:6px;font-size:11px}#character-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.character-card,.character-card.slot-empty,.character-card.slot-locked{min-height:280px;padding:12px 8px}.slot-art{height:160px}.slot-art img.base-art{width:300px;height:200px;top:-25px}.slot-art img{width:200px;height:160px}.character-card>strong{font-size:15px}.character-card>p{font-size:10px}.creation-layout{grid-template-columns:1fr;gap:24px}.creation-preview{min-height:340px;max-width:100%}.creation-preview>img{width:450px;height:300px;top:-54px}.preview-glow{width:190px;height:190px;top:20px}.creation-preview figcaption{padding-bottom:20px}.creation-preview strong{font-size:21px}.creation-heading h2{font-size:25px}.creation-fields{padding:0}.creation-fields>label{margin-top:16px}.has-roster .test-phase-notice{padding:12px;font-size:11px}}