/* Etheric deck UX layer — deterministic typography, product chrome and Overview Canvas. */
@import url("https://cdn.jsdelivr.net/npm/@fontsource/spectral@5.3.0/500.css");
@import url("https://cdn.jsdelivr.net/npm/@fontsource/ibm-plex-sans@5.3.0/400.css");
@import url("https://cdn.jsdelivr.net/npm/@fontsource/ibm-plex-sans@5.3.0/600.css");
@import url("https://cdn.jsdelivr.net/npm/@fontsource/ibm-plex-sans@5.3.0/700.css");
@import url("https://cdn.jsdelivr.net/npm/@fontsource/ibm-plex-mono@5.3.0/400.css");
@import url("https://cdn.jsdelivr.net/npm/@fontsource/ibm-plex-mono@5.3.0/600.css");
@import url("https://cdn.jsdelivr.net/npm/@fontsource/ibm-plex-mono@5.3.0/700.css");

html,body,.reveal-viewport { overscroll-behavior-x: none; }
html.ed-grid-modal-open,
html.ed-grid-modal-open body { overflow: hidden !important; }

/* Presentation-mode geometry is a Reveal runtime invariant. Deck-local CSS must not move root slides into document flow. */
html:not(.print-pdf) .reveal-viewport:not(.ed-in-scroll-view) .reveal .slides > section,
html:not(.print-pdf) .reveal-viewport:not(.ed-in-scroll-view) .reveal .slides > section > section { position: absolute !important; }
.reveal .ed-table th,.reveal .ed-table td { padding-top: 7px; padding-bottom: 7px; }
.reveal .ed-table th { font-size: 11px; }
.reveal .ed-table td { font-size: 13.5px; line-height: 1.32; }
.ed-product-chrome { position: fixed; inset: 0; z-index: 90; pointer-events: none; font-family: var(--ed-sans); }
.ed-edge-nav { position: fixed; top: 0; bottom: 0; width: 78px; margin: 0; padding: 0; border: 0; background: transparent; color: var(--ed-ink); cursor: pointer; pointer-events: auto; }
.ed-edge-prev { left: 0; }
.ed-edge-next { right: 0; }
.ed-edge-nav span { position: absolute; top: 50%; display: grid; width: 42px; height: 56px; place-items: center; border: 1px solid color-mix(in srgb,var(--ed-rule-strong) 78%,transparent); background: color-mix(in srgb,var(--ed-surface) 92%,transparent); color: var(--ed-ink); font-family: var(--ed-serif); font-size: 28px; line-height: 1; opacity: 0; transition: opacity var(--ed-motion-ui) ease,transform var(--ed-motion-ui) ease,border-color var(--ed-motion-ui) ease; }
.ed-edge-prev span { left: 14px; transform: translateY(-50%) translateX(-8px); }
.ed-edge-next span { right: 14px; transform: translateY(-50%) translateX(8px); }
.ed-edge-nav:hover span,.ed-edge-nav:focus-visible span { opacity: .94; transform: translateY(-50%) translateX(0); border-color: var(--ed-accent); }
.ed-edge-nav:disabled { cursor: default; pointer-events: none; }
.ed-edge-nav:disabled span { opacity: 0 !important; }
.ed-command-dock { position: fixed; top: 0; right: 0; display: flex; gap: 6px; align-items: center; justify-content: flex-end; width: 220px; height: 76px; padding: 16px 18px; box-sizing: border-box; pointer-events: auto; }
.ed-chrome-button,.ed-grid-close { display: grid; width: 42px; min-width: 42px; height: 42px; min-height: 42px; padding: 0; place-items: center; border: 1px solid var(--ed-rule-strong); border-radius: var(--ed-radius-ui); background: color-mix(in srgb,var(--ed-surface) 95%,transparent); color: var(--ed-ink); }
.ed-chrome-button { opacity: 0; transform: translateY(-6px); transition: opacity var(--ed-motion-ui) ease,transform var(--ed-motion-ui) ease,background-color var(--ed-motion-ui) ease,border-color var(--ed-motion-ui) ease; }
.ed-command-dock:hover .ed-chrome-button,.ed-command-dock:focus-within .ed-chrome-button,.ed-chrome-active .ed-command-dock .ed-chrome-button { opacity: .96; transform: translateY(0); }
.ed-chrome-button:hover,.ed-grid-close:hover { border-color: var(--ed-accent); background: var(--ed-accent-soft); }
.ed-chrome-button svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.ed-chrome-button:first-child svg rect { fill: currentColor; stroke: none; }
/* Global site footer: centered runtime-owned browser UI, separate from Reveal and slide content. */
.ed-site-footer { position: fixed; left: 50%; bottom: 2px; z-index: 95; display: flex; min-height: 24px; padding: 0 4px; align-items: center; color: var(--ed-muted); font-family: var(--ed-mono); font-size: 9.5px; font-weight: 600; line-height: 1; letter-spacing: .045em; text-decoration: none; opacity: 1; pointer-events: auto; transform: translateX(-50%); transition: color var(--ed-motion-ui) ease; }
.ed-site-footer:hover,.ed-site-footer:focus-visible,.ed-chrome-active .ed-site-footer { color: var(--ed-accent); }
/* Slide number + Overview replace the old bottom progress rail in v2. */
.reveal .progress { display: none !important; }
.ed-chrome-active .reveal .slide-number { color: var(--ed-accent); }
.ed-in-scroll-view .ed-edge-nav { display: none; }

/* Overview is a modal camera over one fixed, DOM-backed slide board. */
.ed-grid-navigator { position: fixed; inset: 0; z-index: 130; display: grid; grid-template-rows: auto minmax(0,1fr); overflow: hidden; background: color-mix(in srgb,var(--ed-paper) 98%,transparent); color: var(--ed-ink); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity var(--ed-motion-ui) ease,visibility var(--ed-motion-ui) step-end; }
.ed-grid-open .ed-grid-navigator { opacity: 1; visibility: visible; pointer-events: auto; transition: opacity var(--ed-motion-ui) ease; }
.ed-grid-open .reveal { pointer-events: none; }
.ed-grid-open .ed-edge-nav,.ed-grid-open .ed-command-dock,.ed-grid-open .ed-site-footer { opacity: 0; pointer-events: none; }
.ed-grid-header { display: grid; grid-template-columns: minmax(0,1fr) auto auto; align-items: center; gap: 12px 24px; padding: 14px 28px 12px; border-bottom: 1px solid var(--ed-rule); background: var(--ed-paper); }
.ed-grid-heading { display: flex; min-width: 0; align-items: baseline; gap: 12px; }
.ed-grid-title { color: var(--ed-ink); font-family: var(--ed-serif); font-size: 26px; font-weight: 500; letter-spacing: -.02em; }
.ed-grid-count { color: var(--ed-muted); font-family: var(--ed-mono); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.ed-grid-controls { display: flex; gap: 6px; align-items: center; justify-content: center; }
.ed-grid-zoom-button,.ed-grid-zoom-value,.ed-grid-fit { display: grid; min-width: 42px; height: 42px; box-sizing: border-box; padding: 0 10px; place-items: center; border: 1px solid var(--ed-rule-strong); border-radius: var(--ed-radius-ui); background: color-mix(in srgb,var(--ed-surface) 95%,transparent); color: var(--ed-ink); cursor: pointer; font-family: var(--ed-sans); font-size: 16px; line-height: 1; }
.ed-grid-zoom-value { min-width: 62px; color: var(--ed-ink); font-family: var(--ed-mono); font-size: 11px; font-weight: 700; }
.ed-grid-fit { padding-inline: 13px; color: var(--ed-ink); font-size: 12px; font-weight: 650; }
.ed-grid-zoom-button:hover,.ed-grid-zoom-value:hover,.ed-grid-fit:hover,.ed-grid-zoom-button:focus-visible,.ed-grid-zoom-value:focus-visible,.ed-grid-fit:focus-visible,.ed-grid-close:focus-visible { border-color: var(--ed-accent); background: var(--ed-accent-soft); }
.ed-grid-close { cursor: pointer; font-family: var(--ed-sans); font-size: 25px; line-height: 1; }
.ed-grid-scroll { position: relative; min-height: 0; overflow: hidden; overscroll-behavior: contain; padding: 0; scrollbar-gutter: auto; touch-action: none; }
.ed-grid-canvas { position: relative; width: 100%; height: 100%; min-height: 0; overflow: hidden; overscroll-behavior: contain; touch-action: none; cursor: grab; user-select: none; -webkit-user-select: none; }
.ed-grid-canvas.is-grabbing { cursor: grabbing; }
.ed-grid-list { position: absolute; top: 0; left: 0; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 22px 18px; width: auto; max-width: none; margin: 0; transform-origin: 0 0; will-change: transform; }
.ed-grid-item { min-width: 0; color: var(--ed-ink); cursor: pointer; outline: none; }
.ed-grid-item:focus-visible { outline: 3px solid var(--ed-accent); outline-offset: 5px; }
.ed-grid-thumb-viewport { position: relative; width: 100%; aspect-ratio: 16/9; overflow: hidden; border: 1px solid var(--ed-rule-strong); background: var(--ed-surface); transition: border-color var(--ed-motion-ui) ease,box-shadow var(--ed-motion-ui) ease; }
.ed-grid-item:hover .ed-grid-thumb-viewport,.ed-grid-item:focus-visible .ed-grid-thumb-viewport,.ed-grid-item[aria-current="true"] .ed-grid-thumb-viewport { border-color: var(--ed-accent); }
.ed-grid-item[aria-current="true"] .ed-grid-thumb-viewport { box-shadow: inset 0 0 0 2px var(--ed-accent); }
.ed-grid-thumb-stage { position: absolute; top: 0; left: 0; width: 1280px; height: 720px; transform-origin: 0 0; pointer-events: none; }
.ed-grid-thumb-stage.reveal { width: 1280px !important; height: 720px !important; min-height: 720px !important; font-size: 16px !important; }
.ed-grid-thumb-stage .slides { position: relative !important; top: 0 !important; left: 0 !important; width: 1280px !important; height: 720px !important; transform: none !important; perspective: none !important; }
.ed-grid-thumb-stage .slides > section { position: absolute !important; top: 0 !important; left: 0 !important; display: block !important; width: 1280px !important; height: 720px !important; opacity: 1 !important; visibility: visible !important; transform: none !important; }
/* Cover slides are intrinsic grids; the generic thumbnail block projection must not flatten them. */
.ed-grid-thumb-stage .slides > section.ed-cover { display: grid !important; }
.ed-grid-caption { display: flex; gap: 9px; align-items: baseline; min-width: 0; padding-top: 8px; color: var(--ed-ink-2); font-family: var(--ed-sans); font-size: 12.5px; line-height: 1.25; }
.ed-grid-number { flex: 0 0 auto; color: var(--ed-accent); font-family: var(--ed-mono); font-size: 11px; font-weight: 700; letter-spacing: .06em; }
.ed-grid-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

@media (max-width:1100px) { .ed-grid-list { grid-template-columns: repeat(3,minmax(0,1fr)); } }
@media (max-width:760px) {
  .ed-grid-header { grid-template-columns: minmax(0,1fr) auto; padding-inline: 18px; }
  .ed-grid-heading { grid-column: 1; grid-row: 1; }
  .ed-grid-controls { grid-column: 1 / -1; grid-row: 2; justify-content: flex-start; }
  .ed-grid-close { grid-column: 2; grid-row: 1; }
  .ed-grid-scroll { padding-inline: 0; }
  .ed-grid-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width:480px) {
  .ed-grid-header { column-gap: 12px; padding-inline: 14px; }
  .ed-grid-list { grid-template-columns: 1fr; }
  .ed-grid-controls { gap: 4px; }
  .ed-grid-zoom-button,.ed-grid-zoom-value,.ed-grid-fit { min-width: 40px; height: 40px; }
  .ed-grid-zoom-value { min-width: 58px; }
  .ed-grid-fit { padding-inline: 10px; }
}
@media (max-width:640px),(pointer:coarse) { .ed-edge-nav { width: 52px; } .ed-edge-nav span { width: 34px; height: 48px; } .ed-edge-prev span { left: 8px; } .ed-edge-next span { right: 8px; } .ed-command-dock { width: 190px; height: 64px; padding: 10px 12px; } .ed-chrome-button { width: 40px; min-width: 40px; height: 40px; min-height: 40px; opacity: .92; transform: none; } }
@media (prefers-reduced-motion: reduce) { .ed-grid-navigator,.ed-grid-thumb-viewport,.ed-chrome-button,.ed-edge-nav span { transition-duration: 0ms !important; } }
@media print { .ed-product-chrome,.ed-site-footer,.ed-grid-navigator { display: none !important; } }
