/* CHAMELEON UI, WEARING LEISURE LOUNGE.
 *
 * Floris, 9 September: "chameleon UI is our engine, we have to give feedback to FLOCORE, and we can
 * get all our UIs on the same consistency without fucking them up."
 *
 * FLOCORE ships five brand-neutral component layers that close failure classes this app has been
 * re-solving by hand on thirty screens: responsive, state, focus, form, motion. They speak --cui-*.
 * Our token contract is Layer A of the same system and speaks --fc-*. Nobody had ever joined the
 * two, which is why we adopted the tokens and then rebuilt .msg on twenty screens anyway.
 *
 * THIS FILE IS THE JOIN, AND IT IS THE WHOLE OF IT. Every --cui-* name the five layers actually
 * consume, taken from the layers themselves rather than from the documentation, pointed at the
 * Leisure Lounge value it already has. No colour, no radius and no font is invented here.
 *
 * WHY NOT chameleon-ui/leisure-lounge/base.css, WHICH EXISTS AND ANSWERS 200. Because it is not
 * Leisure Lounge. It is dark navy on cyan with Space Grotesk: --cui-bg #0b0f16, --cui-primary
 * #22d3ee. Ours is warm cream, olive and terracotta with Cinzel and Jost. Pulling that file repaints
 * the whole factory as a different company. Reported to FLOCORE rather than worked around quietly.
 *
 * VENDORED, NOT HOTLINKED. The layers sit beside this file rather than being fetched from
 * fo.flocore.tech at run time. Same rule as the anti-pattern suite under LANE_COORDINATION: each
 * lane owns its copy. A factory floor that cannot lay out a screen because another lane's host is
 * down is not a trade worth making.
 */
:root{
  /* surfaces and lines */
  --cui-bg:            var(--fc-surface);
  --cui-surface:       var(--fc-surface-raised);
  --cui-line:          var(--fc-border);

  /* text */
  --cui-text:          var(--fc-text);
  --cui-muted:         var(--fc-text-muted);

  /* intent. --cui-primary is what the focus ring and the primary action are drawn from, so it is
     our accent and not our ink: a ring in --fc-text would be invisible against dark furniture. */
  --cui-primary:       var(--fc-accent-fill);
  --cui-accent:        var(--fc-success-fill);
  --cui-danger:        var(--fc-danger);
  --cui-danger-text:   var(--fc-text-on-fill);
  --cui-focus:         var(--fc-accent-fill);

  /* type. Both scales are already fluid clamps, so this is a rename and not a second scale
     competing with the first, which is how a heading ends up bigger than its own container. */
  --cui-font-body:     var(--fc-font-body);
  --cui-font-display:  var(--fc-font-display);
  --cui-font-mono:     ui-monospace, 'SF Mono', Menlo, monospace;
  --cui-fs-xs:         var(--fc-text-xs);
  --cui-fs-sm:         var(--fc-text-sm);
  --cui-fs-base:       var(--fc-text-md);
  --cui-fs-lg:         var(--fc-text-lg);
  --cui-fs-xl:         var(--fc-text-xl);
  --cui-fs-2xl:        var(--fc-text-2xl);
  --cui-fs-3xl:        var(--fc-text-3xl);

  /* space. Theirs runs 1 to 8, ours 1 to 5, so the top of their scale is derived rather than
     invented: 6 and 8 continue the same rhythm instead of introducing new numbers. */
  --cui-sp-2:          var(--fc-space-2);
  --cui-sp-3:          var(--fc-space-3);
  --cui-sp-4:          var(--fc-space-4);
  --cui-sp-6:          var(--fc-space-5);
  --cui-sp-8:          calc(var(--fc-space-5) * 1.6);

  --cui-radius:        var(--fc-radius-lg);
}

/* THEIR RESPONSIVE LAYER SETS color-scheme: light dark, WHICH THIS APP IS NOT.
   Every surface here is a measured warm tone with a contrast figure written against it. Letting the
   browser hand us a dark form control in the middle of that is how an input ends up unreadable on
   one person's laptop and fine on everybody else's. */
:root{ color-scheme: light; }
