/* Three simple views of the same closet; every outfit appears exactly once. */
.wardrobe-dialog { width:min(1040px,calc(100% - 24px)); height:min(850px,calc(100dvh - 24px)); max-width:none; max-height:none; padding:0; border:1px solid #cfb19a; border-radius:24px; overflow:hidden; color:#493342; background:#bb9181 url('assets/evening-v1/dressing-room.png') center/cover; box-shadow:0 25px 100px #24142c80; }
.wardrobe-dialog[open] { display:flex; flex-direction:column; }
.wardrobe-dialog::backdrop { background:#211722b0; backdrop-filter:blur(8px); }
.studio-header { display:flex; align-items:center; gap:12px; padding:12px 20px; background:#fff8eff0; border-bottom:1px solid #d6bdae; flex:none; }
.studio-header h2 { margin:0; font-size:22px; font-weight:750; letter-spacing:-.025em; }
.wardrobe-dialog #wardrobe-close { width:42px; height:42px; background:#f3e5db; color:#674a53; border:1px solid #dac3b4; font-size:32px; }
.wardrobe-dialog .wardrobe-wallet { position:static; margin:0 0 0 auto; padding:5px 13px; display:flex; align-items:center; gap:8px; border:1px solid #d6bbae; border-radius:13px; background:#fffaf2; box-shadow:none; flex:none; }
.wardrobe-dialog .wardrobe-wallet span { font-size:14px; color:#765b66; }
.wardrobe-dialog .wardrobe-wallet strong { font-size:21px; color:#684955; }
.wardrobe-dialog .wardrobe-wallet .sr-only { position:absolute; margin:0; }
.wardrobe-dialog .wardrobe-controls { margin:0; padding:10px 20px; background:#fff8efd9; border-bottom:1px solid #cdb3a1; flex:none; flex-wrap:wrap; gap:10px; }
.wardrobe-dialog .wardrobe-tabs,.wardrobe-tools { display:flex; gap:6px; }
.wardrobe-dialog .wardrobe-tabs button,.wardrobe-dialog .wardrobe-tools select { border:1px solid #d1b5a5; background:#fffaf3; color:#73505f; border-radius:20px; min-height:40px; padding:7px 16px; font:650 14px system-ui; cursor:pointer; }
.wardrobe-dialog .wardrobe-tabs button[aria-pressed="true"] { background:#785466; border-color:#785466; color:#fff; }
.wardrobe-dialog[data-section="mia"] .wardrobe-tabs button[aria-pressed="true"] { background:#4f668a; border-color:#4f668a; }
#wardrobe-items { flex:1; min-height:0; min-width:0; overflow:hidden; }
.closet-collection { box-sizing:border-box; height:100%; padding:20px; display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); align-content:start; gap:14px; overflow:auto; overscroll-behavior:contain; scrollbar-color:#ab8b81 #fff6ed90; }
.closet-card { box-sizing:border-box; display:grid; grid-template-rows:220px minmax(40px,auto) 42px; align-content:start; min-width:0; padding:14px; border:1px solid #d9c5bb; border-radius:18px; background:#fffaf2ec; box-shadow:0 4px 16px #4a2e3b16; }
.closet-card.is-equipped { border:2px solid #aa758e; padding:13px; background:#fff2f9f5; }
.wardrobe-dialog[data-section="mia"] .closet-card.is-equipped { border-color:#7494bf; background:#edf5fff5; }
.closet-art { min-width:0; min-height:0; width:100%; height:100%; padding-bottom:8px; box-sizing:border-box; }
.closet-art>.hanger-sprite { display:block; width:100%; height:100%; overflow:hidden; filter:drop-shadow(0 3px 3px #49322b20); }
.closet-art>img { width:100%; height:100%; object-fit:cover; border-radius:10px; }
.closet-card h3 { align-self:center; margin:2px 0 8px; font-size:16px; line-height:1.25; text-align:center; overflow-wrap:anywhere; }
.closet-card>button { width:100%; min-height:42px; border:1px solid #765167; border-radius:12px; padding:8px 10px; color:white; background:#765167; font:700 14px system-ui; cursor:pointer; }
.wardrobe-dialog[data-section="mia"] .closet-card>button { background:#506d95; border-color:#506d95; }
.closet-card>button:disabled,.wardrobe-dialog[data-section="mia"] .closet-card>button:disabled { color:#77636f; background:#e9dce2; border-color:#d5c4ce; cursor:default; }
.closet-card.is-equipped>button:disabled { background:transparent; border-color:transparent; color:#7e536d; }
.closet-empty { padding:30px; color:#694b59; background:#fffaf2e0; border-radius:14px; }
/* B: a swipeable row, without a separate large duplicate. */
.wardrobe-dialog[data-layout="rail"] .closet-collection { display:flex; align-items:center; gap:20px; padding:24px; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; }
.wardrobe-dialog[data-layout="rail"] .closet-card { flex:0 0 min(72vw,340px); height:min(100%,570px); grid-template-rows:minmax(0,1fr) auto 44px; padding:20px; scroll-snap-align:center; }
.wardrobe-dialog[data-layout="rail"] .closet-card h3 { margin:14px 0; font-size:20px; }
/* C: compact rows, with the same one-click action area. */
.wardrobe-dialog[data-layout="list"] .closet-collection { grid-template-columns:1fr; gap:10px; }
.wardrobe-dialog[data-layout="list"] .closet-card { grid-template-columns:92px minmax(0,1fr) 140px; grid-template-rows:112px; align-items:center; gap:18px; padding:10px 16px; }
.wardrobe-dialog[data-layout="list"] .closet-card.is-equipped { padding:9px 15px; }
.wardrobe-dialog[data-layout="list"] .closet-art { padding:0; }
.wardrobe-dialog[data-layout="list"] .closet-card h3 { text-align:left; margin:0; }
.studio-footer { display:flex; align-items:center; justify-content:flex-end; gap:12px; min-height:36px; box-sizing:border-box; padding:6px 18px; border-top:1px solid #cfb2a3; background:#fff8efed; flex:none; position:relative; }
.wardrobe-dialog #wardrobe-status { margin:0; color:#806676; font-size:13px; line-height:1.35; flex:1; }
.wardrobe-dialog #wardrobe-status[hidden] { display:none; }
.wardrobe-dialog #wardrobe-retry { margin:0; min-height:32px; font-size:13px; }
.studio-music { flex:none; }.studio-music summary { cursor:pointer; color:#735766; font-size:14px; padding:3px 2px; }
.studio-music .ambient-controls { position:absolute; right:12px; bottom:44px; z-index:5; width:245px; padding:17px; margin:0; border:1px solid #c7aebf; border-radius:15px; background:#fffcf7; box-shadow:0 8px 32px #32243740; }
.wardrobe-dialog button:focus-visible,.wardrobe-dialog select:focus-visible,.studio-music summary:focus-visible,.closet-card:focus-visible { outline:3px solid #66466f; outline-offset:3px; }
@media(max-width:700px) {
  .wardrobe-dialog { width:100%; height:100dvh; max-height:100dvh; margin:0; border:0; border-radius:0; }
  .studio-header { gap:8px; padding:9px 12px; }.studio-header h2 { font-size:19px; }
  .wardrobe-dialog #wardrobe-close { width:36px; height:36px; font-size:29px; }
  .wardrobe-dialog .wardrobe-wallet { padding:6px 9px; gap:6px; border-radius:10px; }.wardrobe-dialog .wardrobe-wallet strong { font-size:18px; }
  .wardrobe-dialog .wardrobe-controls { padding:8px 12px; gap:8px; }
  .wardrobe-dialog .wardrobe-tabs button,.wardrobe-dialog .wardrobe-tools select { min-height:36px; padding:6px 10px; }
  .wardrobe-dialog .wardrobe-tools { margin-left:auto; }
  .closet-collection { padding:12px; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .closet-card { padding:10px; grid-template-rows:clamp(140px,23dvh,200px) minmax(40px,auto) 42px; border-radius:15px; }.closet-card.is-equipped { padding:9px; }
  .closet-card h3 { font-size:15px; }
  .wardrobe-dialog[data-layout="rail"] .closet-collection { padding:16px; gap:14px; }
  .wardrobe-dialog[data-layout="rail"] .closet-card { padding:18px; }
  .wardrobe-dialog[data-layout="list"] .closet-card { grid-template-columns:64px minmax(0,1fr) 105px; grid-template-rows:90px; gap:10px; padding:9px; }
  .wardrobe-dialog[data-layout="list"] .closet-card.is-equipped { padding:8px; }
  .wardrobe-dialog[data-layout="list"] .closet-card>button { font-size:13px; padding:8px 5px; }
  .studio-footer { padding:5px 12px max(5px,env(safe-area-inset-bottom)); gap:8px; }
}
@media(max-width:370px) { .wardrobe-dialog .wardrobe-wallet span { display:none; }.wardrobe-dialog .wardrobe-controls { justify-content:center; }.wardrobe-dialog .wardrobe-tools { margin-left:0; } }

.studio-footer { flex-wrap:wrap; }
.reset-open { border:0; background:transparent; color:#76536c; min-height:40px; padding:7px 4px; font:600 14px system-ui; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.reset-open:disabled { opacity:.5; cursor:default; }
.reset-dialog { box-sizing:border-box; width:min(430px,calc(100% - 28px)); max-height:calc(100dvh - 28px); overflow:auto; padding:24px; border:1px solid #d6bacd; border-radius:22px; background:#fff8f3; color:#563d54; box-shadow:0 16px 60px #2c173d45; }
.reset-dialog::backdrop { background:#23132d99; }
.reset-dialog h2 { font-size:23px; margin:0 0 12px; }
.reset-dialog p { font-size:16px; line-height:1.5; }
.reset-dialog #reset-status:empty { display:none; }
.reset-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; }
.reset-actions button { flex:1 1 145px; min-height:44px; padding:10px 12px; border:1px solid #bd91ae; border-radius:12px; background:white; color:#76516c; font:700 14px system-ui; cursor:pointer; }
.reset-actions #reset-confirm { color:white; background:#9c416b; border-color:#9c416b; }
.reset-actions button:disabled { opacity:.5; cursor:default; }
