/**
 * BOXIES Builder Design Tokens — V7.1.05
 * Shared visual language for every Builder (Showroom, Quotation, and future).
 * Builders consume these tokens; they must not invent parallel chrome styles.
 */
:root {
  /* ── Layout / shell ── */
  --builder-header-height: var(--hall-header-h, 52px);
  --builder-rail-width: 185px;
  --builder-props-rail-width: 0px;
  --builder-dock-height: 56px;
  --builder-dock-safe: env(safe-area-inset-bottom, 0px);
  --builder-transition: var(--hall-duration, 0.28s) var(--hall-ease, cubic-bezier(0.22, 1, 0.36, 1));
  --builder-rail-collapse-duration: 0.22s;
  --builder-rail-collapse-ease: cubic-bezier(0.22, 1, 0.36, 1);

  /* ── Typography ── */
  --builder-font-family: inherit;
  --builder-font-size: 12px;
  --builder-font-size-sm: 10px;
  --builder-font-size-title: 20px;
  --builder-font-weight: 400;
  --builder-font-weight-current: 550;
  --builder-font-weight-title: 700;
  --builder-line-height: 1.25;
  --builder-line-height-title: 1.2;
  --builder-letter-spacing: 0;
  --builder-letter-spacing-title: -0.02em;

  /* ── Colors (chrome) ── */
  --builder-text: var(--hall-text, rgba(255, 255, 255, 0.94));
  --builder-text-secondary: rgba(255, 255, 255, 0.42);
  --builder-text-muted: rgba(255, 255, 255, 0.34);
  --builder-text-done: rgba(255, 255, 255, 0.72);
  --builder-text-disabled: rgba(255, 255, 255, 0.28);
  --builder-bg: rgba(8, 8, 8, 0.55);
  --builder-bg-hover: rgba(255, 255, 255, 0.03);
  --builder-bg-selected: rgba(229, 72, 77, 0.08);
  --builder-border: var(--hall-border-hairline, rgba(255, 255, 255, 0.04));
  --builder-divider: rgba(255, 255, 255, 0.05);
  --builder-accent: #e5484d;
  --builder-accent-soft: rgba(229, 72, 77, 0.08);
  --builder-success: rgba(62, 207, 142, 0.95);
  --builder-warning: rgba(220, 170, 110, 0.95);
  --builder-danger: rgba(229, 72, 77, 0.72);
  --builder-dock-bg: rgba(5, 5, 5, 0.82);
  --builder-dock-border: var(--hall-border-hairline, rgba(255, 255, 255, 0.04));

  /* ── Spacing ── */
  --builder-space-1: 4px;
  --builder-space-2: 6px;
  --builder-space-3: 8px;
  --builder-space-4: 10px;
  --builder-space-5: 12px;
  --builder-rail-pad-y: 6px;
  --builder-rail-pad-x: 0;
  --builder-rail-list-pad-x: 6px;
  --builder-rail-item-pad-y: 7px;
  --builder-rail-item-pad-x: 5px;
  --builder-rail-item-gap: 6px;
  --builder-indent: 12px;
  --builder-page-pad-x: clamp(20px, 3vw, 36px);
  --builder-page-pad-y: 16px;
  --builder-page-header-title-h: 24px;
  --builder-page-header-desc-h: 22px;

  /* ── Sidebar / rail ── */
  --builder-rail-scrollbar-size: 3px;
  --builder-rail-scrollbar-thumb: rgba(255, 255, 255, 0.16);
  --builder-rail-scrollbar-thumb-hover: rgba(255, 255, 255, 0.28);
  --builder-rail-mark-pending: rgba(229, 72, 77, 0.72);
  --builder-rail-mark-done: rgba(62, 207, 142, 0.95);
  --builder-rail-current-bar: #e5484d;

  /* ── Float collapse handle ── */
  --builder-float-w: 16px;
  --builder-float-h: 72px;
  --builder-float-radius: 0 7px 7px 0;
  --builder-float-bg: rgba(8, 8, 8, 0.92);
  --builder-float-bg-hover: rgba(10, 10, 10, 0.96);
  --builder-float-border: rgba(255, 255, 255, 0.07);
  --builder-float-color: rgba(255, 255, 255, 0.38);

  /* ── Items ── */
  --builder-item-radius: 0;
  --builder-item-transition: background 0.18s ease, box-shadow 0.18s ease;
  --builder-focus-ring: 0 0 0 1px rgba(255, 255, 255, 0.16);
}