:root {
  --v2-color-bg: #f5f7fb;
  --v2-color-surface: #ffffff;
  --v2-color-text: #172033;
  --v2-color-muted: #667085;
  --v2-color-border: #dfe4ec;
  --v2-color-primary: #3157d5;
  --v2-color-primary-strong: #2444ad;
  --v2-color-success: #16794b;
  --v2-color-warning: #9a5b00;
  --v2-color-danger: #b42318;
  --v2-radius-sm: 8px;
  --v2-radius-md: 12px;
  --v2-radius-lg: 18px;
  --v2-shadow-sm: 0 1px 2px rgba(16, 24, 40, .06);
  --v2-shadow-md: 0 12px 30px rgba(16, 24, 40, .09);
  --v2-space-1: 4px;
  --v2-space-2: 8px;
  --v2-space-3: 12px;
  --v2-space-4: 16px;
  --v2-space-5: 24px;
  --v2-space-6: 32px;
}

*:focus-visible { outline: 3px solid rgba(49, 87, 213, .38); outline-offset: 2px; }
.v2-skip-link { position: fixed; inset-inline-start: 16px; top: -80px; z-index: 10000; padding: 10px 14px; border-radius: var(--v2-radius-sm); background: #111827; color: #fff; }
.v2-skip-link:focus { top: 12px; }
.v2-workspace { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: var(--v2-space-5); align-items: start; }
.v2-workspace__rail { display: grid; gap: var(--v2-space-4); position: sticky; top: 18px; }
.v2-toolbar { display: flex; align-items: center; gap: var(--v2-space-3); flex-wrap: wrap; padding: var(--v2-space-3); border: 1px solid var(--v2-color-border); border-radius: var(--v2-radius-md); background: var(--v2-color-surface); box-shadow: var(--v2-shadow-sm); }
.v2-toolbar[hidden] { display: none !important; }
.v2-toolbar__count { min-width: 32px; height: 32px; display: inline-grid; place-items: center; border-radius: 999px; background: var(--v2-color-primary); color: #fff; font-weight: 700; }
.v2-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--v2-space-4); }
.v2-field { display: grid; gap: var(--v2-space-2); min-width: 0; }
.v2-field--full { grid-column: 1 / -1; }
.v2-field[hidden] { display: none !important; }
.v2-field__help { color: var(--v2-color-muted); font-size: .875rem; }
.v2-field__required { color: var(--v2-color-danger); }
.v2-status-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--v2-space-3); }
.v2-metric { padding: var(--v2-space-4); border: 1px solid var(--v2-color-border); border-radius: var(--v2-radius-md); background: var(--v2-color-surface); }
.v2-metric strong { display: block; margin-top: var(--v2-space-2); font-size: clamp(1.35rem, 2vw, 2rem); color: var(--v2-color-text); }
.v2-chip { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; padding: 5px 9px; border-radius: 999px; border: 1px solid var(--v2-color-border); background: #f8fafc; color: var(--v2-color-text); font-size: .82rem; }
.v2-collision { border-color: #fdb022; background: #fffaeb; color: #7a2e0e; }
.v2-save-state { color: var(--v2-color-muted); font-size: .82rem; min-height: 1.2em; }
.v2-save-state[data-state="error"] { color: var(--v2-color-danger); }
.v2-save-state[data-state="saved"] { color: var(--v2-color-success); }
.v2-empty { padding: var(--v2-space-6); text-align: center; color: var(--v2-color-muted); border: 1px dashed var(--v2-color-border); border-radius: var(--v2-radius-md); }
.v2-table-actions { display: flex; gap: var(--v2-space-2); flex-wrap: wrap; }
.v2-form-preview { padding: var(--v2-space-4); border: 1px solid var(--v2-color-border); border-radius: var(--v2-radius-md); background: #fbfcfe; }
.v2-unsaved::after { content: "Unsaved"; margin-inline-start: 8px; color: var(--v2-color-warning); font-size: .75rem; }
.v2-a11y-status { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

@media (max-width: 1100px) {
  .v2-workspace { grid-template-columns: 1fr; }
  .v2-workspace__rail { position: static; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .v2-status-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .v2-field-grid, .v2-workspace__rail, .v2-status-grid { grid-template-columns: 1fr; }
  .v2-toolbar { align-items: stretch; }
  .v2-toolbar > * { flex: 1 1 140px; }
  .support-table { min-width: 760px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
