/* The shared rail chrome: the dark icon rail (collapsed 64px, opens on hover, pin control, pinned footer with the user
   menu, phone drawer, minimised module navigation) and the few card and field rules that go with it, for every business
   with a theme (registry brand.theme: the body carries data-chrome). No business is named here and no colour literal:
   every colour is a --bc-* token. A themed business gets them from its theme tokens (the default block below); a
   business with a hand-tuned look sets them itself (for Universal Finance, static/brand/ufs/ufs-brand.css).
   The scope below has the specificity of the hand-tuned scope this file replaces (0,2,1), so the cascade against
   sidebar.css and the page stylesheets is unchanged. Load after sidebar.css. */
body[data-chrome] {
  color-scheme: light;
  --bc-rail-width: 268px;
  --bc-rail-collapsed: 64px;
  --bc-mark-height: 32px;
  --t-fast: 120ms;
  --t-base: 180ms;
  --t-slow: 240ms;
  --ease: cubic-bezier(0.2, 0.8, 0.3, 1);
  --font: var(--dlg-font-text);
  --font-display: var(--dlg-font-text);
  --bc-rail-bg: var(--dlg-rail);
  --bc-rail-raised: color-mix(in srgb, var(--dlg-rail) 94%, var(--dlg-canvas));
  --bc-rail-text: var(--dlg-canvas);
  --bc-rail-muted: color-mix(in srgb, var(--dlg-canvas) 72%, var(--dlg-rail));
  --bc-rail-hover: color-mix(in srgb, var(--dlg-rail) 92%, var(--dlg-canvas));
  --bc-rail-active: color-mix(in srgb, var(--dlg-rail) 86%, var(--dlg-canvas));
  --bc-rail-active-line: var(--dlg-rail-active);
  --bc-rail-line: color-mix(in srgb, var(--dlg-rail) 86%, var(--dlg-canvas));
  --bc-rail-ring: var(--dlg-rail-active);
  --bc-mark: var(--dlg-rail-active);
  --bc-card-mark: var(--dlg-accent);
  --bc-button-bg: var(--dlg-accent);
  --bc-button-hover: var(--dlg-accent-hover);
  --bc-button-text: var(--dlg-surface);
  --bc-avatar-bg: var(--dlg-rail-active);
  --bc-avatar-text: var(--dlg-ink);
  --bc-del-hover: color-mix(in srgb, var(--dlg-fall) 45%, transparent);
  --bc-surface: var(--dlg-surface);
  --bc-ink: var(--dlg-ink);
  --bc-line: var(--dlg-border);
  --bc-line-strong: color-mix(in srgb, var(--dlg-muted) 70%, var(--dlg-surface));
  --bc-hover: var(--dlg-accent-soft);
  --bc-accent: var(--dlg-accent);
  --bc-accent-soft: var(--dlg-accent-soft);
  --bc-hairline: color-mix(in srgb, var(--dlg-border) 55%, var(--dlg-surface));
  --bc-overlay: color-mix(in srgb, var(--dlg-ink) 40%, transparent);
  --bc-shadow-peek: 12px 0 32px color-mix(in srgb, var(--dlg-rail) 28%, transparent);
  --bc-shadow-menu: 0 12px 28px color-mix(in srgb, var(--dlg-ink) 14%, transparent);
  --bc-shadow-flyout: 0 12px 28px color-mix(in srgb, var(--dlg-rail) 45%, transparent);
  --chrome-branded: 1;
  --bc-accent-hover: var(--dlg-accent-hover);
  --bc-surface-2: color-mix(in srgb, var(--dlg-canvas) 55%, var(--dlg-surface));
  --bc-row: var(--dlg-body);
  --bc-fade: color-mix(in srgb, var(--dlg-canvas) 0%, transparent);
  --bc-ink-wash: color-mix(in srgb, var(--dlg-ink) 6%, transparent);
  --bc-warn-line: color-mix(in srgb, var(--dlg-warn) 35%, var(--dlg-surface));
  --bc-tone-1: var(--dlg-ink);
  --bc-tone-1-soft: var(--dlg-accent-soft);
  --bc-tone-2: var(--dlg-series-1);
  --bc-tone-2-soft: color-mix(in srgb, var(--dlg-series-1) 10%, var(--dlg-surface));
  --bc-tone-3: var(--dlg-series-4);
  --bc-tone-3-soft: color-mix(in srgb, var(--dlg-series-4) 10%, var(--dlg-surface));
  --bc-tone-4: color-mix(in srgb, var(--dlg-series-3) 55%, #000);
  --bc-tone-4-soft: color-mix(in srgb, var(--dlg-series-3) 12%, var(--dlg-surface));
  --bc-tone-5: var(--dlg-series-2);
  --bc-tone-5-soft: color-mix(in srgb, var(--dlg-series-2) 10%, var(--dlg-surface));
  --bc-tone-6: var(--dlg-fall);
  --bc-tone-6-soft: color-mix(in srgb, var(--dlg-fall) 10%, var(--dlg-surface));
  --bc-danger-ink: color-mix(in srgb, var(--dlg-fall) 80%, #000);
  --bc-danger-line: color-mix(in srgb, var(--dlg-fall) 35%, var(--dlg-surface));
  --bc-danger-wash: color-mix(in srgb, var(--dlg-fall) 5%, var(--dlg-surface));
  --bc-scrim: color-mix(in srgb, var(--dlg-ink) 50%, transparent);
  --bc-shadow-modal: 0 24px 80px color-mix(in srgb, var(--dlg-ink) 28%, transparent);
  --bc-rail-soft: color-mix(in srgb, var(--dlg-canvas) 85%, var(--dlg-rail));
  --bc-step-done: color-mix(in srgb, var(--dlg-rise) 55%, #fff);
  --bc-step-act: var(--dlg-rail-active);
  --bc-step-err: color-mix(in srgb, var(--dlg-fall) 40%, #fff);
  --bc-callout-warn-bg: color-mix(in srgb, var(--dlg-accent) 16%, transparent);
  --bc-callout-warn-line: color-mix(in srgb, var(--dlg-accent) 45%, transparent);
  --bc-callout-delta-bg: color-mix(in srgb, var(--dlg-rail-active) 14%, transparent);
  --bc-callout-delta-line: color-mix(in srgb, var(--dlg-rail-active) 35%, transparent);
  --bc-verdict-bg: linear-gradient(120deg, var(--dlg-ink) 0%, var(--dlg-rail) 100%);
  font-variant-numeric: tabular-nums lining-nums;
  font-feature-settings: "tnum" 1, "lnum" 1;
}

/* The brand mark of a registry mark template is drawn in currentColor. */
body[data-chrome] .brand-mark { color: var(--bc-mark); }

body[data-chrome]:not([hidden]) .app {
  grid-template-columns: var(--bc-rail-width) minmax(0, 1fr);
}

body[data-chrome]:not([hidden]) .app.sidebar-collapsed {
  grid-template-columns: var(--bc-rail-collapsed) minmax(0, 1fr);
}

body[data-chrome]:not([hidden]) .sidebar {
  --foreground: var(--bc-rail-text);
  --muted-foreground: var(--bc-rail-muted);
  --accent: var(--bc-rail-active);
  --accent-foreground: var(--bc-rail-text);
  --hover: var(--bc-rail-hover);
  --border: var(--bc-rail-line);
  --dl-ink: var(--bc-rail-text);
  --ring: var(--bc-rail-ring);
  position: relative;
  isolation: isolate;
  background: var(--bc-rail-bg);
  color: var(--bc-rail-text);
}

body[data-chrome]:not([hidden]) .sidebar-head {
  padding: 20px 12px 20px 18px;
}

body[data-chrome]:not([hidden]) .brand-mark {
  width: 32px;
  height: var(--bc-mark-height);
}

body[data-chrome]:not([hidden]) .new-chat-form {
  padding: 0 16px 16px;
}

body[data-chrome]:not([hidden]) .new-chat-btn {
  min-height: 44px;
  font-size: 14px;
  line-height: 20px;
  background: var(--bc-button-bg);
}

body[data-chrome]:not([hidden]) .new-chat-btn:hover {
  background: var(--bc-button-hover);
}

body[data-chrome]:not([hidden]) .workspace-nav {
  padding: 0 16px;
}

body[data-chrome]:not([hidden]) .conv-item {
  min-height: 44px;
  padding: 10px 12px;
  gap: 12px;
  font-size: 14px;
  line-height: 20px;
}

body[data-chrome]:not([hidden]) .conv-item.active {
  font-weight: 600;
  box-shadow: inset 0 0 0 1px var(--bc-rail-active-line);
}

body[data-chrome]:not([hidden]) .sidebar .conv-icon {
  width: 20px;
  height: 20px;
  color: var(--bc-rail-text);
}

body[data-chrome]:not([hidden]) .side-group-label {
  font-size: 11px;
  line-height: 16px;
}

body[data-chrome]:not([hidden]) .sidebar-foot {
  min-height: 72px;
  padding: 16px;
}

body[data-chrome]:not([hidden]) .user-avatar {
  width: 40px;
  height: 40px;
  background: var(--bc-avatar-bg);
  color: var(--bc-avatar-text);
}

body[data-chrome]:not([hidden]) .conv-del:focus-visible,
body[data-chrome]:not([hidden]) .conv-item:focus-within .conv-del {
  opacity: 1;
}

body[data-chrome]:not([hidden]) :where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--ring);
  outline-offset: 3px;
}

body[data-chrome]:not([hidden]) .app.sidebar-collapsed .workspace-nav {
  padding: 0 8px;
}

body[data-chrome]:not([hidden]) .app.sidebar-collapsed .sidebar-head {
  padding: 16px 8px;
  flex-direction: column;
}

body[data-chrome]:not([hidden]) .app.sidebar-collapsed .sidebar-foot {
  padding: 12px;
}

/* ---- 2. Shared sidebar shell (chat/_sidebar.html, ufs branch) ---- */
body[data-chrome]:not([hidden]) .sidebar-head { gap: 12px; }
body[data-chrome]:not([hidden]) .brand { gap: 12px; }
body[data-chrome]:not([hidden]) .brand-name {
  font-family: var(--font-display);
  font-size: 18px;
  line-height: 24px;
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--bc-rail-text);
}
body[data-chrome]:not([hidden]) .brand-sub {
  font-size: 12px;
  line-height: 18px;
  font-weight: 400;
  color: var(--bc-rail-muted);
}
body[data-chrome]:not([hidden]) .sidebar-toggle { padding: 4px; color: var(--bc-rail-text); }
body[data-chrome]:not([hidden]) .sidebar-toggle:focus-visible { outline-offset: 1px; }
body[data-chrome]:not([hidden]) .sidebar-toggle:hover { background: var(--bc-rail-hover); color: var(--bc-rail-text); }
body[data-chrome]:not([hidden]) .new-chat-btn {
  border-radius: 8px;
  font-weight: 600;
  color: var(--bc-button-text);
  box-shadow: none;
}
body[data-chrome]:not([hidden]) .new-chat-btn i { width: 20px; height: 20px; }
body[data-chrome]:not([hidden]) .side-group-label {
  padding: 12px 28px 8px;
  font-weight: 600;
  letter-spacing: 0.1em;
  color: var(--bc-rail-muted);
}
body[data-chrome]:not([hidden]) .conv-item {
  margin-bottom: 4px;
  border-radius: 8px;
  color: var(--bc-rail-text);
  font-weight: 400;
  transition: background var(--t-fast) var(--ease);
}
body[data-chrome]:not([hidden]) .conv-item:hover { background: var(--bc-rail-hover); }
body[data-chrome]:not([hidden]) .conv-item.active {
  background: var(--bc-rail-active);
  color: var(--bc-rail-text);
}
body[data-chrome]:not([hidden]) .conv-item.active .conv-icon { color: var(--bc-rail-text); }
body[data-chrome]:not([hidden]) .conv-list { padding: 4px 16px; scrollbar-width: thin; scrollbar-color: var(--bc-rail-line) transparent; }
body[data-chrome]:not([hidden]) .side-divider { border-top-color: var(--bc-rail-line); margin: 12px 16px 2px; }
body[data-chrome]:not([hidden]) .conv-del { color: var(--bc-rail-muted); }
body[data-chrome]:not([hidden]) .conv-del:hover { background: var(--bc-del-hover); color: var(--bc-rail-text); }
body[data-chrome]:not([hidden]) .sidebar-foot { margin-top: 0; border-top: 1px solid var(--bc-rail-line); }
body[data-chrome]:not([hidden]) .user-name {
  font-size: 13px;
  line-height: 20px;
  font-weight: 500;
  color: var(--bc-rail-text);
}
body[data-chrome]:not([hidden]) .logout-btn { color: var(--bc-rail-muted); }
body[data-chrome]:not([hidden]) .logout-btn:hover { background: var(--bc-rail-hover); color: var(--bc-rail-text); }
body[data-chrome]:not([hidden]) .bstat-dot { box-shadow: 0 0 0 1px var(--bc-rail-line); }

/* Decorative wave: static and in flow. It is a flex item below the nav that shrinks
   to nothing when the nav needs the room, so it never sits behind text. */
body[data-chrome]:not([hidden]) .sidebar-wave {
  flex: 0 100 160px;
  min-height: 0;
  width: 100%;
  margin-top: auto;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 30%, #000 70%, transparent 100%);
  mask-image: linear-gradient(180deg, transparent 0%, #000 30%, #000 70%, transparent 100%);
}
/* Lists and sub-links get the room first: the wave collapses before they do. */
body[data-chrome]:not([hidden]) .sidebar .conv-list { flex: 1 1 auto; min-height: 0; }
body[data-chrome]:not([hidden]) .app.sidebar-collapsed .conv-del-form { display: none; }
body[data-chrome]:not([hidden]) .app.sidebar-collapsed .conv-list { padding: 4px 8px; }
body[data-chrome]:not([hidden]) .app.sidebar-collapsed .side-divider { margin: 12px 8px 2px; }
body[data-chrome]:not([hidden]) .app.sidebar-collapsed .sidebar-wave { display: none; }
body[data-chrome]:not([hidden]) .app.sidebar-collapsed .sidebar-foot { flex-direction: column; gap: 8px; }
body[data-chrome]:not([hidden]) .app.sidebar-collapsed .new-chat-btn { padding: 10px 0; }

/* Short windows: the decorative wave would crowd the nav, so drop it first. */
@media (max-height: 780px) {
  body[data-chrome]:not([hidden]) .sidebar-wave { display: none; }
}

/* ---- 3. Sidebar rows and sub-links ---- */
/* Pages outside chat (Lineage, Data Quality) have no global border-box reset, so the
   44px minimum would otherwise grow by its padding. */
body[data-chrome]:not([hidden]) .sidebar :is(.conv-item, .new-chat-btn, .lineage-sub a, .dq-sub a, .logout-btn),
body[data-chrome]:not([hidden]) :is(.ufs-menubar, .ufs-menu-btn, .ufs-drawer-close) { box-sizing: border-box; }
body[data-chrome]:not([hidden]) .conv-item { min-height: 44px; padding: 10px 12px; }
body[data-chrome]:not([hidden]) .sidebar :is(.lineage-sub, .dq-sub) { gap: 4px; margin: 0 0 8px 17px; padding-left: 12px; border-left-color: var(--bc-rail-line); }
body[data-chrome]:not([hidden]) .sidebar :is(.lineage-sub, .dq-sub) a {
  display: flex; align-items: center; min-height: 44px; padding: 10px 12px;
  border-radius: 8px; font-size: 14px; line-height: 20px; color: var(--bc-rail-muted);
}
body[data-chrome]:not([hidden]) .sidebar :is(.lineage-sub, .dq-sub) a:hover { background: var(--bc-rail-hover); color: var(--bc-rail-text); }
body[data-chrome]:not([hidden]) .sidebar :is(.lineage-sub, .dq-sub) a.active {
  background: var(--bc-rail-active); color: var(--bc-rail-text); font-weight: 600;
  box-shadow: inset 0 0 0 1px var(--bc-rail-active-line);
}

/* ---- 4. Cards and fields ---- */
body[data-chrome]:not([hidden]) :is(.card, .msg-block, .suggestion-card, .thinking-block, .export-card, .libcard, .block, .tile, .kpi, .dd-stat-card, .dd-total) {
  box-shadow: none;
  border-radius: 10px;
}
body[data-chrome]:not([hidden]) :is(.card, .msg-block, .suggestion-card, .libcard, .block, .tile, .kpi) {
  border: 1px solid var(--bc-line);
}
body[data-chrome]:not([hidden]) :is(input[type="search"], input[type="text"], input[type="email"], input[type="url"], input[type="number"], input:not([type]), select, textarea):not(.composer textarea, :is(svg, i) + input, :is(.input, .search-field, .check-search, .br-search, .br-tsearch) > input) {
  border: 1px solid var(--bc-line-strong);
}
/* Search fields (an icon followed by the input, inside a wrapper): the wrapper owns the single 1px boundary and the
   focus ring, the input inside is bare, so no inner rectangle shows (round 2, F5). Plain inputs keep their border. */
body[data-chrome]:not([hidden]) :is(.input, .search-field, .check-search, .br-search, .br-tsearch) > input,
body[data-chrome]:not([hidden]) :is(.input, .search-field, .check-search, .br-search, .br-tsearch) > input:focus,
body[data-chrome]:not([hidden]) :is(svg, i) + input:is([type="search"], [type="text"], :not([type])),
body[data-chrome]:not([hidden]) :is(svg, i) + input:is([type="search"], [type="text"], :not([type])):focus {
  border: 0; outline: 0; box-shadow: none; background: transparent; appearance: none;
}
body[data-chrome]:not([hidden]) :has(> :is(svg, i) + input:is([type="search"], [type="text"], :not([type]))) { border-color: var(--bc-line-strong); }
body[data-chrome]:not([hidden]) :has(> :is(svg, i) + input:is([type="search"], [type="text"], :not([type]))):focus-within { outline: 2px solid var(--bc-accent); outline-offset: 3px; }

/* ---- 5. Phone navigation (below 760px) ---- */
/* The menu bar, overlay and drawer close button exist only in the UFS branch of
   chat/_sidebar.html. Above 760px they are hidden and the sidebar is unchanged. */
body[data-chrome]:not([hidden]) .ufs-menubar,
body[data-chrome]:not([hidden]) .ufs-drawer-overlay,
body[data-chrome]:not([hidden]) .ufs-drawer-close { display: none; }

@media (max-width: 760px) {
  body[data-chrome]:not([hidden]) .app,
  body[data-chrome]:not([hidden]) .app.sidebar-collapsed {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto minmax(0, 1fr);
    height: 100vh;
    height: 100dvh;
  }
  /* Whatever follows the menu bar fills the second row and scrolls itself. */
  body[data-chrome]:not([hidden]) .app > :not(.ufs-menubar):not(.ufs-drawer-overlay):not(.sidebar) {
    min-height: 0;
    height: auto;
    overflow: auto;
  }
  body[data-chrome]:not([hidden]) .app > .chat { overflow: hidden; }
  body[data-chrome]:not([hidden]) .ufs-menubar {
    display: flex; align-items: center; gap: 12px;
    box-sizing: border-box; height: 56px; padding: 6px 12px;
    background: var(--bc-surface); border-bottom: 1px solid var(--bc-line);
  }
  body[data-chrome]:not([hidden]) .ufs-menu-btn {
    display: inline-flex; align-items: center; gap: 8px;
    min-height: 44px; padding: 10px 14px;
    background: var(--bc-surface); color: var(--bc-ink); border: 1px solid var(--bc-line-strong); border-radius: 8px;
    font: 600 14px/20px var(--font); cursor: pointer;
  }
  body[data-chrome]:not([hidden]) .ufs-menu-btn i,
  body[data-chrome]:not([hidden]) .ufs-menu-btn svg { width: 20px; height: 20px; }
  body[data-chrome]:not([hidden]) .ufs-menu-btn:hover { background: var(--bc-hover); }
  body[data-chrome]:not([hidden]) .ufs-menubar-brand {
    font: 600 16px/24px var(--font-display); letter-spacing: -0.02em; color: var(--bc-ink);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }

  /* The sidebar becomes an off-canvas drawer. */
  body[data-chrome]:not([hidden]) .sidebar {
    display: flex;
    position: fixed; top: 0; bottom: 0; left: 0; z-index: 1001;
    width: min(300px, 86vw);
    transform: translateX(-100%);
    visibility: hidden;
    transition: transform var(--t-slow) var(--ease), visibility 0s linear var(--t-slow);
    overflow-y: auto;
  }
  body[data-chrome]:not([hidden]) .app.nav-open .sidebar {
    transform: none;
    visibility: visible;
    transition: transform var(--t-slow) var(--ease), visibility 0s;
  }
  body[data-chrome]:not([hidden]) .app.nav-open .ufs-drawer-overlay {
    display: block;
    position: fixed; inset: 0; z-index: 1000;
    background: var(--bc-overlay);
  }
  body[data-chrome]:not([hidden]) .ufs-drawer-overlay[hidden] { display: none; }
  /* The 64px collapse rail does not apply inside the drawer. */
  body[data-chrome]:not([hidden]) .sidebar-toggle { display: none; }
  body[data-chrome]:not([hidden]) .ufs-drawer-close {
    display: inline-flex; align-items: center; justify-content: center;
    width: 44px; height: 44px; flex: 0 0 44px;
    background: transparent; color: var(--bc-rail-text); border: 0; border-radius: 8px; cursor: pointer;
  }
  body[data-chrome]:not([hidden]) .ufs-drawer-close:hover { background: var(--bc-rail-hover); }
  body[data-chrome]:not([hidden]) .ufs-drawer-close i,
  body[data-chrome]:not([hidden]) .ufs-drawer-close svg { width: 20px; height: 20px; }
}

/* ---- 6. Motion preferences ---- */
@media (prefers-reduced-motion: reduce) {
  body[data-chrome]:not([hidden]) {
    --t-fast: 0ms;
    --t-base: 0ms;
    --t-slow: 0ms;
    --t-count: 0ms;
  }

  body[data-chrome]:not([hidden]) *,
  body[data-chrome]:not([hidden]) *::before,
  body[data-chrome]:not([hidden]) *::after {
    transition-duration: 0ms !important;
    animation-duration: 0ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
  }
}

/* ---- 7. Round 2 sidebar: pinned footer, rail with hover overlay, user menu, embedded chat ---- */
/* The navigation scrolls; the user card never does. Desktop only: the phone drawer has its own layout. */
@media (min-width: 761px) {
  body[data-chrome]:not([hidden]) .app { grid-template-rows: minmax(0, 1fr); }
  body[data-chrome]:not([hidden]) .sidebar {
    /* Sticky at the viewport height: right whether the app grid is 100vh (chat, Pulse) or the document scrolls (Browse v2). */
    position: sticky; top: 0; align-self: start; min-height: 0; height: 100vh; height: 100dvh; z-index: 40;
    transition: width 240ms cubic-bezier(0.2, 0.8, 0.3, 1), box-shadow 240ms cubic-bezier(0.2, 0.8, 0.3, 1);
  }
  /* Hover expansion: the grid keeps the 64px rail column, the sidebar overlays the content at full width. */
  body[data-chrome]:not([hidden]) .app.sidebar-peek { grid-template-columns: var(--bc-rail-collapsed) minmax(0, 1fr); }
  body[data-chrome]:not([hidden]) .app.sidebar-peek .sidebar { width: var(--bc-rail-width); box-shadow: var(--bc-shadow-peek); }
  body[data-chrome]:not([hidden]) .sidebar-head { overflow: hidden; }
}
body[data-chrome]:not([hidden]) .sidebar-head, body[data-chrome]:not([hidden]) .new-chat-form { flex: 0 0 auto; }
body[data-chrome]:not([hidden]) .sidebar-scroll {
  flex: 1 1 auto; min-height: 0;
  display: flex; flex-direction: column;
  overflow-x: hidden; overflow-y: auto;
  scrollbar-width: thin; scrollbar-color: var(--bc-rail-line) transparent;
}
body[data-chrome]:not([hidden]) .sidebar-scroll > * { flex-shrink: 0; }
body[data-chrome]:not([hidden]) .sidebar-scroll > .sidebar-wave { flex: 0 100 160px; min-height: 0; }
body[data-chrome]:not([hidden]) .sidebar-scroll .conv-list { flex: 0 0 auto; overflow: visible; }
body[data-chrome]:not([hidden]) .sidebar-scroll .workspace-nav { display: flex; flex-direction: column; }
body[data-chrome]:not([hidden]) .app.sidebar-collapsed .sidebar-scroll { scrollbar-width: none; }
body[data-chrome]:not([hidden]) .app.sidebar-collapsed .sidebar-scroll::-webkit-scrollbar { display: none; }

/* Pin control: 32px, two stacked icons switched by aria-pressed. Hidden in the rail. */
body[data-chrome]:not([hidden]) .sidebar-toggle { width: 32px; height: 32px; padding: 0; flex: 0 0 32px; }
body[data-chrome]:not([hidden]) .sidebar-toggle svg { width: 16px; height: 16px; }
body[data-chrome]:not([hidden]) .sidebar-toggle .pin-icon-off { display: none; }
body[data-chrome]:not([hidden]) .sidebar-toggle[aria-pressed="true"] .pin-icon-on { display: none; }
body[data-chrome]:not([hidden]) .sidebar-toggle[aria-pressed="true"] .pin-icon-off { display: inline; }
body[data-chrome]:not([hidden]) .app.sidebar-collapsed .sidebar-toggle { display: none; }

/* Rail: module buttons are 44px squares centred in the 64px rail. */
body[data-chrome]:not([hidden]) .app.sidebar-collapsed .sidebar .conv-item { width: 44px; min-height: 44px; padding: 10px; margin-left: auto; margin-right: auto; box-sizing: border-box; }
body[data-chrome]:not([hidden]) .app.sidebar-collapsed .workspace-nav { padding: 0 8px; }

/* Lineage and Data Quality sub-links (base rows; the minimised disclosure in section 8 restyles them). */
body[data-chrome]:not([hidden]) .sidebar :is(.lineage-sub, .dq-sub) a { min-height: 40px; display: flex; align-items: center; gap: 12px; box-sizing: border-box; }

/* Footer: the whole card is the user menu trigger. */
body[data-chrome]:not([hidden]) .sidebar-foot { flex: 0 0 72px; height: 72px; min-height: 72px; padding: 0; position: relative; box-sizing: border-box; }
body[data-chrome]:not([hidden]) .user-btn {
  display: flex; align-items: center; gap: 12px;
  width: 100%; height: 100%; padding: 16px; margin: 0;
  background: transparent; border: 0; border-radius: 0; box-sizing: border-box;
  color: var(--bc-rail-text); font: inherit; text-align: left; cursor: pointer;
}
body[data-chrome]:not([hidden]) .user-btn:hover, body[data-chrome]:not([hidden]) .user-btn[aria-expanded="true"] { background: var(--bc-rail-hover); }
body[data-chrome]:not([hidden]) .user-btn:focus-visible { outline-offset: -3px; }
body[data-chrome]:not([hidden]) .user-btn .user-caret { width: 16px; height: 16px; flex: 0 0 16px; margin-left: auto; color: var(--bc-rail-muted); }
body[data-chrome]:not([hidden]) .app.sidebar-collapsed .user-btn { justify-content: center; padding: 16px 12px; }
body[data-chrome]:not([hidden]) .app.sidebar-collapsed .user-btn .user-caret { display: none; }
body[data-chrome]:not([hidden]) .app.sidebar-collapsed .sidebar-foot { flex-direction: row; padding: 0; }

/* User menu popover, above the card. */
body[data-chrome]:not([hidden]) .ufs-usermenu {
  position: absolute; left: 12px; bottom: calc(100% + 8px); z-index: 5;
  width: 244px; max-width: calc(100vw - 16px); box-sizing: border-box;
  padding: 8px; background: var(--bc-surface); border: 1px solid var(--bc-line); border-radius: 10px;
  max-height: calc(100vh - 96px); overflow-y: auto;
  box-shadow: var(--bc-shadow-menu);
}
body[data-chrome]:not([hidden]) .ufs-usermenu[hidden] { display: none; }
body[data-chrome]:not([hidden]) .ufs-usermenu form { margin: 0; }
body[data-chrome]:not([hidden]) .ufs-usermenu-item {
  display: flex; align-items: center; gap: 8px;
  width: 100%; min-height: 44px; padding: 8px 12px; margin: 0; box-sizing: border-box;
  background: transparent; border: 0; border-radius: 8px;
  font: 400 13px/20px var(--font); color: var(--bc-ink); text-decoration: none; text-align: left; cursor: pointer;
}
body[data-chrome]:not([hidden]) .ufs-usermenu-item svg { width: 16px; height: 16px; flex: 0 0 16px; }
body[data-chrome]:not([hidden]) .ufs-usermenu-item:hover, body[data-chrome]:not([hidden]) .ufs-usermenu-item:focus { background: var(--bc-hover); }
body[data-chrome]:not([hidden]) .ufs-usermenu-item[aria-current="page"], body[data-chrome]:not([hidden]) .ufs-usermenu-item.active { background: var(--bc-accent-soft); font-weight: 600; }
body[data-chrome]:not([hidden]) .ufs-usermenu-item:focus-visible { outline: 2px solid var(--bc-accent); outline-offset: 3px; }
body[data-chrome]:not([hidden]) .ufs-usermenu-sep { height: 1px; margin: 4px 8px; background: var(--bc-hairline); }
body[data-chrome]:not([hidden]) .ufs-usermenu-sep[hidden] { display: none; }

/* Embedded in the Pulse "Ask Pulse" iframe (html.ufs-embedded, set before first paint): no sidebar, no Menu button. */
html.ufs-embedded body[data-chrome]:not([hidden]) :is(.sidebar, .ufs-menubar, .ufs-drawer-overlay) { display: none !important; }
html.ufs-embedded body[data-chrome]:not([hidden]) .app,
html.ufs-embedded body[data-chrome]:not([hidden]) .app.sidebar-collapsed,
html.ufs-embedded body[data-chrome]:not([hidden]) .app.sidebar-peek { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); }

/* Phone: when the document scrolls (Browse v2) the Menu bar stays reachable. */
@media (max-width: 760px) {
  body[data-chrome]:not([hidden]) .ufs-menubar { position: sticky; top: 0; z-index: 30; }
}

/* Document-scroll pages (Browse v2 sets body[data-lin-doc-scroll]): the page owns the scroll; the sidebar above is
   sticky at the viewport height with its footer pinned, so nothing else is needed but a free-height shell. */
body[data-chrome]:not([hidden])[data-lin-doc-scroll] .app { height: auto; min-height: 100vh; overflow: visible; }

/* ---- 8. Minimised module navigation (round 3, F2) ---- */
/* The active module is a disclosure (chat/_sidebar.html script): a trigger row that always shows the current
   destination, and a small menu overlaid beneath it. Collapsed 64px rail: the active tile shows its icon and the
   destination under it, and the separate Home and Browse tiles no longer exist. */
body[data-chrome]:not([hidden]) .side-mod { margin-bottom: 4px; }
body[data-chrome]:not([hidden]) .side-mod > .side-mod-trigger.conv-item {
  width: 100%; margin-bottom: 0; border: 0; text-align: left; cursor: pointer;
  font-family: var(--font); font-size: 14px; line-height: 20px; font-weight: 500; color: var(--bc-rail-text);
}
body[data-chrome]:not([hidden]) .side-mod > .side-mod-trigger.conv-item.active { background: var(--bc-rail-active); color: var(--bc-rail-text); }
body[data-chrome]:not([hidden]) .side-mod > .side-mod-trigger.conv-item:hover { background: var(--bc-rail-hover); }
body[data-chrome]:not([hidden]) .side-mod > .side-mod-trigger.conv-item.active:hover, body[data-chrome]:not([hidden]) .side-mod.is-open > .side-mod-trigger.conv-item.active { background: var(--bc-rail-active); }
body[data-chrome]:not([hidden]) .side-mod-dest { font-size: 12px; line-height: 18px; font-weight: 400; color: var(--bc-rail-muted); }
body[data-chrome]:not([hidden]) .side-mod-trigger.active .side-mod-dest { color: var(--bc-rail-muted); opacity: 1; }
body[data-chrome]:not([hidden]) .side-mod-chev { width: 16px; height: 16px; flex: 0 0 16px; color: var(--bc-rail-muted); transition: transform var(--t-base) var(--ease); }
body[data-chrome]:not([hidden]) .sidebar .side-mod [data-side-menu] {
  left: 4px; width: 228px; max-width: calc(100% - 4px); margin: 0; padding: 4px; gap: 0;
  background: var(--bc-rail-raised); border: 1px solid var(--bc-rail-line); border-radius: 8px;
  box-shadow: var(--bc-shadow-flyout);
}
body[data-chrome]:not([hidden]) .sidebar .side-mod [data-side-menu] a {
  min-height: 44px; padding: 10px 12px; justify-content: space-between;
  font-size: 13px; line-height: 20px; font-weight: 400; color: var(--bc-rail-muted); border-radius: 6px;
}
body[data-chrome]:not([hidden]) .sidebar .side-mod [data-side-menu] a:hover { background: var(--bc-rail-hover); color: var(--bc-rail-text); }
body[data-chrome]:not([hidden]) .sidebar .side-mod [data-side-menu] a.active {
  background: var(--bc-rail-active); color: var(--bc-rail-text); font-weight: 500; box-shadow: none;
}
body[data-chrome]:not([hidden]) .sidebar .side-mod [data-side-menu] a:focus-visible { outline: 2px solid var(--bc-rail-ring); outline-offset: -2px; }
body[data-chrome]:not([hidden]) .sidebar .side-mod > .side-mod-trigger:focus-visible { outline: 2px solid var(--bc-rail-ring); outline-offset: 2px; }
body[data-chrome]:not([hidden]) .side-mod .sub-check { width: 16px; height: 16px; flex: 0 0 16px; color: var(--bc-rail-text); }

body[data-chrome]:not([hidden]) .app.sidebar-collapsed .side-mod { margin-bottom: 4px; }
body[data-chrome]:not([hidden]) .app.sidebar-collapsed .sidebar .side-mod > .side-mod-trigger.conv-item {
  width: 44px; height: 44px; min-height: 44px; margin: 0 auto; padding: 10px;
  justify-content: center; align-items: center; gap: 0;
  background: var(--bc-rail-active); box-shadow: inset 0 0 0 1px var(--bc-rail-active-line); border-radius: 8px;
}
body[data-chrome]:not([hidden]) .app.sidebar-collapsed .side-mod-dest { display: none; }
body[data-chrome]:not([hidden]) .app.sidebar-collapsed .side-mod-chev { display: none; }
body[data-chrome]:not([hidden]) .app.sidebar-collapsed .sidebar .side-mod [data-side-menu] { display: none; }

@media (prefers-reduced-motion: reduce) {
  body[data-chrome]:not([hidden]) .side-mod-chev { transition: none; }
}
