/* v2.72 · B layout, using the existing studio's palette and typography. */
.studio-mode-buttons{display:grid;grid-template-columns:1fr 1fr;gap:12px;flex-shrink:0}
.studio-mode-buttons .trybtn{width:100%;margin:0;min-width:0;font-size:14px;padding:16px 12px;box-shadow:0 0 0 1.2px var(--ink),0 6px 18px -12px var(--ink)}
.studio-mode-buttons .trybtn b{font-size:15px;letter-spacing:1px;white-space:nowrap}
.studio-mode-buttons .trybtn em,.studio-mode-buttons .trybtn>span{font-size:16px;margin-left:5px}
.studio-mode-buttons #tryBtn{background:white;animation:none}
.studio-mode-buttons #tryBtn:after{display:none}
.studio-mode-buttons .live-entry{background:var(--brand);color:var(--ink)}
.live-stage,.live-footer{--live-xs:6px;--live-sm:12px;--live-md:20px;--live-screen:22px;--live-corner:22px}
.live-stage{position:absolute;inset:0;z-index:20;background:var(--bg);border-radius:inherit;overflow:hidden;isolation:isolate}
.live-stage[hidden],.live-footer[hidden],.live-help[hidden],.live-stage [hidden]{display:none!important}
.live-video-backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:blur(28px);transform:scale(1.14);opacity:.6;z-index:-3;pointer-events:none}
.live-freeze-backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:blur(28px);transform:scale(1.14);opacity:.6;z-index:-1;pointer-events:none}
.live-freeze-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:-1;pointer-events:none}
.live-video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:transparent;z-index:-2}
.live-header{position:absolute;inset:var(--live-md) var(--live-md) auto;display:flex;align-items:center;gap:var(--live-sm)}
.live-back{display:flex;align-items:center;gap:var(--live-xs);height:42px}
.live-back-arrow{font-size:24px;line-height:1;font-weight:300}
.live-back-title{font-size:11px}
.utils .live-history-icon{display:inline-flex;align-items:center;justify-content:center;min-width:42px;min-height:42px;padding:10px}
.live-history-icon svg{display:block;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.live-preview-label{margin-left:auto;font-size:11px;color:var(--ink-soft);padding:7px 10px;background:rgba(253,252,246,.82);border:1px solid rgba(255,255,255,.8);border-radius:999px;backdrop-filter:blur(20px)}
.live-help-toggle{margin-left:auto;width:36px;height:36px;display:grid;place-items:center;padding:0!important}
.live-preview-label:not([hidden])+.live-help-toggle{margin-left:0}
.utils .live-nav-help{margin-left:-16px;width:32px;height:32px;flex-shrink:0;font-size:13px}
.live-small,.live-start,.live-voice,.live-preview-button{border:1px solid var(--hairline);border-radius:999px;padding:10px 16px;background:rgba(255,255,255,.76);backdrop-filter:blur(20px) saturate(1.2);color:var(--ink);font:inherit;font-size:13px;white-space:nowrap;transition:transform .18s,background .18s}
.live-small:hover,.live-preview-button:hover{background:rgba(255,255,255,.94)}
.live-small:active,.live-start:active,.live-voice:active,.live-preview-button:active{transform:scale(.97)}
.live-small:disabled,.live-start:disabled{opacity:.45;cursor:default}
.live-start{flex:1;min-width:0;min-height:52px;padding:var(--live-sm);border-radius:var(--live-corner);background:var(--brand);font-size:16px;font-weight:650;border-color:transparent;box-shadow:0 3px 12px -8px var(--ink)}
.live-preview-button{position:absolute;top:45%;left:50%;transform:translate(-50%,-50%);box-shadow:0 5px 20px #00000012}
.live-preview-button:active{transform:translate(-50%,-50%) scale(.97)}
.live-static-source{position:absolute;top:calc(45% + 52px);left:50%;transform:translateX(-50%);font-size:11px;padding:8px 12px}
.live-static-source:active{transform:translateX(-50%) scale(.97)}
.live-status{position:absolute;top:76px;left:var(--live-md);right:var(--live-md);font-size:13px;line-height:1.6;color:var(--ink);width:fit-content;max-width:calc(100% - 40px);padding:var(--live-xs) 10px;background:rgba(253,252,246,.86);border:1px solid rgba(255,255,255,.7);border-radius:12px;backdrop-filter:blur(20px)}
.live-status:empty{display:none}
.live-connecting{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:var(--live-sm);max-width:calc(100% - 40px);padding:var(--live-sm) var(--live-md);border:1px solid var(--hairline);border-radius:999px;background:rgba(253,252,246,.86);backdrop-filter:blur(20px) saturate(1.2);color:var(--ink);font:13px var(--body-cjk);pointer-events:none}
.live-connecting-spinner{display:block;flex-shrink:0;width:18px;height:18px;border:2px solid var(--brand-deep);border-top-color:transparent;border-radius:50%;animation:live-connecting-spin .8s linear infinite}
@keyframes live-connecting-spin{to{transform:rotate(360deg)}}
.studio-mode-buttons.realtime-controls-open{display:block}
.studio-mode-buttons.realtime-controls-open>.trybtn{display:none}
.live-footer{width:100%;position:relative}
.live-stage>.live-footer{position:absolute;left:var(--live-md);right:var(--live-md);bottom:var(--live-md);width:auto}
.live-current{display:block;font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-bottom:var(--live-sm)}
.live-controls{display:flex;align-items:stretch;gap:var(--live-sm);min-height:52px}
.live-voice{display:flex;align-items:center;justify-content:center;gap:var(--live-xs);min-width:130px;padding:var(--live-sm) 10px;border-radius:var(--live-corner);font-size:13px}
.live-mic-icon{width:18px;height:18px;display:block;flex-shrink:0}.live-mic-icon svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.live-voice.is-on{border-color:rgba(233,167,0,.38)}
.live-voice-light{width:5px;height:5px;border-radius:50%;background:var(--ink-soft);opacity:.35}
.live-voice.is-on .live-voice-light{background:var(--brand-deep);opacity:1}
.live-voice.is-listening .live-voice-light{animation:live-voice-ready 1.7s ease-in-out infinite}
.live-voice.is-busy .live-voice-light{width:12px;height:12px;border:2px solid var(--brand-deep);border-top-color:transparent;background:transparent;opacity:1;animation:live-connecting-spin .8s linear infinite}
.live-metrics{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.live-help{position:absolute;left:var(--live-md);right:var(--live-md);bottom:var(--live-md);width:calc(100% - 40px);max-width:420px;margin:0 auto;max-height:calc(100% - 140px);overflow:auto;padding:var(--live-md);background:rgba(253,252,246,.92);border:1px solid rgba(255,255,255,.85);border-radius:var(--live-corner);font-size:13px;line-height:1.85;box-shadow:0 12px 36px #0000000d;backdrop-filter:blur(24px)}
.live-help-heading{display:flex;align-items:center;justify-content:space-between;gap:var(--live-sm);margin-bottom:var(--live-sm)}
.live-help h2{font:600 21px var(--display-cjk);line-height:1.5;margin:0}.live-help p{margin:0}
.live-help-dismiss{width:28px;height:28px;padding:0;border:0;font-size:18px;background:transparent;flex-shrink:0}
.live-help summary{cursor:pointer;font-size:13px;width:fit-content;color:var(--ink-soft);margin-top:var(--live-sm)}
.live-help video{display:block;width:100%;max-height:240px;border-radius:12px;margin-top:var(--live-sm);background:var(--bg)}
.live-help details:not([open])>video,.live-help details:not([open])>p{display:none}.live-help details>p{font-size:11px;color:var(--ink-soft);margin-top:var(--live-xs)}
.live-command{position:absolute;left:var(--live-md);right:var(--live-md);bottom:var(--live-md);display:flex;gap:var(--live-xs);align-items:center;max-width:420px;margin:auto;padding:4px;background:rgba(255,255,255,.84);border:1px solid var(--hairline);border-radius:14px;box-shadow:0 4px 14px #00000004;backdrop-filter:blur(24px)}
.live-command input{flex:1;min-width:0;padding:10px 12px;border:0;outline:none;background:none;font:inherit;font-size:13px;color:var(--ink)}
.live-command input::placeholder{color:var(--ink-soft)}.live-command:focus-within{border-color:var(--brand-deep)}
.live-command button{border:0;background:var(--brand);border-radius:10px;padding:9px 12px;font-size:12px}
.live-candidates{position:absolute;left:var(--live-md);right:var(--live-md);bottom:84px;display:flex;gap:var(--live-xs);flex-wrap:wrap;max-width:420px;margin:auto;max-height:35%;overflow:auto;padding:var(--live-xs);background:rgba(253,252,246,.88);backdrop-filter:blur(24px);border:1px solid rgba(255,255,255,.7);border-radius:var(--live-corner)}
.live-candidates:empty{display:none}.live-candidates button{max-width:100%;overflow:hidden;text-overflow:ellipsis}
.live-stage button:focus-visible,.live-footer button:focus-visible{outline:2px solid var(--brand-deep);outline-offset:3px}
@keyframes live-voice-ready{50%{box-shadow:0 0 0 4px rgba(255,209,64,.2)}}
.gitem .material-state{position:absolute;left:4px;top:4px;font:10px var(--body-cjk);color:var(--ink-soft);background:rgba(255,255,255,.9);border-radius:6px;padding:2px 4px}
@media(max-width:700px){.live-header{inset:var(--live-sm) var(--live-sm) auto;gap:var(--live-xs)}.live-back{height:38px}.live-small{padding:8px 11px}.live-help{left:var(--live-sm);right:var(--live-sm);width:calc(100% - 24px);padding:var(--live-sm)}.live-help h2{font-size:19px}.live-status{top:62px;left:var(--live-sm);max-width:calc(100% - 24px)}.live-command,.live-candidates{left:var(--live-sm);right:var(--live-sm)}.live-command input{font-size:16px}.studio-mode-buttons{gap:8px}}
@media(prefers-reduced-motion:reduce){.live-stage *,.live-footer *{transition:none;animation:none}}

/* v2.75: busy voice/manual controls do not interrupt an SDK garment change. */
.live-voice:disabled,.live-command input:disabled,.live-command button:disabled{opacity:.45;cursor:default}

/* v2.75: the studio's existing .ggrid/.gitem tiles, with names below images. */
.live-garment-results { min-height: 0; display: flex; flex: 1 1 auto; }
#gGrid[hidden] { display: none !important; }
.live-garment-results[hidden] { display: none !important; }
.live-garment-results .live-garment-grid { min-height: 0; width: 100%; align-content: start; }
.live-garment-results .live-garment-choice { aspect-ratio: auto; align-self: start; color: var(--ink); font: inherit; cursor: pointer; }
.live-garment-results .live-garment-image { position: relative; aspect-ratio: 3/4; overflow: hidden; background: var(--bg); }
.live-garment-results .live-garment-choice img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.live-garment-results .live-garment-choice img[hidden] { display: none; }
.live-garment-results .live-garment-placeholder { position: absolute; inset: 0; display: grid; place-items: center; color: var(--ink-soft); opacity: .35; }
.live-garment-results .live-garment-placeholder svg { width: 32px; height: 32px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linejoin: round; }
.live-garment-results .has-image .live-garment-placeholder { display: none; }
.live-garment-results .live-garment-choice:disabled { cursor: default; }
.live-garment-results .live-garment-choice .live-garment-name { position: static; display: block; background: transparent; padding: 6px 5px; font-size: 11px; line-height: 1.45; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.live-garment-results .live-garment-choice:focus-visible { outline: 2px solid var(--brand-deep); outline-offset: 2px; }
@media (max-width: 700px) {
  .live-garment-results .live-garment-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .live-garment-results .live-garment-choice .live-garment-name { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  .live-garment-results .live-garment-choice { transition: none; }
}

/* This preference stays above either the library or image-and-name matches. */
.live-garment-options { display: flex; flex: 0 0 auto; justify-content: flex-end; align-items: flex-start; gap: 12px; margin: 0 0 12px; }
.live-garment-options[hidden] { display: none !important; }
.live-garment-matches-label { flex: 0 0 auto; color: var(--ink); font-size: 11px; font-weight: 600; line-height: 1.4; }
.live-garment-matches-label[hidden] { display: none !important; }
.live-garment-heading { order: -1; flex: 0 0 auto; color: var(--ink); font-size: 13px; font-weight: 600; line-height: 1.4; }
.live-garment-options .live-garment-matches-label { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.live-garment-auto-label { display: inline-flex; margin-left: auto; min-width: 0; align-items: flex-start; gap: 6px; color: var(--ink); font: inherit; font-size: 11px; line-height: 1.4; cursor: pointer; }
.live-garment-auto-input { margin: 0; flex: 0 0 auto; width: 14px; height: 14px; accent-color: var(--brand); cursor: pointer; }
@media (max-width: 700px) {
  .live-garment-auto-label, .live-garment-matches-label { font-size: 13px; }
  .live-garment-auto-input { width: 16px; height: 16px; }
}