:root {
  --basis-accent: 99 102 241; /* indigo-500 */
  --basis-cyan: 34 211 238; /* cyan-400 */
  --basis-fg: 226 232 240; /* slate-200 */
  --basis-muted: 148 163 184; /* slate-400 */
  --basis-bg: 2 6 23; /* slate-950 */
  --basis-surface: 15 23 42; /* slate-900 */
  --basis-surface-2: 30 41 59; /* slate-800 */
  --basis-border: 148 163 184;
  --basis-border-subtle-alpha: 0.08;
  --basis-border-strong-alpha: 0.14;
  --basis-text-primary: var(--basis-fg);
  --basis-text-secondary: var(--basis-muted);
  --basis-text-muted: 100 116 139;
  --basis-btn-primary-fg: 0 0 0;
}

/* Self-hosted fonts (used by the UI v2 preview theme). */
@font-face {
  font-family: "Basis Sans";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("/static/fonts/inter-latin-ext-wght-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
  font-family: "Basis Sans";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("/static/fonts/inter-latin-wght-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
  font-family: "Basis Serif";
  font-style: normal;
  font-display: swap;
  font-weight: 200 800;
  src: url("/static/fonts/newsreader-latin-ext-wght-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
  font-family: "Basis Serif";
  font-style: normal;
  font-display: swap;
  font-weight: 200 800;
  src: url("/static/fonts/newsreader-latin-wght-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
  font-family: "Basis Mono";
  font-style: normal;
  font-display: swap;
  font-weight: 100 800;
  src: url("/static/fonts/jetbrains-mono-latin-ext-wght-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
  font-family: "Basis Mono";
  font-style: normal;
  font-display: swap;
  font-weight: 100 800;
  src: url("/static/fonts/jetbrains-mono-latin-wght-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

html, body {
  height: 100%;
}

body {
  background: rgb(var(--basis-bg));
  color: rgb(var(--basis-fg));
  font-feature-settings: "ss01" 1, "cv02" 1, "cv03" 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.basis-bg {
  position: fixed;
  inset: 0;
  z-index: -10;
  pointer-events: none;
  background:
    radial-gradient(900px 520px at 18% 0%, rgba(var(--basis-accent), 0.18), transparent 60%),
    radial-gradient(760px 520px at 88% 10%, rgba(var(--basis-cyan), 0.14), transparent 55%),
    radial-gradient(900px 640px at 50% 120%, rgba(168, 85, 247, 0.10), transparent 60%),
    linear-gradient(rgb(var(--basis-bg)), rgb(var(--basis-bg)));
}

.basis-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0.10;
  background-image:
    linear-gradient(to right, rgba(148,163,184,0.14) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(148,163,184,0.14) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(60% 60% at 50% 0%, black 0%, transparent 80%);
}

/* UI v2 preview: "Obsidian Console" palette + typography (admin-toggle). */
body:not(.basis-ui-v2) .basis-ui-v2-only {
  display: none !important;
}

body.basis-ui-v2 .basis-ui-v1-only {
  display: none !important;
}

body.basis-ui-v2 {
  /* Palette (default: dark). Use RGB triplets for compatibility with existing var() usage. */
  --basis-bg: 2 2 2; /* #020202 */
  --basis-fg: 241 245 249; /* #f1f5f9 */
  --basis-muted: 161 161 170; /* #a1a1aa */

  --basis-accent: 34 211 238; /* cyan-400 (#22d3ee) */
  --basis-accent-hover: 103 232 249; /* cyan-300 (#67e8f9) */
  --basis-accent-contrast: 0 0 0; /* text on accent */

  --basis-success: 74 222 128; /* #4ade80 */
  --basis-danger: 244 63 94; /* rose-500 */
  --basis-warning: 245 158 11; /* amber-500 */
  --basis-info: 59 130 246; /* blue-500 */

  --basis-surface: 10 10 10; /* #0a0a0a */
  --basis-surface-2: 17 17 17; /* #111111 */
  --basis-surface-3: 26 26 26; /* #1a1a1a */

  --basis-border: 113 113 122; /* zinc-500-ish (neutral gray), avoids white-tinted outlines */
  --basis-border-subtle-alpha: 0.045;
  --basis-border-strong-alpha: 0.10;

  --basis-radius: 0.5rem; /* 8px */

  --basis-font-sans: "Basis Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --basis-font-serif: "Basis Serif", ui-serif, Georgia, serif;
  --basis-font-mono: "Basis Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;

  font-family: var(--basis-font-sans);
  background: rgb(var(--basis-bg));
  color: rgb(var(--basis-fg));
  color-scheme: dark;
}

body.basis-ui-v2.basis-theme-light {
  --basis-bg: 250 250 250; /* #fafafa */
  --basis-fg: 24 24 27; /* #18181b */
  --basis-muted: 82 82 91; /* #52525b */

  --basis-surface: 255 255 255; /* #ffffff */
  --basis-surface-2: 244 244 245; /* #f4f4f5 */
  --basis-surface-3: 238 238 238; /* #eeeeee */

  --basis-border: 228 228 231; /* #e4e4e7 */
  --basis-border-subtle-alpha: 1;
  --basis-border-strong-alpha: 1;

  color-scheme: light;
}

body.basis-ui-v2 h1,
body.basis-ui-v2 h2,
body.basis-ui-v2 h3 {
  font-family: var(--basis-font-sans);
  letter-spacing: -0.01em;
}

body.basis-ui-v2 .font-mono {
  font-family: var(--basis-font-mono) !important;
}

body.basis-ui-v2 .font-serif {
  font-family: var(--basis-font-serif) !important;
}

body.basis-ui-v2 .basis-bg {
  background: rgb(var(--basis-bg));
}

body.basis-ui-v2.basis-theme-light .basis-bg {
  background: rgb(var(--basis-bg));
}

body.basis-ui-v2 .basis-bg::after {
  opacity: 0;
  background-image: none;
}

body.basis-ui-v2 .basis-card {
  border-color: rgba(var(--basis-border), var(--basis-border-subtle-alpha));
  background: rgb(var(--basis-surface));
  backdrop-filter: none;
  border-radius: var(--basis-radius);
  box-shadow: none;
}

body.basis-ui-v2.basis-theme-dark #basis-page-shell > header.basis-card {
  border-color: transparent;
}

body.basis-ui-v2.basis-theme-dark #basis-page-shell > header.basis-card:hover {
  border-color: rgba(var(--basis-border), var(--basis-border-subtle-alpha));
}

body.basis-ui-v2 .basis-admin-toggle,
body.basis-ui-v2 .basis-toggle {
  border-color: rgba(var(--basis-border), var(--basis-border-subtle-alpha));
  background: rgb(var(--basis-surface));
  border-radius: var(--basis-radius);
}

body.basis-ui-v2.basis-theme-dark .basis-admin-toggle,
body.basis-ui-v2.basis-theme-dark .basis-toggle {
  border-color: transparent;
}

body.basis-ui-v2.basis-theme-dark .basis-admin-toggle:hover,
body.basis-ui-v2.basis-theme-dark .basis-toggle:hover {
  border-color: rgba(var(--basis-border), var(--basis-border-subtle-alpha));
  background: rgb(var(--basis-surface-2));
}

body.basis-ui-v2 .basis-admin-toggle__label,
body.basis-ui-v2 .basis-admin-toggle__state,
body.basis-ui-v2 .basis-toggle__label {
  color: rgba(var(--basis-muted), 0.95);
}

body.basis-ui-v2 .basis-btn-primary {
  background-image: none;
  background-color: rgb(var(--basis-accent));
  color: rgb(var(--basis-accent-contrast));
  border: 1px solid rgba(0, 0, 0, 0.18);
  border-radius: var(--basis-radius);
  box-shadow: none;
  transition: background-color 160ms ease, transform 80ms ease;
}

body.basis-ui-v2 .basis-btn-primary:hover {
  filter: none;
  background-color: rgb(var(--basis-accent-hover));
}

body.basis-ui-v2 .basis-btn-primary:active {
  transform: scale(0.985);
}

body.basis-ui-v2 .basis-pill {
  border-radius: var(--basis-radius);
  text-transform: none;
  letter-spacing: 0;
  font-family: var(--basis-font-sans);
  border-color: rgba(var(--basis-border), var(--basis-border-subtle-alpha));
  background: rgb(var(--basis-surface-2));
  color: rgba(var(--basis-fg), 0.88);
}

body.basis-ui-v2 .basis-pill--succeeded {
  border-color: rgba(var(--basis-success), 0.20);
  background: rgba(var(--basis-success), 0.10);
  color: rgb(var(--basis-success));
}

body.basis-ui-v2 .basis-pill--failed {
  border-color: rgba(var(--basis-danger), 0.22);
  background: rgba(var(--basis-danger), 0.10);
  color: rgb(var(--basis-danger));
}

body.basis-ui-v2 .basis-pill--cancelled {
  border-color: rgba(var(--basis-warning), 0.25);
  background: rgba(var(--basis-warning), 0.10);
  color: rgb(var(--basis-warning));
}

body.basis-ui-v2 .basis-pill--paused {
  border-color: rgba(var(--basis-info), 0.22);
  background: rgba(var(--basis-info), 0.10);
  color: rgb(var(--basis-info));
}

body.basis-ui-v2 .basis-pill--running {
  border-color: rgba(var(--basis-accent), 0.25);
  background: rgba(var(--basis-accent), 0.10);
  color: rgba(var(--basis-accent), 0.95);
}

body.basis-ui-v2 .basis-pill--queued {
  border-color: rgba(var(--basis-border), var(--basis-border-subtle-alpha));
  background: rgba(var(--basis-border), 0.03);
  color: rgba(var(--basis-muted), 0.92);
}

body.basis-ui-v2 .basis-chip {
  border-color: rgba(var(--basis-border), var(--basis-border-subtle-alpha));
  background: rgba(var(--basis-border), 0.03);
  color: rgba(var(--basis-muted), 0.92);
  border-radius: var(--basis-radius);
  font-family: var(--basis-font-mono);
}

body.basis-ui-v2 .basis-artifact-link {
  border-color: rgba(var(--basis-border), var(--basis-border-subtle-alpha));
  background: rgb(var(--basis-surface));
  color: rgba(var(--basis-fg), 0.92);
  border-radius: var(--basis-radius);
}

body.basis-ui-v2 .basis-artifact-link:hover {
  border-color: rgba(var(--basis-accent), 0.28);
  background: rgb(var(--basis-surface-2));
}

body.basis-ui-v2 .basis-ring:focus {
  outline: none;
  box-shadow:
    0 0 0 1px rgba(var(--basis-accent), 0.55),
    0 0 0 4px rgba(var(--basis-accent), 0.20);
}

body.basis-ui-v2 .basis-switch-track {
  background: rgb(var(--basis-surface-2));
  border-color: rgba(var(--basis-border), var(--basis-border-subtle-alpha));
}

body.basis-ui-v2.basis-theme-dark .basis-switch-track {
  border-color: transparent;
}

body.basis-ui-v2.basis-theme-dark .basis-switch:hover .basis-switch-track {
  border-color: rgba(var(--basis-border), var(--basis-border-subtle-alpha));
}

body.basis-ui-v2 .basis-switch input:checked ~ .basis-switch-track {
  background: rgba(var(--basis-accent), 0.28);
  border-color: rgba(var(--basis-accent), 0.38);
}

body.basis-ui-v2 .basis-switch input:focus-visible ~ .basis-switch-track {
  box-shadow:
    0 0 0 1px rgba(var(--basis-accent), 0.55),
    0 0 0 4px rgba(var(--basis-accent), 0.20);
}

body.basis-ui-v2 input[type="text"],
body.basis-ui-v2 input[type="email"],
body.basis-ui-v2 input[type="password"],
body.basis-ui-v2 input[type="number"],
body.basis-ui-v2 textarea,
body.basis-ui-v2 select {
  background: rgb(var(--basis-surface-2)) !important;
  border-color: rgba(var(--basis-border), var(--basis-border-subtle-alpha)) !important;
  color: rgb(var(--basis-fg)) !important;
  border-radius: var(--basis-radius) !important;
  caret-color: rgb(var(--basis-accent));
  transition: border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}

body.basis-ui-v2.basis-theme-dark input[type="text"],
body.basis-ui-v2.basis-theme-dark input[type="email"],
body.basis-ui-v2.basis-theme-dark input[type="password"],
body.basis-ui-v2.basis-theme-dark input[type="number"],
body.basis-ui-v2.basis-theme-dark textarea,
body.basis-ui-v2.basis-theme-dark select {
  border-color: transparent !important;
}

body.basis-ui-v2.basis-theme-dark input[type="text"]:hover,
body.basis-ui-v2.basis-theme-dark input[type="email"]:hover,
body.basis-ui-v2.basis-theme-dark input[type="password"]:hover,
body.basis-ui-v2.basis-theme-dark input[type="number"]:hover,
body.basis-ui-v2.basis-theme-dark textarea:hover,
body.basis-ui-v2.basis-theme-dark select:hover {
  border-color: rgba(var(--basis-border), var(--basis-border-subtle-alpha)) !important;
}

body.basis-ui-v2 ::placeholder {
  color: rgba(var(--basis-muted), 0.85);
}

body.basis-ui-v2 input[type="text"]:focus,
body.basis-ui-v2 input[type="email"]:focus,
body.basis-ui-v2 input[type="password"]:focus,
body.basis-ui-v2 input[type="number"]:focus,
body.basis-ui-v2 textarea:focus,
body.basis-ui-v2 select:focus {
  outline: none;
  border-color: rgba(var(--basis-accent), 0.55) !important;
  box-shadow:
    0 0 0 1px rgba(var(--basis-accent), 0.55),
    0 0 0 4px rgba(var(--basis-accent), 0.20);
}

body.basis-ui-v2 .text-slate-100,
body.basis-ui-v2 .text-slate-200 {
  color: rgba(var(--basis-fg), 0.96);
}

body.basis-ui-v2 .text-slate-400 {
  color: rgba(var(--basis-muted), 0.95);
}

body.basis-ui-v2 .text-slate-300 {
  color: rgba(var(--basis-fg), 0.92);
}

body.basis-ui-v2 .text-slate-500 {
  color: rgba(var(--basis-muted), 0.85);
}

body.basis-ui-v2 .text-slate-600 {
  color: rgba(var(--basis-muted), 0.75);
}

body.basis-ui-v2 .text-slate-700 {
  color: rgba(var(--basis-muted), 0.55);
}

body.basis-ui-v2 .border-slate-800 {
  border-color: rgba(var(--basis-border), var(--basis-border-subtle-alpha)) !important;
}

body.basis-ui-v2 .hover\\:border-slate-800:hover {
  border-color: rgba(var(--basis-accent), 0.30) !important;
}

body.basis-ui-v2 .border-slate-700 {
  border-color: rgba(var(--basis-border), var(--basis-border-strong-alpha)) !important;
}

body.basis-ui-v2 .bg-slate-950\\/40 {
  background-color: rgb(var(--basis-surface-2)) !important;
}

body.basis-ui-v2 .bg-slate-950\\/50,
body.basis-ui-v2 .bg-slate-950\\/60,
body.basis-ui-v2 .bg-slate-950\\/70 {
  background-color: rgb(var(--basis-surface-2)) !important;
}

body.basis-ui-v2 .bg-slate-950 {
  background-color: rgb(var(--basis-surface-2)) !important;
}

body.basis-ui-v2 .bg-slate-900\\/60 {
  background-color: rgb(var(--basis-surface)) !important;
}

body.basis-ui-v2 .bg-slate-800\\/70,
body.basis-ui-v2 .bg-slate-800 {
  background-color: rgba(var(--basis-border), var(--basis-border-subtle-alpha)) !important;
}

body.basis-ui-v2 .bg-slate-900\\/70,
body.basis-ui-v2 .bg-slate-900\\/50,
body.basis-ui-v2 .bg-slate-900\\/40 {
  background-color: rgb(var(--basis-surface)) !important;
}

body.basis-ui-v2 .hover\\:bg-slate-900\\/60:hover {
  background-color: rgb(var(--basis-surface-2)) !important;
}

body.basis-ui-v2 .hover\\:bg-slate-900:hover {
  background-color: rgb(var(--basis-surface-2)) !important;
}

body.basis-ui-v2 .hover\\:text-slate-100:hover,
body.basis-ui-v2 .hover\\:text-slate-300:hover {
  color: rgba(var(--basis-fg), 0.96) !important;
}

body.basis-ui-v2 .hover\\:bg-slate-950\\/30:hover {
  background-color: rgb(var(--basis-surface-2)) !important;
}

body.basis-ui-v2 .bg-indigo-950\\/20 {
  background-color: rgba(var(--basis-accent), 0.08) !important;
}

body.basis-ui-v2 .text-indigo-100 {
  color: rgba(var(--basis-fg), 0.96) !important;
}

body.basis-ui-v2 .text-indigo-200,
body.basis-ui-v2 .text-indigo-300 {
  color: rgba(var(--basis-accent), 0.95) !important;
}

body.basis-ui-v2 .divide-slate-800 > :not([hidden]) ~ :not([hidden]),
body.basis-ui-v2 .divide-slate-700 > :not([hidden]) ~ :not([hidden]) {
  border-color: rgba(var(--basis-border), var(--basis-border-subtle-alpha)) !important;
}

body.basis-ui-v2 .shadow-lg,
body.basis-ui-v2 .shadow-indigo-500\\/5,
body.basis-ui-v2 .shadow-indigo-500\\/10 {
  box-shadow: none !important;
}

body.basis-ui-v2 .rounded,
body.basis-ui-v2 .rounded-md,
body.basis-ui-v2 .rounded-lg,
body.basis-ui-v2 .rounded-xl,
body.basis-ui-v2 .rounded-2xl,
body.basis-ui-v2 .rounded-3xl {
  border-radius: var(--basis-radius) !important;
}

body.basis-ui-v2 .divide-y.divide-slate-800 > div.p-5 {
  padding: 1rem 1.25rem !important;
}

body.basis-ui-v2 .border-slate-800\\/80 {
  border-color: rgba(var(--basis-border), var(--basis-border-subtle-alpha)) !important;
}

body.basis-ui-v2.basis-theme-dark a.border-slate-800.basis-ring,
body.basis-ui-v2.basis-theme-dark button.border-slate-800.basis-ring:not(.basis-preset-btn),
body.basis-ui-v2.basis-theme-dark summary.border-slate-800.basis-ring {
  border-color: transparent !important;
  background-color: transparent !important;
}

body.basis-ui-v2 a.border-slate-800.basis-ring:hover,
body.basis-ui-v2 button.border-slate-800.basis-ring:hover {
  border-color: rgba(var(--basis-accent), 0.30) !important;
  color: rgba(var(--basis-accent), 0.95) !important;
}

body.basis-ui-v2 #progress-bar {
  background-image: none !important;
  background-color: rgb(var(--basis-accent)) !important;
}

/* Dashboard polish (UI v2 preview). */
body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] .basis-dashboard-stat-card {
  border-color: transparent !important;
  transition: background-color 160ms ease;
}

body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] .basis-dashboard-stat-card:hover {
  background: rgb(var(--basis-surface-2));
}

body.basis-ui-v2 [data-basis-page="dashboard"] .basis-dashboard-stat-label {
  color: rgba(var(--basis-muted), 0.85) !important;
}

body.basis-ui-v2 [data-basis-page="dashboard"] .basis-dashboard-stat-value {
  margin-top: 0.5rem !important;
  font-size: clamp(2rem, 3.1vw, 3.5rem) !important;
  line-height: 1 !important;
  letter-spacing: -0.05em;
}

body.basis-ui-v2 [data-basis-page="dashboard"] .basis-dashboard-stat-success {
  color: rgb(var(--basis-success)) !important;
}

body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] .basis-dashboard-filters,
body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] .basis-dashboard-list {
  border-color: transparent !important;
}

body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] .basis-dashboard-filters input[type="text"],
body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] .basis-dashboard-filters input[type="date"],
body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] .basis-dashboard-filters select {
  border-color: transparent !important;
}

body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] .basis-dashboard-filters input[type="text"]:hover,
body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] .basis-dashboard-filters input[type="date"]:hover,
body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] .basis-dashboard-filters select:hover {
  border-color: rgba(var(--basis-border), var(--basis-border-subtle-alpha)) !important;
}

body.basis-ui-v2 [data-basis-page="dashboard"] .basis-dashboard-run-row {
  padding: 1.25rem 1.5rem !important;
}

body.basis-ui-v2 [data-basis-page="dashboard"] .basis-dashboard-run-row:hover {
  background-color: rgb(var(--basis-surface-2)) !important;
}

body.basis-ui-v2 [data-basis-page="dashboard"] .basis-dashboard-run-title {
  color: rgba(var(--basis-fg), 0.94) !important;
  text-decoration: none;
}

body.basis-ui-v2 [data-basis-page="dashboard"] .basis-dashboard-run-row:hover .basis-dashboard-run-title {
  color: rgba(var(--basis-accent), 0.95) !important;
}

body.basis-ui-v2 [data-basis-page="dashboard"] .basis-dashboard-run-meta {
  color: rgba(var(--basis-muted), 0.85) !important;
}

body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] .basis-dashboard-action {
  padding: 0.375rem 0.75rem !important;
  font-size: 0.75rem !important;
  line-height: 1rem;
  background-color: transparent !important;
  border-color: transparent !important;
  color: rgba(var(--basis-fg), 0.88) !important;
  transition: border-color 160ms ease, background-color 160ms ease, color 160ms ease, transform 80ms ease;
}

body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] a.basis-dashboard-action:hover,
body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] button.basis-dashboard-action:hover,
body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] summary.basis-dashboard-action:hover {
  border-color: rgba(var(--basis-border), var(--basis-border-subtle-alpha)) !important;
  background-color: rgb(var(--basis-surface-2)) !important;
  color: rgba(var(--basis-accent), 0.95) !important;
}

body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] a.basis-dashboard-action:active,
body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] button.basis-dashboard-action:active,
body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] summary.basis-dashboard-action:active {
  transform: scale(0.985);
}

body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] .basis-chip {
  border-color: transparent !important;
  background: rgba(var(--basis-border), 0.03) !important;
}

body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] .basis-pill,
body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] .basis-pill--succeeded,
body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] .basis-pill--failed,
body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] .basis-pill--cancelled,
body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] .basis-pill--paused,
body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] .basis-pill--running,
body.basis-ui-v2.basis-theme-dark [data-basis-page="dashboard"] .basis-pill--queued {
  border-color: transparent !important;
}

/* New Run page polish (UI v2 preview). */
body.basis-ui-v2 [data-basis-page="new-run"] {
  gap: 1.25rem;
}

body.basis-ui-v2 [data-basis-page="new-run"] .basis-new-run-intro,
body.basis-ui-v2 [data-basis-page="new-run"] .basis-new-run-form {
  padding: 1.25rem;
}

body.basis-ui-v2 [data-basis-page="new-run"] .basis-new-run-intro {
  background: rgb(var(--basis-surface-2));
}

body.basis-ui-v2.basis-theme-dark [data-basis-page="new-run"] .basis-new-run-intro,
body.basis-ui-v2.basis-theme-dark [data-basis-page="new-run"] .basis-new-run-form {
  border-color: transparent !important;
}

body.basis-ui-v2 [data-basis-page="new-run"] .basis-example-card {
  background: rgb(var(--basis-surface));
  border-color: rgba(var(--basis-border), var(--basis-border-subtle-alpha));
  padding: 1.25rem;
  transition: border-color 160ms ease, background-color 160ms ease;
}

body.basis-ui-v2.basis-theme-dark [data-basis-page="new-run"] .basis-example-card {
  border-color: transparent;
}

body.basis-ui-v2 [data-basis-page="new-run"] .basis-example-card:hover {
  border-color: rgba(var(--basis-border), var(--basis-border-subtle-alpha));
  background: rgb(var(--basis-surface-2));
}

body.basis-ui-v2 [data-basis-page="new-run"] .basis-preset-panel {
  background: rgb(var(--basis-surface-2));
  border-color: rgba(var(--basis-border), var(--basis-border-subtle-alpha));
  padding: 1.25rem;
}

body.basis-ui-v2.basis-theme-dark [data-basis-page="new-run"] .basis-preset-panel {
  border-color: transparent;
}

body.basis-ui-v2 [data-basis-page="new-run"] .basis-preset-btn {
  flex: 1 1 12rem;
  padding: 0.75rem 1.5rem !important;
  font-weight: 500;
  background-color: rgb(var(--basis-surface)) !important;
  border-color: rgba(var(--basis-border), var(--basis-border-subtle-alpha)) !important;
  transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
}

body.basis-ui-v2.basis-theme-dark [data-basis-page="new-run"] .basis-preset-btn {
  border-color: transparent !important;
}

body.basis-ui-v2 [data-basis-page="new-run"] .basis-preset-btn:hover {
  background-color: rgb(var(--basis-surface-2)) !important;
  border-color: rgba(var(--basis-accent), 0.45) !important;
}

body.basis-ui-v2 [data-basis-page="new-run"] .basis-new-run-title {
  font-size: 1.875rem;
  line-height: 2.25rem;
  letter-spacing: -0.02em;
}

body.basis-ui-v2 [data-basis-page="new-run"] .basis-new-run-textarea {
  height: auto !important;
  padding: 1.25rem 1.5rem !important;
  font-size: 1rem;
  line-height: 1.5rem;
  resize: vertical;
}

body.basis-ui-v2 [data-basis-page="new-run"] textarea[name="question"].basis-new-run-textarea {
  min-height: 140px;
}

body.basis-ui-v2 [data-basis-page="new-run"] textarea[name="context"].basis-new-run-textarea {
  min-height: 120px;
}

body.basis-ui-v2 [data-basis-page="new-run"] .basis-new-run-submit {
  padding-top: 1rem;
  padding-bottom: 1rem;
  font-size: 1.125rem;
  letter-spacing: -0.01em;
}

.basis-card {
  border: 1px solid rgba(30, 41, 59, 0.75);
  background: rgba(2, 6, 23, 0.60);
  backdrop-filter: blur(10px);
}

.basis-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  padding: 0.35rem 0.55rem;
  border-radius: 999px;
  border: 1px solid rgba(51, 65, 85, 0.9);
  background: rgba(15, 23, 42, 0.65);
  font-size: 0.75rem;
  line-height: 1rem;
  color: rgb(var(--basis-fg));
  text-transform: lowercase;
}

.basis-pill--succeeded {
  border-color: rgba(16, 185, 129, 0.35);
  background: rgba(6, 95, 70, 0.25);
  color: rgba(167, 243, 208, 0.95);
}

.basis-pill--failed {
  border-color: rgba(244, 63, 94, 0.35);
  background: rgba(159, 18, 57, 0.22);
  color: rgba(254, 205, 211, 0.95);
}

.basis-pill--cancelled {
  border-color: rgba(245, 158, 11, 0.35); /* amber-500 */
  background: rgba(180, 83, 9, 0.22); /* amber-700-ish */
  color: rgba(253, 230, 138, 0.95); /* amber-200 */
}

.basis-pill--paused {
  border-color: rgba(59, 130, 246, 0.35); /* blue-500 */
  background: rgba(29, 78, 216, 0.18); /* blue-700-ish */
  color: rgba(191, 219, 254, 0.95); /* blue-200 */
}

.basis-pill--running {
  border-color: rgba(var(--basis-accent), 0.45);
  background: rgba(30, 41, 59, 0.45);
  color: rgba(199, 210, 254, 0.95);
}

.basis-pill--queued {
  border-color: rgba(148, 163, 184, 0.25);
  background: rgba(15, 23, 42, 0.45);
  color: rgba(203, 213, 225, 0.95);
}

.basis-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  padding: 0.25rem 0.55rem;
  border-radius: 999px;
  border: 1px solid rgba(51, 65, 85, 0.7);
  background: rgba(15, 23, 42, 0.45);
  color: rgba(148, 163, 184, 0.95);
  font-size: 0.75rem;
  line-height: 1rem;
}

.basis-btn-primary {
  /* Always visible fallback, then layer a gradient on top. */
  background-color: rgb(var(--basis-accent));
  background-image: linear-gradient(
    135deg,
    rgb(var(--basis-accent) / 1) 0%,
    rgb(var(--basis-cyan) / 0.92) 60%,
    rgb(168 85 247 / 0.90) 100%
  );
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow:
    0 12px 28px rgba(99, 102, 241, 0.18),
    0 2px 10px rgba(0, 0, 0, 0.35);
  color: rgba(248, 250, 252, 0.98); /* slate-50 */
}

.basis-btn-primary:hover {
  filter: brightness(1.05);
}

.basis-progress-bar {
  transition: width 600ms cubic-bezier(0.16, 1, 0.3, 1);
}

.basis-fade {
  transition: opacity 220ms ease;
}

.basis-artifact-link {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.7rem 0.85rem;
  border-radius: 0.9rem;
  border: 1px solid rgba(51, 65, 85, 0.7);
  background: rgba(2, 6, 23, 0.45);
  color: rgba(199, 210, 254, 0.95);
  text-decoration: none;
}

.basis-artifact-link:hover {
  border-color: rgba(99, 102, 241, 0.55);
  background: rgba(2, 6, 23, 0.65);
}

.basis-artifact-link:focus {
  outline: none;
  box-shadow:
    0 0 0 2px rgba(2, 6, 23, 0.9),
    0 0 0 4px rgba(var(--basis-accent), 0.55);
}

.basis-ring:focus {
  outline: none;
  box-shadow:
    0 0 0 2px rgba(2, 6, 23, 0.9),
    0 0 0 4px rgba(var(--basis-accent), 0.55);
}

.basis-menu summary::-webkit-details-marker {
  display: none;
}

.basis-menu summary {
  list-style: none;
}

.basis-collapsible summary::-webkit-details-marker {
  display: none;
}

.basis-collapsible summary {
  list-style: none;
}

.basis-collapsible summary::marker {
  content: "";
}

.basis-collapsible .basis-chevron {
  transition: transform 160ms ease;
}

.basis-collapsible[open] .basis-chevron {
  transform: rotate(180deg);
}

.basis-input-locked {
  opacity: 0.75;
  cursor: not-allowed;
  pointer-events: none;
}

/* Admin UI toggle: let admins hide internal controls to preview user experience. */
body.basis-admin-controls-off .basis-admin-only {
  display: none !important;
}

.basis-admin-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.45rem 0.6rem;
  border-radius: 0.75rem;
  border: 1px solid rgba(51, 65, 85, 0.9);
  background: rgba(15, 23, 42, 0.55);
}

.basis-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.45rem 0.6rem;
  border-radius: 0.75rem;
  border: 1px solid rgba(51, 65, 85, 0.9);
  background: rgba(15, 23, 42, 0.55);
}

.basis-admin-toggle__label,
.basis-admin-toggle__state,
.basis-toggle__label {
  font-size: 0.75rem;
  line-height: 1rem;
  color: rgba(148, 163, 184, 0.95);
}

.basis-switch {
  position: relative;
  display: inline-block;
  width: 38px;
  height: 20px;
}

.basis-switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.basis-switch-track {
  position: absolute;
  inset: 0;
  border-radius: 999px;
  background: rgba(51, 65, 85, 0.75);
  border: 1px solid rgba(71, 85, 105, 0.85);
  transition: background 180ms ease, border-color 180ms ease;
}

.basis-switch-thumb {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 14px;
  height: 14px;
  border-radius: 999px;
  background: rgba(226, 232, 240, 0.95);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.35);
  transition: transform 180ms ease;
}

.basis-switch input:checked ~ .basis-switch-track {
  background: rgba(var(--basis-accent), 0.55);
  border-color: rgba(var(--basis-accent), 0.65);
}

.basis-switch input:checked ~ .basis-switch-thumb {
  transform: translateX(18px);
}

.basis-switch input:focus-visible ~ .basis-switch-track {
  box-shadow:
    0 0 0 2px rgba(2, 6, 23, 0.9),
    0 0 0 4px rgba(var(--basis-accent), 0.55);
}

/* Run detail: in-app drawer (PDF viewer now; TeX editor later) */
.basis-drawer-backdrop {
  position: fixed;
  inset: 0;
  z-index: 50;
  background: rgba(0, 0, 0, 0.35);
  opacity: 0;
  pointer-events: none;
  transition: opacity 180ms ease;
}

.basis-drawer {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 60;
  height: 100vh;
  width: var(--basis-drawer-width, 560px);
  max-width: 94vw;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 0.85rem;
  background: rgba(2, 6, 23, 0.92);
  border-left: 1px solid rgba(30, 41, 59, 0.75);
  backdrop-filter: blur(12px);
  transform: translateX(100%);
  transition: transform 240ms cubic-bezier(0.16, 1, 0.3, 1);
}

.basis-drawer-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}

.basis-drawer-toolbar {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.basis-drawer-body {
  flex: 1;
  overflow: hidden;
}

body.basis-drawer-open .basis-drawer {
  transform: translateX(0);
}

body.basis-drawer-open .basis-drawer-backdrop {
  opacity: 1;
  pointer-events: auto;
}

@media (min-width: 1024px) {
  body.basis-drawer-open .basis-drawer-backdrop {
    opacity: 0;
    pointer-events: none;
  }
}

/* When a drawer is open, reserve space so the page shell (including header) doesn't sit underneath. */
body.basis-drawer-open {
  overflow-x: hidden;
}

@media (min-width: 1024px) {
  body.basis-drawer-open .basis-page-shell {
    max-width: none;
    width: calc(100% - var(--basis-drawer-width, 560px));
    margin-left: 0;
    margin-right: 0;
  }
}

/* Drawer resize handle */
.basis-drawer-handle {
  position: absolute;
  top: 0;
  left: -6px;
  width: 12px;
  height: 100%;
  cursor: col-resize;
}

.basis-drawer-handle::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 4px;
  height: 84px;
  transform: translate(-50%, -50%);
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.22);
  border: 1px solid rgba(148, 163, 184, 0.18);
}

.basis-drawer-handle:hover::after,
body.basis-drawer-resizing .basis-drawer-handle::after {
  background: rgba(99, 102, 241, 0.28);
  border-color: rgba(99, 102, 241, 0.35);
}

.basis-log-mark {
  background: rgba(var(--basis-accent), 0.22);
  color: rgba(248, 250, 252, 0.98);
  padding: 0 0.18rem;
  border-radius: 0.25rem;
}

/* Smoother resizing: avoid text selection and prevent the iframe from eating pointer events mid-drag. */
body.basis-drawer-resizing {
  user-select: none;
  cursor: col-resize;
}

body.basis-drawer-resizing * {
  cursor: col-resize;
}

body.basis-drawer-resizing #pdf-viewer-frame {
  pointer-events: none;
}

.basis-toast-container {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 60;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  pointer-events: none;
}

.basis-toast {
  pointer-events: auto;
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 0.75rem 0.9rem;
  border-radius: 1rem;
  background: rgba(2, 6, 23, 0.88);
  border: 1px solid rgba(30, 41, 59, 0.85);
  backdrop-filter: blur(10px);
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.4);
  max-width: 22rem;
}

.basis-toast__msg {
  flex: 1;
  font-size: 0.875rem;
  line-height: 1.25rem;
  color: rgba(226, 232, 240, 0.96);
}

.basis-toast__close {
  background: transparent;
  border: 0;
  padding: 0.1rem;
  line-height: 1;
  cursor: pointer;
  color: rgba(148, 163, 184, 0.9);
}

.basis-toast__close:hover {
  color: rgba(241, 245, 249, 0.95);
}

.basis-toast--success {
  border-color: rgba(52, 211, 153, 0.35);
}

.basis-toast--error {
  border-color: rgba(244, 63, 94, 0.35);
}

.basis-toast--info {
  border-color: rgba(99, 102, 241, 0.35);
}

@media (max-width: 640px) {
  .basis-toast-container {
    left: 1rem;
    right: 1rem;
  }
  .basis-toast {
    max-width: none;
  }
}

/* nicer scrollbars */
* {
  scrollbar-width: thin;
  scrollbar-color: rgba(100,116,139,0.65) transparent;
}
*::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
*::-webkit-scrollbar-thumb {
  background: rgba(100,116,139,0.55);
  border-radius: 999px;
  border: 2px solid rgba(2,6,23,0.75);
}
*::-webkit-scrollbar-track {
  background: transparent;
}

/* =====================================================================
   UI v3 preview: Precision Lab (admin-only variant, V1/V2 preserved)
   ===================================================================== */

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("/static/fonts/inter-latin-ext-wght-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("/static/fonts/inter-latin-wght-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-display: swap;
  font-weight: 100 800;
  src: url("/static/fonts/jetbrains-mono-latin-ext-wght-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-display: swap;
  font-weight: 100 800;
  src: url("/static/fonts/jetbrains-mono-latin-wght-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

body:not(.basis-ui-v3) .basis-ui-v3-only {
  display: none !important;
}

body.basis-ui-v3 .basis-ui-v1-only,
body.basis-ui-v3 .basis-ui-v2-only {
  display: none !important;
}

body.basis-ui-v3 {
  --basis-bg: 0 0 0;
  --basis-surface: 10 10 10;
  --basis-surface-2: 17 17 17;
  --basis-border: 255 255 255;
  --basis-border-strong: 255 255 255;
  --basis-border-subtle-alpha: 0.08;
  --basis-border-strong-alpha: 0.14;
  --basis-text-primary: 250 250 250;
  --basis-text-secondary: 161 161 170;
  --basis-text-muted: 113 113 122;
  --basis-accent: 52 211 153;
  --basis-accent-hover: 134 239 172;
  --basis-btn-primary-bg: 255 255 255;
  --basis-btn-primary-fg: 0 0 0;

  background: rgb(var(--basis-bg));
  color: rgb(var(--basis-text-primary));
  color-scheme: dark;
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

body.basis-ui-v3 h1,
body.basis-ui-v3 h2,
body.basis-ui-v3 h3,
body.basis-ui-v3 h4,
body.basis-ui-v3 .basis-new-run-title,
body.basis-ui-v3 .basis-dashboard-run-title {
  font-family: "Satoshi", "Space Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-weight: 650;
  letter-spacing: -0.02em;
}

body.basis-ui-v3 .font-mono,
body.basis-ui-v3 code,
body.basis-ui-v3 pre,
body.basis-ui-v3 .basis-chip,
body.basis-ui-v3 .basis-pill {
  font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace !important;
}

body.basis-ui-v3 .basis-bg {
  background: rgb(var(--basis-bg));
}

body.basis-ui-v3 .basis-bg::after {
  content: none;
  display: none;
}

body.basis-ui-v3 #basis-page-shell {
  max-width: 96rem;
}

body.basis-ui-v3 #basis-page-shell > header.basis-card {
  background: rgb(var(--basis-surface));
  border: 1px solid rgba(var(--basis-border), 0.08);
  border-radius: 8px;
  box-shadow: none;
}

body.basis-ui-v3 #basis-page-shell > header.basis-card .text-lg,
body.basis-ui-v3 #basis-page-shell > header.basis-card .text-xs {
  letter-spacing: -0.01em;
}

body.basis-ui-v3 .basis-card {
  background: rgb(var(--basis-surface));
  border: 1px solid rgba(var(--basis-border), 0.08);
  border-radius: 8px;
  box-shadow: none;
  backdrop-filter: none;
}

body.basis-ui-v3 .basis-btn-primary {
  background: rgb(var(--basis-btn-primary-bg));
  color: rgb(var(--basis-btn-primary-fg));
  border: 1px solid rgba(var(--basis-border), 0.08);
  border-radius: 8px;
  font-weight: 500;
  padding: 0.75rem 1.5rem;
  transition: all 160ms ease;
  box-shadow: none;
}

body.basis-ui-v3 .basis-btn-primary:hover {
  background: rgba(var(--basis-btn-primary-bg), 0.95);
  filter: none;
}

body.basis-ui-v3 .basis-btn-primary:active {
  transform: scale(0.985);
}

body.basis-ui-v3 .basis-pill {
  padding: 0.125rem 0.75rem;
  font-size: 0.7rem;
  line-height: 1rem;
  border-radius: 6px;
  border: 1px solid rgba(var(--basis-border), 0.12);
  background: rgba(255, 255, 255, 0.04);
  color: rgb(var(--basis-text-secondary));
}

body.basis-ui-v3 .basis-pill--succeeded {
  background: rgba(6, 78, 59, 0.6);
  color: rgb(52, 211, 153);
  border-color: rgba(6, 95, 70, 0.65);
}

body.basis-ui-v3 .basis-pill--running {
  background: rgba(52, 211, 153, 0.15);
  color: rgb(52, 211, 153);
  border-color: rgba(52, 211, 153, 0.3);
}

body.basis-ui-v3 .basis-pill--failed {
  background: rgba(127, 29, 29, 0.5);
  color: rgb(252, 165, 165);
  border-color: rgba(153, 27, 27, 0.55);
}

body.basis-ui-v3 .basis-pill--cancelled,
body.basis-ui-v3 .basis-pill--paused,
body.basis-ui-v3 .basis-pill--queued {
  background: rgba(255, 255, 255, 0.04);
  color: rgb(var(--basis-text-secondary));
  border-color: rgba(var(--basis-border), 0.12);
}

body.basis-ui-v3 .basis-chip {
  border: 1px solid rgba(var(--basis-border), 0.12);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.04);
  color: rgb(var(--basis-text-secondary));
}

body.basis-ui-v3 .basis-artifact-link {
  background: transparent;
  border: 1px solid rgba(var(--basis-border), 0.12);
  border-radius: 8px;
  color: rgb(var(--basis-text-primary));
}

body.basis-ui-v3 .basis-artifact-link:hover {
  background: rgb(var(--basis-surface-2));
  border-color: rgba(var(--basis-border-strong), 0.14);
}

body.basis-ui-v3 .basis-ring:focus,
body.basis-ui-v3 .basis-ring:focus-visible {
  outline: none;
  box-shadow: 0 0 0 1px rgba(52, 211, 153, 0.7), 0 0 0 3px rgba(52, 211, 153, 0.18);
}

body.basis-ui-v3 .basis-switch-track {
  background: rgb(var(--basis-surface-2));
  border: 1px solid rgba(var(--basis-border), 0.12);
}

body.basis-ui-v3 .basis-switch input:checked ~ .basis-switch-track {
  background: rgba(52, 211, 153, 0.2);
  border-color: rgba(52, 211, 153, 0.35);
}

body.basis-ui-v3 input[type="text"],
body.basis-ui-v3 input[type="email"],
body.basis-ui-v3 input[type="password"],
body.basis-ui-v3 input[type="number"],
body.basis-ui-v3 input[type="date"],
body.basis-ui-v3 textarea,
body.basis-ui-v3 select {
  background: rgb(var(--basis-surface-2)) !important;
  border: 1px solid rgba(var(--basis-border), 0.08) !important;
  color: rgb(var(--basis-text-primary)) !important;
  border-radius: 8px !important;
}

body.basis-ui-v3 input[type="text"]:focus,
body.basis-ui-v3 input[type="email"]:focus,
body.basis-ui-v3 input[type="password"]:focus,
body.basis-ui-v3 input[type="number"]:focus,
body.basis-ui-v3 input[type="date"]:focus,
body.basis-ui-v3 textarea:focus,
body.basis-ui-v3 select:focus {
  border-color: rgba(52, 211, 153, 0.92) !important;
  box-shadow: 0 0 0 2px rgba(52, 211, 153, 0.16);
}

body.basis-ui-v3 ::placeholder {
  color: rgb(var(--basis-text-muted));
}

body.basis-ui-v3 .text-slate-100,
body.basis-ui-v3 .text-slate-200,
body.basis-ui-v3 .text-slate-300 {
  color: rgb(var(--basis-text-primary)) !important;
}

body.basis-ui-v3 .text-slate-400,
body.basis-ui-v3 .text-slate-500 {
  color: rgb(var(--basis-text-secondary)) !important;
}

body.basis-ui-v3 .text-slate-600,
body.basis-ui-v3 .text-slate-700 {
  color: rgb(var(--basis-text-muted)) !important;
}

body.basis-ui-v3 .text-indigo-100,
body.basis-ui-v3 .text-indigo-200,
body.basis-ui-v3 .text-indigo-300 {
  color: rgb(var(--basis-text-primary)) !important;
}

body.basis-ui-v3 .border-slate-800,
body.basis-ui-v3 .border-slate-700,
body.basis-ui-v3 .border-slate-800\/80 {
  border-color: rgba(var(--basis-border), 0.08) !important;
}

body.basis-ui-v3 .hover\:border-slate-800:hover {
  border-color: rgba(var(--basis-border-strong), 0.14) !important;
}

body.basis-ui-v3 .bg-slate-950,
body.basis-ui-v3 .bg-slate-950\/40,
body.basis-ui-v3 .bg-slate-950\/50,
body.basis-ui-v3 .bg-slate-950\/60,
body.basis-ui-v3 .bg-slate-950\/70,
body.basis-ui-v3 .bg-slate-900\/40,
body.basis-ui-v3 .bg-slate-900\/50,
body.basis-ui-v3 .bg-slate-900\/60,
body.basis-ui-v3 .bg-slate-900\/70,
body.basis-ui-v3 .bg-slate-800,
body.basis-ui-v3 .bg-slate-800\/70 {
  background-color: rgb(var(--basis-surface)) !important;
}

body.basis-ui-v3 .bg-indigo-950\/20 {
  background: rgba(52, 211, 153, 0.12) !important;
}

body.basis-ui-v3 .hover\:bg-slate-900\/60:hover,
body.basis-ui-v3 .hover\:bg-slate-900:hover,
body.basis-ui-v3 .hover\:bg-slate-950\/30:hover {
  background: rgb(var(--basis-surface-2)) !important;
}

body.basis-ui-v3 a.border-slate-800.basis-ring,
body.basis-ui-v3 button.border-slate-800.basis-ring:not(.basis-btn-primary),
body.basis-ui-v3 summary.border-slate-800.basis-ring {
  background: transparent !important;
  border-color: rgba(var(--basis-border), 0.12) !important;
  color: rgb(var(--basis-text-primary));
}

body.basis-ui-v3 a.border-slate-800.basis-ring:hover,
body.basis-ui-v3 button.border-slate-800.basis-ring:not(.basis-btn-primary):hover,
body.basis-ui-v3 summary.border-slate-800.basis-ring:hover {
  background: rgb(var(--basis-surface-2)) !important;
  border-color: rgba(var(--basis-border-strong), 0.14) !important;
}

body.basis-ui-v3 .shadow-lg,
body.basis-ui-v3 .shadow-indigo-500\/5,
body.basis-ui-v3 .shadow-indigo-500\/10 {
  box-shadow: none !important;
}

body.basis-ui-v3 .rounded,
body.basis-ui-v3 .rounded-md,
body.basis-ui-v3 .rounded-lg,
body.basis-ui-v3 .rounded-xl,
body.basis-ui-v3 .rounded-2xl,
body.basis-ui-v3 .rounded-3xl {
  border-radius: 8px !important;
}

body.basis-ui-v3 .bg-gradient-to-r,
body.basis-ui-v3 .bg-gradient-to-br,
body.basis-ui-v3 .bg-gradient-to-t,
body.basis-ui-v3 .bg-gradient-to-b,
body.basis-ui-v3 .bg-gradient-to-l {
  background-image: none !important;
}

body.basis-ui-v3 #progress-bar,
body.basis-ui-v3 .basis-progress-bar {
  background: rgb(var(--basis-accent)) !important;
}

body.basis-ui-v3 [data-basis-page="dashboard"] .basis-dashboard-stat-card {
  background: rgb(var(--basis-surface));
  border: 1px solid rgba(var(--basis-border), 0.08);
}

body.basis-ui-v3 [data-basis-page="dashboard"] .basis-dashboard-filters,
body.basis-ui-v3 [data-basis-page="dashboard"] .basis-dashboard-list {
  background: rgb(var(--basis-surface));
  border: 1px solid rgba(var(--basis-border), 0.08);
}

body.basis-ui-v3 [data-basis-page="dashboard"] .basis-dashboard-run-row {
  padding: 0.875rem 1.5rem;
}

body.basis-ui-v3 [data-basis-page="dashboard"] .basis-dashboard-run-row:hover {
  background: rgb(var(--basis-surface-2));
}

body.basis-ui-v3 [data-basis-page="dashboard"] .basis-dashboard-action {
  padding: 0.375rem 0.75rem;
  font-size: 0.75rem;
}

body.basis-ui-v3 [data-basis-page="dashboard"] .basis-dashboard-run-meta {
  font-size: 0.7rem;
}

body.basis-ui-v3 [data-basis-page="files"] .divide-y.divide-slate-800 > div.py-3\.5 {
  padding: 0.875rem 1.5rem;
}

body.basis-ui-v3 [data-basis-page="new-run"] .basis-example-card,
body.basis-ui-v3 [data-basis-page="new-run"] .basis-preset-panel,
body.basis-ui-v3 [data-basis-page="new-run"] .basis-preset-btn {
  border-color: rgba(var(--basis-border), 0.08) !important;
  box-shadow: none;
}

body.basis-ui-v3 [data-basis-page="new-run"] .basis-preset-btn:hover {
  border-color: rgba(var(--basis-border-strong), 0.14) !important;
  background: rgb(var(--basis-surface-2)) !important;
}

body.basis-ui-v3 [data-basis-page="run-detail"] .basis-card,
body.basis-ui-v3 [data-basis-page="support"] .basis-card,
body.basis-ui-v3 [data-basis-page="profile"] .basis-card,
body.basis-ui-v3 [data-basis-page="landing"] .basis-card,
body.basis-ui-v3 [data-basis-page="auth-login"] .basis-card,
body.basis-ui-v3 [data-basis-page="auth-register"] .basis-card,
body.basis-ui-v3 [data-basis-page="about"] .basis-card,
body.basis-ui-v3 [data-basis-page="privacy"] .basis-card,
body.basis-ui-v3 [data-basis-page="terms"] .basis-card,
body.basis-ui-v3 [data-basis-page^="admin-"] .basis-card {
  border: 1px solid rgba(var(--basis-border), 0.08);
}

body.basis-ui-v3 .basis-drawer {
  background: rgb(var(--basis-surface));
  border-left: 1px solid rgba(var(--basis-border), 0.08);
  box-shadow: none;
}

body.basis-ui-v3 .basis-drawer-handle::after {
  background: rgba(var(--basis-border), 0.16);
  border: 1px solid rgba(var(--basis-border), 0.14);
}

body.basis-ui-v3 .basis-drawer-handle:hover::after,
body.basis-ui-v3.basis-drawer-resizing .basis-drawer-handle::after {
  background: rgba(52, 211, 153, 0.3);
  border-color: rgba(52, 211, 153, 0.5);
}

body.basis-ui-v3 .basis-toast {
  background: rgb(var(--basis-surface));
  border: 1px solid rgba(var(--basis-border), 0.12);
  border-radius: 8px;
  box-shadow: none;
  backdrop-filter: none;
}

body.basis-ui-v3 .basis-toast__msg {
  color: rgb(var(--basis-text-primary));
}

body.basis-ui-v3 .basis-toast--success {
  border-color: rgba(52, 211, 153, 0.45);
}

body.basis-ui-v3 .basis-toast--error,
body.basis-ui-v3 .basis-toast--info {
  border-color: rgba(var(--basis-border), 0.18);
}

body.basis-ui-v3 *::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.2);
  border: 2px solid rgb(var(--basis-bg));
}

body.basis-ui-v3 *::-webkit-scrollbar-track {
  background: rgb(var(--basis-bg));
}

/* V3 micro-polish pass: tighter information density + cleaner hierarchy */
body.basis-ui-v3 #basis-page-shell {
  padding-top: 0.9rem;
  padding-bottom: 1.1rem;
}

body.basis-ui-v3 #basis-page-shell > header.basis-card {
  padding: 0.65rem 0.85rem;
  margin-bottom: 1rem;
}

body.basis-ui-v3 #basis-page-shell > header nav {
  gap: 0.35rem;
}

body.basis-ui-v3 #basis-page-shell > header nav a,
body.basis-ui-v3 #basis-page-shell > header nav button,
body.basis-ui-v3 #basis-page-shell > header nav summary {
  border-radius: 8px;
  font-size: 0.78rem;
  line-height: 1.1rem;
  padding: 0.45rem 0.7rem;
}

body.basis-ui-v3 #basis-page-shell > header nav .basis-btn-primary {
  padding: 0.5rem 0.95rem;
}

body.basis-ui-v3 footer {
  margin-top: 1.75rem;
  color: rgb(var(--basis-text-muted));
}

body.basis-ui-v3 .basis-admin-toggle,
body.basis-ui-v3 .basis-toggle {
  border: 1px solid rgba(var(--basis-border), 0.12);
  background: rgb(var(--basis-surface));
  border-radius: 8px;
  padding: 0.25rem 0.45rem;
}

body.basis-ui-v3 .basis-admin-toggle__label,
body.basis-ui-v3 .basis-admin-toggle__state,
body.basis-ui-v3 .basis-toggle__label {
  color: rgb(var(--basis-text-secondary));
}

body.basis-ui-v3 .basis-dashboard-stat-value,
body.basis-ui-v3 [data-basis-page="dashboard"] .text-2xl,
body.basis-ui-v3 [data-basis-page="files"] .text-2xl,
body.basis-ui-v3 [data-basis-page="new-run"] .text-2xl,
body.basis-ui-v3 [data-basis-page="run-detail"] .text-2xl {
  letter-spacing: -0.02em;
}

body.basis-ui-v3 [data-basis-page="dashboard"] .basis-dashboard-run-list,
body.basis-ui-v3 [data-basis-page="files"] .divide-y {
  border-top: 1px solid rgba(var(--basis-border), 0.08);
}

body.basis-ui-v3 [data-basis-page="dashboard"] .basis-dashboard-run-row,
body.basis-ui-v3 [data-basis-page="files"] .divide-y > div.py-3\.5 {
  min-height: 4rem;
  border-bottom: 1px solid rgba(var(--basis-border), 0.06);
}

body.basis-ui-v3 [data-basis-page="dashboard"] .basis-dashboard-run-title,
body.basis-ui-v3 [data-basis-page="files"] a.text-indigo-200 {
  color: rgb(var(--basis-text-primary)) !important;
}

body.basis-ui-v3 [data-basis-page="dashboard"] .basis-dashboard-run-title:hover,
body.basis-ui-v3 [data-basis-page="files"] a.text-indigo-200:hover,
body.basis-ui-v3 [data-basis-page="run-detail"] a.text-indigo-200:hover,
body.basis-ui-v3 [data-basis-page="landing"] a.text-indigo-300:hover {
  color: rgb(var(--basis-accent)) !important;
}

body.basis-ui-v3 [data-basis-page="dashboard"] .basis-dashboard-action,
body.basis-ui-v3 [data-basis-page="files"] .basis-ring,
body.basis-ui-v3 [data-basis-page="run-detail"] .basis-ring {
  border-color: rgba(var(--basis-border), 0.12) !important;
}

body.basis-ui-v3 [data-basis-page="dashboard"] .basis-dashboard-action:hover,
body.basis-ui-v3 [data-basis-page="files"] .basis-ring:hover,
body.basis-ui-v3 [data-basis-page="run-detail"] .basis-ring:hover {
  border-color: rgba(var(--basis-border-strong), 0.14) !important;
}

body.basis-ui-v3 [data-basis-page="new-run"] .basis-new-run-intro,
body.basis-ui-v3 [data-basis-page="new-run"] .basis-new-run-form {
  border: 1px solid rgba(var(--basis-border), 0.08);
}

body.basis-ui-v3 [data-basis-page="new-run"] .basis-new-run-intro {
  padding: 1.1rem;
}

body.basis-ui-v3 [data-basis-page="new-run"] .basis-new-run-form {
  padding: 1.1rem;
}

body.basis-ui-v3 [data-basis-page="new-run"] .basis-new-run-textarea {
  min-height: 7.5rem;
}

body.basis-ui-v3 [data-basis-page="new-run"] textarea[name="context"].basis-new-run-textarea {
  min-height: 5rem;
}

body.basis-ui-v3 [data-basis-page="run-detail"] .basis-card {
  padding: 1rem;
}

body.basis-ui-v3 [data-basis-page="run-detail"] pre,
body.basis-ui-v3 [data-basis-page="run-detail"] code {
  border-radius: 8px;
  border-color: rgba(var(--basis-border), 0.1) !important;
}

body.basis-ui-v3 [data-basis-page="run-detail"] #log-tail {
  font-size: 0.73rem;
  line-height: 1.08rem;
  background: rgb(var(--basis-surface-2));
}

body.basis-ui-v3 [data-basis-page="run-detail"] .basis-collapsible > summary,
body.basis-ui-v3 [data-basis-page^="admin-"] summary {
  color: rgb(var(--basis-text-secondary));
}

body.basis-ui-v3 [data-basis-page="landing"] section.basis-card {
  border-radius: 8px !important;
  padding: 1.25rem;
}

body.basis-ui-v3 [data-basis-page="landing"] .inline-flex.rounded-full {
  border-radius: 6px;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 0.68rem;
  letter-spacing: 0.02em;
}

body.basis-ui-v3 [data-basis-page="landing"] h1 {
  font-size: clamp(2rem, 5.2vw, 3.35rem);
  line-height: 1.02;
}

body.basis-ui-v3 [data-basis-page^="admin-"] table {
  border-collapse: collapse;
}

body.basis-ui-v3 [data-basis-page^="admin-"] table tr {
  border-bottom: 1px solid rgba(var(--basis-border), 0.08);
}

body.basis-ui-v3 [data-basis-page^="admin-"] table th,
body.basis-ui-v3 [data-basis-page^="admin-"] table td {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

body.basis-ui-v3 [data-basis-page="auth-login"] .basis-card,
body.basis-ui-v3 [data-basis-page="auth-register"] .basis-card,
body.basis-ui-v3 [data-basis-page="profile"] .basis-card,
body.basis-ui-v3 [data-basis-page="support"] .basis-card,
body.basis-ui-v3 [data-basis-page="about"] .basis-card,
body.basis-ui-v3 [data-basis-page="privacy"] .basis-card,
body.basis-ui-v3 [data-basis-page="terms"] .basis-card {
  padding: 1rem;
}

body.basis-ui-v3 [data-basis-page^="run-"] .basis-card {
  padding: 1rem;
}

/* =====================================================================
   V3 Precision Lab final override (2026-02-27)
   ===================================================================== */
body.basis-ui-v3 {
  --basis-bg: 0 0 0;
  --basis-surface: 10 10 10;
  --basis-surface-hover: 17 17 17;
  --basis-surface-2: 17 17 17;
  --basis-border: 255 255 255;
  --basis-text-primary: 250 250 250;
  --basis-text-secondary: 161 161 170;
  --basis-text-muted: 113 113 122;
  --basis-accent: 52 211 153;
  --basis-accent-hover: 134 239 172;
  --basis-btn-primary-bg: 255 255 255;
  --basis-btn-primary-fg: 0 0 0;
  --basis-sidebar-open-width: 240px;
  --basis-sidebar-collapsed-width: 64px;
  --basis-sidebar-width: var(--basis-sidebar-open-width);

  background: rgb(var(--basis-bg));
  color: rgb(var(--basis-text-primary));
  color-scheme: dark;
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
}

body.basis-ui-v3.basis-has-sidebar.basis-sidebar-collapsed {
  --basis-sidebar-width: var(--basis-sidebar-collapsed-width);
}

body.basis-ui-v3 .basis-ui-v3-hidden {
  display: none !important;
}

body.basis-ui-v3 h1,
body.basis-ui-v3 h2,
body.basis-ui-v3 h3,
body.basis-ui-v3 h4,
body.basis-ui-v3 .basis-topbar-title,
body.basis-ui-v3 .basis-dashboard-run-title,
body.basis-ui-v3 .basis-new-run-title {
  font-family: "Satoshi", "Space Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-weight: 650;
  letter-spacing: -0.02em;
}

body.basis-ui-v3 .font-mono,
body.basis-ui-v3 code,
body.basis-ui-v3 pre,
body.basis-ui-v3 .basis-chip,
body.basis-ui-v3 .basis-pill,
body.basis-ui-v3 .basis-dashboard-run-meta {
  font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace !important;
}

body.basis-ui-v3 .basis-bg {
  background: rgb(var(--basis-bg));
}

body.basis-ui-v3 .basis-bg::after {
  display: none;
}

body.basis-ui-v3.basis-has-sidebar #basis-page-shell {
  width: 100%;
  max-width: none;
  min-height: 100vh;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: var(--basis-sidebar-width) minmax(0, 1fr);
}

body.basis-ui-v3 #basis-main-shell {
  min-width: 0;
  padding: 16px 20px 20px;
}

body.basis-ui-v3 .basis-card {
  background: #0a0a0a;
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 8px;
  box-shadow: none;
  backdrop-filter: none;
}

body.basis-ui-v3 .basis-btn-primary {
  background: #ffffff;
  color: #000000;
  font-weight: 600;
  border: none;
  padding: 0.75rem 1.5rem;
  border-radius: 8px;
  transition: all 120ms ease;
  box-shadow: none;
}

body.basis-ui-v3 .basis-btn-primary:hover {
  background: rgba(255, 255, 255, 0.95);
  filter: none;
}

body.basis-ui-v3 .basis-btn-primary:active {
  transform: scale(0.985);
}

body.basis-ui-v3 .basis-dashboard-action,
body.basis-ui-v3 a.basis-ring:not(.basis-btn-primary),
body.basis-ui-v3 button.basis-ring:not(.basis-btn-primary),
body.basis-ui-v3 summary.basis-ring,
body.basis-ui-v3 .basis-sidebar-link {
  background: transparent;
  color: rgb(var(--basis-text-primary));
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 8px;
  transition: border-color 120ms ease, background-color 120ms ease, color 120ms ease, transform 100ms ease;
  box-shadow: none;
}

body.basis-ui-v3 .basis-dashboard-action:hover,
body.basis-ui-v3 a.basis-ring:not(.basis-btn-primary):hover,
body.basis-ui-v3 button.basis-ring:not(.basis-btn-primary):hover,
body.basis-ui-v3 summary.basis-ring:hover {
  border-color: rgba(255, 255, 255, 0.18);
  background: #111111;
  color: rgb(var(--basis-text-primary));
}

body.basis-ui-v3 .basis-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.125rem 0.5rem;
  border-radius: 6px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: #111111;
  color: rgb(var(--basis-text-secondary));
  font-size: 0.68rem;
  line-height: 1rem;
  text-transform: lowercase;
}

body.basis-ui-v3 .basis-pill--succeeded {
  background: rgba(6, 78, 59, 0.65);
  color: #34d399;
  border-color: rgba(16, 185, 129, 0.4);
}

body.basis-ui-v3 .basis-pill--running {
  background: rgba(52, 211, 153, 0.15);
  color: #34d399;
  border-color: rgba(52, 211, 153, 0.3);
}

body.basis-ui-v3 .basis-pill--failed {
  background: rgba(127, 29, 29, 0.55);
  color: #fca5a5;
  border-color: rgba(248, 113, 113, 0.35);
}

body.basis-ui-v3 .basis-pill--cancelled,
body.basis-ui-v3 .basis-pill--paused,
body.basis-ui-v3 .basis-pill--queued {
  background: #111111;
  color: rgb(var(--basis-text-secondary));
  border-color: rgba(255, 255, 255, 0.12);
}

body.basis-ui-v3 .basis-chip {
  border-radius: 6px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: #111111;
  color: rgb(var(--basis-text-secondary));
  padding: 0.18rem 0.45rem;
  font-size: 0.65rem;
}

body.basis-ui-v3 .basis-ring:focus,
body.basis-ui-v3 .basis-ring:focus-visible {
  outline: none;
  box-shadow: 0 0 0 1px #34d399, 0 0 0 3px rgba(52, 211, 153, 0.2);
}

body.basis-ui-v3 input[type="text"],
body.basis-ui-v3 input[type="email"],
body.basis-ui-v3 input[type="password"],
body.basis-ui-v3 input[type="number"],
body.basis-ui-v3 input[type="date"],
body.basis-ui-v3 input[type="file"],
body.basis-ui-v3 textarea,
body.basis-ui-v3 select {
  background: #111111 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 8px !important;
  color: rgb(var(--basis-text-primary)) !important;
  padding: 0.75rem 1rem;
}

body.basis-ui-v3 input[type="text"]:focus,
body.basis-ui-v3 input[type="email"]:focus,
body.basis-ui-v3 input[type="password"]:focus,
body.basis-ui-v3 input[type="number"]:focus,
body.basis-ui-v3 input[type="date"]:focus,
body.basis-ui-v3 input[type="file"]:focus,
body.basis-ui-v3 textarea:focus,
body.basis-ui-v3 select:focus {
  border-color: #34d399 !important;
  box-shadow: 0 0 0 1px #34d399;
}

body.basis-ui-v3 ::placeholder {
  color: rgb(var(--basis-text-muted));
}

body.basis-ui-v3 .basis-switch-track {
  background: #111111;
  border: 1px solid rgba(255, 255, 255, 0.12);
}

body.basis-ui-v3 .basis-switch input:checked ~ .basis-switch-track {
  background: rgba(52, 211, 153, 0.2);
  border-color: rgba(52, 211, 153, 0.35);
}

body.basis-ui-v3 .basis-switch-thumb {
  background: #fafafa;
}

body.basis-ui-v3 .basis-sidebar {
  position: sticky;
  top: 0;
  height: 100vh;
  min-height: 100vh;
  padding: 10px;
  border-right: 1px solid rgba(255, 255, 255, 0.06);
  background: #0a0a0a;
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow: hidden;
  z-index: 30;
}

body.basis-ui-v3 .basis-sidebar-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 4px 6px 10px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

body.basis-ui-v3 .basis-sidebar-mark {
  display: none;
  width: 32px;
  height: 32px;
  object-fit: contain;
  border-radius: 8px;
  flex-shrink: 0;
}

body.basis-ui-v3 .basis-sidebar-wordmark {
  display: block;
  width: 118px;
  height: auto;
  flex-shrink: 0;
}

body.basis-ui-v3 .basis-sidebar-nav {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  gap: 6px;
  overflow-y: auto;
  padding-right: 2px;
}

body.basis-ui-v3 .basis-sidebar-section-title {
  margin-top: 8px;
  margin-bottom: 2px;
  padding: 0 10px;
  color: rgb(var(--basis-text-muted));
  font-size: 0.65rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

body.basis-ui-v3 .basis-sidebar-link {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  min-height: 36px;
  padding: 0 10px;
  text-decoration: none;
  color: rgb(var(--basis-text-secondary));
  font-size: 0.8rem;
  border-color: rgba(255, 255, 255, 0.06);
}

body.basis-ui-v3 .basis-sidebar-link:hover {
  background: #111111;
  border-color: rgba(255, 255, 255, 0.16);
  color: rgb(var(--basis-text-primary));
}

body.basis-ui-v3 .basis-sidebar-link--sub {
  font-size: 0.76rem;
}

body.basis-ui-v3 .basis-sidebar-link--active {
  background: rgba(52, 211, 153, 0.14);
  border-color: rgba(52, 211, 153, 0.36);
  color: #34d399;
}

body.basis-ui-v3 .basis-sidebar-icon {
  width: 15px;
  height: 15px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

body.basis-ui-v3 .basis-sidebar-icon svg {
  width: 15px;
  height: 15px;
  display: block;
}

body.basis-ui-v3 .basis-sidebar-bottom {
  margin-top: 0;
  flex-shrink: 0;
  padding-top: 8px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  display: flex;
  flex-direction: column;
  gap: 8px;
}

body.basis-ui-v3 .basis-sidebar-cta {
  text-align: center;
  text-decoration: none;
  width: 100%;
}

body.basis-ui-v3 .basis-sidebar-logout {
  margin: 0;
}

body.basis-ui-v3 .basis-sidebar-link--logout {
  width: 100%;
  justify-content: flex-start;
  background: transparent;
}

body.basis-ui-v3 .basis-sidebar-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.52);
  opacity: 0;
  pointer-events: none;
  transition: opacity 140ms ease;
  z-index: 40;
}

body.basis-ui-v3 #basis-main-shell > header.basis-card {
  margin-bottom: 14px;
  padding: 10px 12px;
}

body.basis-ui-v3 .basis-topbar-title {
  font-size: 1rem;
  line-height: 1.3;
  color: rgb(var(--basis-text-primary));
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.basis-ui-v3 .basis-user-controls {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
}

body.basis-ui-v3 .basis-user-identity {
  max-width: 16rem;
  padding: 0 0.35rem;
  color: rgb(var(--basis-text-secondary));
  font-size: 0.72rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.basis-ui-v3 .basis-user-control {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2rem;
  padding: 0 0.65rem;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: transparent;
  color: rgb(var(--basis-text-secondary));
  font-size: 0.74rem;
  text-decoration: none;
  line-height: 1;
}

body.basis-ui-v3 .basis-user-control:hover {
  background: #111111;
  border-color: rgba(255, 255, 255, 0.2);
  color: rgb(var(--basis-text-primary));
}

body.basis-ui-v3 .basis-user-control--active {
  border-color: rgba(52, 211, 153, 0.38);
  color: #34d399;
  background: rgba(52, 211, 153, 0.12);
}

body.basis-ui-v3 .basis-user-control-form {
  margin: 0;
}

body.basis-ui-v3 .basis-user-control--logout {
  color: rgb(var(--basis-text-primary));
}

body.basis-ui-v3 .basis-admin-toggle,
body.basis-ui-v3 .basis-toggle {
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: #0a0a0a;
  border-radius: 8px;
  padding: 0.2rem 0.45rem;
}

body.basis-ui-v3 .basis-admin-toggle__label,
body.basis-ui-v3 .basis-admin-toggle__state,
body.basis-ui-v3 .basis-toggle__label {
  color: rgb(var(--basis-text-secondary));
  font-size: 0.68rem;
}

body.basis-ui-v3 #basis-flash-banner {
  background: #0a0a0a;
  border: 1px solid rgba(255, 255, 255, 0.08);
}

body.basis-ui-v3 footer {
  margin-top: 20px;
  color: rgb(var(--basis-text-muted));
}

body.basis-ui-v3 .text-slate-100,
body.basis-ui-v3 .text-slate-200,
body.basis-ui-v3 .text-slate-300 {
  color: rgb(var(--basis-text-primary)) !important;
}

body.basis-ui-v3 .text-slate-400,
body.basis-ui-v3 .text-slate-500 {
  color: rgb(var(--basis-text-secondary)) !important;
}

body.basis-ui-v3 .text-slate-600,
body.basis-ui-v3 .text-slate-700 {
  color: rgb(var(--basis-text-muted)) !important;
}

body.basis-ui-v3 .text-indigo-100,
body.basis-ui-v3 .text-indigo-200,
body.basis-ui-v3 .text-indigo-300 {
  color: rgb(var(--basis-text-primary)) !important;
}

body.basis-ui-v3 .hover\:text-slate-300:hover,
body.basis-ui-v3 .hover\:text-slate-100:hover,
body.basis-ui-v3 .hover\:text-indigo-300:hover,
body.basis-ui-v3 .hover\:text-indigo-200:hover {
  color: #34d399 !important;
}

body.basis-ui-v3 .border-slate-800,
body.basis-ui-v3 .border-slate-700,
body.basis-ui-v3 .border-slate-800\/80 {
  border-color: rgba(255, 255, 255, 0.08) !important;
}

body.basis-ui-v3 .bg-slate-950,
body.basis-ui-v3 .bg-slate-950\/40,
body.basis-ui-v3 .bg-slate-950\/50,
body.basis-ui-v3 .bg-slate-950\/60,
body.basis-ui-v3 .bg-slate-950\/70,
body.basis-ui-v3 .bg-slate-900\/40,
body.basis-ui-v3 .bg-slate-900\/50,
body.basis-ui-v3 .bg-slate-900\/60,
body.basis-ui-v3 .bg-slate-900\/70,
body.basis-ui-v3 .bg-slate-800,
body.basis-ui-v3 .bg-slate-800\/70 {
  background-color: #0a0a0a !important;
}

body.basis-ui-v3 .hover\:bg-slate-900\/60:hover,
body.basis-ui-v3 .hover\:bg-slate-900:hover,
body.basis-ui-v3 .hover\:bg-slate-950\/30:hover {
  background: #111111 !important;
}

body.basis-ui-v3 .bg-indigo-950\/20 {
  background: rgba(52, 211, 153, 0.12) !important;
}

body.basis-ui-v3 .shadow-lg,
body.basis-ui-v3 .shadow-indigo-500\/5,
body.basis-ui-v3 .shadow-indigo-500\/10 {
  box-shadow: none !important;
}

body.basis-ui-v3 .rounded,
body.basis-ui-v3 .rounded-md,
body.basis-ui-v3 .rounded-lg,
body.basis-ui-v3 .rounded-xl,
body.basis-ui-v3 .rounded-2xl,
body.basis-ui-v3 .rounded-3xl,
body.basis-ui-v3 .rounded-full {
  border-radius: 8px !important;
}

body.basis-ui-v3 .bg-gradient-to-r,
body.basis-ui-v3 .bg-gradient-to-l,
body.basis-ui-v3 .bg-gradient-to-b,
body.basis-ui-v3 .bg-gradient-to-t,
body.basis-ui-v3 .bg-gradient-to-br,
body.basis-ui-v3 .bg-gradient-to-bl {
  background-image: none !important;
}

body.basis-ui-v3 [style*="linear-gradient"],
body.basis-ui-v3 [style*="radial-gradient"] {
  background-image: none !important;
}

body.basis-ui-v3 #progress-bar,
body.basis-ui-v3 .basis-progress-bar {
  background: #34d399 !important;
}

body.basis-ui-v3 [data-basis-page="dashboard"] .basis-dashboard-stat-card {
  padding: 0.85rem;
}

body.basis-ui-v3 [data-basis-page="dashboard"] .basis-dashboard-stat-value {
  font-size: clamp(2rem, 3.2vw, 3rem);
  line-height: 1;
  letter-spacing: -0.03em;
}

body.basis-ui-v3 [data-basis-page="dashboard"] .basis-dashboard-stat-success {
  color: #34d399 !important;
}

body.basis-ui-v3 [data-basis-page="dashboard"] .basis-dashboard-filters {
  padding: 0.9rem;
}

body.basis-ui-v3 [data-basis-page="dashboard"] .basis-dashboard-run-row,
body.basis-ui-v3 [data-basis-page="files"] .divide-y > div.py-3\.5 {
  padding: 0.875rem 1.5rem !important;
  min-height: 62px;
}

body.basis-ui-v3 [data-basis-page="dashboard"] .basis-dashboard-run-row:hover,
body.basis-ui-v3 [data-basis-page="files"] .divide-y > div.py-3\.5:hover {
  background: #111111 !important;
}

body.basis-ui-v3 [data-basis-page="dashboard"] .basis-dashboard-run-title,
body.basis-ui-v3 [data-basis-page="files"] a.text-indigo-200 {
  font-size: 15px;
  line-height: 1.35;
  color: rgb(var(--basis-text-primary)) !important;
  text-decoration: none;
}

body.basis-ui-v3 [data-basis-page="dashboard"] .basis-dashboard-run-title:hover,
body.basis-ui-v3 [data-basis-page="files"] a.text-indigo-200:hover {
  color: #34d399 !important;
}

body.basis-ui-v3 [data-basis-page="dashboard"] .basis-dashboard-run-meta,
body.basis-ui-v3 [data-basis-page="files"] .text-xs.text-slate-500 {
  font-size: 0.68rem;
  line-height: 1.05rem;
}

body.basis-ui-v3 [data-basis-page="new-run"] .basis-new-run-intro,
body.basis-ui-v3 [data-basis-page="new-run"] .basis-new-run-form {
  padding: 1rem;
}

body.basis-ui-v3 [data-basis-page="new-run"] .basis-example-card,
body.basis-ui-v3 [data-basis-page="new-run"] .basis-preset-panel,
body.basis-ui-v3 [data-basis-page="new-run"] [class*="rounded-xl border border-slate-800 bg-slate-950/40"] {
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  background: #0a0a0a !important;
}

body.basis-ui-v3 [data-basis-page="new-run"] .basis-preset-btn {
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  background: transparent !important;
}

body.basis-ui-v3 [data-basis-page="new-run"] .basis-preset-btn:hover {
  background: #111111 !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
  color: rgb(var(--basis-text-primary)) !important;
}

body.basis-ui-v3 [data-basis-page="run-detail"] .basis-card,
body.basis-ui-v3 [data-basis-page="support"] .basis-card,
body.basis-ui-v3 [data-basis-page="profile"] .basis-card,
body.basis-ui-v3 [data-basis-page^="run-"] .basis-card,
body.basis-ui-v3 [data-basis-page^="admin-"] .basis-card,
body.basis-ui-v3 [data-basis-page="about"] .basis-card,
body.basis-ui-v3 [data-basis-page="privacy"] .basis-card,
body.basis-ui-v3 [data-basis-page="terms"] .basis-card,
body.basis-ui-v3 [data-basis-page="landing"] .basis-card,
body.basis-ui-v3 [data-basis-page="auth-login"] .basis-card,
body.basis-ui-v3 [data-basis-page="auth-register"] .basis-card {
  padding: 1rem;
}

body.basis-ui-v3 [data-basis-page="run-detail"] #log-tail,
body.basis-ui-v3 [data-basis-page="run-detail"] pre {
  background: #111111 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 8px !important;
  font-size: 0.72rem;
  line-height: 1.05rem;
}

body.basis-ui-v3 [data-basis-page="run-detail"] .basis-admin-only details,
body.basis-ui-v3 [data-basis-page="run-detail"] details.basis-admin-only {
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  padding: 0.6rem;
  overflow: hidden;
}

body.basis-ui-v3 [data-basis-page^="admin-"] table {
  border-collapse: collapse;
}

body.basis-ui-v3 [data-basis-page^="admin-"] table tr {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

body.basis-ui-v3 [data-basis-page^="admin-"] table th,
body.basis-ui-v3 [data-basis-page^="admin-"] table td {
  padding-top: 0.45rem;
  padding-bottom: 0.45rem;
}

body.basis-ui-v3 .basis-drawer {
  background: #0a0a0a;
  border-left: 1px solid rgba(255, 255, 255, 0.08);
}

body.basis-ui-v3 .basis-drawer-handle::after {
  background: rgba(255, 255, 255, 0.18);
  border: 1px solid rgba(255, 255, 255, 0.14);
}

body.basis-ui-v3 .basis-drawer-handle:hover::after,
body.basis-ui-v3.basis-drawer-resizing .basis-drawer-handle::after {
  background: rgba(52, 211, 153, 0.35);
  border-color: rgba(52, 211, 153, 0.55);
}

body.basis-ui-v3 .basis-toast {
  background: #0a0a0a;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 8px;
  box-shadow: none;
  backdrop-filter: none;
}

body.basis-ui-v3 .basis-toast__msg {
  color: rgb(var(--basis-text-primary));
}

body.basis-ui-v3 .basis-toast--success {
  border-color: rgba(52, 211, 153, 0.45);
}

body.basis-ui-v3 *::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.22);
  border: 2px solid rgb(var(--basis-bg));
}

body.basis-ui-v3 *::-webkit-scrollbar-track {
  background: rgb(var(--basis-bg));
}

@media (min-width: 1024px) {
  body.basis-ui-v3.basis-has-sidebar.basis-sidebar-collapsed .basis-sidebar-wordmark,
  body.basis-ui-v3.basis-has-sidebar.basis-sidebar-collapsed .basis-sidebar-label,
  body.basis-ui-v3.basis-has-sidebar.basis-sidebar-collapsed .basis-sidebar-section-title,
  body.basis-ui-v3.basis-has-sidebar.basis-sidebar-collapsed .basis-sidebar-cta {
    display: none !important;
  }

  body.basis-ui-v3.basis-has-sidebar.basis-sidebar-collapsed .basis-sidebar-link,
  body.basis-ui-v3.basis-has-sidebar.basis-sidebar-collapsed .basis-sidebar-link--logout,
  body.basis-ui-v3.basis-has-sidebar.basis-sidebar-collapsed .basis-sidebar-brand {
    justify-content: center;
    padding-left: 0;
    padding-right: 0;
  }

  body.basis-ui-v3.basis-has-sidebar.basis-sidebar-collapsed .basis-sidebar-mark {
    display: block !important;
    width: 28px;
    height: 28px;
  }
}

@media (max-width: 1023px) {
  body.basis-ui-v3.basis-has-sidebar #basis-page-shell {
    grid-template-columns: minmax(0, 1fr);
  }

  body.basis-ui-v3 #basis-main-shell {
    padding: 12px;
  }

  body.basis-ui-v3 .basis-sidebar {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    width: var(--basis-sidebar-open-width);
    transform: translateX(-108%);
    transition: transform 140ms ease;
    z-index: 50;
  }

  body.basis-ui-v3.basis-has-sidebar.basis-sidebar-open-mobile .basis-sidebar {
    transform: translateX(0);
  }

  body.basis-ui-v3.basis-has-sidebar.basis-sidebar-open-mobile .basis-sidebar-overlay {
    opacity: 1;
    pointer-events: auto;
  }

  body.basis-ui-v3 .basis-user-identity {
    display: none;
  }
}

/* =====================================================================
   Landing V3 (public marketing surface, keeps V1 intact)
   ===================================================================== */
body.basis-landing-v3 {
  --basis-bg: 0 0 0;
  --basis-surface: 10 10 10;
  --basis-surface-2: 17 17 17;
  --basis-border: 255 255 255;
  --basis-text-primary: 250 250 250;
  --basis-text-secondary: 161 161 170;
  --basis-text-muted: 113 113 122;
  --basis-accent: 52 211 153;

  background: rgb(var(--basis-bg));
  color: rgb(var(--basis-text-primary));
}

body.basis-landing-v3 .basis-bg {
  background: rgb(var(--basis-bg)) !important;
  background-image: none !important;
}

body.basis-landing-v3 .basis-bg::after {
  content: none !important;
  display: none !important;
  background-image: none !important;
  mask-image: none !important;
}

body.basis-landing-v3 .basis-btn-primary {
  background: #ffffff !important;
  background-image: none !important;
  color: #000000 !important;
  font-weight: 600;
  border: none !important;
  border-radius: 8px;
  padding: 0.75rem 1.5rem;
  transition: all 120ms ease;
  box-shadow: none !important;
}

body.basis-landing-v3 .basis-btn-primary:hover {
  background: rgba(255, 255, 255, 0.95) !important;
  filter: none !important;
}

body.basis-landing-v3 .basis-btn-primary:active {
  transform: scale(0.985);
}

body.basis-landing-v3 .bg-gradient-to-r,
body.basis-landing-v3 .bg-gradient-to-l,
body.basis-landing-v3 .bg-gradient-to-b,
body.basis-landing-v3 .bg-gradient-to-t,
body.basis-landing-v3 .bg-gradient-to-br,
body.basis-landing-v3 .bg-gradient-to-bl,
body.basis-landing-v3 [style*="linear-gradient"],
body.basis-landing-v3 [style*="radial-gradient"] {
  background-image: none !important;
}

body.basis-landing-v3 #basis-page-shell {
  max-width: 92rem;
  padding-top: 1rem;
  padding-bottom: 2rem;
}

body.basis-landing-v3 #basis-main-shell > header.basis-card {
  border-radius: 0 !important;
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: #0a0a0a;
  box-shadow: none !important;
}

body.basis-landing-v3 .basis-landing-v3-topnav {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

body.basis-landing-v3 .basis-landing-v3-topnav-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.25rem;
  padding: 0 0.8rem;
  border-radius: 8px;
  border: 1px solid transparent;
  color: rgb(var(--basis-text-secondary));
  text-decoration: none;
  font-size: 0.82rem;
  transition: color 120ms ease, border-color 120ms ease, background-color 120ms ease;
}

body.basis-landing-v3 .basis-landing-v3-topnav-link:hover {
  border-color: rgba(255, 255, 255, 0.14);
  color: rgb(var(--basis-text-primary));
  background: #111111;
}

body.basis-landing-v3 .basis-landing-v3-topnav-link--outline {
  border-color: rgba(255, 255, 255, 0.12);
}

[data-basis-page="landing-v3"] {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-panel,
[data-basis-page="landing-v3"] .basis-landing-v3-section {
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 8px;
  background: #0a0a0a;
  padding: 1.15rem;
}

[data-basis-page="landing-v3"] [data-reveal] {
  opacity: 0;
  transform: translateY(18px);
}

[data-basis-page="landing-v3"] [data-reveal].is-visible {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 360ms ease, transform 360ms ease;
}

[data-basis-page="landing-v3"] .basis-landing-v3-hero {
  padding: 1.4rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: 1.1rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  min-height: 1.6rem;
  padding: 0 0.58rem;
  border-radius: 6px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  font-size: 0.68rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgb(var(--basis-text-secondary));
}

[data-basis-page="landing-v3"] .basis-landing-v3-wordmark-block {
  margin-top: 0.8rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-wordmark {
  font-family: "Satoshi", "Space Grotesk", system-ui, -apple-system, sans-serif;
  font-size: clamp(1.35rem, 2.6vw, 1.85rem);
  font-weight: 650;
  letter-spacing: -0.03em;
}

[data-basis-page="landing-v3"] .basis-landing-v3-wordmark-line {
  margin-top: 0.18rem;
  width: 5.2rem;
  height: 2px;
  background: #34d399;
  border-radius: 999px;
}

[data-basis-page="landing-v3"] .basis-landing-v3-title {
  margin-top: 0.9rem;
  font-family: "Satoshi", "Space Grotesk", system-ui, -apple-system, sans-serif;
  font-size: clamp(2rem, 4.8vw, 3.5rem);
  line-height: 1.03;
  letter-spacing: -0.032em;
}

[data-basis-page="landing-v3"] .basis-landing-v3-subtitle {
  margin-top: 0.88rem;
  font-size: 1rem;
  line-height: 1.52;
  color: rgb(var(--basis-text-secondary));
  max-width: 42rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-support {
  margin-top: 0.62rem;
  font-size: 0.86rem;
  line-height: 1.52;
  color: rgb(var(--basis-text-muted));
  max-width: 40rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-actions {
  margin-top: 1rem;
  display: flex;
  align-items: center;
  gap: 0.62rem;
  flex-wrap: wrap;
}

[data-basis-page="landing-v3"] .basis-landing-v3-btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.8rem;
  padding: 0 1.2rem;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: rgb(var(--basis-text-primary));
  text-decoration: none;
  font-weight: 500;
  transition: border-color 120ms ease, background-color 120ms ease;
}

[data-basis-page="landing-v3"] .basis-landing-v3-btn-secondary:hover {
  background: #111111;
  border-color: rgba(255, 255, 255, 0.18);
}

[data-basis-page="landing-v3"] .basis-landing-v3-metrics {
  margin-top: 1rem;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.52rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-metric {
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 8px;
  padding: 0.68rem 0.72rem;
  background: #111111;
}

[data-basis-page="landing-v3"] .basis-landing-v3-metric-label {
  font-size: 0.66rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgb(var(--basis-text-muted));
}

[data-basis-page="landing-v3"] .basis-landing-v3-metric-value {
  margin-top: 0.38rem;
  font-size: 0.8rem;
  color: rgb(var(--basis-text-primary));
}

[data-basis-page="landing-v3"] .basis-landing-v3-hero-media {
  display: flex;
  flex-direction: column;
  gap: 0.72rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-video-frame {
  overflow: hidden;
  padding: 0;
}

[data-basis-page="landing-v3"] .basis-landing-v3-video {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

[data-basis-page="landing-v3"] .basis-landing-v3-video--static {
  filter: saturate(0.9);
}

[data-basis-page="landing-v3"] .basis-landing-v3-runline {
  padding: 0.72rem 0.82rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-runline-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-runline-title {
  font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.68rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgb(var(--basis-text-muted));
}

[data-basis-page="landing-v3"] .basis-landing-v3-runline .basis-pill {
  border: none;
  padding: 0.15rem 0.5rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-runline-row {
  margin-top: 0.56rem;
  display: grid;
  grid-template-columns: 78px minmax(0, 1fr);
  gap: 0.55rem;
  align-items: baseline;
}

[data-basis-page="landing-v3"] .basis-landing-v3-runline-key {
  font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.64rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgb(var(--basis-text-muted));
}

[data-basis-page="landing-v3"] .basis-landing-v3-runline-val {
  font-size: 0.8rem;
  line-height: 1.45;
  color: rgb(var(--basis-text-secondary));
}

[data-basis-page="landing-v3"] .basis-landing-v3-section-head {
  max-width: 52rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-section-kicker {
  font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.66rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgb(var(--basis-text-muted));
}

[data-basis-page="landing-v3"] .basis-landing-v3-section-title {
  margin-top: 0.48rem;
  font-family: "Satoshi", "Space Grotesk", system-ui, -apple-system, sans-serif;
  font-size: clamp(1.4rem, 2.8vw, 2rem);
  line-height: 1.1;
  letter-spacing: -0.02em;
}

[data-basis-page="landing-v3"] .basis-landing-v3-section-copy {
  margin-top: 0.72rem;
  font-size: 0.92rem;
  line-height: 1.55;
  color: rgb(var(--basis-text-secondary));
}

[data-basis-page="landing-v3"] .basis-landing-v3-feature-grid {
  margin-top: 0.92rem;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.58rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-feature {
  padding: 0.86rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-feature h3 {
  font-size: 1rem;
  letter-spacing: -0.015em;
}

[data-basis-page="landing-v3"] .basis-landing-v3-feature p {
  margin-top: 0.52rem;
  font-size: 0.84rem;
  line-height: 1.52;
  color: rgb(var(--basis-text-secondary));
}

[data-basis-page="landing-v3"] .basis-landing-v3-split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0.62rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-process,
[data-basis-page="landing-v3"] .basis-landing-v3-image-panel {
  padding: 0.88rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-steps {
  margin-top: 0.72rem;
  list-style: none;
  display: grid;
  gap: 0.66rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-steps li {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 0.66rem;
  align-items: start;
  padding: 0.56rem;
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 8px;
  background: #111111;
}

[data-basis-page="landing-v3"] .basis-landing-v3-step-index {
  font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.62rem;
  line-height: 1;
  letter-spacing: 0.1em;
  color: #34d399;
  padding-top: 0.22rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-steps h3 {
  font-size: 0.92rem;
  letter-spacing: -0.01em;
}

[data-basis-page="landing-v3"] .basis-landing-v3-steps p {
  margin-top: 0.34rem;
  font-size: 0.79rem;
  line-height: 1.45;
  color: rgb(var(--basis-text-secondary));
}

[data-basis-page="landing-v3"] .basis-landing-v3-image-panel img {
  width: 100%;
  height: 100%;
  min-height: 320px;
  object-fit: cover;
  border-radius: 8px;
}

[data-basis-page="landing-v3"] .basis-landing-v3-output-grid {
  margin-top: 0.88rem;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.56rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-output {
  padding: 0.82rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-output h3 {
  font-size: 0.9rem;
  letter-spacing: -0.01em;
}

[data-basis-page="landing-v3"] .basis-landing-v3-output p {
  margin-top: 0.42rem;
  font-size: 0.8rem;
  line-height: 1.45;
  color: rgb(var(--basis-text-secondary));
}

[data-basis-page="landing-v3"] .basis-landing-v3-persona-grid {
  margin-top: 0.88rem;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.56rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-persona {
  padding: 0.86rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-persona h3 {
  font-size: 0.92rem;
  letter-spacing: -0.01em;
}

[data-basis-page="landing-v3"] .basis-landing-v3-persona p {
  margin-top: 0.44rem;
  font-size: 0.81rem;
  line-height: 1.45;
  color: rgb(var(--basis-text-secondary));
}

[data-basis-page="landing-v3"] .basis-landing-v3-proof-strip {
  margin-top: 0.9rem;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.4rem;
  padding: 0.72rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-proof-item {
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 8px;
  background: #111111;
  padding: 0.56rem;
  display: grid;
  gap: 0.22rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-proof-label {
  font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.63rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgb(var(--basis-text-muted));
}

[data-basis-page="landing-v3"] .basis-landing-v3-proof-value {
  font-size: 0.78rem;
  line-height: 1.4;
  color: rgb(var(--basis-text-primary));
}

[data-basis-page="landing-v3"] .basis-landing-v3-case-grid {
  margin-top: 0.88rem;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.56rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-case {
  padding: 0.86rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-case h3 {
  font-size: 0.9rem;
  letter-spacing: -0.01em;
}

[data-basis-page="landing-v3"] .basis-landing-v3-case p {
  margin-top: 0.44rem;
  font-size: 0.8rem;
  line-height: 1.45;
  color: rgb(var(--basis-text-secondary));
}

[data-basis-page="landing-v3"] .basis-landing-v3-faq-grid {
  margin-top: 0.88rem;
  display: grid;
  gap: 0.48rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-faq-item {
  padding: 0.72rem 0.8rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-faq-item > summary {
  list-style: none;
  cursor: pointer;
  font-size: 0.86rem;
  letter-spacing: -0.01em;
  color: rgb(var(--basis-text-primary));
}

[data-basis-page="landing-v3"] .basis-landing-v3-faq-item > summary::-webkit-details-marker {
  display: none;
}

[data-basis-page="landing-v3"] .basis-landing-v3-faq-item > p {
  margin-top: 0.45rem;
  font-size: 0.79rem;
  line-height: 1.46;
  color: rgb(var(--basis-text-secondary));
}

[data-basis-page="landing-v3"] .basis-landing-v3-invite {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: 0.88rem;
  padding: 1rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-invite-foot {
  margin-top: 0.82rem;
  color: rgb(var(--basis-text-muted));
  font-size: 0.82rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-invite-foot a {
  color: rgb(var(--basis-text-primary));
  text-decoration: none;
}

[data-basis-page="landing-v3"] .basis-landing-v3-invite-foot a:hover {
  color: #34d399;
}

[data-basis-page="landing-v3"] .basis-landing-v3-form {
  display: grid;
  gap: 0.66rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-form label {
  display: grid;
  gap: 0.34rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-form label > span {
  font-size: 0.78rem;
  color: rgb(var(--basis-text-secondary));
}

[data-basis-page="landing-v3"] .basis-landing-v3-form label > span em {
  font-style: normal;
  color: rgb(var(--basis-text-muted));
}

[data-basis-page="landing-v3"] .basis-landing-v3-form input,
[data-basis-page="landing-v3"] .basis-landing-v3-form textarea {
  width: 100%;
  background: #111111;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  color: rgb(var(--basis-text-primary));
  padding: 0.74rem 0.94rem;
}

[data-basis-page="landing-v3"] .basis-landing-v3-form input:focus,
[data-basis-page="landing-v3"] .basis-landing-v3-form textarea:focus {
  outline: none;
  border-color: #34d399;
  box-shadow: 0 0 0 1px #34d399;
}

[data-basis-page="landing-v3"] .basis-landing-v3-form button {
  justify-self: start;
}

[data-basis-page="landing-v3"] .basis-landing-v3-legal {
  margin: 0;
  font-size: 0.76rem;
  color: rgb(var(--basis-text-muted));
}

[data-basis-page="landing-v3"] .basis-landing-v3-legal a {
  color: rgb(var(--basis-text-primary));
  text-decoration: none;
}

[data-basis-page="landing-v3"] .basis-landing-v3-legal a:hover {
  color: #34d399;
}

@media (max-width: 1080px) {
  [data-basis-page="landing-v3"] .basis-landing-v3-hero-grid,
  [data-basis-page="landing-v3"] .basis-landing-v3-split,
  [data-basis-page="landing-v3"] .basis-landing-v3-invite {
    grid-template-columns: minmax(0, 1fr);
  }

  [data-basis-page="landing-v3"] .basis-landing-v3-feature-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  [data-basis-page="landing-v3"] .basis-landing-v3-persona-grid,
  [data-basis-page="landing-v3"] .basis-landing-v3-case-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  [data-basis-page="landing-v3"] .basis-landing-v3-proof-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  [data-basis-page="landing-v3"] .basis-landing-v3-output-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 740px) {
  body.basis-landing-v3 #basis-page-shell {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }

  body.basis-landing-v3 #basis-main-shell > header.basis-card {
    border-radius: 0 !important;
    padding-left: 0.7rem;
    padding-right: 0.7rem;
  }

  body.basis-landing-v3 .basis-landing-v3-topnav {
    gap: 0.35rem;
  }

  body.basis-landing-v3 .basis-landing-v3-topnav-link {
    padding: 0 0.55rem;
    font-size: 0.76rem;
  }

  [data-basis-page="landing-v3"] .basis-landing-v3-panel,
  [data-basis-page="landing-v3"] .basis-landing-v3-section {
    padding: 0.82rem;
  }

  [data-basis-page="landing-v3"] .basis-landing-v3-title {
    font-size: clamp(1.75rem, 10vw, 2.3rem);
  }

  [data-basis-page="landing-v3"] .basis-landing-v3-metrics,
  [data-basis-page="landing-v3"] .basis-landing-v3-feature-grid,
  [data-basis-page="landing-v3"] .basis-landing-v3-persona-grid,
  [data-basis-page="landing-v3"] .basis-landing-v3-case-grid,
  [data-basis-page="landing-v3"] .basis-landing-v3-proof-strip,
  [data-basis-page="landing-v3"] .basis-landing-v3-output-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  [data-basis-page="landing-v3"] .basis-landing-v3-runline-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.22rem;
  }

  [data-basis-page="landing-v3"] .basis-landing-v3-image-panel img {
    min-height: 240px;
  }
}

/* =====================================================================
   Auth pages V3 polish (keeps non-v3 intact)
   ===================================================================== */
body.basis-ui-v3 [data-basis-page="auth-login"].basis-auth-v3-layout,
body.basis-ui-v3 [data-basis-page="auth-register"].basis-auth-v3-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0.7rem;
  align-items: stretch;
}

body.basis-ui-v3 .basis-auth-v3-panel {
  padding: 1rem !important;
}

body.basis-ui-v3 .basis-auth-v3-marketing {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 1rem;
  min-height: 540px;
}

body.basis-ui-v3 .basis-auth-v3-kicker {
  margin-top: 0.65rem;
  font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.65rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgb(var(--basis-text-muted));
}

body.basis-ui-v3 .basis-auth-v3-title {
  margin-top: 0.55rem;
  font-size: clamp(1.35rem, 2.4vw, 1.9rem);
  line-height: 1.16;
}

body.basis-ui-v3 .basis-auth-v3-copy {
  margin-top: 0.7rem;
  max-width: 34rem;
  font-size: 0.88rem;
  line-height: 1.5;
  color: rgb(var(--basis-text-secondary));
}

body.basis-ui-v3 .basis-auth-v3-list {
  margin-top: 0.86rem;
  display: grid;
  gap: 0.44rem;
  font-size: 0.82rem;
  line-height: 1.45;
  color: rgb(var(--basis-text-secondary));
}

body.basis-ui-v3 .basis-auth-v3-list li {
  list-style: none;
  padding-left: 0.85rem;
  position: relative;
}

body.basis-ui-v3 .basis-auth-v3-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.45rem;
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: rgba(52, 211, 153, 0.9);
}

body.basis-ui-v3 .basis-auth-v3-meta {
  font-size: 0.74rem;
  color: rgb(var(--basis-text-muted));
}

body.basis-ui-v3 .basis-auth-v3-meta a {
  color: rgb(var(--basis-text-primary));
  text-decoration: none;
}

body.basis-ui-v3 .basis-auth-v3-meta a:hover {
  color: #34d399;
}

body.basis-ui-v3 .basis-auth-v3-formpanel {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}

body.basis-ui-v3 .basis-auth-v3-form-title {
  font-size: clamp(1.4rem, 2.5vw, 2rem);
  line-height: 1.14;
}

body.basis-ui-v3 .basis-auth-v3-form-copy {
  font-size: 0.84rem;
  line-height: 1.5;
  color: rgb(var(--basis-text-secondary));
}

body.basis-ui-v3 .basis-auth-v3-form {
  margin-top: 0.12rem;
  display: grid;
  gap: 0.56rem;
}

body.basis-ui-v3 .basis-auth-v3-form label {
  display: grid;
  gap: 0.28rem;
}

body.basis-ui-v3 .basis-auth-v3-form label > span {
  font-size: 0.74rem;
  color: rgb(var(--basis-text-secondary));
}

body.basis-ui-v3 .basis-auth-v3-form label > em {
  margin-top: -0.05rem;
  font-style: normal;
  font-size: 0.69rem;
  color: rgb(var(--basis-text-muted));
}

body.basis-ui-v3 .basis-auth-v3-form input {
  width: 100%;
}

body.basis-ui-v3 .basis-auth-v3-submit {
  margin-top: 0.15rem;
  width: 100%;
}

body.basis-ui-v3 .basis-auth-v3-foot {
  margin-top: auto;
  font-size: 0.79rem;
  color: rgb(var(--basis-text-secondary));
}

body.basis-ui-v3 .basis-auth-v3-foot a {
  color: rgb(var(--basis-text-primary));
  text-decoration: none;
}

body.basis-ui-v3 .basis-auth-v3-foot a:hover {
  color: #34d399;
}

@media (max-width: 940px) {
  body.basis-ui-v3 [data-basis-page="auth-login"].basis-auth-v3-layout,
  body.basis-ui-v3 [data-basis-page="auth-register"].basis-auth-v3-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  body.basis-ui-v3 .basis-auth-v3-marketing {
    min-height: 0;
    gap: 0.7rem;
  }
}