@property --overlay-progress{syntax:"<number>";inherits:true;initial-value:1}
/* Fixed overlay shell. One child owns editorial scrolling; First Contact keeps its accepted composition. */
:root{--overlay-surface:#fffefa;--overlay-max:1120px;--overlay-pad-x:56px;--overlay-pad-top:36px;--overlay-pad-bottom:56px;--overlay-toolbar:84px;--overlay-reading:720px;--overlay-split-gap:48px}
html.overlay-locked{overflow:hidden!important;scrollbar-gutter:auto!important;overscroll-behavior:none}
body.overlay-locked{position:fixed!important;top:var(--overlay-page-top)!important;left:0!important;width:var(--overlay-page-width)!important;overflow:hidden!important}
html.overlay-locked :is(.site-header,.page-position){width:var(--overlay-page-width)!important;max-width:var(--overlay-page-width)!important}
:is(#orientation-layer,#drug-talk-layer,#drug-media-layer,#contact-dialog).overlay-shell{scrollbar-width:none;scrollbar-gutter:auto;overscroll-behavior:none;overflow-anchor:none}
:is(#orientation-layer,#drug-talk-layer,#drug-media-layer,#contact-dialog).overlay-shell::-webkit-scrollbar{display:none;width:0;height:0}
:is(#orientation-layer,#drug-talk-layer,#drug-media-layer,#contact-dialog).overlay-shell::backdrop{position:fixed;inset:0;width:100vw;height:100dvh;background:transparent;backdrop-filter:none;opacity:1;transition:none}
:is(#orientation-layer,#drug-talk-layer,#drug-media-layer).overlay-shell{position:fixed;inset:0;width:min(var(--overlay-max),calc(100vw - 64px));max-width:none;height:100dvh;max-height:100dvh;min-height:0;margin:0 auto;padding:0;border:0;border-radius:0;overflow:hidden;background:transparent;opacity:1;transform:none!important;box-shadow:none;transition:none;animation:none!important}
/* A native dialog can receive fallback focus; actionable descendants retain visible focus. */
:is(#orientation-layer,#drug-talk-layer,#drug-media-layer).overlay-shell:focus{outline:none}
#orientation-layer.overlay-shell[data-situation=unsure]{width:min(920px,calc(100vw - 64px));height:fit-content;max-height:calc(100dvh - 32px);margin:auto}
:is(#orientation-layer,#drug-talk-layer,#drug-media-layer).overlay-shell .overlay-surface{position:relative;isolation:isolate;display:flex;flex-direction:column;width:100%;height:100%;max-height:inherit;min-height:0;margin:0;overflow:hidden;background:var(--overlay-surface);opacity:var(--overlay-progress);translate:0 calc((1 - var(--overlay-progress)) * 8px);transform:none;box-shadow:none}
#orientation-layer.overlay-shell[data-situation=unsure] .overlay-surface{height:auto;max-height:calc(100dvh - 32px)}
:is(#orientation-layer,#drug-talk-layer,#drug-media-layer).overlay-shell .overlay-scroller{position:relative;z-index:1;flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:none;overflow-anchor:none;scrollbar-width:none;scrollbar-gutter:auto;scroll-padding:16px 0;background:transparent}
.overlay-scroller::-webkit-scrollbar{display:none;width:0;height:0}
#orientation-layer.overlay-shell .dive-head,:is(#drug-talk-layer,#drug-media-layer).overlay-shell .drug-talk-top{position:relative;inset:auto;z-index:2;display:flex;flex:0 0 var(--overlay-toolbar);align-items:center;justify-content:space-between;gap:20px;width:100%;height:var(--overlay-toolbar);min-height:var(--overlay-toolbar);padding:18px var(--overlay-pad-x);background:var(--overlay-surface);opacity:1;pointer-events:auto}
#orientation-layer.overlay-shell .dive-marker,:is(#drug-talk-layer,#drug-media-layer).overlay-shell .drug-talk-top>.eyebrow{font-size:11px;line-height:1.5;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);border:0;padding:0;margin:0}
#orientation-layer.overlay-shell #dive-content,:is(#drug-talk-layer,#drug-media-layer).overlay-shell .drug-talk-content{display:block;flex:none;width:100%;min-height:0;margin:0;padding:var(--overlay-pad-top) var(--overlay-pad-x) max(var(--overlay-pad-bottom),env(safe-area-inset-bottom));opacity:1;transform:none;filter:none;will-change:auto}
:is(#drug-talk-layer,#drug-media-layer).overlay-shell .drug-talk-content{max-width:calc(var(--overlay-reading) + 2 * var(--overlay-pad-x))}
#orientation-layer.overlay-shell :is(.dive-relative,.dive-self-body){column-gap:var(--overlay-split-gap)}
#orientation-layer.overlay-shell[data-situation=unsure] #dive-content{padding-top:24px}
#orientation-layer.overlay-shell .dive-guide,#orientation-layer.overlay-shell .dive-guide-result{min-height:0}
#orientation-layer.overlay-shell .dive-guide-framing{margin-top:0}
#orientation-layer.overlay-shell .dive-result-grid{padding-top:0}
#orientation-layer.overlay-shell .dive-overline{display:none}
#orientation-layer.overlay-shell .dive-guide-result .dive-overline{display:block}
/* Decorative fragment belongs to the visible shell, below controls/content and outside their width. */
.overlay-shell .overlay-watermark{position:absolute;z-index:0;right:0;bottom:32px;width:180px;height:320px;overflow:hidden;opacity:.025;pointer-events:none;user-select:none}
.overlay-shell .overlay-watermark img{position:absolute;left:0;top:0;width:320px;max-width:none;height:320px;object-fit:contain;pointer-events:none}
#orientation-layer .overlay-watermark{width:36px;height:200px;bottom:36px}
#orientation-layer .overlay-watermark img{width:220px;height:220px}
#orientation-layer[data-situation=unsure] .overlay-watermark{display:none}
:is(#orientation-layer,#drug-talk-layer,#drug-media-layer,#contact-dialog,#privacy-settings).overlay-shell .overlay-close{position:static;inset:auto;display:grid;place-items:center;flex:0 0 48px;width:48px;min-width:48px;height:48px;min-height:48px;padding:0;margin:0;border:0;border-radius:50%;background:#e8edef;color:#536875;box-shadow:none;pointer-events:auto;transition:background .2s,color .2s}
:is(#orientation-layer,#drug-talk-layer,#drug-media-layer,#contact-dialog,#privacy-settings).overlay-shell .overlay-close svg{display:block;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.5;transition:transform .24s ease}
.overlay-shell .overlay-close:hover{background:#dce4e9!important;color:#293e4b!important}
:is(#orientation-layer,#drug-talk-layer,#drug-media-layer,#contact-dialog,#privacy-settings).overlay-shell .overlay-close:is(:hover,:focus-visible) svg{transform:rotate(90deg)}
:is(#orientation-layer,#drug-talk-layer,#drug-media-layer,#contact-dialog,#privacy-settings).overlay-shell :focus-visible{outline:2px solid var(--blue);outline-offset:4px}
.overlay-scroller :is(button,a,summary,[tabindex]){scroll-margin:16px 0}
#contact-dialog.overlay-shell .contact-toolbar{height:60px;background:#fff;z-index:5}
@media(max-width:1100px){:root{--overlay-pad-x:32px;--overlay-pad-top:28px;--overlay-pad-bottom:44px;--overlay-split-gap:40px}.overlay-shell .overlay-watermark{width:20px;height:220px}.overlay-shell .overlay-watermark img{width:240px;height:240px}#orientation-layer .overlay-watermark{width:20px}}
@media(max-width:800px){:root{--overlay-pad-x:24px;--overlay-pad-top:24px;--overlay-pad-bottom:32px;--overlay-toolbar:calc(72px + env(safe-area-inset-top))}
 :is(#orientation-layer,#drug-talk-layer,#drug-media-layer).overlay-shell{width:100%;height:100dvh;margin:0}
 #orientation-layer.overlay-shell[data-situation=unsure]{width:100%;height:fit-content;max-height:100dvh;margin:auto}
 #orientation-layer.overlay-shell[data-situation=unsure] .overlay-surface{max-height:100dvh}
 #orientation-layer.overlay-shell .dive-head,:is(#drug-talk-layer,#drug-media-layer).overlay-shell .drug-talk-top{padding:calc(12px + env(safe-area-inset-top)) var(--overlay-pad-x) 12px}
 #orientation-layer.overlay-shell .dive-marker,:is(#drug-talk-layer,#drug-media-layer).overlay-shell .drug-talk-top>.eyebrow{font-size:10px}
 .overlay-shell .overlay-watermark{display:none}
}
@media(max-width:359px){:root{--overlay-pad-x:20px}}
@media(prefers-reduced-motion:reduce){.overlay-shell,.overlay-shell *,.overlay-shell::backdrop{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.review-reduced-motion .overlay-shell,.review-reduced-motion .overlay-shell *,.review-reduced-motion .overlay-shell::backdrop{animation:none!important;transition:none!important;scroll-behavior:auto!important}

#contact-dialog.overlay-shell{opacity:var(--overlay-progress);translate:0 calc((1 - var(--overlay-progress)) * 8px)}
/* Settled reading is independent of the entrance effect, including its identity translate. */
:is(#orientation-layer,#drug-talk-layer,#drug-media-layer,#contact-dialog).overlay-shell[data-overlay-state=OPEN]::backdrop{opacity:1}
:is(#orientation-layer,#drug-talk-layer,#drug-media-layer).overlay-shell[data-overlay-state=OPEN] .overlay-surface,
#contact-dialog.overlay-shell[data-overlay-state=OPEN]{opacity:1;translate:none}
@media(max-width:800px){:is(#orientation-layer,#drug-talk-layer,#drug-media-layer).overlay-shell:not([data-situation=unsure]) .overlay-watermark{display:block;width:8px;height:140px;bottom:20px;opacity:.012}.overlay-shell .overlay-watermark img{width:180px;height:180px}}

/* Visual veil is outside the native dialog/backdrop paint pair; modal semantics stay native.
   Page chrome is at 40 or below; the keyboard skip link is 100.
   This one ordinary plane is 101, while native modal surfaces remain in the top layer. */
.overlay-backdrop{position:fixed;inset:0;width:100vw;height:100dvh;z-index:101;pointer-events:none;background:rgba(126,149,167,.43);backdrop-filter:blur(12px) saturate(.7);opacity:var(--overlay-progress);transition:none}
