/* A small game inventory: preview, category, pick. Same controls at every size. */
.character-maker{display:grid;grid-template-columns:150px minmax(0,1fr);padding:0 0 12px;border:3px solid #ad81ca;border-radius:17px;background:#322047;overflow:hidden;box-shadow:0 5px 0 #12091e}
.character-maker>.mini-chrome{grid-column:1/-1;grid-row:1;padding:12px;background:linear-gradient(#e6cdff,#b087d0);border:0}.mini-chrome h3{font:12px Silkscreen,monospace}.mini-chrome>span{font:10px monospace}
.character-maker>.person-tabs{grid-column:1/-1;grid-row:2;flex-wrap:nowrap;overflow:auto;padding:8px;gap:7px;border-bottom:0;background:#21132f}.person-tabs button{flex:0 0 auto;min-height:44px;padding:9px 12px;border:2px solid #906fa7;border-radius:10px;font:12px monospace;max-width:200px}
.character-maker>.character-stage{grid-column:1;grid-row:3;min-height:0;justify-content:flex-start;padding:24px 8px 15px;border:0;background:radial-gradient(ellipse at 50% 75%,#c5a3e15c,transparent 62%),repeating-conic-gradient(#37234f 0 25%,#3c2956 0 50%) 0/24px 24px}
.character-stage #player-preview{width:128px;height:192px;flex-shrink:0}.character-stage #outfit-name{font:10px/1.4 monospace;max-width:132px;overflow-wrap:anywhere;text-align:center;padding:6px 8px;border-radius:12px;background:#1c102b}.character-stage .stage-caption{font:10px/1.5 monospace;max-width:130px}.stage-stars{font-size:20px;top:12px;letter-spacing:15px;padding-left:15px}
.character-maker>.wardrobe{grid-column:2;grid-row:3;min-width:0;background:#291939;padding:10px;border-left:2px solid #735189}
.wardrobe-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.wardrobe-tabs button{display:flex;align-items:center;justify-content:center;gap:5px;min-height:46px;border:2px solid #9675b5;border-radius:10px;background:linear-gradient(#745693,#50366d);color:#fff1ff;font:bold 11px/1.2 monospace;padding:6px 4px;box-shadow:0 3px 0 #160c25}.wardrobe-tabs button span{font:21px/1 monospace}.wardrobe-tabs button[aria-pressed=true]{color:#253515;background:linear-gradient(#edffbe,#bbdf7e);border-color:#e1ffa2;box-shadow:0 3px 0 #637740}.wardrobe-tabs button:focus-visible,.color-chip:focus-visible,.wardrobe-items button:focus-visible{outline:3px solid #fff;outline-offset:2px}
.wardrobe-heading{display:flex;flex-direction:column;gap:4px;padding:16px 2px 10px}.wardrobe-heading strong{font:15px Silkscreen,monospace;color:#d7ff9b}.wardrobe-heading span{font:11px/1.4 monospace;color:#e0c9ef}
.wardrobe-colors{display:grid;grid-template-columns:repeat(auto-fill,minmax(38px,1fr));gap:5px;margin-bottom:12px}.color-chip{padding:4px;min-width:0;min-height:44px;border:2px solid #9671ac;background:#422955;border-radius:9px;cursor:pointer}.color-chip>span{display:flex;align-items:center;justify-content:center;min-height:30px;background:var(--chip);border-radius:4px;color:white;font:bold 21px monospace;text-shadow:1px 1px 2px #000,-1px -1px 2px #000}.color-chip[aria-pressed=true]{border-color:#d9ffa3;box-shadow:0 0 0 1px #d9ffa3}
.wardrobe .hair-salon{margin:0;border:0;background:none}.wardrobe .hair-salon summary,.wardrobe .hair-search-label{display:none}.wardrobe .hair-salon input{margin:0 0 10px;width:100%;min-height:44px;border:2px solid #9774b4;border-radius:10px;font:14px monospace;padding:10px;background:#1b1028}.wardrobe .hair-gallery,.wardrobe-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(78px,1fr));gap:7px;padding:3px;max-height:280px;overflow:auto;overscroll-behavior:contain;scrollbar-color:#bb96d7 #1b1028;scrollbar-width:thin}
.wardrobe .hair-gallery button,.wardrobe-items button{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;min-height:95px;padding:5px 2px;gap:3px;border:2px solid #9371aa;border-radius:12px;background:linear-gradient(#664781,#48305f);box-shadow:0 3px 0 #170c23;color:#f7eaff;cursor:pointer}.wardrobe .hair-gallery button[aria-pressed=true],.wardrobe-items button[aria-pressed=true]{background:linear-gradient(#e9ffb8,#bfdc91);color:#26351c;border-color:#e7ffb9}.wardrobe .hair-gallery button:hover,.wardrobe-items button:hover{border-color:#f1c5ff}.wardrobe .hair-gallery span,.wardrobe-items button>span{font:11px/1.3 monospace;min-height:26px;text-align:center;overflow-wrap:anywhere}.wardrobe .hair-gallery canvas{width:80px;height:60px;max-width:100%;image-rendering:pixelated}.wardrobe-items canvas{width:72px;height:96px;object-fit:contain;image-rendering:pixelated}.wardrobe-items button{min-height:132px}.wardrobe .hair-salon p{margin:9px 3px;font-size:10px}
.wardrobe-tools{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px;min-height:44px}.wardrobe-tools .chrome-button{border-radius:10px;min-height:44px;font:12px monospace}.wardrobe-tools>span{font:11px/1.4 monospace;color:#dbffac;text-align:right;overflow-wrap:anywhere}
.character-maker>.person-fields{grid-column:1/-1;grid-row:4;display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;padding:16px 12px 0;border-top:2px solid #735189}.person-fields label{display:block;font:12px/1.5 monospace;margin:0}.person-fields label>span{display:block;font-size:10px;color:#cfb6df}.person-fields label[for=real-name]{grid-column:1;grid-row:1}.person-fields label[for=player-name]{grid-column:2;grid-row:1}.person-fields input,#player-name{width:100%;min-height:46px;grid-row:2;margin:0;padding:10px;border:2px solid #9671ad;border-radius:9px;font:16px Arial;background:#1b0f29}.person-fields #real-name{grid-column:1}.person-fields #player-name{grid-column:2}
.character-maker>.creator-note{grid-column:1/-1;grid-row:5;font-size:10px;margin:12px 8px 0}
[hidden]{display:none!important}
@media(min-width:1000px){#ticket-dialog{width:min(1180px,calc(100% - 28px))}.ticket-game-grid{grid-template-columns:minmax(550px,1.4fr) minmax(300px,1fr)}.wardrobe .hair-gallery,.wardrobe-items{max-height:300px}}
@media(min-width:621px) and (max-width:999px){.ticket-game-grid{grid-template-columns:1fr}.ticket-order{max-width:none}.character-maker{grid-template-columns:170px minmax(0,1fr)}.wardrobe-tabs{grid-template-columns:repeat(6,minmax(0,1fr))}.wardrobe-tabs button{flex-direction:column;font-size:10px}.character-stage #player-preview{width:144px;height:216px}}
@media(max-width:620px){
 #ticket-dialog{width:100%;max-width:none;height:100dvh;max-height:100dvh;margin:0;border:0;border-radius:0;overscroll-behavior:contain}#ticket-dialog .dialog-chrome{position:sticky;top:0;min-height:48px;padding:8px 12px}#ticket-dialog .close-dialog{width:44px;height:36px;font-size:23px}
 .ticket-content{padding:14px 10px max(20px,env(safe-area-inset-bottom))}.ticket-content h2{font-size:22px}.ticket-subtitle{font-size:12px;line-height:1.5}.ticket-progress{font-size:8px}.demo-notice{font-size:11px}
 .character-maker{grid-template-columns:1fr;border-radius:15px}.character-maker>.mini-chrome{grid-row:1}.character-maker>.person-tabs{grid-row:2}
 .character-maker>.character-stage{grid-column:1;grid-row:3;display:grid;grid-template-columns:120px minmax(0,1fr);grid-template-rows:1fr 1fr;padding:10px 18px;min-height:158px;align-items:center;justify-content:center;background:radial-gradient(ellipse at 30% 90%,#bd9ade66,transparent 62%),repeating-conic-gradient(#37234f 0 25%,#3c2956 0 50%) 0/24px 24px}
 .character-stage #player-preview{grid-column:1;grid-row:1/3;width:100px;height:150px;justify-self:center}.character-stage #outfit-name{grid-column:2;grid-row:1;align-self:end;font:14px/1.4 monospace;max-width:100%;padding:7px 10px;margin:0 0 6px}.character-stage .stage-caption{grid-column:2;grid-row:2;align-self:start;max-width:100%;font:12px/1.5 monospace;text-align:center;margin:0}.stage-stars{display:none}
 .character-maker>.wardrobe{grid-column:1;grid-row:4;border:0;border-top:2px solid #8962a4;padding:10px}.wardrobe-tabs{grid-template-columns:repeat(6,minmax(0,1fr));gap:4px}.wardrobe-tabs button{min-height:58px;flex-direction:column;gap:5px;font-size:10px;padding:5px 1px;border-radius:9px}.wardrobe-tabs button span{font-size:23px}
 .wardrobe-heading{padding-top:14px}.wardrobe-colors{grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}.color-chip{min-height:44px;padding:4px}.wardrobe .hair-gallery,.wardrobe-items{grid-template-columns:repeat(3,minmax(0,1fr));max-height:260px;gap:7px}.wardrobe .hair-gallery button{min-height:101px}.wardrobe-items button{min-height:127px}
 .character-maker>.person-fields{grid-column:1;grid-row:5;padding:14px 10px 0;gap:7px 10px}.person-fields label{font-size:12px}.person-fields label>span{font-size:10px;margin:0}.person-fields input,#player-name{font-size:16px;padding:10px 7px;width:100%;margin:0}.character-maker>.creator-note{grid-column:1;grid-row:6;font-size:9px;line-height:1.5}
 .quantity button{width:46px;height:46px}.ticket-option h3{font-size:16px}.ticket-order>.primary{font-size:12px;min-height:52px;border-radius:12px}.dance-pad button{min-width:44px;min-height:44px}.ticket-summary{font-size:14px}.ticket-order{margin-top:8px}.ticket-lobby{border-radius:12px;overflow:hidden}
}
@media(max-width:360px){.wardrobe-tabs button{font-size:9px}.wardrobe-tabs{gap:3px}.character-maker>.character-stage{padding:8px 12px;grid-template-columns:108px minmax(0,1fr)}.wardrobe{padding:8px}.wardrobe .hair-gallery span,.wardrobe-items button>span{font-size:10px}.wardrobe .hair-gallery canvas{width:72px;height:54px}.wardrobe-colors{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:620px){
 .character-maker{overflow:clip}
 .character-maker>.character-stage{position:sticky;top:48px;z-index:2;border-bottom:2px solid #9874b5;background-color:#36224c}
}
.wardrobe-tabs svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
/* Buying and dressing have separate screens. The fast path contains no game controls. */
#ticket-dialog[data-step=select]{width:min(620px,calc(100% - 24px))}.ticket-game-grid{display:block}.attendee-fields{display:grid;gap:14px;margin:22px 0}.attendee-fields label{font:13px/1.5 monospace;color:#f2dff9}.attendee-fields input{display:block;width:100%;min-height:48px;margin-top:6px;padding:11px;border:2px solid #9e7bb5;border-radius:9px;background:#190e25;color:#fff;font:16px Arial}.checkout-character-note{padding:12px;border:1px dashed #9f7ab7;color:#d9efbd;font:12px/1.6 monospace}.ticket-order .ticket-option{border-radius:12px}.ticket-order .party-note{margin-top:14px}.pass-dress{order:0}.issued-pass .pass-dress{min-height:48px;background:#ccff8c}.pass-link{min-height:44px}
#play-dressup{display:block;font:12px/1.5 monospace;margin-top:13px;color:#e7c8ef;padding:8px 0;text-decoration:underline;min-height:44px}
#wardrobe-dialog{padding:0;width:min(760px,calc(100% - 24px));max-height:calc(100dvh - 24px);overflow:auto;border:3px ridge #d9b2ed;border-radius:14px;background:#20102d;color:#f6e8ff}
#wardrobe-dialog .dialog-chrome{position:sticky;top:0;z-index:4;min-height:48px;background:linear-gradient(#e4c7f4,#9e75b5);padding:8px 12px;color:#281433}#wardrobe-dialog .close-dialog{width:40px;min-height:34px}#wardrobe-dialog .wardrobe-context{padding:14px 16px;font:12px/1.6 monospace;color:#e1caec;margin:0}#wardrobe-dialog .character-maker{margin:0 12px}#wardrobe-dialog .person-tabs{display:none}#wardrobe-dialog .person-fields{display:block}#wardrobe-dialog .person-fields label{margin-bottom:6px}#wardrobe-dialog #real-name{display:none}#wardrobe-dialog .wardrobe-actions{display:flex;flex-direction:column;gap:8px;padding:14px 16px}.wardrobe-actions .primary{min-height:50px;border-radius:10px;font-size:13px}.wardrobe-actions .back-button{min-height:44px;font-size:13px}#wardrobe-dialog>.ticket-lobby{margin:12px 16px}#wardrobe-dialog #wardrobe-status{padding:0 14px}#wardrobe-dialog .character-stage{grid-row:3}#wardrobe-dialog .wardrobe-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}#wardrobe-dialog .wardrobe-tabs button{flex-direction:row}#wardrobe-dialog .person-fields label[for=player-name]{display:block}
@media(max-width:620px){#ticket-dialog[data-step=select]{width:100%;height:auto;max-height:100dvh;margin:auto 0}#wardrobe-dialog{width:100%;height:100dvh;max-height:100dvh;max-width:none;margin:0;border:0;border-radius:0}#wardrobe-dialog .character-maker{margin:0 8px}#wardrobe-dialog .wardrobe-tabs{grid-template-columns:repeat(6,minmax(0,1fr))}#wardrobe-dialog .wardrobe-tabs button{flex-direction:column}#wardrobe-dialog .wardrobe-context{padding:10px 14px;font-size:11px}#wardrobe-dialog>.ticket-lobby{margin:12px}#wardrobe-dialog .character-maker>.character-stage{position:sticky;top:48px}#wardrobe-dialog .wardrobe-actions{padding-bottom:max(15px,env(safe-area-inset-bottom))}}
