/* Director26Oct refinement. Own outer surface only; native documents stay exact. */
#contact-dialog .panel-inner{scrollbar-gutter:stable}
#contact-dialog .contact-prepare{box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:18px;width:100%;min-height:50px;margin:8px 0 0;padding:12px 14px;border:1px solid transparent;border-radius:12px;background:transparent;text-align:left;line-height:1.5;transition:background 180ms var(--ease),border-color 180ms var(--ease),color 180ms var(--ease)}
#contact-dialog .contact-prepare>span:first-child{min-width:0}
#contact-dialog .contact-prepare>span:last-child{display:grid;place-items:center;flex:0 0 20px;width:20px;height:20px;font-size:18px;line-height:1}
#contact-dialog .contact-prepare:is(:hover,:focus-visible,[aria-expanded=true]){background:#ffffff0b;border-color:#ffffff14;color:#eeede9}
#contact-dialog .contact-prepare:focus-visible{outline:2px solid #d6d3cb;outline-offset:3px}
#contact-dialog [data-copy-workspace]:not([data-copied=true]){background:#eeede9!important;color:#222!important;border-color:#eeede9!important}
#contact-dialog [data-copy-workspace]:not([data-copied=true]):is(:hover,:focus-visible){background:#fff!important;color:#151515!important;border-color:#fff!important}
#contact-dialog [data-copy-workspace]:not([data-copied=true]):active{background:#d8d7d3!important;color:#151515!important}
/* First-screen plane is fitted proportionally; this frame is the compact display. */
#directions .ap-showcase-top{height:auto;min-height:0;align-items:start;margin-inline:auto;max-width:100%}
#directions .reference-preview-column{min-width:0;position:relative}
#directions .ap-showcase .ap-gallery-frame{height:var(--reference-frame-height,548px);min-height:0}
#directions .ap-copy-stack{max-height:none}
#directions .denim-native-frame.is-preview{display:block;position:relative;overflow:hidden;background:var(--reference-native-background,#1a1c19)}
#directions .denim-native-frame.is-preview iframe{position:absolute;left:50%;top:var(--reference-native-center,50%);width:var(--reference-native-width,1219px)!important;height:var(--reference-native-height,738px)!important;max-width:none;transform:translate(-50%,-50%) scale(var(--reference-native-scale,1))!important;transform-origin:center;pointer-events:none;border:0}
#directions .ap-showcase .ap-filmstrip{height:calc(var(--dock-base)/1.5 + 22px);padding:7px 11px 15px;border-radius:18px}
/* Transparent outer safe area, per Coordinator02 F01 composition correction.
   Native first-screen height stays independent of the Dock footprint. */
#directions .reference-preview-column .ap-filmstrip-shell{position:relative;inset:auto;height:var(--reference-dock-lane,209px);min-height:0;margin:0;padding:0 0 18px;display:flex;align-items:flex-end;justify-content:center;overflow:visible;background:transparent;border:0}
@media(max-width:900px){#directions .reference-preview-column .ap-filmstrip-shell{justify-content:flex-start;overflow-x:auto;scrollbar-width:none}#directions .ap-showcase .ap-filmstrip{padding-inline:8px}}
/* Arrow roles use adjacent type, retaining each existing direction and motion. */
#page .pill:not(.mq-reference-down)>.link-arrow,#page .pill:not(.mq-reference-down)>span[aria-hidden]:not(.menu-glyph){flex-basis:1em;width:1em;height:1em}
#page .pill:not(.mq-reference-down)>:is(.link-arrow,span[aria-hidden])>svg{stroke-width:1.55}
#page .hero-intro .mq-reference-down .mq-reference-down-glyph{width:1em;height:1em;font-size:1em;line-height:1}
#page .hero-intro .mq-reference-down .mq-reference-down-glyph svg{width:100%;height:100%;stroke-width:1.6}
#page footer>a{display:inline-flex;align-items:center;gap:10px}
#page footer>a>span{display:inline-grid;place-items:center;width:1em;height:1em;line-height:1}
#page footer>a>span>svg{display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
#page .scroll-cue>span:last-child{display:inline-grid;place-items:center;width:1em;height:1em;line-height:1}
#page .scroll-cue svg{width:100%;height:100%;stroke-width:1.5}
@media(prefers-reduced-motion:reduce){#contact-dialog .contact-prepare{transition:none}}
html.reduced #contact-dialog .contact-prepare{transition:none}
#page .hero-intro .mq-reference-down>span[aria-hidden]{display:inline-grid;place-items:center;flex:0 0 1em;width:1em;height:1em;font-size:1em;line-height:1}
#menu-dialog .nav-arrow,#page .mq-notes-budget>span{width:1.1em;height:1.1em;font-size:1em;line-height:1}
#contact-dialog .contact-arrow{width:1em;height:1em;font-size:1em}
#contact-dialog .studio-secondary>span,#page .studio-secondary>span{font-size:1em;line-height:1}

/* Discussion details reflow without an intrinsic two-column minimum on narrow QA viewports. */
#budget .mq-estimate-details{grid-template-columns:repeat(2,minmax(0,1fr))}
#budget .mq-estimate-details>div{min-width:0}
@media(max-width:600px){#budget .mq-estimate-details{grid-template-columns:minmax(0,1fr)}}

/* R6 geometry: real first-screen viewport fills the display; Dock is inside it. */
#directions .ap-showcase .ap-gallery-frame{border-radius:20px;overflow:hidden}
#directions .denim-native-frame.is-preview[data-r6-route] iframe{left:0;top:0;transform:scale(var(--reference-native-scale,1))!important;transform-origin:0 0}
#directions .reference-preview-column .ap-filmstrip-shell{position:absolute;inset:auto 0 18px;height:auto;width:100%;padding:0;margin:0;display:flex;align-items:flex-end;justify-content:center;overflow:visible;pointer-events:none}
#directions .reference-preview-column .ap-filmstrip{pointer-events:auto;height:70px;padding:7px 11px 15px}
.mq-dock-tooltip[popover]{max-width:min(250px,calc(100vw - 32px));padding:6px 10px;border:1px solid #ffffff18;border-radius:10px;background:#2e2f30;color:#f1f0ec;font:400 12.5px/16px Onest,sans-serif;white-space:nowrap;box-shadow:0 5px 14px #0004;backdrop-filter:blur(18px);clip-path:inset(100% -15px -8px round 10px)}
.mq-dock-tooltip[popover].is-visible{clip-path:inset(-12px -18px -8px round 10px)}
.mq-dock-tooltip[popover]::after{width:10px;height:6px;bottom:-6px;background:#2e2f30}
#directions .ap-thumb-slot>button:focus-visible{outline:2px solid #7197e8;outline-offset:3px;box-shadow:none}

/* M04: one compact blue marker, centered by the existing numeral row. */
#directions .ap-copy-stack .ap-showcase-copy>.eyebrow{display:flex;align-items:center}
#directions .ap-copy-stack .ap-showcase-copy>.eyebrow::before{width:4px;height:4px;flex:0 0 4px;border-radius:50%;align-self:center;margin:0;transform:none}

/* Reversible dense material. Color derives from the actual Denim hero
   125-degree 36/39/43 -> 21/23/27 composite; density and blur stay separate. */
html[data-r6-material=dense]{--r6-glass-top:36 39 43;--r6-glass-bottom:21 23 27;--r6-glass-edge:rgb(255 255 255 / .14);--r6-glass-shadow:inset 0 1px 0 rgb(255 255 255 / .035),0 18px 45px -22px rgb(0 0 0 / .55)}
html[data-r6-material=dense] :is(.hero-intro,.hero-fan-caption,#directions .ap-copy-stack,#directions .ap-filmstrip,#menu-dialog,#contact-dialog){background:linear-gradient(125deg,rgb(var(--r6-glass-top) / var(--r6-glass-alpha-top,.94)),rgb(var(--r6-glass-bottom) / var(--r6-glass-alpha-bottom,.92)));border-color:var(--r6-glass-edge);box-shadow:var(--r6-glass-shadow);backdrop-filter:blur(26px);-webkit-backdrop-filter:blur(26px)}
html[data-r6-material=dense] .hero-intro{--r6-glass-alpha-top:.88;--r6-glass-alpha-bottom:.84}
html[data-r6-material=dense] :is(#menu-dialog,#contact-dialog){--r6-glass-alpha-top:.96;--r6-glass-alpha-bottom:.94}
html[data-r6-material=dense] #directions .ap-filmstrip{--r6-glass-alpha-top:.92;--r6-glass-alpha-bottom:.90}
html[data-r6-material=dense] .drawer-transfer{background:linear-gradient(125deg,rgb(36 39 43 / .96),rgb(21 23 27 / .94))!important;border-color:var(--r6-glass-edge);box-shadow:var(--r6-glass-shadow);backdrop-filter:blur(26px);-webkit-backdrop-filter:blur(26px)}
html[data-r6-material=dense] :is(#menu-dialog,#contact-dialog) .panel-top{background:transparent}
html[data-r6-material=dense] :is(.hero-intro .hero-copy,.hero-fan-caption small,#directions .ap-try-result dd,#menu-dialog .drawer-note,#contact-dialog .contact-copy,#contact-dialog .drawer-note){color:#c2c4c8}
html[data-r6-material=dense] .mq-dock-tooltip[popover]{background:linear-gradient(125deg,rgb(36 39 43 / .98),rgb(21 23 27 / .96));border-color:var(--r6-glass-edge);color:#f0f0f0;box-shadow:inset 0 1px 0 #ffffff09,0 5px 16px #0005}
html[data-r6-material=dense] .mq-dock-tooltip[popover]::after{background:#15171b}

/* Keep text attached to its masked bubble throughout closing and reversal. */
.mq-dock-tooltip[popover]{opacity:1;transition:clip-path 120ms cubic-bezier(.22,1,.36,1),transform 120ms cubic-bezier(.22,1,.36,1)}
.mq-dock-tooltip[popover].is-visible{opacity:1;transition-duration:180ms,180ms}
#directions .ap-thumb-slot>button:focus-visible{border-color:transparent;box-shadow:none;transition:none}
html.reduced .mq-dock-tooltip[popover]{transition:none}
@media(prefers-reduced-motion:reduce){.mq-dock-tooltip[popover]{transition:none}}

/* W19079 responsive R5: the existing compact Dock owns navigation scroll.
   A later glass-frame rule had cancelled its scroll owner and clipped edge triggers. */
#directions .reference-preview-column .ap-filmstrip-shell[data-dock-compact]{
 max-width:100%;overflow-x:auto;overflow-y:hidden;justify-content:flex-start;
 padding-inline:8px;scroll-padding-inline:8px;overscroll-behavior-inline:contain;
 scrollbar-width:thin;
}
#directions .reference-preview-column .ap-filmstrip-shell[data-dock-compact] .ap-filmstrip{flex:none;margin-inline:auto}
#directions .ap-filmstrip-shell[data-dock-compact] .ap-thumb-slot>button:focus-visible{outline-offset:-3px}