/* ==========================================================================
   Design tokens — cozy top-down world palette.
   Every colour, rhythm and easing value used anywhere lives here.
   ========================================================================== */

:root {
  color-scheme: light;

  /* --- Ground ---------------------------------------------------------- */
  --grass-deep:   #3d6b33;
  --grass:        #55913e;
  --grass-lit:    #71b350;

  --sand-lit:     #f2e2b4;
  --sand:         #e0c98d;
  --sand-deep:    #c6aa6b;

  --dirt-lit:     #a87b4e;
  --dirt:         #8d6539;
  --dirt-deep:    #74502c;

  --concrete-lit: #d3d1ca;
  --concrete:     #bab8b0;
  --concrete-deep:#9d9b93;

  --ice-lit:      #e8f6fb;
  --ice:          #c7e6f2;
  --ice-deep:     #a3d0e4;

  /* Solid ice, cut into bricks. */
  --iceblock-lit: #f2fcff;
  --iceblock:     #bfe4f4;
  --iceblock-deep:#8ac3de;
  --iceblock-cast:#6ba3c2;

  /* --- Hazards ----------------------------------------------------------
     Ground the robot can walk onto but never walk off. */
  --lava-lit:     #ffb03a;
  --lava:         #ef5a1e;
  --lava-deep:    #a32209;
  --lava-crust:   #4a1c0c;

  --pit-void:     #0a0908;

  /* --- Portal -----------------------------------------------------------
     The way out. Violet is used nowhere else, so it reads as "not of this
     plot" whatever terrain it is standing on. */
  --portal-core:  #f6ecff;
  --portal:       #ab63f0;
  --portal-deep:  #4d2189;
  --portal-ring:  #2a1046;

  /* An alternative way out, kept beside the portal so the two can be judged
     against each other. Warm where both the others are cool, and dark in the
     middle where both of them are bright — the colour is the smaller half of
     that. */
  --gate-void: #05060e;
  --gate-deep: #241a3d;
  --gate-rim:  #ffcf6e;
  --gate-hot:  #fff8e4;

  /* The teleport pad. Cyan so it never reads as the way out — one of these
     moves you, the other ends the run. */
  --teleport-core:   #eafcff;
  --teleport:        #4fd0e8;
  --teleport-deep:   #17708c;
  --teleport-ring:   #0b3a4a;

  --soil-deep:    #573820;
  --soil-lit:     #9a6b40;

  --stone-deep:   #55534e;
  --stone:        #7e7c76;
  --stone-lit:    #a8a69e;

  /* --- Built things ---------------------------------------------------- */
  --wood-deep:    #5f3718;
  --wood:         #945926;
  --wood-lit:     #c5873f;
  --parchment:    #f7e6c2;
  --parchment-sh: #e9d0a2;
  --parchment-lo: #d8b981;

  /* --- Ink ------------------------------------------------------------- */
  --ink:          #3a2415;
  --ink-soft:     #6d5238;
  --ink-faint:    #96795a;

  /* The page the plot sits on. */
  --page:         #ffffff;
  --page-line:    rgba(0, 0, 0, .22);
  --page-rule:    rgba(0, 0, 0, .12);

  /* --- Signal ---------------------------------------------------------- */
  --gold:         #f2b134;
  --gold-deep:    #c98a12;
  --terracotta:   #e0703c;
  --sky:          #57bcd6;
  --sky-deep:     #2b8ba6;
  /* The battery. Three states rather than a gradient, because a meter you
     have to interpret is a meter you have to look at twice. */
  --charge:       #64b855;
  --charge-low:   #e0a03c;
  --charge-out:   #b4433a;

  /* Keys and the doors they open. One hue each, light for the face and deep
     for the frame, so a door reads as the same colour whether it is shut or
     standing open. */
  --lock-blue:        #4a86d8;  --lock-blue-deep:   #1f3f76;
  --lock-red:         #d1483f;  --lock-red-deep:    #77201c;
  --lock-yellow:      #e0b03c;  --lock-yellow-deep: #7d5c11;
  --lock-green:       #58b45c;  --lock-green-deep:  #23602c;
  /* A key is generic now, so it is steel rather than a colour to match. */
  --lock-steel:       #b9c6d2;  --lock-steel-deep:  #5c6b7a;

  /* Ice: cold, bright, and obviously not something you stop on. */
  --ice-sheet:        #b9e2f0;
  --ice-sheen:        #dff4fb;

  /* Costly ground: churned, dark, slow-looking. */
  --costly-mud:       #6b5a44;
  --costly-deep:      #4a3d2d;
  --costly-grit:      #574733;

  /* The line a crack is drawn with, before it gives way. */
  --crack-line:       #2b2119;

  /* The two classes of toggle wall. Far enough apart to tell at a glance
     which half of the board is about to change. */
  --toggle-a:         #7c6bd6;  --toggle-a-deep:    #3b3172;
  --toggle-b:         #d68b3f;  --toggle-b-deep:    #78471a;

  --berry:        #c8402f;
  --berry-deep:   #8e2418;

  /* --- Robots -----------------------------------------------------------
     One shell, four liveries. Each is a light face, a mid body and a shaded
     underside, which is all `.unit__body` needs. */
  --bot-steel-lit: #f0f4f7;  --bot-steel: #c3ccd4;  --bot-steel-deep: #8e9aa5;
  --bot-blue-lit:  #dcefff;  --bot-blue:  #67b0e8;  --bot-blue-deep:  #2a6aa8;
  --bot-pink-lit:  #ffe2f0;  --bot-pink:  #f28ab7;  --bot-pink-deep:  #b44378;
  --bot-green-lit: #ddf7d8;  --bot-green: #78cb72;  --bot-green-deep: #388443;

  /* Highlight for the bump livery. */
  --bot-hurt-lit:  #ffd9d3;

  /* Screen glass, for whatever a robot looks out of. */
  --screen-mint:      #6ff0c2;
  --screen-mint-deep: #23b98c;

  /* Head lamps. Gold is the default; pearl keeps the pink one distinct. */
  --lamp-pearl:       #fff2f8;

  /* Toggle switch, off. */
  --switch-off:       #e5e7eb;

  /* --- Control highlights ----------------------------------------------
     The lit top of a raised control, and plain white for text on one. */
  --lit-gold:     #ffdc8a;
  --lit-amber:    #fff3d4;
  --lit-blush:    #ffd9d3;
  --lit-coral:    #e8695a;
  --lit-white:    #ffffff;

  /* --- Metal ------------------------------------------------------------ */
  --metal-lit:    #bcc7d0;
  --metal:        #8e9ba6;
  --metal-deep:   #64707b;

  /* The charging plate. Neutral rather than the blue-grey of --metal, and
     dark enough that the gold bolt on it has somewhere to go. */
  --plate:        #78787d;

  /* --- Asset sheet -----------------------------------------------------
     Plain white, so the pieces are judged against nothing but themselves. */
  --sheet-bg:     #ffffff;
  --sheet-ink:    #2a2a27;
  --sheet-soft:   #85857c;
  --sheet-rule:   #e8e8e2;
  --sheet-tint:   rgba(42, 42, 39, .06);

  /* One tile at the size it reaches on the grid: the plot caps at 560px
     across ten columns. */
  /* ONE tile, everywhere: the game's plot, the builder's plot, and every
     specimen on the asset sheet. Never scaled to fit — a plot grows and
     shrinks with the stage and the page scrolls, because pixel art at a
     non-integer scale shimmers and the sprites are the direction of travel.
     Nothing may define a second tile size. */
  --tile-size:    56px;


  /* ======================================================================
     PROPOSAL PALETTE — trial set, used only by proposal.css and the
     Proposal section of the asset sheet. Nothing in the game reads these.

     Every material is one ramp of three at even lightness steps — lit, mid,
     deep — plus a `cast`, the colour it drops onto the ground beneath it.
     Same three stops for a boulder, a gem and a hedge, which is what makes
     them look like they were carved by the same hand.
     ====================================================================== */

  /* Ground */
  --m-grass-lit:#7cbb57; --m-grass:#5d9c41; --m-grass-deep:#467a31;
  --m-moss-lit: #62935a; --m-moss: #4a7440; --m-moss-deep: #365630;
  --m-sand-lit: #f0dfae; --m-sand: #ddc78a; --m-sand-deep: #c3a96c;
  --m-dirt-lit: #a97c50; --m-dirt: #8c6539; --m-dirt-deep: #6f4f2b;
  --m-grit-lit: #b3ada2; --m-grit: #948e83; --m-grit-deep: #726d63;
  --m-flag-lit: #bcb7ab; --m-flag: #9b968a; --m-flag-deep: #7a766c;
  --m-crete-lit:#d0cdc6; --m-crete:#b4b1a9; --m-crete-deep:#918e87;
  --m-deck-lit: #aab2ba; --m-deck: #8b939c; --m-deck-deep: #6a727a;
  --m-ice-lit:  #e9f6fc; --m-ice:  #c6e5f2; --m-ice-deep:  #a1cee2;
  --m-ash-lit:  #706c6a; --m-ash:  #565351; --m-ash-deep:  #3c3a39;

  /* Solids */
  --m-stone-lit:#b2ada3; --m-stone:#8d887e; --m-stone-deep:#6a655c; --m-stone-cast:#4a463f;
  --m-brick-lit:#eafaff; --m-brick:#bfe4f4; --m-brick-deep:#8ac3de; --m-brick-cast:#5f95b4;
  --m-steel-lit:#c8d0d8; --m-steel:#97a1aa; --m-steel-deep:#6e7880; --m-steel-cast:#4d555c;
  --m-crate-lit:#c58f4f; --m-crate:#a06f34; --m-crate-deep:#7a5324; --m-crate-cast:#523519;
  --m-hedge-lit:#6fae4f; --m-hedge:#4f8a37; --m-hedge-deep:#386626; --m-hedge-cast:#26451a;
  --m-glass-lit:#5a4a63; --m-glass:#3d3145; --m-glass-deep:#241c2a; --m-glass-cast:#140e18;
  --m-rack-lit: #4d5964; --m-rack: #363f48; --m-rack-deep: #232a31; --m-rack-cast:#13181d;

  /* Liquids, light and void */
  --m-lava-lit: #ffc763; --m-lava: #f0631f; --m-lava-deep: #a5230a; --m-lava-cast:#4d1d0c;
  --m-water-lit:#8fd4ec; --m-water:#3f9ecb; --m-water-deep:#1f6a95; --m-water-cast:#0e3b57;
  --m-void-lit: #2a2a38; --m-void: #14141d; --m-void-deep: #07070c; --m-void-null: #000000;
  --m-key-lit:  #ffe3a0; --m-key:  #f2b134; --m-key-deep:  #b8800f; --m-key-cast: #7d5606;
  --m-warp-lit: #f0dcff; --m-warp: #ab63f0; --m-warp-deep: #5b2a9c; --m-warp-cast: #2f1355;
  --m-safe-lit: #cdf7d6; --m-safe: #4fc879; --m-safe-deep: #23864a; --m-safe-cast: #125129;

  /* --- Proposal physics ------------------------------------------------
     One sun, one height, one grain size for the whole set. */
  --p-rise:  3px;                          /* how far a solid stands proud */
  --p-lit:   rgba(255, 255, 255, .26);     /* its top face */
  --p-shade: rgba(0, 0, 0, .26);           /* its underside */
  --p-drop:  rgba(22, 20, 18, .3);         /* the soft shadow beneath it */
  --p-grain: 6px;                          /* one texture period, everywhere */
  --p-edge:  rgba(0, 0, 0, .3);            /* the grid hairline */

  /* How wet the world looks. Every specular highlight in proposal.css is a
     multiple of this one number, so the whole set goes matte or glossy
     together rather than one material at a time. 0 is chalk. */
  --p-gloss:  .13;
  --p-gloss2: .07;                         /* second facet, on faceted things */

  /* --- Rhythm ---------------------------------------------------------- */
  --gap-1: .25rem;
  --gap-2: .5rem;
  --gap-3: .75rem;
  --gap-4: 1rem;
  --gap-5: 1.5rem;
  --gap-6: 2rem;

  --radius-sm: 3px;
  --radius:    6px;

  /* Chunky pixel-frame depth, used by every raised surface. */
  --lift: 4px;

  /* --- Type ------------------------------------------------------------ */
  --font-pixel: 'Pixelify Sans', 'Trebuchet MS', system-ui, sans-serif;
  --font-body:  'Bitter', Georgia, 'Times New Roman', serif;

  /* --- Motion ---------------------------------------------------------- */
  --ease-out:  cubic-bezier(.22,.9,.28,1);
  --ease-hop:  cubic-bezier(.34,.68,.3,1.04);

  /* Duration of one robot step. Overwritten at boot from config.js so the
     simulation clock and the CSS transitions can never drift apart. */
  --tick: 280ms;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}