/* Scoped copy of the visual style guide token source for functional pricing components. */
/* Ampacity v7. Effective v6 values; load before styles.css.
   Geometry is also read by virtualization.js; see STYLING_CONTRACTS.md. */
.kit-surface {
  /* Light semantic palette. */
  --canvas: #fff;
  --surface: #fff;
  --subtle: #f6f7fb;
  --ink: #323338;
  --muted: #676879;
  --line: #d0d4e4;
  --accent: #0060b9;
  --accent-hover: #004f99;
  --accent-soft: #cce5ff;
  --green: #00854d;
  --green-soft: #d5f4e6;
  --amber: #946000;
  --amber-soft: #fff0c2;
  --red: #b4233d;
  --red-soft: #ffdde3;
  --blue: #6354a3;
  --blue-soft: #ece7ff;
  --group-design-ink: #316d98;
  --group-handover-ink: #8143b5;

  /* Full-colour status controls retain their contrast-corrected v6 ink. */
  --status-done-fill: #00c875;
  --status-done-ink: #17342a;
  --status-progress-fill: #fdab3d;
  --status-progress-ink: #323338;
  --status-blocked-fill: #e2445c;
  --status-blocked-ink: #231014;
  --status-planned-fill: #a25ddc;
  --status-planned-ink: #141018;
  --nest-pending-fill: #cce5ff;

  /* Type and geometry. Do not fix the root font size. */
  --sans: Arial, Helvetica, sans-serif;
  --mono: 'JetBrains', monospace;
  --rail-width: 72px;
  --sidebar-width: 279px;
  --topbar-height: 48px;
  --row-height: max(36px, 2.25rem);
  --card-height: max(116px, 7.25rem);
  --card-gap: max(12px, .75rem);
  --lane-width: max(260px, 16.25rem);
  --gantt-label-width: 16.25rem;
  --gantt-min-width: 48.75rem;
  --radius-control: 4px;
  --shadow: 0 12px 40px #27233214;

  /* Motion roles; JS dismissal timing remains in interactions.js. */
  --fast: 70ms;
  --medium: 100ms;
  --panel: 150ms;
  --form: 200ms;
  --expressive: 250ms;
  --ease-enter: cubic-bezier(0, 0, .35, 1);
  --ease-exit: cubic-bezier(.4, 0, 1, 1);
  --ease-standard: cubic-bezier(.4, 0, .2, 1);
}

[data-theme=dark] .kit-surface {
  --canvas: #191a20;
  --surface: #22232c;
  --subtle: #282a34;
  --ink: #f0eff4;
  --muted: #b0afbe;
  --line: #55596c;
  --accent: #8ec5ff;
  --accent-hover: #b7dcff;
  --accent-soft: #263e58;
  --green: #a3dbb8;
  --green-soft: #263e33;
  --amber: #e9c27e;
  --amber-soft: #423925;
  --red: #f0acb6;
  --red-soft: #472e36;
  --blue: #adccdf;
  --blue-soft: #2a3945;
  --group-design-ink: var(--ink);
  --group-handover-ink: var(--ink);
  --shadow: 0 12px 40px #0003;
}

@media (max-width: 600px) {
  .kit-surface { --rail-width: 48px; }
}

@media (prefers-reduced-motion: reduce) {
  .kit-surface {
    --fast: 0ms;
    --medium: 0ms;
    --panel: 0ms;
    --form: 0ms;
    --expressive: 0ms;
  }
}

.kit-surface{--soft:var(--subtle);--tint:var(--accent-soft);--card:var(--surface);--warm:var(--subtle);--faint:var(--muted);--bg:var(--canvas);font-family:var(--sans);color:var(--ink)}
