/* ==========================================================================
   deck.css — the FLIGHT DECK design system, scoped to the hero deck (.fdx)
   Derived from flight-deck/styles/theme.css (tokens, app shell, grid +
   widgets, module utilities) plus the markdown-notes module CSS. Every
   rule is prefixed with .fdx so none of it touches the rest of the site.
   If theme.css changes and the hero should follow, copy the change here.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. TOKENS — DARK (default)
   -------------------------------------------------------------------------- */
.fdx, .fdx {
  color-scheme: dark;

  /* Surfaces — ascending elevation */
  --fd-bg: #05070c;
  --fd-bg-grid: rgba(120, 160, 200, 0.045);
  --fd-surface-0: #080b12;
  --fd-surface-1: #0c1018;
  --fd-surface-2: #111722;
  --fd-surface-3: #18202e;
  --fd-overlay: rgba(3, 5, 9, 0.72);

  /* Lines */
  --fd-line: rgba(140, 175, 215, 0.13);
  --fd-line-strong: rgba(150, 190, 230, 0.28);
  --fd-line-accent: color-mix(in srgb, var(--fd-accent) 45%, transparent);

  /* Text */
  --fd-text: #e6edf7;
  --fd-text-dim: #9fb0c6;
  --fd-text-faint: #5d6f88;
  --fd-text-invert: #05070c;

  /* Accent — user-configurable, drives the whole "wow" layer */
  --fd-accent: #22e0ff;
  --fd-accent-2: #7c5cff;
  --fd-accent-soft: color-mix(in srgb, var(--fd-accent) 14%, transparent);
  --fd-accent-glow: color-mix(in srgb, var(--fd-accent) 38%, transparent);

  /* Semantic */
  --fd-ok: #2fe08a;
  --fd-warn: #ffc247;
  --fd-danger: #ff5470;
  --fd-info: #4aa8ff;

  /* Effects */
  --fd-glow: 0 0 0 1px var(--fd-line-accent), 0 0 24px -6px var(--fd-accent-glow);
  --fd-shadow: 0 18px 48px -24px rgba(0, 0, 0, 0.9);
  --fd-scanline-opacity: 0.035;
  --fd-noise-opacity: 0.02;
}

/* --------------------------------------------------------------------------
   2. TOKENS — LIGHT
   -------------------------------------------------------------------------- */
.fdx[data-theme='light'] {
  color-scheme: light;

  --fd-bg: #eef1f6;
  --fd-bg-grid: rgba(30, 60, 100, 0.055);
  --fd-surface-0: #f7f9fc;
  --fd-surface-1: #ffffff;
  --fd-surface-2: #f2f5fa;
  --fd-surface-3: #e7ecf4;
  --fd-overlay: rgba(226, 232, 240, 0.75);

  --fd-line: rgba(20, 45, 80, 0.12);
  --fd-line-strong: rgba(20, 45, 80, 0.26);

  --fd-text: #0d1521;
  --fd-text-dim: #4a5a70;
  --fd-text-faint: #8697ad;
  --fd-text-invert: #ffffff;

  --fd-accent: #0089c7;
  --fd-accent-2: #6d3ff5;

  --fd-ok: #0f9d58;
  --fd-warn: #b97400;
  --fd-danger: #d92b48;
  --fd-info: #1668d6;

  --fd-shadow: 0 16px 40px -26px rgba(15, 30, 60, 0.55);
  --fd-scanline-opacity: 0;
  --fd-noise-opacity: 0.012;
}

/* --------------------------------------------------------------------------
   3. TOKENS — STRUCTURAL (theme-independent)
   -------------------------------------------------------------------------- */
.fdx {
  --fd-font: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --fd-font-mono: 'JetBrains Mono', 'SF Mono', ui-monospace, 'Cascadia Mono', Menlo, monospace;

  --fd-fs-2xs: 9px;
  --fd-fs-xs: 10.5px;
  --fd-fs-sm: 12px;
  --fd-fs-md: 13.5px;
  --fd-fs-lg: 16px;
  --fd-fs-xl: 22px;
  --fd-fs-2xl: 32px;

  --fd-radius: 10px;
  --fd-radius-sm: 6px;
  --fd-radius-lg: 16px;

  --fd-gap: 10px;                 /* gutter between widgets */
  --fd-pad: 12px;                 /* interior widget padding */
  --fd-row: 56px;                 /* height of one grid row unit */
  --fd-header: 46px;              /* top bar height */
  --fd-widget-head: 30px;         /* widget title bar height */

  --fd-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --fd-fast: 120ms var(--fd-ease);
  --fd-slow: 340ms var(--fd-ease);

  --fd-z-grid: 1;
  --fd-z-drag: 500;
  --fd-z-focus: 700;
  --fd-z-chrome: 800;
  --fd-z-modal: 900;
  --fd-z-toast: 1000;
}

/* Density presets — set on <html data-density="..."> */
.fdx[data-density='compact'] {
  --fd-gap: 7px; --fd-pad: 9px; --fd-row: 46px; --fd-widget-head: 26px; --fd-fs-md: 12.5px;
}
.fdx[data-density='comfortable'] {
  --fd-gap: 14px; --fd-pad: 16px; --fd-row: 64px; --fd-widget-head: 34px;
}

/* Motion + effects kill-switches (toggled from Settings) */
.fdx[data-effects='off'] { --fd-scanline-opacity: 0; --fd-noise-opacity: 0; --fd-glow: 0 0 0 1px var(--fd-line); }



/* --------------------------------------------------------------------------
   6. APP SHELL
   -------------------------------------------------------------------------- */


.fdx .fd-topbar {
  height: var(--fd-header); flex: 0 0 auto;
  display: flex; align-items: center; gap: 8px; padding: 0 10px;
  background: color-mix(in srgb, var(--fd-surface-0) 82%, transparent);
  backdrop-filter: blur(14px) saturate(1.3);
  border-bottom: 1px solid var(--fd-line);
  z-index: var(--fd-z-chrome);
}
.fdx .fd-brand { display: flex; align-items: center; gap: 9px; padding-right: 6px; user-select: none; }
.fdx .fd-brand-mark {
  width: 22px; height: 22px; display: grid; place-items: center;
  color: var(--fd-accent); filter: drop-shadow(0 0 6px var(--fd-accent-glow));
}
.fdx .fd-brand-mark svg { width: 100%; height: 100%; }
.fdx .fd-brand-text { font-size: var(--fd-fs-sm); font-weight: 700; letter-spacing: .22em; text-transform: uppercase; }
.fdx .fd-brand-text span { color: var(--fd-text-faint); font-weight: 500; }

.fdx .fd-topbar-spacer { flex: 1 1 auto; }

/* Buttons ------------------------------------------------------------------ */
.fdx .fd-btn {
  display: inline-flex; align-items: center; gap: 6px;
  height: 28px; padding: 0 10px;
  background: var(--fd-surface-2); color: var(--fd-text-dim);
  border: 1px solid var(--fd-line); border-radius: var(--fd-radius-sm);
  font-size: var(--fd-fs-sm); font-weight: 500; letter-spacing: .02em;
  cursor: pointer; white-space: nowrap;
  transition: background var(--fd-fast), color var(--fd-fast), border-color var(--fd-fast), transform var(--fd-fast);
}
.fdx .fd-btn:hover { color: var(--fd-text); border-color: var(--fd-line-strong); background: var(--fd-surface-3); }
.fdx .fd-btn:active { transform: translateY(1px); }
.fdx .fd-btn[data-active='true'] { color: var(--fd-accent); border-color: var(--fd-line-accent); background: var(--fd-accent-soft); }
.fdx .fd-btn--icon { width: 28px; padding: 0; justify-content: center; }
.fdx .fd-btn--ghost { background: transparent; border-color: transparent; }
.fdx .fd-btn--ghost:hover { background: var(--fd-surface-2); }
.fdx .fd-btn--primary { background: var(--fd-accent); color: var(--fd-text-invert); border-color: transparent; font-weight: 600; }
.fdx .fd-btn--primary:hover { background: var(--fd-accent); filter: brightness(1.12); color: var(--fd-text-invert); }
.fdx .fd-btn--danger:hover { color: var(--fd-danger); border-color: color-mix(in srgb, var(--fd-danger) 45%, transparent); }
.fdx .fd-btn:disabled { opacity: .4; pointer-events: none; }
.fdx .fd-icon { width: 14px; height: 14px; flex: 0 0 auto; stroke: currentColor; fill: none; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

.fdx .fd-kbd {
  display: inline-block; min-width: 17px; padding: 1px 5px;
  background: var(--fd-surface-3); border: 1px solid var(--fd-line);
  border-bottom-width: 2px; border-radius: 4px;
  font-family: var(--fd-font-mono); font-size: var(--fd-fs-2xs);
  color: var(--fd-text-faint); text-align: center;
}

/* Inputs ------------------------------------------------------------------- */
.fdx .fd-input, .fdx .fd-select, .fdx .fd-textarea {
  width: 100%; min-height: 28px; padding: 4px 8px;
  background: var(--fd-surface-0); border: 1px solid var(--fd-line);
  border-radius: var(--fd-radius-sm); font-size: var(--fd-fs-sm);
  transition: border-color var(--fd-fast), box-shadow var(--fd-fast);
}
.fdx .fd-input:focus, .fdx .fd-select:focus, .fdx .fd-textarea:focus {
  outline: none; border-color: var(--fd-accent);
  box-shadow: 0 0 0 3px var(--fd-accent-soft);
}
.fdx .fd-textarea { min-height: 90px; font-family: var(--fd-font-mono); font-size: var(--fd-fs-xs); resize: vertical; }
.fdx .fd-select { appearance: none; padding-right: 24px;
  background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position: right 11px center, right 6px center; background-size: 5px 5px; background-repeat: no-repeat; }
.fdx .fd-switch { position: relative; width: 34px; height: 18px; flex: 0 0 auto; background: var(--fd-surface-3);
  border: 1px solid var(--fd-line); border-radius: 99px; cursor: pointer; transition: background var(--fd-fast); }
.fdx .fd-switch::after { content: ''; position: absolute; top: 2px; left: 2px; width: 12px; height: 12px; border-radius: 99px;
  background: var(--fd-text-faint); transition: transform var(--fd-fast), background var(--fd-fast); }
.fdx .fd-switch[aria-checked='true'] { background: var(--fd-accent-soft); border-color: var(--fd-line-accent); }
.fdx .fd-switch[aria-checked='true']::after { transform: translateX(16px); background: var(--fd-accent); }
.fdx .fd-color { width: 34px; height: 26px; padding: 2px; background: var(--fd-surface-0);
  border: 1px solid var(--fd-line); border-radius: var(--fd-radius-sm); cursor: pointer; }
.fdx .fd-range { width: 100%; accent-color: var(--fd-accent); }

.fdx .fd-field { display: flex; flex-direction: column; gap: 5px; margin-bottom: 12px; }
.fdx .fd-field-row { flex-direction: row; align-items: center; justify-content: space-between; gap: 10px; }
.fdx .fd-label { font-size: var(--fd-fs-xs); font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--fd-text-faint); }
.fdx .fd-help { font-size: var(--fd-fs-xs); color: var(--fd-text-faint); line-height: 1.4; }

/* --------------------------------------------------------------------------
   7. GRID + WIDGETS
   -------------------------------------------------------------------------- */
.fdx .fd-canvas {
  flex: 1 1 auto; position: relative; overflow-y: auto; overflow-x: hidden;
  padding: var(--fd-gap); scrollbar-gutter: stable;
}
.fdx .fd-grid {
  position: relative;
  display: grid;
  grid-template-columns: repeat(var(--fd-cols, 12), minmax(0, 1fr));
  grid-auto-rows: var(--fd-row);
  gap: var(--fd-gap);
  min-height: 100%;
  align-content: start;
}
/* Alignment guides shown while dragging */
.fdx .fd-grid[data-dragging='true']::before {
  content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 0;
  border-radius: var(--fd-radius);
  background-image: linear-gradient(90deg, var(--fd-line) 1px, transparent 1px);
  background-size: calc((100% + var(--fd-gap)) / var(--fd-cols, 12)) 100%;
  opacity: .8;
}

.fdx .fd-widget {
  position: relative; display: flex; flex-direction: column; min-width: 0; min-height: 0;
  background: color-mix(in srgb, var(--fd-surface-1) 88%, transparent);
  backdrop-filter: blur(9px);
  border: 1px solid var(--fd-line);
  border-radius: var(--fd-radius);
  box-shadow: var(--fd-shadow);
  overflow: hidden;
  transition: border-color var(--fd-fast), box-shadow var(--fd-fast), opacity var(--fd-fast);
  z-index: var(--fd-z-grid);
}
.fdx .fd-widget::after {                 /* corner bracket flourish */
  content: ''; position: absolute; inset: 0; pointer-events: none; border-radius: inherit;
  background:
    linear-gradient(var(--fd-accent), var(--fd-accent)) 0 0 / 12px 1px no-repeat,
    linear-gradient(var(--fd-accent), var(--fd-accent)) 0 0 / 1px 12px no-repeat,
    linear-gradient(var(--fd-accent), var(--fd-accent)) 100% 100% / 12px 1px no-repeat,
    linear-gradient(var(--fd-accent), var(--fd-accent)) 100% 100% / 1px 12px no-repeat;
  opacity: 0; transition: opacity var(--fd-slow);
}
.fdx .fd-widget:hover { border-color: var(--fd-line-strong); }
.fdx .fd-widget:hover::after { opacity: .55; }
.fdx .fd-widget[data-state='loading'] { border-color: var(--fd-line-accent); }
.fdx .fd-widget[data-state='error'] { border-color: color-mix(in srgb, var(--fd-danger) 55%, transparent); }
.fdx .fd-widget[data-dragging='true'] { z-index: var(--fd-z-drag); box-shadow: var(--fd-glow), var(--fd-shadow); opacity: .93; cursor: grabbing; }
.fdx .fd-widget[data-placeholder='true'] { background: var(--fd-accent-soft); border: 1px dashed var(--fd-line-accent); box-shadow: none; }
.fdx .fd-widget[data-placeholder='true'] * { display: none; }

/* Loading sweep */
.fdx .fd-widget[data-state='loading'] .fd-widget-head::after {
  content: ''; position: absolute; left: 0; bottom: -1px; height: 1px; width: 32%;
  background: linear-gradient(90deg, transparent, var(--fd-accent), transparent);
  animation: fd-sweep 1.25s var(--fd-ease) infinite;
}
@keyframes fd-sweep { 0% { transform: translateX(-110%); } 100% { transform: translateX(420%); } }

.fdx .fd-widget-head {
  position: relative; flex: 0 0 auto; height: var(--fd-widget-head);
  display: flex; align-items: center; gap: 7px; padding: 0 6px 0 10px;
  border-bottom: 1px solid var(--fd-line);
  background: color-mix(in srgb, var(--fd-surface-2) 60%, transparent);
  cursor: grab; user-select: none;
}
.fdx .fd-widget-head:active { cursor: grabbing; }
.fdx .fd-widget-icon { color: var(--fd-accent); font-size: var(--fd-fs-sm); line-height: 1; }
.fdx .fd-widget-title {
  flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: var(--fd-fs-xs); font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--fd-text-dim);
}
.fdx .fd-widget-badge {
  padding: 1px 6px; border-radius: 99px; font-family: var(--fd-font-mono);
  font-size: var(--fd-fs-2xs); letter-spacing: .06em;
  background: var(--fd-accent-soft); color: var(--fd-accent); border: 1px solid var(--fd-line-accent);
}
.fdx .fd-widget-badge[data-tone='ok'] { background: color-mix(in srgb, var(--fd-ok) 14%, transparent);     color: var(--fd-ok);     border-color: color-mix(in srgb, var(--fd-ok) 40%, transparent); }
.fdx .fd-widget-badge[data-tone='warn'] { background: color-mix(in srgb, var(--fd-warn) 14%, transparent);   color: var(--fd-warn);   border-color: color-mix(in srgb, var(--fd-warn) 40%, transparent); }
.fdx .fd-widget-badge[data-tone='danger'] { background: color-mix(in srgb, var(--fd-danger) 14%, transparent); color: var(--fd-danger); border-color: color-mix(in srgb, var(--fd-danger) 40%, transparent); }
.fdx .fd-widget-tools { display: flex; align-items: center; gap: 1px; opacity: 0; transition: opacity var(--fd-fast); }
.fdx .fd-widget:hover .fd-widget-tools, .fdx .fd-widget:focus-within .fd-widget-tools { opacity: 1; }
.fdx .fd-widget-tool {
  width: 21px; height: 21px; display: grid; place-items: center;
  background: none; border: 0; border-radius: 4px; color: var(--fd-text-faint); cursor: pointer;
  transition: color var(--fd-fast), background var(--fd-fast);
}
.fdx .fd-widget-tool:hover { color: var(--fd-accent); background: var(--fd-surface-3); }
.fdx .fd-widget-tool[data-tool='remove']:hover { color: var(--fd-danger); }

.fdx .fd-widget-body { flex: 1 1 auto; min-height: 0; overflow: auto; padding: var(--fd-pad); }
.fdx .fd-widget-body[data-scroll='none'] { overflow: hidden; }
.fdx .fd-widget-body[data-pad='none'] { padding: 0; }

/* Cards — empty, problem, error — render into this layer, never into the body,
   so a module's cached subtree is never detached. It takes the body's place in
   the widget's flex column and the body is hidden while it is up, so the deck
   looks exactly as it did when a card replaced the body's children. Showing
   stale content behind a card instead is one rule from here: drop the
   display:none and give the overlay position:absolute; inset:0. */
.fdx .fd-widget-overlay { flex: 1 1 auto; min-height: 0; overflow: auto; padding: var(--fd-pad); }
.fdx .fd-widget[data-card] > .fd-widget-body { display: none; }

/* Resize handles */
.fdx .fd-resize { position: absolute; z-index: 3; touch-action: none; }
.fdx .fd-resize[data-dir='e'] { top: 8px; right: -3px; bottom: 8px; width: 8px; cursor: ew-resize; }
.fdx .fd-resize[data-dir='s'] { left: 8px; right: 8px; bottom: -3px; height: 8px; cursor: ns-resize; }
.fdx .fd-resize[data-dir='se'] { right: 0; bottom: 0; width: 16px; height: 16px; cursor: nwse-resize; }
.fdx .fd-resize[data-dir='se']::after {
  content: ''; position: absolute; right: 3px; bottom: 3px; width: 7px; height: 7px;
  border-right: 1.5px solid var(--fd-text-faint); border-bottom: 1.5px solid var(--fd-text-faint);
  border-bottom-right-radius: 3px; opacity: 0; transition: opacity var(--fd-fast);
}
.fdx .fd-widget:hover .fd-resize[data-dir='se']::after { opacity: .85; }



/* Error boundary card */
.fdx .fd-error {
  height: 100%; display: flex; flex-direction: column; gap: 8px; justify-content: center; align-items: flex-start;
  padding: 14px; font-size: var(--fd-fs-sm);
}
.fdx .fd-error-title { display: flex; align-items: center; gap: 7px; color: var(--fd-danger); font-weight: 600; }
.fdx .fd-error-msg {
  width: 100%; max-height: 90px; overflow: auto; padding: 7px 9px;
  background: var(--fd-surface-0); border: 1px solid var(--fd-line); border-radius: var(--fd-radius-sm);
  font-family: var(--fd-font-mono); font-size: var(--fd-fs-xs); color: var(--fd-text-dim); white-space: pre-wrap;
}
.fdx .fd-empty {
  height: 100%; display: grid; place-content: center; gap: 6px; justify-items: center;
  color: var(--fd-text-faint); font-size: var(--fd-fs-sm); text-align: center;
}

/* Focus (fullscreen) mode.
   The widget is normally translucent so the backdrop shows through; over the
   focus scrim that reads as muddy, so go fully opaque here. */
.fdx .fd-widget[data-focus='true'] {
  position: fixed; inset: calc(var(--fd-header) + 14px) 14px 14px; z-index: var(--fd-z-focus);
  background: var(--fd-surface-1);
  backdrop-filter: none;
  border-color: var(--fd-line-strong);
  box-shadow: var(--fd-glow), 0 40px 120px -30px #000;
}
.fdx .fd-widget[data-focus='true'] .fd-widget-head {
  background: var(--fd-surface-2);
  cursor: default;
}
.fdx .fd-widget[data-focus='true'] .fd-widget-title { color: var(--fd-text); }
.fdx .fd-widget[data-focus='true'] .fd-widget-tools { opacity: 1; }




/* --------------------------------------------------------------------------
   9. MODULE-FACING UTILITIES
       Small, stable class contract module authors can rely on. These stay
       backwards-compatible; Tailwind utilities are available on top.
   -------------------------------------------------------------------------- */
.fdx .fd-stat { display: flex; flex-direction: column; gap: 1px; }
.fdx .fd-stat-value { font-family: var(--fd-font-mono); font-size: var(--fd-fs-2xl); font-weight: 600; line-height: 1.05; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.fdx .fd-stat-label { font-size: var(--fd-fs-2xs); font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--fd-text-faint); }
.fdx .fd-stat-delta { font-family: var(--fd-font-mono); font-size: var(--fd-fs-sm); font-variant-numeric: tabular-nums; }
.fdx .fd-up { color: var(--fd-ok); } .fdx .fd-down { color: var(--fd-danger); } .fdx .fd-flat { color: var(--fd-text-faint); }
.fdx .fd-mono { font-family: var(--fd-font-mono); font-variant-numeric: tabular-nums; }
.fdx .fd-dim { color: var(--fd-text-dim); } .fdx .fd-faint { color: var(--fd-text-faint); }

.fdx .fd-table { width: 100%; border-collapse: collapse; font-size: var(--fd-fs-sm); }
.fdx .fd-table th {
  position: sticky; top: 0; z-index: 1; padding: 5px 7px; text-align: left;
  background: var(--fd-surface-2); border-bottom: 1px solid var(--fd-line);
  font-size: var(--fd-fs-2xs); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--fd-text-faint);
}
.fdx .fd-table td { padding: 5px 7px; border-bottom: 1px solid var(--fd-line); }
.fdx .fd-table tbody tr:hover { background: var(--fd-surface-2); }
.fdx .fd-table .num { text-align: right; font-family: var(--fd-font-mono); font-variant-numeric: tabular-nums; }

.fdx .fd-bar { height: 5px; background: var(--fd-surface-3); border-radius: 99px; overflow: hidden; }
.fdx .fd-bar > i { display: block; height: 100%; background: var(--fd-accent); border-radius: 99px; transition: width var(--fd-slow); }
.fdx .fd-list { display: flex; flex-direction: column; gap: 1px; }
.fdx .fd-list-item { display: flex; align-items: center; gap: 8px; padding: 5px 6px; border-radius: var(--fd-radius-sm); }
.fdx .fd-list-item:hover { background: var(--fd-surface-2); }
.fdx .fd-dot { width: 6px; height: 6px; border-radius: 99px; background: var(--fd-text-faint); flex: 0 0 auto; }
.fdx .fd-dot[data-tone='ok'] { background: var(--fd-ok); box-shadow: 0 0 8px var(--fd-ok); }
.fdx .fd-dot[data-tone='warn'] { background: var(--fd-warn); box-shadow: 0 0 8px var(--fd-warn); }
.fdx .fd-dot[data-tone='danger'] { background: var(--fd-danger); box-shadow: 0 0 8px var(--fd-danger); }
.fdx .fd-skeleton { background: linear-gradient(90deg, var(--fd-surface-2) 25%, var(--fd-surface-3) 50%, var(--fd-surface-2) 75%);
  background-size: 200% 100%; border-radius: var(--fd-radius-sm); animation: fd-shimmer 1.3s linear infinite; }
@keyframes fd-shimmer { to { background-position: -200% 0; } }
.fdx .fd-scroll { overflow: auto; min-height: 0; }
.fdx .fd-fill { width: 100%; height: 100%; }
.fdx .fd-center { display: grid; place-content: center; }



/* markdown-notes module CSS (injected by the module at runtime in the deck) */


.fdx .nt { display:flex; flex-direction:column; height:100%; }
.fdx .nt-bar { display:flex; gap:4px; padding:5px 6px; border-bottom:1px solid var(--fd-line); }
.fdx .nt-body { flex:1; min-height:0; overflow:auto; }
.fdx .nt-edit { width:100%; height:100%; padding:10px 12px; background:transparent; border:0; resize:none; color:var(--fd-text); line-height:1.6; }
.fdx .nt-edit:focus { outline:none; }
.fdx .nt-view { padding:10px 12px; font-size:var(--fd-fs-md); line-height:1.6; }
.fdx .nt-view h1, .fdx .nt-view h2, .fdx .nt-view h3, .fdx .nt-view h4 { margin:.7em 0 .35em; line-height:1.25; }
.fdx .nt-view h1 { font-size:1.35em; } .fdx .nt-view h2 { font-size:1.15em; } .fdx .nt-view h3 { font-size:1em; color:var(--fd-text-dim); }
.fdx .nt-view p { margin:.35em 0; } .fdx .nt-view ul { margin:.35em 0; padding-left:1.15em; }
.fdx .nt-view li.task { list-style:none; margin-left:-1.15em; display:flex; gap:7px; align-items:baseline; }
.fdx .nt-view li.task .done { color:var(--fd-text-faint); text-decoration:line-through; }
.fdx .nt-view code { background:var(--fd-surface-2); padding:1px 4px; border-radius:4px; font-family:var(--fd-font-mono); font-size:.9em; }
.fdx .nt-view pre { background:var(--fd-surface-0); border:1px solid var(--fd-line); border-radius:var(--fd-radius-sm); padding:9px 11px; overflow:auto; }
.fdx .nt-view pre code { background:none; padding:0; }
.fdx .nt-view blockquote { margin:.4em 0; padding-left:9px; border-left:2px solid var(--fd-accent); color:var(--fd-text-dim); }
.fdx .nt-view hr { border:0; border-top:1px solid var(--fd-line); margin:.8em 0; }
.fdx .nt-view a { color:var(--fd-accent); }