/* ==========================================================================
   All Medical Dental — Enterprise Data Analyst Tokens & Component Styles
   Derived from enterprise-dashboard measured tokens (frames 01-13)
   ========================================================================== */
:root {
  color-scheme: light;
  /* surfaces: page > shell > panel > card; inset = graph canvas */
  --ed-bg-page: #e8ecef;
  --ed-bg-shell: #f6fafb;
  --ed-bg-panel: #f9f9f9;
  --ed-bg-card: #ffffff;
  --ed-bg-inset: #f1f0f5;
  --ed-bg-muted: #f2f2f3;      /* hover row, chip, kbd, toggle track */
  --ed-track: #e8e8ec;         /* empty bar / meter segment */
  --ed-border: #ececef;        /* hairline, barely visible; depth comes from shadow */
  --ed-border-strong: #dcdfe3;
  --ed-overlay: rgba(10, 12, 16, 0.38);
  /* text tiers */
  --ed-text: #0a0a0c;
  --ed-text-muted: #55575b;
  --ed-text-subtle: #8f9197;
  --ed-text-inverse: #ffffff;
  /* primary */
  --ed-primary: #2363e9;
  --ed-primary-hover: #1d55cc;
  --ed-primary-soft: #eaf2fd;
  --ed-primary-soft-2: #dde9fc;
  /* status: accent (dot, bar, border), soft (pill fill), ink (pill text) */
  --ed-ok: #20c465;     --ed-ok-soft: #dcfbe9;    --ed-ok-ink: #1c6a3e;
  --ed-warn: #f29702;   --ed-warn-soft: #fef3c7;  --ed-warn-ink: #6b430f;  --ed-warn-bar: #f7c745;
  --ed-err: #ee4e1f;    --ed-err-soft: #ffece6;   --ed-err-ink: #8a1422;   --ed-logout: #eb291b;
  --ed-violet: #7c52f4; --ed-violet-soft: #f2ebfb; --ed-violet-bar: #a68dfb;
  --ed-teal: #21d3bb;
  --ed-ink-btn: #202124; --ed-ink-btn-text: #ffffff;
  /* elevation */
  --ed-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04), 0 2px 8px rgba(15, 23, 42, 0.04);
  --ed-shadow-md: 0 1px 2px rgba(15, 23, 42, 0.05), 0 10px 28px rgba(15, 23, 42, 0.06);
  --ed-shadow-pop: 0 2px 6px rgba(15, 23, 42, 0.06), 0 24px 60px rgba(15, 23, 42, 0.16);
  --ed-shadow-cta: 0 8px 20px rgba(35, 99, 233, 0.32);
  /* radii */
  --ed-r-shell: 48px; --ed-r-modal: 36px; --ed-r-panel: 28px; --ed-r-card: 20px;
  --ed-r-tile: 18px;  --ed-r-input: 14px; --ed-r-pill: 999px;
  /* spacing */
  --ed-gap: 14px; --ed-pad-panel: 18px; --ed-pad-card: 14px; --ed-shell-pad: 18px;
  /* type */
  --ed-font-ui: "Geist", "Inter", "IBM Plex Sans Arabic", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --ed-font-display: "Geist", "Outfit", "IBM Plex Sans Arabic", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --ed-font-mono: "Geist Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --ed-fs-title: clamp(22px, 1.8vw, 28px); --ed-fs-h2: clamp(17px, 1.35vw, 20px); --ed-fs-kpi: clamp(18px, 1.35vw, 24px);
  --ed-fs-body: 13.5px;  --ed-fs-sm: 12.5px; --ed-fs-xs: 11.5px; --ed-fs-cap: 10.5px;
  /* segmented meter */
  --ed-meter-n: 28; --ed-meter-gap: 2px; --ed-meter-h: 14px; --ed-meter-r: 3px;
}

[data-theme="dark"] {
  color-scheme: dark;
  --ed-bg-page: #08090b; --ed-bg-shell: #101317; --ed-bg-panel: #14181d; --ed-bg-card: #1a1f25;
  --ed-bg-inset: #12151a; --ed-bg-muted: #222830; --ed-track: #2a3038;
  --ed-border: #252b33; --ed-border-strong: #343c47; --ed-overlay: rgba(0, 0, 0, 0.6);
  --ed-text: #f3f5f8; --ed-text-muted: #a3a9b3; --ed-text-subtle: #747b87; --ed-text-inverse: #ffffff;
  --ed-primary: #3b79f2; --ed-primary-hover: #5a8ff5;
  --ed-primary-soft: rgba(59, 121, 242, 0.16); --ed-primary-soft-2: rgba(59, 121, 242, 0.26);
  --ed-ok: #34d27a;   --ed-ok-soft: rgba(32, 196, 101, 0.16);  --ed-ok-ink: #6fe0a3;
  --ed-warn: #f5a524; --ed-warn-soft: rgba(242, 151, 2, 0.16); --ed-warn-ink: #f6c667; --ed-warn-bar: #f7c745;
  --ed-err: #f2643a;  --ed-err-soft: rgba(238, 78, 31, 0.16);  --ed-err-ink: #ff9a7d; --ed-logout: #ff5a4d;
  --ed-violet: #9272f7; --ed-violet-soft: rgba(124, 82, 244, 0.18); --ed-violet-bar: #8a6af0;
  --ed-teal: #2fd8c2;
  --ed-ink-btn: #f3f5f8; --ed-ink-btn-text: #0a0a0c;
  --ed-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --ed-shadow-md: 0 1px 2px rgba(0, 0, 0, 0.4), 0 10px 28px rgba(0, 0, 0, 0.35);
  --ed-shadow-pop: 0 2px 6px rgba(0, 0, 0, 0.5), 0 24px 60px rgba(0, 0, 0, 0.55);
  --ed-shadow-cta: 0 8px 20px rgba(59, 121, 242, 0.35);
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; width: 100%; max-width: 100vw; overflow-x: hidden; background: var(--ed-bg-page); color: var(--ed-text); font: 400 var(--ed-fs-body)/1.45 var(--ed-font-ui); -webkit-font-smoothing: antialiased; }

/* ---------- base + layout ---------- */
.ed-app { background: var(--ed-bg-page); color: var(--ed-text); min-height: 100vh; width: 100%; max-width: 100vw; overflow-x: hidden; padding: 12px 16px; transition: background 0.16s ease, color 0.16s ease; }
.ed-shell { background: var(--ed-bg-shell); border-radius: 32px; padding: var(--ed-shell-pad); width: 100%; max-width: min(1440px, 100%); margin-inline: auto; box-shadow: var(--ed-shadow-md); position: relative; overflow: hidden; }
.ed-panel { background: var(--ed-bg-panel); border-radius: var(--ed-r-panel); padding: var(--ed-pad-panel); box-shadow: var(--ed-shadow-sm); border: 1px solid var(--ed-border); min-width: 0; max-width: 100%; overflow: hidden; }
.ed-card { background: var(--ed-bg-card); border: 1px solid var(--ed-border); border-radius: var(--ed-r-card); padding: var(--ed-pad-card); box-shadow: var(--ed-shadow-sm); transition: transform 0.14s ease, box-shadow 0.14s ease; min-width: 0; max-width: 100%; overflow: hidden; }
.ed-inset { background: var(--ed-bg-inset); border-radius: var(--ed-r-tile); padding: 14px; min-width: 0; max-width: 100%; }
.ed-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--ed-gap); width: 100%; max-width: 100%; min-width: 0; }
.ed-title { font: 500 var(--ed-fs-title)/1.15 var(--ed-font-display); letter-spacing: -0.02em; margin: 0; word-break: break-word; }
.ed-h2 { font: 500 var(--ed-fs-h2)/1.22 var(--ed-font-display); letter-spacing: -0.01em; margin: 0; word-break: break-word; }
.ed-sub { color: var(--ed-text-muted); font-size: var(--ed-fs-sm); margin: 4px 0 0; }
.ed-label { font-size: var(--ed-fs-cap); letter-spacing: 0.08em; text-transform: uppercase; color: var(--ed-text-subtle); font-weight: 600; }
.ed-num { font-variant-numeric: tabular-nums; }
.ed-mono { font-family: var(--ed-font-mono); font-size: var(--ed-fs-sm); }
.ed-kbd { font-size: var(--ed-fs-cap); padding: 2px 7px; border-radius: var(--ed-r-pill); background: var(--ed-bg-muted); color: var(--ed-text-muted); font-family: var(--ed-font-mono); border: 1px solid var(--ed-border); display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; }

/* ---------- Floating Top Bar & Left Rail (Shell A) ---------- */
.ed-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 14px;
  flex-wrap: nowrap;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
.ed-brand-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 40px;
  padding: 0 11px 0 6px;
  background: var(--ed-bg-card);
  border: 1px solid var(--ed-border);
  border-radius: var(--ed-r-pill);
  box-shadow: var(--ed-shadow-sm);
  cursor: pointer;
  flex-shrink: 0;
}
.ed-brand-disc {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--ed-primary-soft);
  color: var(--ed-primary);
  display: grid;
  place-items: center;
  font-weight: 700;
  font-size: 12px;
}
.ed-nav-pill {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: nowrap;
  gap: 2px;
  height: 40px;
  padding: 3px 4px;
  background: var(--ed-bg-card);
  border: 1px solid var(--ed-border);
  border-radius: var(--ed-r-pill);
  box-shadow: var(--ed-shadow-sm);
  flex: 0 1 auto;
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  scrollbar-width: none;
}
.ed-nav-pill::-webkit-scrollbar { display: none; }
.ed-nav-item {
  height: 32px;
  padding: 0 7px;
  border-radius: var(--ed-r-pill);
  border: none;
  background: transparent;
  color: var(--ed-text-muted);
  font: 500 11px var(--ed-font-ui);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  white-space: nowrap;
  flex-shrink: 0;
  transition: background 0.14s ease, color 0.14s ease;
}
.ed-nav-item:hover {
  color: var(--ed-text);
  background: var(--ed-bg-muted);
}
.ed-nav-item.is-active {
  background: var(--ed-primary);
  color: var(--ed-text-inverse);
  box-shadow: var(--ed-shadow-cta);
}
.ed-top-cluster {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}
.ed-status-cluster {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 42px;
  padding: 0 12px 0 8px;
  background: var(--ed-bg-card);
  border: 1px solid var(--ed-border);
  border-radius: var(--ed-r-pill);
  box-shadow: var(--ed-shadow-sm);
  font-size: var(--ed-fs-xs);
  color: var(--ed-text-muted);
}
.ed-icon-btn {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 1px solid var(--ed-border);
  background: var(--ed-bg-card);
  color: var(--ed-text);
  display: grid;
  place-items: center;
  cursor: pointer;
  box-shadow: var(--ed-shadow-sm);
  position: relative;
  transition: background 0.14s ease;
}
.ed-icon-btn:hover { background: var(--ed-bg-muted); }
.ed-bell-dot {
  position: absolute;
  top: 9px;
  right: 10px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ed-err);
  border: 2px solid var(--ed-bg-card);
}
.ed-user-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 42px;
  padding: 0 12px 0 5px;
  background: var(--ed-bg-card);
  border: 1px solid var(--ed-border);
  border-radius: var(--ed-r-pill);
  box-shadow: var(--ed-shadow-sm);
  cursor: pointer;
  text-align: start;
}
.ed-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--ed-primary), var(--ed-violet));
  color: #fff;
  display: grid;
  place-items: center;
  font-weight: 600;
  font-size: 12px;
}

/* Body Layout: Left Icon Rail + Main Content */
.ed-body {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
#main-content {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
.ed-rail {
  display: flex;
  flex-direction: column;
  gap: 12px;
  position: sticky;
  top: 16px;
}
.ed-rail-pill {
  width: 48px;
  padding: 5px 4px;
  background: var(--ed-bg-card);
  border: 1px solid var(--ed-border);
  border-radius: var(--ed-r-pill);
  box-shadow: var(--ed-shadow-sm);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
}
.ed-rail-btn {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: none;
  background: transparent;
  color: var(--ed-text-muted);
  display: grid;
  place-items: center;
  cursor: pointer;
  transition: all 0.14s ease;
}
.ed-rail-btn:hover {
  background: var(--ed-bg-muted);
  color: var(--ed-text);
}
.ed-rail-btn.is-active {
  background: var(--ed-primary);
  color: var(--ed-text-inverse);
  box-shadow: var(--ed-shadow-cta);
}

/* ---------- pills + chips + buttons ---------- */
.ed-pill { display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px; border-radius: var(--ed-r-pill); font-size: var(--ed-fs-xs); font-weight: 500; white-space: nowrap; }
.ed-pill::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: .9; flex-shrink: 0; }
.ed-pill--plain::before { display: none; }
.ed-pill-ok   { background: var(--ed-ok-soft);   color: var(--ed-ok-ink); }
.ed-pill-warn { background: var(--ed-warn-soft); color: var(--ed-warn-ink); }
.ed-pill-err  { background: var(--ed-err-soft);  color: var(--ed-err-ink); }
.ed-pill-info { background: var(--ed-primary-soft); color: var(--ed-primary); }
.ed-pill-violet { background: var(--ed-violet-soft); color: var(--ed-violet); }
.ed-pill-ok::before { background: var(--ed-ok); }
.ed-pill-warn::before { background: var(--ed-warn); }
.ed-pill-err::before { background: var(--ed-err); }
.ed-pill-info::before { background: var(--ed-primary); }
.ed-pill-violet::before { background: var(--ed-violet); }

.ed-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: var(--ed-r-pill); background: var(--ed-bg-card); border: 1px solid var(--ed-border); color: var(--ed-text); font-size: var(--ed-fs-sm); cursor: pointer; transition: all 0.14s ease; white-space: nowrap; }
.ed-chip:hover { background: var(--ed-bg-muted); }
.ed-chip[aria-pressed="true"], .ed-chip.is-active { background: var(--ed-primary-soft); border-color: transparent; color: var(--ed-primary); font-weight: 500; }

.ed-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 38px; padding: 0 15px; border-radius: var(--ed-r-pill); border: 1px solid var(--ed-border); background: var(--ed-bg-card); color: var(--ed-text); font: 500 var(--ed-fs-sm) var(--ed-font-ui); cursor: pointer; transition: all 0.14s ease; text-decoration: none; white-space: nowrap; }
.ed-btn:hover { background: var(--ed-bg-muted); }
.ed-btn--primary { background: var(--ed-primary); border-color: transparent; color: var(--ed-text-inverse); box-shadow: var(--ed-shadow-cta); }
.ed-btn--primary:hover { background: var(--ed-primary-hover); }
.ed-btn--sm { height: 30px; padding: 0 10px; font-size: var(--ed-fs-xs); }
.ed-btn--ink { background: var(--ed-ink-btn); border-color: transparent; color: var(--ed-ink-btn-text); height: 40px; border-radius: 14px; width: 100%; }
.ed-btn:focus-visible, .ed-chip:focus-visible, .ed-nav-item:focus-visible, .ed-rail-btn:focus-visible { outline: 2px solid var(--ed-primary); outline-offset: 2px; }

/* ---------- KPI ---------- */
.ed-kpi { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 3px 10px; align-items: center; min-width: 0; }
.ed-kpi__icon { grid-row: 1 / span 3; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--ed-primary-soft); color: var(--ed-primary); flex-shrink: 0; }
.ed-kpi__label { font-size: var(--ed-fs-xs); color: var(--ed-text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ed-kpi__value { font: 600 var(--ed-fs-kpi)/1.12 var(--ed-font-display); font-variant-numeric: tabular-nums; letter-spacing: -0.02em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ed-kpi__foot { display: flex; align-items: center; gap: 6px; font-size: var(--ed-fs-xs); color: var(--ed-text-muted); margin-top: 2px; flex-wrap: wrap; min-width: 0; }
.ed-kpi__spark { grid-column: 3; grid-row: 1 / span 3; width: 64px; height: 36px; }
@media (max-width: 1400px) {
  .ed-kpi__spark { display: none; }
}

/* ---------- table as row cards ---------- */
.ed-table-wrap { width: 100%; max-width: 100%; min-width: 0; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.ed-table { width: 100%; border-collapse: separate; border-spacing: 0 5px; font-size: var(--ed-fs-sm); }
.ed-table th { text-align: start; padding: 0 10px 4px; font-size: var(--ed-fs-cap); font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ed-text-subtle); white-space: nowrap; }
.ed-table td { background: var(--ed-bg-card); padding: 9px 10px; border-block: 1px solid var(--ed-border); font-variant-numeric: tabular-nums; transition: background 0.12s ease; }
.ed-table tbody tr { cursor: pointer; }
.ed-table tbody tr:hover td { background: var(--ed-bg-muted); }
.ed-table td:first-child { border-inline-start: 1px solid var(--ed-border); border-start-start-radius: 18px; border-end-start-radius: 18px; }
.ed-table td:last-child { border-inline-end: 1px solid var(--ed-border); border-start-end-radius: 18px; border-end-end-radius: 18px; }
.ed-table tr.is-bad td { background: var(--ed-err-soft); color: var(--ed-err-ink); border-color: transparent; }
.ed-table tr.is-bad:hover td { filter: brightness(0.97); }
.ed-table .num { text-align: end; font-variant-numeric: tabular-nums; }

/* ---------- segmented usage meter (frame 13) ---------- */
.ed-meter { display: grid; grid-template-columns: repeat(var(--ed-meter-n), 1fr); gap: var(--ed-meter-gap); height: var(--ed-meter-h); }
.ed-meter > span { background: var(--ed-track); border-radius: var(--ed-meter-r); }
.ed-meter > span.on { background: var(--c, var(--ed-primary)); }
.ed-meter-row { display: grid; gap: 6px; font-size: var(--ed-fs-sm); color: var(--ed-text-muted); }

/* ---------- Inputs & Filters ---------- */
.ed-input {
  height: 38px;
  padding: 0 14px;
  border-radius: var(--ed-r-pill);
  border: 1px solid var(--ed-border-strong);
  background: var(--ed-bg-card);
  color: var(--ed-text);
  font: 400 var(--ed-fs-sm) var(--ed-font-ui);
  outline: none;
}
.ed-input:focus { border-color: var(--ed-primary); box-shadow: 0 0 0 3px var(--ed-primary-soft); }
.ed-select {
  height: 38px;
  padding: 0 30px 0 14px;
  border-radius: var(--ed-r-pill);
  border: 1px solid var(--ed-border-strong);
  background: var(--ed-bg-card);
  color: var(--ed-text);
  font: 500 var(--ed-fs-sm) var(--ed-font-ui);
  cursor: pointer;
}

/* ---------- Command Palette (Cmd-K) & Modals ---------- */
.ed-backdrop {
  position: fixed;
  inset: 0;
  background: var(--ed-overlay);
  backdrop-filter: blur(5px);
  z-index: 100;
  display: none;
  place-items: start center;
  padding-top: 7vh;
}
.ed-backdrop.is-open { display: grid; }
.ed-palette {
  width: min(860px, 94vw);
  background: var(--ed-bg-card);
  border-radius: var(--ed-r-modal);
  box-shadow: var(--ed-shadow-pop);
  border: 1px solid var(--ed-border);
  overflow: hidden;
}
.ed-palette-search {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 18px 24px;
  border-bottom: 1px solid var(--ed-border);
}
.ed-palette-search input {
  flex: 1;
  border: none;
  background: transparent;
  font: 400 17px var(--ed-font-ui);
  color: var(--ed-text);
  outline: none;
}
.ed-palette-list {
  max-height: 420px;
  overflow-y: auto;
  padding: 14px 18px;
}
.ed-palette-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px;
  border-radius: 16px;
  cursor: pointer;
  transition: background 0.12s ease;
}
.ed-palette-item:hover, .ed-palette-item.is-selected {
  background: var(--ed-primary-soft);
}
.ed-palette-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 24px;
  background: var(--ed-bg-shell);
  border-top: 1px solid var(--ed-border);
  font-size: var(--ed-fs-xs);
  color: var(--ed-text-muted);
}

/* ---------- Account Popover (frame 13) ---------- */
.ed-account-pop {
  position: absolute;
  top: 76px;
  right: 24px;
  width: 330px;
  background: var(--ed-bg-card);
  border: 1px solid var(--ed-border-strong);
  border-radius: 22px;
  box-shadow: var(--ed-shadow-pop);
  padding: 18px;
  z-index: 90;
  display: none;
}
.ed-account-pop.is-open { display: block; }

/* ---------- Cost / Category Bars ---------- */
.ed-bar-track {
  height: 11px;
  background: var(--ed-track);
  border-radius: 999px;
  overflow: hidden;
}
.ed-bar-fill {
  height: 100%;
  border-radius: 999px;
  transition: width 0.35s ease;
}

/* ---------- Responsive (Desktop, Laptop, Tablet & 390px Mobile) ---------- */
.col-12, .col-8, .col-7, .col-6, .col-5, .col-4, .col-3 { min-width: 0; max-width: 100%; }
.col-12 { grid-column: span 12; }
.col-8  { grid-column: span 8; }
.col-7  { grid-column: span 7; }
.col-6  { grid-column: span 6; }
.col-5  { grid-column: span 5; }
.col-4  { grid-column: span 4; }
.col-3  { grid-column: span 3; }

@media (max-width: 1520px) {
  .ed-status-cluster { display: none; }
}
@media (max-width: 1240px) {
  .col-3 { grid-column: span 6; }
}
@media (max-width: 1100px) {
  .col-8, .col-7, .col-6, .col-5, .col-4, .col-3 { grid-column: span 12; }
}
@media (max-width: 768px) {
  .ed-app { padding: 8px; }
  .ed-shell { border-radius: 24px; padding: 12px; }
  .ed-body { grid-template-columns: minmax(0, 1fr); }
  .ed-rail {
    flex-direction: row;
    position: fixed;
    bottom: 12px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 80;
    top: auto;
  }
  .ed-rail-pill {
    flex-direction: row;
    width: auto;
    padding: 5px 8px;
  }
  .ed-rail-pill.hide-mobile { display: none; }
}