#selection{position:absolute;inset:0;z-index:5;background:linear-gradient(135deg,#0c211ae8,#10251fbb);display:flex;align-items:center;justify-content:center;padding:max(20px,env(safe-area-inset-top)) 20px max(20px,env(safe-area-inset-bottom));overflow:auto}.character-panel{width:min(720px,100%);padding:30px;border-radius:18px}.selection-back{display:inline-block;color:#b8c6a7;text-decoration:none;font-size:11px;margin-bottom:26px}.character-panel .eyebrow{display:block}.character-panel h1{font-size:38px;margin:17px 0 8px;letter-spacing:-1px}#selection-handle{color:#d4d9a7;font-size:13px;margin:0 0 23px}#character-options{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.character-option{background:#b4c69309;border:1px solid #cdd9aa26;border-radius:10px;padding:12px 6px;display:flex;align-items:center;flex-direction:column;gap:7px;transition:background .15s,border-color .15s}.character-option:hover:not(:disabled){background:#b4c69322}.character-option[aria-checked=true]{border-color:#d4d9a7;background:#b4c6931a}.character-option:disabled{opacity:.42;cursor:not-allowed}.character-option strong{font-size:12px;font-weight:500}.character-option small{font-size:9px;color:#abbc9e}#selection-status{min-height:32px;color:#becbac;font-size:11px;line-height:1.6;margin:18px 0 10px}.play-button{width:100%;padding:15px 18px;border:1px solid #d1d9a54d;border-radius:9px;background:#a3b77d;color:#11251f;font-size:13px;font-weight:600}.play-button:disabled{background:#3c503a;color:#a6b49b;opacity:.6;cursor:not-allowed}.selection-note{text-align:center;color:#91a58b;font-size:9px;line-height:1.8;margin:15px 0 0}@media(max-width:700px){#selection{align-items:flex-start;padding:18px 14px}.character-panel{padding:20px 16px}.selection-back{margin-bottom:20px}.character-panel h1{font-size:30px}.character-panel .eyebrow{font-size:7px;letter-spacing:1.2px}#character-options{grid-template-columns:repeat(3,1fr);gap:8px}.character-option{padding:10px 5px;gap:5px}#selection-status{font-size:10px}.selection-note{font-size:8px}}
#selection .character-panel{margin:auto;max-height:none} .character-preview{width:64px;height:96px;display:block;background-image:url('/assets/characters.png');background-size:384px 2208px;background-repeat:no-repeat;image-rendering:pixelated;background-position:0 0;flex-shrink:0}.character-preview.pending-preview{background-size:contain;background-position:center}.character-create{margin-top:24px;border-top:1px solid #b4c69340;padding-top:16px}.character-create label,.initial-vocation label{display:flex;flex-direction:column;gap:8px;margin:12px 0;font-size:13px}.character-create input,.character-create select,.initial-vocation select{background:#152c24;color:#e3e8d3;border:1px solid #a7bd8c70;border-radius:6px;padding:11px;font:inherit}.model-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;max-height:330px;overflow:auto}.model-options .character-option strong{font-size:10px;overflow-wrap:anywhere}.model-options .character-option small{line-height:1.4}.creation-status{font-size:12px;color:#efc297}.character-panel>.secondary{margin-top:12px;width:100%}.google-login[aria-disabled=true]{opacity:.5;cursor:default}.initial-vocation{margin:12px 0}.character-panel{overflow:visible}@media(max-width:700px){.model-options{grid-template-columns:repeat(3,minmax(0,1fr))}}

.paperdoll-preview{width:96px;height:96px;display:block;image-rendering:pixelated;flex-shrink:0}.portrait .paperdoll-preview{width:100%;height:100%;object-fit:contain}.appearance-editor{border:1px solid #cdd9aa40;border-radius:12px;padding:16px;display:grid;grid-template-columns:112px minmax(0,1fr);align-items:center;gap:12px}.appearance-editor legend{padding:0 8px;color:#d4d9a7}.appearance-editor>.paperdoll-preview{width:112px;height:112px;background:#203d30;border-radius:8px}.appearance-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.appearance-controls label{margin:0;min-width:0}.appearance-controls select{width:100%;min-width:0}.appearance-directions{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px}.appearance-directions button{background:#203d30;border:1px solid #cdd9aa40;border-radius:6px;padding:8px;font-size:11px}.appearance-directions button[aria-pressed=true]{background:#526d46}@media(max-width:480px){.appearance-editor{grid-template-columns:1fr}.appearance-editor>.paperdoll-preview{justify-self:center}.appearance-controls{width:100%}}
#visual-controls{position:absolute;right:18px;bottom:145px;display:flex;gap:8px;pointer-events:auto;z-index:6}#visual-controls button{background:#17372ded;border:1px solid #d3c69870;border-radius:8px;padding:10px 14px;font-size:12px}#visual-controls #attack-button{background:#755237;color:#fff0cf}.visual-panel{position:absolute;right:0;bottom:48px;width:240px;max-width:calc(100vw - 36px);padding:14px;border:1px solid #d3c69870;background:#10291ff5;border-radius:10px}.visual-panel label{display:flex;flex-direction:column;gap:8px;font-size:12px}.visual-panel select,.animation-preview-select select{padding:9px;background:#152c24;color:#e3e8d3;border:1px solid #a7bd8c70;border-radius:6px;max-width:100%}.visual-panel button{width:100%;margin-top:10px}.visual-panel small{display:block;font-size:10px;line-height:1.6;color:#bdc9ad;margin-top:12px}.animation-preview-select{grid-column:1/-1;display:flex;flex-direction:column;gap:8px}@media(pointer:coarse){#visual-controls{bottom:185px;right:12px}#visual-controls button{min-height:42px}.visual-panel{bottom:50px}}

@media(pointer:coarse) and (orientation:portrait){#world.handheld #visual-controls{top:calc(var(--screen-top) + var(--screen-height) + var(--chat-height) + 136px);bottom:auto;right:24px}.visual-panel{max-height:55dvh;overflow:auto}}