/* CodLab Visual System — original scoped primitives. No reset or remote fonts. */
:where(.cv-system, [data-cv-system]) {
  --cv-bg: var(--bg, #080b0f);
  --cv-bg-deep: var(--bg-deep, #05070a);
  --cv-surface: var(--surface, var(--panel, #0d1218));
  --cv-surface-raised: var(--surface-2, var(--panel-raised, #111820));
  --cv-surface-selected: var(--surface-3, #17202a);
  --cv-stroke: var(--line, #26313d);
  --cv-stroke-control: var(--line-control, #5c6b7b);
  --cv-text: var(--text, #f3f6f8);
  --cv-text-secondary: var(--text-soft, var(--muted, #b3bec9));
  --cv-text-muted: var(--text-dim, #778492);
  --cv-brand: var(--red, #c7233e);
  --cv-accent: var(--red-bright, var(--accent, #ff5267));
  --cv-pass: var(--green, var(--lime, #6fd3a5));
  --cv-caution: var(--amber, var(--orange, #dfb060));
  --cv-font-sans: var(--font-sans, Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
  --cv-font-mono: var(--font-mono, "SFMono-Regular", Consolas, "Liberation Mono", monospace);
  --cv-space-1: .25rem;
  --cv-space-2: .5rem;
  --cv-space-3: .75rem;
  --cv-space-4: 1rem;
  --cv-space-5: 1.5rem;
  --cv-space-6: 2rem;
  --cv-space-7: 3rem;
  --cv-space-8: 4rem;
  --cv-type-label: .75rem;
  --cv-type-caption: .8125rem;
  --cv-type-body: 1rem;
  --cv-type-title: 1.25rem;
  --cv-type-heading: clamp(1.5rem, 2.5vw, 2rem);
  --cv-type-display: clamp(2.5rem, 6vw, 5.5rem);
  --cv-leading-body: 1.65;
  --cv-leading-title: 1.15;
  --cv-radius: var(--radius, 12px);
  --cv-radius-control: 8px;
  --cv-line-weight: 1px;
  --cv-icon-weight: 1.5;
  --cv-depth-1: 0 8px 24px rgb(0 0 0 / .18);
  --cv-depth-2: 0 20px 48px rgb(0 0 0 / .28);
  --cv-motion-fast: 160ms;
  --cv-motion-base: 240ms;
  --cv-motion-slow: 900ms;
  --cv-motion-ease: cubic-bezier(.22, .68, .2, 1);
}

/* Private fallbacks make a named component work without a wrapper. */
:where(.v-surface, .v-card, .v-card__header, .v-card__footer, .v-icon, .v-eyebrow, .v-status, .v-stat, .v-progress, .v-button, .v-link, .v-grid, .v-stack, .v-cluster, .v-divider, .v-code, .v-title, .v-copy, .v-note) {
  --_cv-surface: var(--cv-surface, var(--surface, var(--panel, #0d1218)));
  --_cv-raised: var(--cv-surface-raised, var(--surface-2, var(--panel-raised, #111820)));
  --_cv-selected: var(--cv-surface-selected, var(--surface-3, #17202a));
  --_cv-line: var(--cv-stroke, var(--line, #26313d));
  --_cv-control: var(--cv-stroke-control, var(--line-control, #5c6b7b));
  --_cv-text: var(--cv-text, var(--text, #f3f6f8));
  --_cv-secondary: var(--cv-text-secondary, var(--text-soft, var(--muted, #b3bec9)));
  --_cv-accent: var(--cv-accent, var(--red-bright, var(--accent, #ff5267)));
  --_cv-brand: var(--cv-brand, var(--red, #c7233e));
  --_cv-pass: var(--cv-pass, var(--green, var(--lime, #6fd3a5)));
  --_cv-caution: var(--cv-caution, var(--amber, var(--orange, #dfb060)));
  --_cv-sans: var(--cv-font-sans, var(--font-sans, Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif));
  --_cv-mono: var(--cv-font-mono, var(--font-mono, "SFMono-Regular", Consolas, "Liberation Mono", monospace));
  box-sizing: border-box;
}

:where(.v-surface, .v-card) {
  min-width: 0;
  color: var(--_cv-text);
  background: var(--_cv-surface);
  border: var(--cv-line-weight, 1px) solid var(--_cv-line);
  border-radius: var(--cv-radius, 12px);
}
.v-surface { padding: var(--cv-space-5, 1.5rem); }
.v-surface--raised { background: var(--_cv-raised); box-shadow: var(--cv-depth-1, 0 8px 24px rgb(0 0 0 / .18)); }
.v-card { position: relative; padding: var(--cv-space-5, 1.5rem); font-family: var(--_cv-sans); }
.v-card::before { content: ""; position: absolute; inset: 16px auto auto -1px; width: 2px; height: 20px; background: var(--v-card-accent, var(--_cv-line)); pointer-events: none; }
.v-card__header { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--cv-space-4, 1rem); margin-bottom: var(--cv-space-4, 1rem); }
.v-card__footer { display: flex; flex-wrap: wrap; align-items: center; gap: var(--cv-space-3, .75rem); margin-top: var(--cv-space-5, 1.5rem); padding-top: var(--cv-space-4, 1rem); border-top: 1px solid var(--_cv-line); }
.v-card[data-state="empty"] { --v-card-accent: var(--_cv-secondary); border-style: dashed; }
.v-card[data-state="unknown"] { --v-card-accent: var(--_cv-secondary); }
.v-card[data-state="busy"] { --v-card-accent: var(--_cv-accent); }
.v-card[data-state="error"] { --v-card-accent: var(--_cv-accent); }
.v-card[data-state="caution"] { --v-card-accent: var(--_cv-caution); }
.v-card[data-state="success"] { --v-card-accent: var(--_cv-pass); }
.v-card--interactive { transition: border-color var(--cv-motion-fast, 160ms) var(--cv-motion-ease, ease), background-color var(--cv-motion-fast, 160ms) var(--cv-motion-ease, ease); }
.v-card--interactive:hover { border-color: var(--_cv-control); background-color: var(--_cv-raised); }
.v-card--interactive:focus-visible { outline: 2px solid var(--_cv-text); outline-offset: 4px; }

.v-icon { display: inline-block; width: 24px; height: 24px; flex: 0 0 auto; vertical-align: -.2em; color: inherit; fill: none; stroke: currentColor; stroke-width: var(--cv-icon-weight, 1.5); stroke-linecap: round; stroke-linejoin: round; }
.v-icon--small { width: 18px; height: 18px; }
.v-icon--large { width: 32px; height: 32px; }
.v-eyebrow { display: flex; align-items: center; gap: var(--cv-space-2, .5rem); margin: 0 0 var(--cv-space-3, .75rem); color: var(--_cv-accent); font: 600 var(--cv-type-label, .75rem)/1.5 var(--_cv-mono); letter-spacing: .08em; text-transform: uppercase; }
.v-title { margin: 0; color: var(--_cv-text); font: 600 var(--cv-type-title, 1.25rem)/var(--cv-leading-title, 1.15) var(--_cv-sans); letter-spacing: -.025em; overflow-wrap: anywhere; }
.v-title--heading { font-size: var(--cv-type-heading, clamp(1.5rem, 2.5vw, 2rem)); }
.v-title--display { font-size: var(--cv-type-display, clamp(2.5rem, 6vw, 5.5rem)); letter-spacing: -.055em; }
.v-copy { margin: var(--cv-space-3, .75rem) 0 0; color: var(--_cv-secondary); font: 400 var(--cv-type-body, 1rem)/var(--cv-leading-body, 1.65) var(--_cv-sans); overflow-wrap: anywhere; }
.v-note { margin: 0; color: var(--_cv-secondary); font: 400 var(--cv-type-caption, .8125rem)/1.6 var(--_cv-sans); overflow-wrap: anywhere; }
.v-code { color: var(--_cv-secondary); font: 400 var(--cv-type-caption, .8125rem)/1.6 var(--_cv-mono); overflow-wrap: anywhere; }

.v-status { --v-status-color: var(--_cv-secondary); display: inline-flex; align-items: center; gap: .5rem; width: fit-content; max-width: 100%; padding: .25rem 0; color: var(--v-status-color); font: 500 var(--cv-type-label, .75rem)/1.5 var(--_cv-mono); overflow-wrap: anywhere; }
.v-status::before { content: ""; box-sizing: border-box; width: 7px; height: 7px; flex: 0 0 auto; border: 1px solid currentColor; border-radius: 50%; }
.v-status[data-state="success"] { --v-status-color: var(--_cv-pass); }
.v-status[data-state="caution"] { --v-status-color: var(--_cv-caution); }
.v-status[data-state="error"] { --v-status-color: var(--_cv-accent); }
.v-status[data-state="busy"] { --v-status-color: var(--_cv-accent); }
.v-status:is([data-state="success"], [data-state="caution"], [data-state="error"])::before { background: currentColor; }
.v-status[data-state="busy"]::before { animation: cv-status-pulse var(--cv-motion-slow, 900ms) ease-in-out infinite alternate; }
.v-status[data-state="empty"]::before { border-radius: 1px; }
.v-status[data-state="unknown"]::before { border-style: dashed; }
@keyframes cv-status-pulse { to { opacity: .45; } }

.v-stat { display: grid; align-content: start; gap: .5rem; min-width: 0; margin: 0; padding: var(--cv-space-5, 1.5rem); color: var(--_cv-text); background: var(--_cv-surface); border: 1px solid var(--_cv-line); border-radius: var(--cv-radius, 12px); }
.v-stat__label { margin: 0; color: var(--_cv-secondary); font: 500 var(--cv-type-label, .75rem)/1.5 var(--_cv-mono); }
.v-stat__value { margin: 0; color: inherit; font: 550 clamp(1.75rem, 3vw, 2.5rem)/1.15 var(--_cv-sans); font-variant-numeric: tabular-nums; letter-spacing: -.035em; overflow-wrap: anywhere; }
.v-stat__value--unknown { font-size: var(--cv-type-title, 1.25rem); color: var(--_cv-secondary); letter-spacing: -.015em; }
.v-stat__note { margin: 0; color: var(--_cv-secondary); font: 400 var(--cv-type-caption, .8125rem)/1.6 var(--_cv-sans); overflow-wrap: anywhere; }

/* Native progress provides the value, maximum and indeterminate semantics. */
progress.v-progress { --v-progress-color: var(--_cv-accent); display: block; width: 100%; min-width: 0; height: 6px; padding: 0; appearance: none; border: 0; border-radius: 3px; background: var(--_cv-selected); color: var(--v-progress-color); accent-color: var(--v-progress-color); overflow: hidden; }
progress.v-progress[data-state="success"] { --v-progress-color: var(--_cv-pass); }
progress.v-progress[data-state="caution"] { --v-progress-color: var(--_cv-caution); }
progress.v-progress[data-state="unknown"] { --v-progress-color: var(--_cv-secondary); }
progress.v-progress::-webkit-progress-bar { background: var(--_cv-selected); border-radius: 3px; }
progress.v-progress::-webkit-progress-value { background: var(--v-progress-color); border-radius: 3px; }
progress.v-progress::-moz-progress-bar { background: var(--v-progress-color); border-radius: 3px; }
progress.v-progress:not([value]) { background: repeating-linear-gradient(90deg, var(--_cv-selected) 0 12px, var(--_cv-control) 12px 16px); }
progress.v-progress:not([value])::-webkit-progress-bar { background: repeating-linear-gradient(90deg, var(--_cv-selected) 0 12px, var(--_cv-control) 12px 16px); }
progress.v-progress:not([value])::-moz-progress-bar { background: var(--_cv-control); }

.v-button { display: inline-flex; align-items: center; justify-content: center; gap: .625rem; min-height: 44px; max-width: 100%; padding: .6875rem 1rem; border: 1px solid var(--_cv-control); border-radius: var(--cv-radius-control, 8px); background: var(--_cv-raised); color: var(--_cv-text); font: 600 .875rem/1.5 var(--_cv-sans); text-align: center; text-decoration: none; cursor: pointer; transition: border-color var(--cv-motion-fast, 160ms) var(--cv-motion-ease, ease), background-color var(--cv-motion-fast, 160ms) var(--cv-motion-ease, ease); }
.v-button:hover { background: var(--_cv-selected); border-color: var(--_cv-secondary); }
.v-button--primary { background: var(--_cv-brand); border-color: var(--_cv-brand); }
.v-button--primary:hover { background: var(--_cv-accent); border-color: var(--_cv-accent); color: var(--cv-bg, var(--bg, #080b0f)); }
.v-button:is(:disabled, [aria-disabled="true"]) { color: var(--_cv-secondary); background: var(--_cv-surface); border-color: var(--_cv-line); cursor: not-allowed; }
.v-link { color: var(--_cv-text); font-family: var(--_cv-sans); text-decoration: underline; text-decoration-color: var(--_cv-control); text-underline-offset: .25em; }
.v-link:hover { text-decoration-color: var(--_cv-accent); }
:where(.v-button, .v-link):focus-visible { outline: 2px solid var(--_cv-text); outline-offset: 4px; }
.v-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); gap: var(--cv-space-4, 1rem); min-width: 0; }
.v-stack { display: flex; flex-direction: column; gap: var(--cv-space-4, 1rem); min-width: 0; }
.v-cluster { display: flex; flex-wrap: wrap; align-items: center; gap: var(--cv-space-3, .75rem); min-width: 0; }
.v-divider { margin: var(--cv-space-5, 1.5rem) 0; border: 0; border-top: 1px solid var(--_cv-line); }

/* An adopted display class must never reveal a hidden application state. */
:where(.cv-system, [data-cv-system]) [hidden],
:where(.v-surface, .v-card, .v-card__header, .v-card__footer, .v-icon, .v-eyebrow, .v-status, .v-stat, .v-progress, .v-button, .v-link, .v-grid, .v-stack, .v-cluster, .v-divider, .v-code, .v-title, .v-copy, .v-note)[hidden] { display: none !important; }

@media (prefers-reduced-motion: reduce) {
  :where(.cv-system, [data-cv-system]) { --cv-motion-fast: 0ms; --cv-motion-base: 0ms; --cv-motion-slow: 0ms; }
  :where(.cv-system, [data-cv-system]), :where(.cv-system, [data-cv-system]) *, :where(.cv-system, [data-cv-system]) *::before, :where(.cv-system, [data-cv-system]) *::after,
  :where(.v-card, .v-card::before, .v-status, .v-status::before, .v-progress, .v-button, .v-link) {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
  progress.v-progress::-moz-progress-bar { animation: none !important; transition: none !important; }
}

@media (forced-colors: active) {
  :where(.cv-system, [data-cv-system]) {
    --cv-bg: Canvas; --cv-bg-deep: Canvas; --cv-surface: Canvas; --cv-surface-raised: Canvas; --cv-surface-selected: Canvas;
    --cv-stroke: CanvasText; --cv-stroke-control: CanvasText; --cv-text: CanvasText; --cv-text-secondary: CanvasText;
    --cv-text-muted: CanvasText; --cv-brand: Highlight; --cv-accent: CanvasText; --cv-pass: CanvasText; --cv-caution: CanvasText;
    --cv-depth-1: none; --cv-depth-2: none;
  }
  :where(.v-surface, .v-card, .v-stat, .v-button) { border-color: CanvasText; box-shadow: none; }
  .v-card::before { background: CanvasText; }
  .v-status { color: CanvasText; }
  .v-link { color: LinkText; text-decoration-color: LinkText; }
  .v-button--primary { background: Highlight; color: HighlightText; }
  .v-button:disabled { color: GrayText; border-color: GrayText; }
  progress.v-progress { appearance: auto; forced-color-adjust: auto; accent-color: Highlight; }
}