/* ============================================================
   MomokoArt design tokens
   ------------------------------------------------------------
   Shipped dormant: nothing consumes these yet, so this file
   cannot change a single pixel — a custom property renders
   nothing until some rule var()s it, and there are no other
   rules here. Page stylesheets begin adopting these in later
   phases. Values mirror the current homepage palette so that
   adoption stays visually neutral.

   Naming is unified on --momokoart-* (matching the plugin dir,
   the PHP prefix, and five of six body classes; the homepage's
   older --momoko-home-* set is the outlier and is migrated over
   time, not touched here).
   ============================================================ */

:root {
    /* --- primitives: raw values, no meaning --- */
    --momokoart-ink-900: #2d2924;
    --momokoart-ink-700: #5f584f;
    --momokoart-sand-50: #f8f4ee;
    --momokoart-sand-100: #eee3d4;
    --momokoart-sand-200: #e7ddd0;
    --momokoart-card-light: #fffdf9;
    --momokoart-brown-500: #79654d;
    --momokoart-brown-700: #5d4632;
    --momokoart-green-700: #2f5b43;

    /* --- semantic: the layer page CSS consumes --- */
    --momokoart-color-text: var(--momokoart-ink-900);
    --momokoart-color-text-muted: var(--momokoart-ink-700);
    --momokoart-color-accent: var(--momokoart-brown-500);
    --momokoart-color-price: var(--momokoart-brown-700);
    --momokoart-color-line: var(--momokoart-sand-200);
    --momokoart-surface-card: var(--momokoart-card-light);

    /* the gallery "wall" — the page's warm cream backdrop
       (current homepage body / main-wrapper gradient stops) */
    --momokoart-wall: #f6eee5;
    --momokoart-wall-lit: #f9f2ea;
    --momokoart-wall-deep: #efe3d2;

    /* typography — the two stacks the homepage already uses */
    --momokoart-font-display: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Noto Serif JP", serif;
    --momokoart-font-ui: "Hiragino Sans", "Yu Gothic", "YuGothic", "Noto Sans JP", sans-serif;

    /* layout */
    --momokoart-content-max: 1220px;
    --momokoart-content-gutter: 56px;
    --momokoart-radius: 22px;

    /* motion — single knobs, flipped by the reduced-motion block
       below so every page's transitions go still in one place */
    --momokoart-duration-base: 0.28s;
    --momokoart-duration-slow: 0.55s;
    --momokoart-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* Dark mode: remap only the semantic layer, declared at :root so it
   reaches every page that consumes tokens — the mechanism the old
   homepage-scoped dark block could never propagate. Values match the
   homepage's existing dark palette. */
@media (prefers-color-scheme: dark) {
    :root {
        --momokoart-color-text: #f3eadf;
        --momokoart-color-text-muted: #cfc2b6;
        --momokoart-color-accent: #e1c7ad;
        --momokoart-color-price: #d8c0a0;
        --momokoart-color-line: rgba(255, 255, 255, 0.16);
        --momokoart-surface-card: rgba(55, 48, 43, 0.74);
        --momokoart-wall: #2f2a26;
        --momokoart-wall-lit: #3a312c;
        --momokoart-wall-deep: #262220;
    }
}

/* Escape hatch: force light regardless of OS preference. Reserved for
   surfaces where a dark repaint is a QA risk — chiefly checkout, with its
   komoju payment iframes. body is a descendant of :root, so re-declaring
   here wins for everything inside. Add the class in PHP where needed. */
body.momokoart-force-light {
    --momokoart-color-text: #2d2924;
    --momokoart-color-text-muted: #5f584f;
    --momokoart-color-accent: #79654d;
    --momokoart-color-price: #5d4632;
    --momokoart-color-line: #e7ddd0;
    --momokoart-surface-card: #fffdf9;
    --momokoart-wall: #f6eee5;
    --momokoart-wall-lit: #f9f2ea;
    --momokoart-wall-deep: #efe3d2;
}

/* Reduced motion: collapse the duration knobs site-wide in one place.
   Only works because transitions are meant to read their duration from
   these tokens; page CSS adopts that as it migrates. */
@media (prefers-reduced-motion: reduce) {
    :root {
        --momokoart-duration-base: 0.01ms;
        --momokoart-duration-slow: 0.01ms;
    }
}
