/*
 * BundleBuddy app styles.
 * Oat UI provides base component styles; we add layout and overrides here.
 */

/* Near-black actions and one blue accent. Oat’s default primary is a warm brown. */
:root {
  --primary: light-dark(#09090b, #fafafa);
  --primary-foreground: light-dark(#fafafa, #18181b);
  --secondary-foreground: light-dark(#09090b, #fafafa);
  /* Oat’s faint text goes darker in dark mode (#71717a), which sinks into the
     near-black background. Keep secondary copy light in both themes. */
  --muted-foreground: light-dark(#71717a, #d4d4d8);
  --faint-foreground: light-dark(#a1a1aa, #d4d4d8);
  --bb-accent: #2563eb;
  --radius-medium: 0.5rem;
}
/* An explicit choice overrides Oat's `color-scheme: light dark`. */
:root[data-theme="light"] {
  color-scheme: light;
}
:root[data-theme="dark"] {
  color-scheme: dark;
}

/*
 * Page canvas: the marketing glow plus a light grain, fixed to the viewport
 * so long pages and in-app navigation keep the same backdrop.
 * html holds the solid color; body stays transparent so the layers (painted
 * behind the UI) stay visible. Sidebar and top nav are see-through on desktop
 * so the canvas reads as one surface. Cards keep their own background.
 */
:root {
  --bb-glow: color-mix(in srgb, var(--bb-accent) 16%, transparent);
  --bb-glow-size: 80vw 50dvh;
  --bb-glow-at: 50% -10dvh;
  --bb-glow-fade: transparent;
  --bb-grain-opacity: 0.32;
}
/* The same 16% tint disappears on the near-black background. Dark keeps the
   light-mode ellipse and only raises the wash and grain so both stay visible. */
:root[data-theme="dark"] {
  --bb-glow: color-mix(in srgb, var(--bb-accent) 42%, transparent);
  --bb-grain-opacity: 0.62;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bb-glow: color-mix(in srgb, var(--bb-accent) 42%, transparent);
    --bb-grain-opacity: 0.62;
  }
}
html {
  background-color: var(--background);
}
body {
  background-color: transparent;
}
body::before,
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}
body::before {
  background: radial-gradient(
    ellipse var(--bb-glow-size) at var(--bb-glow-at),
    var(--bb-glow),
    var(--bb-glow-fade)
  );
}
body::after {
  opacity: var(--bb-grain-opacity);
  background-image: url("data:image/png;base64,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");
  background-repeat: repeat;
  background-size: 128px 128px;
}
[data-sidebar-layout] > aside[data-sidebar],
nav[data-topnav] {
  background-color: transparent;
}
/* Same bar metrics as the marketing header: one row, vertically centered. */
nav[data-topnav] {
  flex-wrap: nowrap;
  align-items: center;
  min-height: 3.25rem;
  box-sizing: border-box;
}
@media (max-width: 768px) {
  [data-sidebar-layout] > aside[data-sidebar] {
    background-color: color-mix(in srgb, var(--background) 92%, transparent);
    backdrop-filter: blur(10px);
  }
}

/*
 * Oat paints buttons on `button` and `a.button` only. App actions use
 * `a.button` / `a.outline` / `a.ghost`, which otherwise stay underlined links.
 * `.small` is only for dense row actions.
 */
a.button,
a.small,
a.outline,
a.ghost:not([role="menuitem"]),
.marketing-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  padding: 0.55rem 1rem;
  border-radius: var(--radius-medium);
  background-color: var(--primary);
  color: var(--primary-foreground);
  text-decoration: none;
  font-size: var(--text-6, 0.875rem);
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  border: 1px solid transparent;
}
a.small,
a.outline.small,
a.ghost.small {
  padding: var(--space-1) var(--space-3);
  font-size: var(--text-7);
}
a.outline,
a.ghost:not([role="menuitem"]),
.marketing-btn--outline {
  background-color: transparent;
  color: var(--foreground);
}
a.outline,
.marketing-btn--outline {
  border-color: var(--border);
}
/* Ghost's selector is more specific than `a.outline`, so restore the border when both are set. */
a.outline.ghost {
  border-color: var(--border);
}
a.ghost:not(.outline) {
  border-color: transparent;
}
a.small:hover,
a.outline:hover,
a.ghost:not([role="menuitem"]):hover,
.marketing-btn:hover {
  text-decoration: none;
}
a.small:not(.outline):not(.ghost):hover,
.marketing-btn:not(.marketing-btn--outline):hover {
  background-color: color-mix(in srgb, var(--primary), white 14%);
  color: var(--primary-foreground);
}
a.outline:hover,
a.ghost:not([role="menuitem"]):hover,
.marketing-btn--outline:hover {
  background-color: var(--accent);
  color: var(--foreground);
}

/* Hide Turbo's default progress bar — it can shift layout; we use a fixed overlay + brand spinner. */
.turbo-progress-bar {
  display: none !important;
}

/* Oat (and some nav libs) paint a loading bar/spinner via html::before — hide it so it
   doesn't fight our custom progress UI or shove the page. */
html::before,
html:before,
html[aria-busy="true"]::before,
html[aria-busy="true"]:before {
  content: none !important;
  display: none !important;
  animation: none !important;
}

/* Full-width fixed overlay progress (no document flow impact). */
.app-progress {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 1000;
  height: 2px;
  pointer-events: none;
  overflow: hidden;
  background: transparent;
}
.app-progress-indeterminate {
  height: 100%;
  width: 40%;
  background: var(--foreground, #0f172a);
  border-radius: 0 1px 1px 0;
  animation: app-progress-slide 1s ease-in-out infinite;
}
[data-theme="dark"] .app-progress-indeterminate {
  background: var(--foreground, #f1f5f9);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .app-progress-indeterminate {
    background: var(--foreground, #f1f5f9);
  }
}
@keyframes app-progress-slide {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(350%); }
}

/* Brand-adjacent spinner in the top nav. */
.nav-brand-group {
  min-width: 0;
}
.nav-brand-spinner-slot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 0.85rem;
  height: 0.85rem;
  flex-shrink: 0;
}
.nav-brand-spinner {
  width: 0.85rem;
  height: 0.85rem;
  border: 2px solid color-mix(in srgb, var(--foreground) 20%, transparent);
  border-top-color: var(--foreground);
  border-radius: 50%;
  animation: nav-brand-spin 0.7s linear infinite;
}
@keyframes nav-brand-spin {
  to { transform: rotate(360deg); }
}

/* Three-line menu control. Hidden on desktop, where the sidebar or marketing links are already on screen. */
.menu-toggle {
  display: none;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  padding: 0;
  flex-shrink: 0;
  border: 0;
  background: transparent;
  color: var(--muted-foreground);
  box-shadow: none;
}
.menu-toggle:hover {
  color: var(--foreground);
  background: transparent;
}
.menu-icon {
  display: block;
}
[data-topnav] .nav-user-block {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: var(--space-2);
  margin-inline-start: auto;
  min-width: 0;
}
[data-topnav] .nav-user-block form {
  display: flex;
  align-items: center;
  margin: 0;
  flex-shrink: 0;
}
[data-topnav] .nav-user-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.theme-switch {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  padding: 0;
}
.theme-switch svg {
  display: block;
}
.theme-switch .theme-switch-sun {
  display: none;
}
:root[data-theme="dark"] .theme-switch .theme-switch-moon {
  display: none;
}
:root[data-theme="dark"] .theme-switch .theme-switch-sun {
  display: block;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .theme-switch .theme-switch-moon {
    display: none;
  }
  :root:not([data-theme="light"]) .theme-switch .theme-switch-sun {
    display: block;
  }
}
.sidebar-account {
  display: none;
}
.sidebar-account-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  width: 100%;
}
.sidebar-account-name {
  margin: 0;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted-foreground);
  font-size: var(--text-7);
}
@media (max-width: 768px) {
  .menu-toggle {
    display: inline-flex;
  }
  [data-topnav] .nav-user-block {
    display: none;
  }
  .sidebar-account {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-2);
  }
  [data-sidebar] footer form.sidebar-account {
    display: flex;
    width: 100%;
  }
}

/* Signed-in: main content spacing.
   min-width: 0 lets a wide table scroll inside the column instead of
   stretching the sidebar layout past the viewport. */
[data-sidebar-layout] main.container {
  min-width: 0;
  padding-block: var(--space-6);
  padding-inline: var(--container-pad);
}
.table-scroll {
  overflow-x: auto;
  max-width: 100%;
  /* Paint containment keeps the table from leaking a second page scrollbar
     inside the signed-in layout, where main already scrolls. */
  contain: paint;
}
.card {
  min-width: 0;
  max-width: 100%;
}

/* Sidebar: no extra inset on the top-level nav list (aligns with footer);
   only nest project links. */
[data-sidebar] nav > ul {
  margin-inline-start: 0;
  padding-inline-start: 0;
}
[data-sidebar] nav ul ul {
  padding-inline-start: var(--space-4);
}
[data-sidebar] nav ul ul ul {
  padding-inline-start: var(--space-4);
}
[data-sidebar] nav .sidebar-empty {
  display: block;
  padding-block: var(--space-2);
  font-size: var(--text-7);
}

/* Sidebar footer: Organizations Oat dropdown + Sign out */
[data-sidebar] footer {
  padding-block-end: var(--space-4);
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
[data-sidebar] footer .sidebar-orgs {
  display: block;
  width: 100%;
}
[data-sidebar] footer .sidebar-orgs > button {
  width: 100%;
  justify-content: space-between;
  min-width: 0;
}
[data-sidebar] footer .sidebar-orgs > button .sidebar-orgs-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}
[data-sidebar] footer .sidebar-orgs > button svg {
  flex-shrink: 0;
}
[data-sidebar] footer .sidebar-orgs menu[popover] {
  min-width: 12rem;
  padding: var(--space-2);
}
[data-sidebar] footer .sidebar-orgs menu[popover] [role="menuitem"] {
  display: flex;
  width: 100%;
  box-sizing: border-box;
  padding: var(--space-2) var(--space-3);
  font-size: var(--text-6);
  justify-content: flex-start;
  text-decoration: none;
}
/* Oat paints every focused menu item like a selection. Opening this menu
   focuses the first item, so "All organizations" looked selected on every page. */
[data-sidebar] footer .sidebar-orgs menu[popover] [role="menuitem"]:focus {
  background-color: transparent;
}
[data-sidebar] footer .sidebar-orgs menu[popover] [role="menuitem"]:hover {
  background-color: var(--accent);
}
[data-sidebar] footer .sidebar-orgs menu[popover] [role="menuitem"]:focus-visible {
  outline: 2px solid var(--foreground);
  outline-offset: -2px;
}
[data-sidebar] footer .sidebar-orgs menu[popover] [role="menuitem"][aria-current] {
  background-color: var(--accent);
  font-weight: 600;
}

/* Sidebar footer sign-out: full-width button */
[data-sidebar] footer form {
  width: 100%;
  margin: 0;
}
[data-sidebar] footer form button {
  width: 100%;
  justify-content: start;
}

/* Dashboard: project cards grid */
.dashboard-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: var(--space-4);
}
.project-card-title {
  margin: 0;
  font-size: var(--text-5);
}
.project-card-title a {
  text-decoration: none;
  color: inherit;
}
.size-delta-up {
  color: var(--danger);
  font-weight: 600;
}
.size-delta-down {
  color: var(--success);
  font-weight: 600;
}
.size-delta-flat {
  color: var(--muted-foreground);
}
.diffstat {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  white-space: nowrap;
}
.diffstat-add {
  color: var(--success);
}
.diffstat-del {
  color: var(--danger);
}
.diffstat-bar {
  display: inline-flex;
  width: 4.5rem;
  height: 0.45rem;
  border-radius: 999px;
  overflow: hidden;
  background: var(--border);
}
.diffstat-bar-add,
.diffstat-bar-del {
  height: 100%;
}
.diffstat-bar-add {
  background: var(--success);
}
.diffstat-bar-del {
  background: var(--danger);
}
.package-change {
  border-top: 1px solid var(--border);
}
.package-change:last-child {
  border-bottom: 1px solid var(--border);
}
.package-change > summary {
  display: block;
  padding: var(--space-3) var(--space-4);
  cursor: pointer;
  list-style: none;
}
.package-change > summary::-webkit-details-marker {
  display: none;
}
.package-change > summary::marker {
  content: none;
  display: none;
}
.package-change-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  flex-wrap: wrap;
}
.package-change-label {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  min-width: 0;
}
.package-change-label::before {
  content: "";
  width: 0.4rem;
  height: 0.4rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(-45deg);
  flex: none;
}
.package-change[open] > summary .package-change-label::before {
  transform: rotate(45deg);
  margin-top: -0.15rem;
}
.package-change-body {
  /* Oat also adds a space-4 margin on every side. Keep the top gap, and
     drop the side margin so it does not stack with this padding. */
  margin: var(--space-4) 0 0;
  padding: 0 var(--space-4) var(--space-3);
}
/* Oat tooltips live inside the trigger, so neighboring rows cover them. */
[data-tooltip]::before,
[data-tooltip]::after {
  content: none;
  display: none;
}
.bb-tooltip {
  position: fixed;
  z-index: calc(var(--z-modal, 1000) + 20);
  margin: 0;
  padding: var(--space-2) var(--space-3);
  font-size: var(--text-7, 0.75rem);
  line-height: 1.3;
  white-space: nowrap;
  background: var(--foreground);
  color: var(--background);
  border-radius: var(--radius-medium, 6px);
  pointer-events: none;
}
.bb-tooltip[hidden] {
  display: none;
}
.bb-tooltip::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  border: 6px solid transparent;
}
.bb-tooltip[data-placement="top"]::after {
  top: 100%;
  border-top-color: var(--foreground);
}
.bb-tooltip[data-placement="bottom"]::after {
  bottom: 100%;
  border-bottom-color: var(--foreground);
}
.module-change-table {
  table-layout: fixed;
  width: 100%;
}
.module-change-table .module-change-size {
  width: 8.5rem;
}
.module-change-table th:last-child,
.module-change-table td:last-child {
  text-align: end;
}
.module-name {
  display: inline-flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.35rem 0.6rem;
  min-width: 0;
}
.module-path {
  word-break: break-all;
}
.module-package-link {
  color: var(--muted-foreground);
  font-size: var(--text-8, 0.75rem);
  white-space: nowrap;
}
.module-package-link:hover {
  color: var(--foreground);
}
.link-preview {
  position: fixed;
  z-index: calc(var(--z-modal, 1000) + 30);
  width: min(28rem, calc(100vw - 1rem));
  overflow: hidden;
  background: var(--background);
  color: var(--foreground);
  border: 1px solid var(--border);
  border-radius: var(--radius-large, 0.75rem);
  box-shadow: 0 16px 40px color-mix(in srgb, var(--foreground) 14%, transparent);
  pointer-events: auto;
  overscroll-behavior: contain;
  --link-preview-enter-y: -10px;
  transform-origin: center top;
}
.link-preview[data-placement="top"] {
  --link-preview-enter-y: 10px;
  transform-origin: center bottom;
}
.link-preview.is-entering {
  animation: link-preview-in 0.38s cubic-bezier(0.16, 1.15, 0.3, 1) both;
}
@keyframes link-preview-in {
  0% {
    opacity: 0;
    transform: translateY(var(--link-preview-enter-y)) scale(0.94);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
@media (prefers-reduced-motion: reduce), (update: slow) {
  .link-preview.is-entering {
    animation: none;
  }
  .link-preview-spinner {
    animation: none;
  }
}
.link-preview[hidden] {
  display: none;
}
.link-preview-host {
  margin: 0;
  padding: 0.4rem 0.75rem;
  overflow: hidden;
  border-bottom: 1px solid var(--border);
  color: var(--muted-foreground);
  font-size: var(--text-8, 0.75rem);
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.link-preview-stage {
  position: relative;
  background: var(--background);
}
.link-preview-stage[hidden] {
  display: none;
}
.link-preview-frame {
  display: block;
  width: 100%;
  height: 16.5rem;
  border: 0;
  background: #fff;
  opacity: 1;
  overscroll-behavior: contain;
}
.link-preview--page .link-preview-frame {
  height: 22rem;
}
.link-preview-frame.is-loading {
  opacity: 0;
}
.link-preview-frame[hidden],
.link-preview-card[hidden],
.link-preview-loading[hidden] {
  display: none;
}
.link-preview-loading {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--background);
}
.link-preview-spinner {
  width: 1.25rem;
  height: 1.25rem;
  border: 2px solid color-mix(in srgb, var(--foreground) 20%, transparent);
  border-top-color: var(--foreground);
  border-radius: 50%;
  animation: nav-brand-spin 0.7s linear infinite;
}
.link-preview-card {
  padding: 0.85rem 0.9rem 1rem;
  min-height: 7.5rem;
}
.link-preview-title {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  margin: 0;
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.3;
}
.link-preview-version {
  color: var(--muted-foreground);
  font-size: var(--text-8, 0.75rem);
  font-weight: 600;
}
.link-preview-desc {
  margin: 0.45rem 0 0;
  color: var(--muted-foreground);
  font-size: var(--text-7, 0.8125rem);
  line-height: 1.45;
}
.link-preview-downloads {
  margin: 0.7rem 0 0;
  font-size: var(--text-7, 0.8125rem);
  font-weight: 600;
}
.package-change-latest {
  display: inline-flex;
  align-items: center;
  padding: 0.05rem 0.45rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--bb-accent, var(--success)) 16%, transparent);
  color: var(--bb-accent, var(--foreground));
  font-size: var(--text-8, 0.75rem);
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.02em;
}

/* Pricing / billing plan cards: stack on small screens, 3 columns on desktop */
.pricing-interval-bar {
  display: flex;
  justify-content: center;
  margin-block-end: var(--space-6);
}
.pricing-interval {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.15rem;
  padding: 0.2rem;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: color-mix(in srgb, var(--foreground) 4%, var(--background));
}
.pricing-interval-thumb {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  border-radius: 999px;
  background: var(--primary);
  pointer-events: none;
  opacity: 0;
  transition: transform 240ms cubic-bezier(0.2, 0.8, 0.2, 1), width 240ms cubic-bezier(0.2, 0.8, 0.2, 1), height 240ms cubic-bezier(0.2, 0.8, 0.2, 1), opacity 160ms ease;
}
.pricing-interval.is-ready .pricing-interval-thumb {
  opacity: 1;
}
.pricing-interval-option {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin: 0;
  padding: 0.4rem 0.85rem;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--foreground);
  font: inherit;
  font-size: var(--text-6, 0.875rem);
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  transition: color 180ms ease, background-color 180ms ease;
}
.pricing-interval-option[aria-checked="true"] {
  background: var(--primary);
  color: var(--primary-foreground);
}
.pricing-interval.is-ready .pricing-interval-option[aria-checked="true"] {
  background: transparent;
}
.pricing-interval-option:focus-visible {
  outline: 2px solid var(--bb-accent);
  outline-offset: 2px;
}
.pricing-interval-save {
  padding: 0.05rem 0.4rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--success) 18%, var(--background));
  color: var(--success);
  font-size: var(--text-8, 0.75rem);
  font-weight: 600;
  line-height: 1.4;
}
.pricing-plans[data-pricing-interval-interval-value="year"] .pricing-card-cta [data-price-interval="month"],
.pricing-plans[data-pricing-interval-interval-value="month"] .pricing-card-cta [data-price-interval="year"] {
  display: none;
}
.pricing-amount {
  position: relative;
  overflow: hidden;
}
.pricing-amount-sizer {
  visibility: hidden;
}
.pricing-amount-roll {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  transition: transform 380ms cubic-bezier(0.22, 1, 0.36, 1);
}
.pricing-amount-roll > * {
  flex-shrink: 0;
}
.pricing-plans[data-pricing-interval-interval-value="month"] .pricing-amount-roll {
  transform: translateY(-50%);
}
.pricing-caption {
  display: grid;
}
.pricing-caption > [data-price-interval] {
  grid-area: 1 / 1;
}
.pricing-plans[data-pricing-interval-interval-value="year"] .pricing-caption > [data-price-interval="month"],
.pricing-plans[data-pricing-interval-interval-value="month"] .pricing-caption > [data-price-interval="year"] {
  visibility: hidden;
}
@media (prefers-reduced-motion: reduce) {
  .pricing-interval-thumb,
  .pricing-interval-option,
  .pricing-amount-roll {
    transition: none;
  }
}
.pricing-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-4);
  align-items: stretch;
}
@media (min-width: 56rem) {
  .pricing-cards {
    grid-template-columns: repeat(3, 1fr);
  }
}
.pricing-card {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.pricing-card > h2 {
  margin-block-start: 0;
}
.pricing-card-cta {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-2);
  margin-block-start: auto;
  padding-block-start: var(--space-4);
}
.pricing-card-cta form {
  display: flex;
  margin: 0;
}
.pricing-card-cta form button,
.pricing-card-cta .marketing-btn {
  width: 100%;
}
.pricing-card-cta > .text-lighter {
  text-align: center;
}
.pricing-card--current {
  position: relative;
  border-color: var(--success);
  box-shadow: 0 0 0 1px var(--success);
}
.pricing-cards {
  padding-block-start: 0.7rem;
}
.pricing-card--recommended {
  position: relative;
  border-color: var(--bb-accent);
  box-shadow: 0 0 0 1px var(--bb-accent);
}
.pricing-badge {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  margin: 0;
  padding: 0.15rem 0.7rem;
  border-radius: 999px;
  background: var(--bb-accent);
  color: #fff;
  font-size: var(--text-8, 0.75rem);
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1.4;
  white-space: nowrap;
}
.pricing-badge--current {
  background: var(--success);
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.pricing-compare {
  margin-block-start: var(--space-8);
}
.pricing-compare > h2 {
  margin-block: 0 var(--space-4);
}
.pricing-compare-scroll {
  overflow-x: auto;
  /* Paint containment keeps the table from leaking a second page scrollbar
     inside the signed-in layout, where main already scrolls. */
  contain: paint;
  border: 1px solid var(--border);
  border-radius: var(--radius-medium);
  background: var(--background);
}
.pricing-compare-table {
  width: 100%;
  min-width: 40rem;
  border-collapse: separate;
  border-spacing: 0;
  font-size: var(--text-6, 0.875rem);
}
.pricing-compare-table th,
.pricing-compare-table td {
  padding: 0.7rem 0.85rem;
  border-bottom: 1px solid var(--border);
  text-align: center;
  vertical-align: middle;
  background: var(--background);
}
.pricing-compare-table > :last-child > tr:last-child > th,
.pricing-compare-table > :last-child > tr:last-child > td {
  border-bottom: 0;
}
.pricing-compare-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  padding-block: 0.9rem;
  background: color-mix(in srgb, var(--foreground) 4%, var(--background));
}
.pricing-compare-table tbody th[scope="row"],
.pricing-compare-table thead th:first-child {
  position: sticky;
  left: 0;
  z-index: 1;
  min-width: 11rem;
  text-align: left;
  font-weight: 500;
}
.pricing-compare-table thead th:first-child {
  z-index: 3;
}
.pricing-compare-plan,
.pricing-compare-price,
.pricing-compare-price-note {
  display: block;
}
.pricing-compare-plan {
  font-weight: 600;
}
.pricing-compare-price {
  margin-block-start: 0.15rem;
  font-weight: 600;
}
.pricing-compare-price.pricing-amount {
  display: grid;
}
.pricing-compare-price-note {
  margin-block-start: 0.1rem;
  color: var(--muted-foreground);
  font-size: var(--text-8, 0.75rem);
  font-weight: 400;
}
.pricing-compare-current {
  display: inline-block;
  margin-block-start: 0.35rem;
  padding: 0.05rem 0.45rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--success) 18%, var(--background));
  color: var(--success);
  font-size: var(--text-8, 0.75rem);
  font-weight: 600;
  white-space: nowrap;
}
.pricing-compare-table thead th:last-child,
.pricing-compare-table tbody td:last-child {
  background: color-mix(in srgb, var(--bb-accent) 8%, var(--background));
}
.pricing-compare-table thead th:last-child {
  box-shadow: inset 0 2px 0 var(--bb-accent);
}
.pricing-compare-group th {
  position: sticky;
  left: 0;
  padding-block: 0.45rem;
  text-align: left;
  font-size: var(--text-8, 0.75rem);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted-foreground);
  background: color-mix(in srgb, var(--foreground) 3%, var(--background));
}
.pricing-compare-table td:has(.pricing-compare-mark) {
  position: relative;
}
.pricing-compare-mark {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
.pricing-compare-mark svg {
  display: block;
}
.pricing-compare-mark--yes {
  color: var(--success);
}
.pricing-compare-mark--no {
  color: var(--muted-foreground);
}
@media (max-width: 42rem) {
  .pricing-compare-table {
    min-width: 0;
    table-layout: fixed;
    font-size: 0.75rem;
  }
  .pricing-compare-table th,
  .pricing-compare-table td {
    padding: 0.55rem 0.3rem;
  }
  .pricing-compare-table tbody th[scope="row"],
  .pricing-compare-table thead th:first-child {
    min-width: 0;
    width: 34%;
  }
  .pricing-compare-price-note {
    font-size: 0.65rem;
  }
}

/* Narrow form containers so inputs/buttons don’t stretch full width */
.form-narrow {
  max-width: 28rem;
}

.settings-stack {
  display: flex;
  flex-direction: column;
  max-width: 46rem;
}
.settings-section + .settings-section {
  margin-block-start: var(--space-6);
  padding-block-start: var(--space-6);
  border-block-start: 1px solid var(--border);
}
.settings-actions {
  margin-block-start: var(--space-6);
}

/* Signed-out: centered auth layout (sign in / sign up) */
.layout-auth {
  position: relative;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: var(--space-6);
}
.layout-marketing > .layout-auth {
  flex: 1;
  min-height: 0;
  width: 100%;
}
.auth-panel,
.layout-auth main,
.layout-auth .auth {
  width: 100%;
  max-width: 24rem;
}

/* Flash messages: use Oat alert styling when possible */
.notice,
.alert {
  margin-block-end: var(--space-4);
  padding: var(--space-4);
  border-radius: var(--radius-medium);
  border: 1px solid var(--border);
}
.alert {
  background-color: color-mix(in srgb, var(--danger) 8%, white);
  color: var(--danger);
  border-color: var(--danger);
}
.notice {
  background-color: color-mix(in srgb, var(--success) 8%, white);
  color: var(--success);
  border-color: var(--success);
}
[data-theme="dark"] .alert {
  background-color: color-mix(in srgb, var(--danger) 20%, black);
}
[data-theme="dark"] .notice {
  background-color: color-mix(in srgb, var(--success) 20%, black);
}

/* Utilities: reset margins/listing for reuse (avoids inline styles) */
.heading-reset {
  margin: 0;
}
.list-reset {
  margin: 0;
  padding-inline-start: 0;
  list-style: none;
}
.flush {
  margin: 0;
}
.mb-0 {
  margin-block-end: 0;
}
.mb-1 {
  margin-block-end: var(--space-1, 0.25rem);
}
.page-header-lede {
  margin-block: 0.25rem 0;
}
.text-sm {
  font-size: var(--text-7);
}
.section-title {
  margin-block: 0 var(--space-4);
}
.section-title-sm {
  margin-block: 0 var(--space-3);
}
.section-title-xs {
  margin-block: 0 var(--space-2);
}
.definition-list {
  margin: 0;
}
.definition-list dt,
.definition-list dd {
  margin: 0;
}
.definition-list dt {
  color: var(--muted-foreground);
}
.nav-brand {
  text-decoration: none;
  font-weight: 600;
  color: var(--foreground);
}
.dl-inline {
  margin: 0;
  font-size: var(--text-7);
  color: var(--muted-foreground);
}
.dl-inline dt,
.dl-inline dd {
  margin: 0;
}

/* Chart — follow page light/dark tokens so labels stay readable */
:root {
  --chart-bg: transparent;
  --chart-grid: color-mix(in srgb, var(--foreground, #0f172a) 14%, transparent);
  --chart-label: var(--muted-foreground, #64748b);
  --chart-fg: var(--foreground, #0f172a);
  --chart-point-stroke: var(--background, #fff);
  --chart-tooltip-bg: #1e293b;
  --chart-tooltip-fg: #f1f5f9;
}
[data-theme="dark"] {
  --chart-point-stroke: var(--background, #0b1220);
  --chart-tooltip-bg: #020617;
  --chart-tooltip-fg: #f8fafc;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --chart-point-stroke: var(--background, #0b1220);
    --chart-tooltip-bg: #020617;
    --chart-tooltip-fg: #f8fafc;
  }
}

/* Chart */
[data-controller="chart"] {
  overflow: visible;
}
.chart-tooltip {
  position: absolute;
  z-index: 50;
  padding: 8px 10px;
  font-size: 12px;
  line-height: 1.4;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  pointer-events: none;
  max-width: 320px;
  white-space: normal;
  background: var(--chart-tooltip-bg);
  color: var(--chart-tooltip-fg);
}
.chart-tooltip strong {
  display: block;
  margin-block-end: 2px;
}

/* Marketing / landing */
.layout-marketing {
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
}
.marketing-topbar {
  position: sticky;
  top: 0;
  z-index: 5;
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: var(--space-3);
  min-height: 3.25rem;
  padding: var(--space-2) var(--space-4);
  border-block-end: 1px solid var(--border);
  background-color: color-mix(in srgb, var(--background) 92%, transparent);
  backdrop-filter: blur(10px);
  box-sizing: border-box;
}
.marketing-topbar .nav-brand {
  flex-shrink: 0;
}
.marketing-topbar nav {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: var(--space-2);
  margin-inline-start: auto;
  min-width: 0;
}
.marketing-menu-theme {
  display: inline-flex;
  align-items: center;
}
.marketing-menu-theme-label {
  display: none;
}
.marketing-nav-link {
  color: var(--muted-foreground);
  text-decoration: none;
  font-size: var(--text-6, 0.875rem);
  font-weight: 500;
  white-space: nowrap;
}
.marketing-nav-link:hover,
.marketing-nav-link[aria-current="page"] {
  color: var(--foreground);
  text-decoration: none;
}
@media (max-width: 768px) {
  nav[data-topnav],
  .marketing-topbar {
    padding-inline: var(--space-3);
  }
  .marketing-topbar nav {
    display: none;
    position: absolute;
    inset-inline: 0;
    top: 100%;
    margin: 0;
    flex-direction: column;
    align-items: stretch;
    gap: var(--space-1);
    padding: var(--space-2);
    background-color: var(--background);
    border-block-end: 1px solid var(--border);
    box-shadow: 0 12px 24px color-mix(in srgb, var(--foreground) 8%, transparent);
  }
  .marketing-menu-theme {
    gap: var(--space-2);
    padding-inline: var(--space-3);
  }
  .marketing-menu-theme-label {
    display: inline;
    color: var(--foreground);
    font-size: var(--text-6, 0.875rem);
    font-weight: 500;
  }
  .marketing-topbar[data-menu-open] nav {
    display: flex;
  }
  .marketing-topbar nav .marketing-nav-link,
  .marketing-topbar nav .marketing-btn {
    justify-content: flex-start;
    width: 100%;
    padding: var(--space-3);
    font-size: var(--text-6, 0.875rem);
    box-sizing: border-box;
  }
}
.marketing-hero {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-8);
  align-items: center;
  width: 100%;
  max-width: 64rem;
  margin-inline: auto;
  padding: var(--space-8) var(--container-pad, 1.5rem) var(--space-6);
  box-sizing: border-box;
}
@media (min-width: 56rem) {
  .marketing-hero {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  }
}
.marketing-headline {
  margin: 0 0 var(--space-3);
  font-size: clamp(2rem, 4vw, 2.75rem);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.15;
}
.marketing-lede {
  margin: 0 0 var(--space-6);
  color: var(--muted-foreground);
  font-size: var(--text-5);
  max-width: 36rem;
}
.marketing-cta {
  flex-wrap: wrap;
}
.marketing-hero-visual {
  margin: 0;
  padding: var(--space-2) var(--space-2) var(--space-3);
  border: 1px solid var(--border);
  border-radius: var(--radius-large, 0.75rem);
  background: color-mix(in srgb, var(--foreground) 3%, transparent);
  box-shadow: 0 16px 40px color-mix(in srgb, var(--foreground) 8%, transparent);
}
.marketing-hero-caption {
  margin: var(--space-2) 0 0;
  padding-inline: var(--space-2);
  color: var(--muted-foreground);
  font-size: var(--text-7, 0.75rem);
}
.marketing-showcase {
  display: grid;
  gap: var(--space-4);
  margin-block-start: var(--space-6);
}
.marketing-showcase h3 {
  margin-block: 0 var(--space-2);
  font-size: var(--text-5);
}
.marketing-showcase .package-change-body h3 {
  margin: 0 0 var(--space-2);
  font-size: var(--text-7, 0.75rem);
}
.marketing-showcase p {
  margin-block: 0 var(--space-4);
}
.marketing-features {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-4);
  margin-block-start: var(--space-6);
}
@media (min-width: 48rem) {
  .marketing-features {
    grid-template-columns: repeat(3, 1fr);
  }
}
.marketing-features h3 {
  margin-block: 0 var(--space-2);
  font-size: var(--text-5);
}
.marketing-price {
  margin: 0 0 var(--space-2);
  font-size: clamp(1.75rem, 4vw, 2.25rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.1;
}
.marketing-price span {
  color: var(--muted-foreground);
  font-size: var(--text-6, 0.875rem);
  font-weight: 400;
}
.marketing-section {
  width: 100%;
  max-width: 64rem;
  margin-inline: auto;
  padding: var(--space-8) var(--container-pad, 1.5rem);
  border-block-start: 1px solid var(--border);
  box-sizing: border-box;
}
.marketing-main {
  flex: 1;
  width: 100%;
  max-width: 40rem;
  margin-inline: auto;
  padding: var(--space-8) var(--container-pad, 1.5rem);
  box-sizing: border-box;
}
.marketing-main--wide {
  max-width: 64rem;
}
.marketing-main--docs {
  max-width: 46rem;
}
.marketing-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  margin-block-start: auto;
  padding: var(--space-4) var(--container-pad, 1.5rem);
  border-block-start: 1px solid var(--border);
  font-size: var(--text-7);
}
.marketing-footer-tagline {
  margin: 0;
  color: var(--muted-foreground);
}
.marketing-footer a {
  color: var(--muted-foreground);
  text-decoration: none;
}
.marketing-footer a:hover {
  color: var(--foreground);
  text-decoration: none;
}

.setup-paths {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr));
  gap: var(--space-6);
}
.setup-path {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
  min-width: 0;
}
.setup-path > * {
  margin-block: 0;
}
.setup-snippet {
  margin: 0;
  width: 100%;
  box-sizing: border-box;
  padding: var(--space-4);
  border: 1px solid var(--border);
  border-radius: var(--radius-medium, 0.5rem);
  background: color-mix(in srgb, var(--foreground) 4%, transparent);
  overflow-x: auto;
  font-size: var(--text-6, 0.875rem);
  line-height: 1.55;
}
.setup-snippet code {
  display: block;
  padding: 0;
  background: none;
  border-radius: 0;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.api-key-reveal {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-3);
  border-color: color-mix(in srgb, var(--success) 40%, var(--border));
}
.api-key-reveal > * {
  min-width: 0;
  max-width: 100%;
  margin: 0;
}
.api-key-reveal-title {
  font-weight: 600;
}
.api-key-token,
.api-key-reveal .setup-snippet {
  margin: 0;
  overflow-x: auto;
}
.api-key-token {
  padding: var(--space-3) var(--space-4);
  border: 1px solid var(--border);
  border-radius: var(--radius-medium);
  background: var(--background);
}
.api-key-token code,
.api-key-reveal .setup-snippet code {
  display: block;
  padding: 0;
  background: none;
  border-radius: 0;
  color: var(--foreground);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: var(--text-6, 0.875rem);
  line-height: 1.6;
  white-space: pre;
  overflow-wrap: normal;
  word-break: normal;
}

.live-crawl-details > summary {
  cursor: pointer;
  list-style: none;
}
.live-crawl-details > summary::-webkit-details-marker {
  display: none;
}
.live-crawl-summary {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-3);
  flex-wrap: wrap;
}
.live-crawl-summary-title {
  font-size: var(--text-4, 1.125rem);
  font-weight: 600;
}

.onboarding-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.onboarding-steps li {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
}
.onboarding-steps li.is-done {
  color: var(--muted-foreground);
}
.onboarding-step-index {
  flex: 0 0 auto;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-7);
}

/* Sample GitHub pull request comment on the docs page. */
.gh-comment {
  margin: 0;
  border: 1px solid var(--border);
  border-radius: 0.75rem;
  background: light-dark(#ffffff, #0d1117);
  color: light-dark(#1f2328, #e6edf3);
  overflow: hidden;
}
.gh-comment-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin: 0;
  padding: 0.55rem 0.85rem;
  border-bottom: 1px solid var(--border);
  background: light-dark(#f6f8fa, #151b23);
  font-size: 0.875rem;
}
.gh-comment-avatar {
  flex: none;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #c6903e;
  color: #fff;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.gh-comment-meta {
  flex: 1;
  min-width: 0;
}
.gh-comment-meta strong {
  font-weight: 650;
}
.gh-comment-time,
.gh-comment-author {
  color: var(--muted-foreground);
}
.gh-comment-author {
  flex: none;
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 0.05rem 0.45rem;
  font-size: 0.75rem;
}
.gh-comment-body {
  padding: 0.9rem 1rem 1.1rem;
  overflow-x: auto;
}
.gh-comment-body h3 {
  margin: 0 0 0.65rem;
  font-size: 1.25rem;
  font-weight: 650;
}
.gh-comment-body h4 {
  margin: 0.15rem 0 0.5rem;
  font-size: 1rem;
  font-weight: 650;
}
.gh-comment-body p {
  margin: 0 0 0.75rem;
}
.gh-comment-body p:last-child {
  margin-bottom: 0;
}
.gh-comment-body table {
  width: auto;
  min-width: 100%;
  border-collapse: collapse;
  margin: 0 0 1rem;
  font-size: 0.875rem;
}
.gh-comment-body th,
.gh-comment-body td {
  border: 1px solid var(--border);
  padding: 0.3rem 0.7rem;
  text-align: left;
  font-weight: 400;
}
.gh-comment-body thead th,
.gh-comment-body tbody th {
  font-weight: 650;
}
.gh-comment-body code {
  font-size: 0.85em;
}
.gh-comment-added {
  color: light-dark(#1a7f37, #3fb950);
  font-weight: 650;
}
.gh-comment-links {
  color: var(--bb-accent);
}
.gh-comment-links span + span::before {
  content: " · ";
  color: var(--muted-foreground);
}