/* LexForge workspace design tokens — shared by product and public demos. */

/* The hidden attribute must win over component display rules.
   The browser's own [hidden] rule is user-agent origin, so ANY author rule that sets
   display on the same element beats it — `.convert-page .btn{display:inline-flex}` is
   one, and it left every hidden button on the page visible (See plans / Buy a page pack
   on a mode error, and the Restyle button that was meant to be gated away).
   console.css carried this guard, but the graphite pages no longer load console.css,
   so it lives here: workspace-tokens.css is the one sheet all of them share. */
[hidden] { display: none !important; }

:root {
  color-scheme:light;

  /* Editorial colour ramp */
  --lf-ground:#f5f1e8;
  --lf-ground-raised:#faf8f3;
  --lf-panel:#ffffff;
  --lf-panel-raised:#ffffff;
  --lf-panel-hover:#f3efe6;
  --lf-topbar:var(--lf-material-strong);
  --lf-sidebar:color-mix(in oklab,var(--lf-ground-raised) 88%,transparent);
  --lf-input:var(--lf-panel);
  --lf-drop:var(--lf-panel);
  --lf-paper:#ffffff;
  --lf-paper-ink:#26211a;
  --lf-text-strong:#26211a;
  --lf-text:#26211a;
  --lf-text-body:rgba(38,33,26,.80);
  --lf-text-muted:rgba(38,33,26,.66);
  --lf-text-subtle:rgba(38,33,26,.64);
  --lf-line-soft:rgba(38,33,26,.10);
  --lf-line:rgba(38,33,26,.16);
  --lf-line-strong:rgba(38,33,26,.24);
  --lf-accent:#7f6235;
  --lf-accent-hover:#6f5730;
  --lf-accent-ink:#f5f1e8;
  --lf-accent-soft:rgba(127,98,53,.13);
  --lf-accent-line:rgba(127,98,53,.38);
  --lf-success:#3f6c3b;
  --lf-success-soft:rgba(63,108,59,.14);
  --lf-warning:#78551d;
  --lf-warning-soft:rgba(120,85,29,.14);
  --lf-info:#3c6281;
  --lf-info-soft:rgba(60,98,129,.14);
  --lf-danger:#a3443e;
  --lf-danger-soft:rgba(163,68,62,.12);
  --lf-btn-primary-bg:#171410;
  --lf-btn-primary-ink:#ece5d8;
  --lf-btn-primary-hover:#2b251c;

  /* Typography */
  --lf-serif:'Newsreader','Times New Roman',serif;
  --lf-sans:'IBM Plex Sans',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --lf-mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Consolas,monospace;
  --lf-text-xs:.6875rem;
  --lf-text-sm:.8125rem;
  --lf-text-ui:.875rem;
  --lf-text-body-size:.9375rem;
  --lf-text-h3:1.25rem;
  --lf-text-h2:1.75rem;
  --lf-text-h1:clamp(1.875rem,2.2vw,2.375rem);
  --lf-leading-tight:1.08;
  --lf-leading-heading:1.16;
  --lf-leading-body:1.58;
  --lf-track-display:-.025em;
  --lf-track-heading:-.015em;
  --lf-track-label:.09em;

  /* 4px rhythm */
  --lf-space-1:4px;
  --lf-space-2:8px;
  --lf-space-3:12px;
  --lf-space-4:16px;
  --lf-space-5:20px;
  --lf-space-6:24px;
  --lf-space-8:32px;
  --lf-space-10:40px;
  --lf-space-12:48px;
  --lf-space-16:64px;

  /* Shape, light and material */
  --lf-radius-xs:5px;
  --lf-radius-sm:7px;
  --lf-radius-md:10px;
  --lf-radius-lg:14px;
  --lf-radius-pill:999px;
  --lf-shadow-card:0 1px 2px rgba(38,33,26,.05),0 12px 28px -20px rgba(38,33,26,.14);
  --lf-shadow-raised:0 2px 5px rgba(38,33,26,.06),0 20px 44px -24px rgba(38,33,26,.18);
  --lf-shadow-pop:0 4px 10px rgba(38,33,26,.08),0 28px 64px -28px rgba(38,33,26,.22);
  --lf-material:rgba(250,248,243,.82);
  --lf-material-strong:rgba(245,241,232,.94);
  --lf-material-solid:#faf8f3;
  --lf-focus:0 0 0 1px var(--lf-ground),0 0 0 3px var(--lf-accent);

  /* Shared response */
  --lf-ease-out:cubic-bezier(.23,1,.32,1);
  --lf-ease-in-out:cubic-bezier(.77,0,.175,1);
  --lf-ease-drawer:cubic-bezier(.32,.72,0,1);
  --lf-duration-press:140ms;
  --lf-duration-fast:160ms;
  --lf-duration-ui:220ms;
  --lf-duration-material:260ms;
  --lf-stagger:40ms;
}

:root[data-theme="dark"] {
  color-scheme:dark;
  --lf-ground:#141414;
  --lf-topbar:#0f0f0f;
  --lf-sidebar:#121212;
  --lf-ground-raised:#181818;
  --lf-panel:#1a1a1a;
  --lf-panel-raised:#1e1e1e;
  --lf-input:#1c1c1c;
  --lf-panel-hover:#232323;
  --lf-drop:#181818;
  --lf-paper:#f5f1e8;
  --lf-paper-ink:#26211a;
  --lf-text-strong:#ededec;
  --lf-text:#ededec;
  --lf-text-body:#c7c6c3;
  --lf-text-muted:#9d9c9a;
  --lf-text-subtle:#6b6a68;
  --lf-line-soft:#212121;
  --lf-line:#292929;
  --lf-line-strong:#3a3a3a;
  --lf-accent:#d0aa6a;
  --lf-accent-hover:#e1b872;
  --lf-accent-ink:#161310;
  --lf-accent-soft:rgba(208,170,106,.11);
  --lf-accent-line:rgba(208,170,106,.34);
  --lf-success:#8fb38a;
  --lf-success-soft:#161c16;
  --lf-warning:#d4b374;
  --lf-warning-soft:rgba(212,179,116,.13);
  --lf-info:#a7bdd9;
  --lf-info-soft:rgba(167,189,217,.13);
  --lf-danger:#f1b1a8;
  --lf-danger-soft:rgba(241,177,168,.09);
  --lf-btn-primary-bg:#d0aa6a;
  --lf-btn-primary-ink:#161310;
  --lf-btn-primary-hover:#e1b872;
  --lf-shadow-card:0 1px 0 rgba(255,255,255,.035) inset,0 16px 34px -24px rgba(0,0,0,.88),0 4px 12px -8px rgba(0,0,0,.64);
  --lf-shadow-raised:0 1px 0 rgba(255,255,255,.05) inset,0 24px 58px -30px rgba(0,0,0,.94),0 10px 24px -18px rgba(0,0,0,.78);
  --lf-shadow-pop:0 1px 0 rgba(255,255,255,.055) inset,0 30px 80px -26px rgba(0,0,0,.96),0 12px 32px -20px rgba(0,0,0,.86);
  --lf-material:rgba(26,26,26,.84);
  --lf-material-strong:rgba(15,15,15,.94);
  --lf-material-solid:#1a1a1a;
}

@media (prefers-reduced-transparency:reduce) {
  :root {
    --lf-material:var(--lf-panel);
    --lf-material-strong:var(--lf-ground);
  }
}

@media (prefers-contrast:more) {
  :root {
    --lf-text-body:var(--lf-text);
    --lf-text-muted:rgba(38,33,26,.78);
    --lf-text-subtle:rgba(38,33,26,.68);
    --lf-line-soft:rgba(38,33,26,.20);
    --lf-line:rgba(38,33,26,.34);
    --lf-line-strong:rgba(38,33,26,.48);
    --lf-material:var(--lf-panel);
    --lf-material-strong:var(--lf-ground);
  }

  :root[data-theme="dark"] {
    --lf-text-muted:#c7c6c3;
    --lf-text-subtle:#9d9c9a;
    --lf-line-soft:#3a3a3a;
    --lf-line:#505050;
    --lf-line-strong:#6a6a6a;
  }
}