/* TC008 Web Image Flow — design tokens */
@layer tenant {
  .tenant-body--website-image-platform {
    --wif-font-sans: 'IBM Plex Sans', system-ui, sans-serif;
    --wif-font-mono: ui-monospace, 'Cascadia Code', 'Segoe UI Mono', monospace;
    --wif-bg: #eef0f4;
    --wif-surface: #ffffff;
    --wif-surface-2: #e4e8ef;
    --wif-grid: #d8dde6;
    --wif-text: #0f172a;
    --wif-text-muted: #475569;
    --wif-border: #cbd5e1;
    --wif-accent: #5b21b6;
    --wif-accent-2: #0891b2;
    --wif-on-accent: #ffffff;
    --wif-accent-soft: color-mix(in srgb, var(--wif-accent) 10%, transparent);
    --wif-success: #047857;
    --wif-max-width: 1160px;
    --wif-gutter: clamp(1rem, 3vw, 2rem);
    --wif-radius-sm: 2px;
    --wif-radius-md: 4px;
    --wif-radius-btn: 2px;
    --it-pricing-accent: var(--wif-accent);
    --it-pricing-accent-on: var(--wif-on-accent);
    --it-pricing-toggle-track: var(--wif-surface-2);
    --it-pricing-toggle-border: var(--wif-border);
    --it-pricing-slider-track: color-mix(in srgb, var(--wif-accent-2) 28%, var(--wif-border));
    --it-pricing-slider-fill: var(--wif-accent);
    --it-pricing-text: var(--wif-text);
    --it-pricing-text-muted: var(--wif-text-muted);
    font-family: var(--wif-font-sans);
    font-size: 0.95rem;
    line-height: 1.6;
    color: var(--wif-text);
    background: var(--wif-bg);
  }
}