/* V24 shared native transport and detail controls. Native artwork, coordinates, colors and engine clocks remain in their approved modules. */
.detail-viewer-v22{--dv22-ink:var(--ink,#242528);--dv22-muted:var(--muted,#646b75);--dv22-line:var(--line,#ddded9);--dv-control-height:44px;--dv-control-icon:16px;--dv-control-font-size:13px;--dv-control-line-height:1.5;--dv-control-gap:8px;--dv-control-pad-block:10px;--dv-control-pad-inline:16px;--dv-control-radius:24px;--dv-transport-width:108px;display:block!important;min-width:0;min-height:0!important;width:100%;height:auto;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;overflow:visible;text-align:left;color:var(--dv22-ink);container-type:inline-size}
.detail-layout .demo-panel{min-width:0;background:transparent}
.detail-viewer-v22 .dv22-stage{display:block;min-width:0;width:100%;max-height:none;padding:0;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none;overflow:visible}
.detail-viewer-v22 .color-v16-stage,.detail-viewer-v22 .layout-v9-stage{aspect-ratio:auto;max-height:none;overflow:visible}
.detail-viewer-v22 .layout-v9-stage>svg{width:100%;height:auto;max-height:none}
.detail-viewer-v22 .color-original-figure-v20{background:transparent!important}
.detail-viewer-v22 .tm20-stage{min-height:220px;display:flex;align-items:center;justify-content:center}
.detail-viewer-v22 .tm20-stage>svg{display:block;width:100%;height:auto;max-width:640px;overflow:visible}
.detail-viewer-v22 .tm20-stage:has(.tm20-loading-sample){align-items:flex-start;justify-content:flex-start;box-sizing:border-box;padding:24px}
.detail-viewer-v22 .tm20-phase{margin:12px 0 0;min-height:0;padding:0 0 8px;color:var(--dv22-muted);font-size:12px;line-height:1.7}
.detail-viewer-v22 .ui-example.dv22-stage{box-sizing:border-box;min-height:240px;padding:24px 0!important;border:0!important;background:transparent!important}
.detail-viewer-v22 .ui-example .uie-title{margin:0 0 24px!important;font-size:16px!important}
.detail-viewer-v22 .ui-example .uie-demo{width:min(100%,480px);margin-inline:auto}
.detail-viewer-v22 .dv22-toolbar{display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:8px;box-sizing:border-box;width:100%;margin:16px 0 0;padding:12px 0 0;border:0;border-top:1px solid var(--dv22-line);background:transparent;box-shadow:none;min-width:0}
.detail-viewer-v22 .dv22-toolbar:empty{display:none}
.detail-viewer-v22 .dv22-toolbar[hidden],.detail-viewer-v22 .dv22-repeat[hidden]{display:none!important}
/* Every native timed scene uses this transport DOM and token contract.
   Fixed widths prevent the neighbouring replay control moving on play/pause. */
.detail-viewer-v22 .dv23-transport{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:var(--dv-control-gap);min-width:0;width:max-content;max-width:100%;margin:0;padding:0;border:0;background:transparent}
.detail-viewer-v22 .dv23-control,.detail-viewer-v22 .dv22-basis button,.detail-viewer-v22 .camera-audio-toggle{appearance:none;display:inline-flex;align-items:center;justify-content:center;flex:none;gap:var(--dv-control-gap);box-sizing:border-box;min-width:var(--dv-control-height);min-height:var(--dv-control-height);max-width:100%;padding:var(--dv-control-pad-block) var(--dv-control-pad-inline);margin:0;border:1px solid var(--dv22-line);border-radius:var(--dv-control-radius);background:transparent;color:var(--dv22-ink);font:400 var(--dv-control-font-size)/var(--dv-control-line-height) Outfit,Pretendard,sans-serif;letter-spacing:normal;text-transform:none;text-indent:0;text-decoration:none;text-align:center;vertical-align:middle;cursor:pointer;box-shadow:none;overflow-wrap:anywhere;word-break:keep-all;touch-action:manipulation}
.detail-viewer-v22 .dv23-transport>.dv23-control{width:var(--dv-transport-width);height:var(--dv-control-height);min-width:var(--dv-transport-width);white-space:nowrap}
.detail-viewer-v22 .dv23-control:hover,.detail-viewer-v22 .dv22-basis button:hover,.detail-viewer-v22 .camera-audio-toggle:hover{background:#eeeee9}
.detail-viewer-v22 .dv23-control[data-dv23-variant="primary"],.detail-viewer-v22 .dv23-control[aria-pressed="true"]{background:var(--dv22-ink);border-color:var(--dv22-ink);color:#fff}
.detail-viewer-v22 .dv23-control[data-dv23-variant="primary"]:hover{background:#3d3e3a}
.detail-viewer-v22 .dv23-control:disabled{cursor:default;opacity:.45}
.detail-viewer-v22 .dv23-control:focus-visible,.detail-viewer-v22 .dv22-basis button:focus-visible,.detail-viewer-v22 .dv22-basis>summary:focus-visible,.detail-viewer-v22 .camera-audio-toggle:focus-visible{outline:2px solid var(--dv22-ink);outline-offset:3px}
.detail-viewer-v22 .dv23-control>svg{display:block;flex:none;width:var(--dv-control-icon);height:var(--dv-control-icon);max-width:var(--dv-control-icon);overflow:visible}
.detail-viewer-v22 .dv23-control>.dv22-tool-label{display:block;font:inherit;line-height:inherit;letter-spacing:inherit;color:inherit}
.detail-viewer-v22[data-detail-mode="comparison"] .dv22-toolbar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch}
.detail-viewer-v22[data-detail-mode="comparison"] .dv22-tool{width:100%;white-space:normal;text-align:center;word-break:keep-all}
.detail-viewer-v22 .dv22-status,.detail-viewer-v22 .dv22-reduced,.detail-viewer-v22 .dv22-support{padding:0;margin:8px 0 0;color:var(--dv22-muted);font:400 12px/1.7 Outfit,Pretendard,sans-serif;word-break:keep-all;overflow-wrap:anywhere}
.detail-viewer-v22 .dv22-summary{padding:0;margin:12px 0 0;background:transparent;color:var(--dv22-ink);font:400 14px/1.8 Outfit,Pretendard,sans-serif;word-break:keep-all;overflow-wrap:anywhere}
.detail-viewer-v22 .dv22-reduced[hidden],.detail-viewer-v22 .dv22-support[hidden],.detail-viewer-v22 .dv22-status[hidden],.detail-viewer-v22 .dv22-basis[hidden]{display:none!important}
.detail-viewer-v22 .dv22-basis{padding:0;margin:8px 0 0;border:0;background:transparent;color:var(--dv22-muted);font:400 12px/1.8 Outfit,Pretendard,sans-serif;text-align:left}
.detail-viewer-v22 .dv22-basis>summary{display:list-item;width:max-content;max-width:100%;min-height:44px;box-sizing:border-box;padding:10px 0;cursor:pointer;list-style-position:inside;font-size:12px;line-height:1.8;color:var(--dv22-muted)}
.detail-viewer-v22 .dv22-basis-body{padding:4px 0 16px;max-width:72ch;overflow-wrap:anywhere;word-break:keep-all}
.detail-viewer-v22 .dv22-basis-body>p,.detail-viewer-v22 .dv22-basis-body>.uie-scope{margin:0 0 12px!important;padding:0!important;border:0!important;background:transparent!important;font:400 12px/1.8 Outfit,Pretendard,sans-serif;color:var(--dv22-muted)}
.detail-viewer-v22 .dv22-repeat{display:flex;align-items:center;gap:8px;width:max-content;max-width:100%;min-height:44px;font-size:12px;cursor:pointer}
.detail-viewer-v22 .dv22-repeat input{width:16px;height:16px;margin:0;accent-color:var(--dv22-ink)}
.detail-viewer-v22 .co20-choice-controls{width:100%;margin:0;padding:0;border:0;background:transparent}
.detail-viewer-v22 .co20-choice-controls legend{margin:0 0 8px;padding:0;font-size:12px;line-height:1.7;color:var(--dv22-muted)}
.detail-viewer-v22 .co20-choice-controls>div{display:flex;gap:8px;flex-wrap:wrap}
.detail-viewer-v22 .co20-choice-status{margin:8px 0 0;font:400 12px/1.7 Outfit,Pretendard,sans-serif;color:var(--dv22-muted)}
.detail-viewer-v22 .camera-audio-v19{padding:0;margin:12px 0 0;border:0;background:transparent}
.detail-viewer-v22 .camera-audio-status,.detail-viewer-v22 .camera-audio-v19>p{display:block;padding:0;margin:8px 0 0;font:400 12px/1.7 Outfit,Pretendard,sans-serif;color:var(--dv22-muted)}
@media(max-width:600px){.detail-viewer-v22{--dv-control-pad-inline:14px;--dv-transport-width:104px}.detail-viewer-v22 .tm20-stage{min-height:180px}.detail-viewer-v22 .tm20-stage:has(.tm20-loading-sample){padding:20px 0}.detail-viewer-v22 .color-original-figure-v20{padding:18px 0}.detail-viewer-v22 .ui-example.dv22-stage{padding:18px 0!important;min-height:210px}.detail-viewer-v22 .dv22-toolbar{margin-top:12px}.detail-viewer-v22 .dv22-summary{font-size:14px}}
@media(prefers-reduced-motion:reduce){.detail-viewer-v22 .dv23-control,.detail-viewer-v22 .dv22-basis button,.detail-viewer-v22 .camera-audio-toggle{animation:none!important;transition:none!important}}

/* One native transport: icons, seek, and real elapsed/duration for every timed scene. */
.detail-viewer-v22 .dv24-transport{display:grid;grid-template-columns:44px 44px minmax(48px,1fr) 92px;align-items:center;gap:8px;box-sizing:border-box;min-width:0;width:100%;max-width:100%;margin:0;padding:0;border:0;background:transparent}
.detail-viewer-v22 .dv24-transport>.dv24-icon-control{width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border-radius:50%;gap:0;white-space:nowrap;overflow:visible}
.detail-viewer-v22 .dv24-icon-control>.dv22-tool-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.detail-viewer-v22 .dv24-seek{appearance:none;-webkit-appearance:none;display:block;box-sizing:border-box;min-width:0;width:100%;height:44px;padding:0;margin:0;border:0;border-radius:0;background:transparent;accent-color:var(--dv22-ink);cursor:pointer;touch-action:pan-y;outline-offset:2px}
.detail-viewer-v22 .dv24-seek::-webkit-slider-runnable-track{height:3px;border-radius:3px;background:linear-gradient(to right,var(--dv22-ink) 0 var(--dv-progress,0%),var(--dv22-line) var(--dv-progress,0%) 100%)}
.detail-viewer-v22 .dv24-seek::-moz-range-track{height:3px;border:0;border-radius:3px;background:var(--dv22-line)}
.detail-viewer-v22 .dv24-seek::-moz-range-progress{height:3px;border:0;border-radius:3px;background:var(--dv22-ink)}
.detail-viewer-v22 .dv24-seek::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:12px;height:12px;margin-top:-4.5px;border:0;border-radius:50%;background:var(--dv22-ink);box-shadow:none}
.detail-viewer-v22 .dv24-seek::-moz-range-thumb{width:12px;height:12px;border:0;border-radius:50%;background:var(--dv22-ink);box-shadow:none}
.detail-viewer-v22 .dv24-seek:focus-visible{outline:2px solid var(--dv22-ink);outline-offset:2px;border-radius:4px}
.detail-viewer-v22 .dv24-seek:disabled{opacity:.45;cursor:default}
.detail-viewer-v22 .dv24-time{display:block;box-sizing:border-box;min-width:0;width:92px;padding:0;margin:0;color:var(--dv22-muted);font:400 12px/1.5 Outfit,Pretendard,sans-serif;font-variant-numeric:tabular-nums;letter-spacing:normal;white-space:nowrap;text-align:right}
@media(max-width:350px){.detail-viewer-v22 .dv24-transport{grid-template-columns:44px 44px minmax(32px,1fr) 86px;gap:6px}.detail-viewer-v22 .dv24-time{width:86px;font-size:11px}}