/* The image and resource picker have separate space at every screen size. */
#cts-storyboard :is(.cts-viewer,.cts-viewer-stage) { min-width:0; }
#cts-storyboard .cts-viewer-stage { display:flex; flex-direction:column; }
#cts-storyboard .cts-viewer>.cts-resource-view { padding:22px clamp(18px,3vw,32px); border-top:1px solid var(--cts-line); background:#0a1421; }
#cts-storyboard .cts-resource-picker-title { margin:0 0 6px; font-size:21px; font-weight:600; letter-spacing:-.025em; }
#cts-storyboard .cts-resource-picker-hint { margin:0 0 18px; color:#c0d0e3; font-size:13px; line-height:1.6; }
#cts-storyboard .cts-viewer .cts-resource-chips button { min-height:76px; padding:12px; border-color:#466078; }
#cts-storyboard .cts-viewer .cts-resource-chips b { font-size:22px; }
#cts-storyboard .cts-viewer .cts-resource-chips small { font-size:13px; }
#cts-storyboard .cts-viewer .cts-resource-chips em { font-size:12px; }
#cts-storyboard .cts-zoom-controls { display:flex; align-items:center; justify-content:center; gap:5px; flex-wrap:wrap; }
#cts-storyboard .cts-zoom-controls button[data-zoom] { width:44px; padding:6px; font-size:24px; line-height:1; color:var(--cts-cyan); background:#102436; border-color:#3e647a; }
#cts-storyboard .cts-zoom-controls output { min-width:52px; text-align:center; color:#edf4ff; font-size:13px; font-variant-numeric:tabular-nums; }
#cts-storyboard #cts-reset-camera { margin-left:5px; }
#cts-storyboard #cts-scene.cts-can-pan { cursor:grab; touch-action:pan-y; }
#cts-storyboard #cts-scene.cts-can-pan:active { cursor:grabbing; }
#cts-storyboard .cts-scene-tools { align-items:center; }
#cts-storyboard #cts-model-status { flex:1 1 230px; font-size:12px; line-height:1.6; text-align:left; }
#cts-storyboard .cts-viewer .cts-mass-caption { margin:16px 0; font-size:12px; line-height:1.65; }
@media(min-width:1100px){
 #cts-storyboard .cts-viewer:has(>.cts-resource-view:not([hidden])) { display:grid; grid-template-columns:minmax(0,1fr) 300px; align-items:start; }
 #cts-storyboard .cts-viewer>.cts-resource-view { border-top:0; border-left:1px solid var(--cts-line); min-height:100%; padding:22px 18px; }
 #cts-storyboard .cts-viewer .cts-resource-chips { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
 #cts-storyboard .cts-viewer .cts-view-switch { width:100%; }
 #cts-storyboard .cts-viewer .cts-view-switch button { padding:9px 7px; font-size:12px; }
 #cts-storyboard .cts-viewer .cts-data-note { margin-top:16px; font-size:12px; }
 #cts-storyboard .cts-viewer-stage .cts-scene-tools { padding:12px 20px; }
 #cts-storyboard .cts-viewer-stage .cts-scene { min-height:360px; }
}
@media(max-width:540px){
 #cts-storyboard .cts-viewer .cts-resource-chips { grid-template-columns:repeat(2,minmax(0,1fr)); }
 #cts-storyboard .cts-scene-tools .cts-display-switch { width:100%; }
 #cts-storyboard .cts-zoom-controls { justify-content:flex-start; width:100%; }
 #cts-storyboard #cts-model-status { order:2; flex-basis:100%; }
}
#cts-storyboard #cts-selected-guide { width:100%; margin-top:16px; background:var(--cts-cyan); color:#06131d; font-size:14px; font-weight:600; }
#cts-storyboard .cts-viewer .cts-resource-chips button:is(:hover,:focus-visible) { border-color:var(--resource-colour); background:#142d3e; box-shadow:inset 3px 0 var(--resource-colour); }
@media(min-width:1100px){
 #cts-storyboard .cts-viewer>.cts-resource-view { padding:16px 18px; }
 #cts-storyboard .cts-resource-picker-hint { font-size:12px; line-height:1.5; margin-bottom:12px; }
 #cts-storyboard .cts-viewer .cts-mass-caption { margin:10px 0; font-size:11px; line-height:1.5; }
 #cts-storyboard .cts-viewer .cts-resource-chips { gap:8px; }
 #cts-storyboard .cts-viewer .cts-resource-chips button { padding:8px; min-height:66px; }
 #cts-storyboard .cts-viewer .cts-resource-chips b { font-size:20px; }
 #cts-storyboard .cts-viewer .cts-resource-chips small { font-size:12px; }
 #cts-storyboard .cts-viewer .cts-resource-chips button:last-child:nth-child(odd) { grid-column:1 / -1; }
 #cts-storyboard .cts-viewer .cts-data-note { margin-top:10px; }
}
#cts-storyboard .cts-viewer>.cts-resource-view .cts-mass-caption { margin:10px 0; }
#cts-storyboard #cts-photography { user-select:none; -webkit-user-select:none; }
#cts-storyboard #cts-photography img { -webkit-user-drag:none; }
/* Two-line wordmark, with the publisher kept deliberately smaller. */
#cts-storyboard .cts-header .cts-wordmark { display:inline-flex; flex-direction:column; align-items:flex-start; gap:4px; min-height:44px; justify-content:center; letter-spacing:normal; }
#cts-storyboard .cts-wordmark .cts-brand-name { display:flex; align-items:center; gap:10px; font-size:28px; line-height:1.05; font-weight:700; letter-spacing:-.045em; }
#cts-storyboard .cts-wordmark .cts-brand-name .cts-dot { margin:0; font-size:11px; line-height:1; }
#cts-storyboard .cts-wordmark .cts-brand-byline { font-size:10px; line-height:1.25; font-weight:500; letter-spacing:.045em; color:#aebfd3; }
@media(max-width:540px){
 #cts-storyboard .cts-wordmark .cts-brand-name { font-size:26px; }
 #cts-storyboard .cts-wordmark .cts-brand-byline { font-size:10px; }
}

#cts-storyboard .cts-footer-links { display:flex; align-items:center; flex-wrap:wrap; gap:14px 24px; }
#cts-storyboard .cts-builder { display:inline-flex; align-items:center; gap:4px; font-size:11px; line-height:1.5; }
#cts-storyboard .cts-builder a { display:inline-flex; align-items:center; min-height:44px; text-underline-offset:3px; }
@media(max-width:540px){ #cts-storyboard .cts-footer-links { width:100%; gap:4px 20px; } }
