/* Agoramores — "august" theme overrides. Loaded after main.css.
   Every selector here is scoped to body[data-theme-id="august"]. */

/* August — a lava lamp. The page is the vessel: cool dark glass at the top, hot glass
   at the base where the bulb sits. Two wax layers convect past each other — hot reds
   and ambers rising, cooled magentas and violets settling back down. Red leads the
   palette, the borders and every gradient. Values are byte-identical to the Obsidian
   --august-* set; nothing is a #000/#fff placeholder, so headings render their gradient. */
body[data-theme-id="august"] {
  --tt-bg: #190b08;
  /* Link-hover paired to THIS block's ground (standing rule 2026-08-14),
     never to the mode name. #140a1c is dark: #FF465A clears 5.76:1 here. */
  --link-hover: #FF4947;
  --tt-bg-alt: #24110d;
  --tt-cyan: #fae3cf;
  --tt-cyan-soft: #d3a8a5;
  --tt-yellow: #ffc53d;
  --tt-orange: #ff5a1f;
  --tt-chartreuse: #ffa023;
  --tt-green: #ff7847;
  --tt-pink: #ff5f5d;
  --tt-purple: #af4428;
  --tt-blue: #d87659;
  --tt-teal: #ec3c39;
  --tt-gray: #d3a8a5;
  --tt-gold: #ffc53d;
  --tt-red: #ff3434;
  --tt-breadcrumb-text: #ffb08a;
  --tt-breadcrumb-glow: rgba(255, 90, 31, 0.35);
  --tt-heading-rainbow: linear-gradient(
    90deg,
    var(--tt-red),
    var(--tt-orange),
    var(--tt-gold),
    var(--tt-pink),
    var(--tt-teal),
    var(--tt-red)
  );
  --tt-heading-rainbow-vertical: linear-gradient(
    180deg,
    var(--tt-red),
    var(--tt-orange),
    var(--tt-gold),
    var(--tt-pink),
    var(--tt-teal),
    var(--tt-red)
  );
  --tt-heading-text-rainbow: linear-gradient(
    90deg,
    var(--tt-red),
    var(--tt-green),
    var(--tt-orange),
    var(--tt-chartreuse),
    var(--tt-gold),
    var(--tt-pink),
    var(--tt-teal),
    var(--tt-purple),
    var(--tt-red),
    var(--tt-green),
    var(--tt-orange),
    var(--tt-chartreuse),
    var(--tt-gold),
    var(--tt-pink),
    var(--tt-teal),
    var(--tt-purple),
    var(--tt-red)
  );
  --bg: #190b08;
  --surface: transparent;
  --text: var(--tt-cyan);
  --text-soft: var(--tt-cyan-soft);
  --muted: var(--tt-gray);
  --border: var(--tt-red);
  --border-dim: rgba(255, 52, 52, 0.3);
  --border-teal: rgba(236, 60, 57, 0.45);
  background: #190b08;
  color: var(--tt-cyan);
  color-scheme: dark;
}

body[data-theme-id="august"] .breadcrumb-nav {
  background: rgba(36, 17, 13, 0.62);
}

/* The vessel itself: dark glass cooling upward, the bulb burning at the very bottom. */
body[data-theme-id="august"] .night-sky {
  background:
    radial-gradient(ellipse at 50% 104%, rgba(255, 140, 40, 0.5), transparent 44%),
    radial-gradient(ellipse at 50% 100%, rgba(255, 197, 61, 0.42), transparent 26%),
    radial-gradient(ellipse at 17% 103%, rgba(255, 52, 52, 0.2), transparent 30%),
    radial-gradient(ellipse at 83% 103%, rgba(236, 60, 57, 0.18), transparent 30%),
    linear-gradient(
      180deg,
      #2c130d 0%,
      #200d09 26%,
      #190b08 52%,
      #1d0c08 74%,
      #100604 100%
    );
  background-repeat: no-repeat;
}

/* Glass sheen down the sides plus the heat haze standing over the bulb. Static, so the
   wax owns all the motion and the first painted frame is already the finished picture. */
body[data-theme-id="august"] .night-sky::before {
  inset: 0;
  opacity: 1;
  background-image:
    linear-gradient(
      90deg,
      rgba(250, 227, 207, 0.055) 0%,
      transparent 13%,
      transparent 87%,
      rgba(250, 227, 207, 0.045) 100%
    ),
    radial-gradient(ellipse 58% 30% at 50% 97%, rgba(255, 120, 71, 0.16), transparent 72%);
  background-size: auto;
  background-repeat: no-repeat;
  animation: none;
}

/* Hot wax rising. Blobs are tiled on a 34rem vertical period and the layer translates
   exactly one 34rem tile per loop, so the column restarts with no visible seam. Soft
   multi-stop gradient falloff does the blur — no filter, no repaint, transform only. */
body[data-theme-id="august"] .night-sky__stars--far {
  inset: -4rem -4rem -38rem;
  opacity: 0.68;
  background-image:
    radial-gradient(ellipse 8.5rem 10.5rem at 23% 17%, rgba(255, 52, 52, 0.52) 0 24%, rgba(255, 52, 52, 0.22) 54%, rgba(255, 52, 52, 0) 78%),
    radial-gradient(ellipse 6.5rem 8rem at 69% 43%, rgba(255, 90, 31, 0.48) 0 24%, rgba(255, 90, 31, 0.2) 54%, rgba(255, 90, 31, 0) 78%),
    radial-gradient(ellipse 5rem 6.5rem at 42% 72%, rgba(255, 160, 35, 0.42) 0 24%, rgba(255, 160, 35, 0.18) 54%, rgba(255, 160, 35, 0) 78%),
    radial-gradient(ellipse 4rem 5rem at 87% 89%, rgba(255, 197, 61, 0.36) 0 24%, rgba(255, 197, 61, 0.15) 54%, rgba(255, 197, 61, 0) 78%);
  background-size: 27rem 34rem, 34rem 34rem, 21rem 34rem, 39rem 34rem;
  background-position: 0 0, 7rem 0, 15rem 0, 3rem 0;
  background-repeat: repeat;
  background-blend-mode: normal;
  animation: augustWaxRise 84s linear infinite;
}

/* Cooled wax settling back down the other way. Shorter 26rem period and a different
   speed, so the two layers never travel together and the convection reads as circular. */
body[data-theme-id="august"] .night-sky__stars--near {
  inset: -30rem -4rem -4rem;
  opacity: 0.5;
  background-image:
    radial-gradient(ellipse 6rem 7.5rem at 34% 26%, rgba(236, 60, 57, 0.42) 0 24%, rgba(236, 60, 57, 0.18) 54%, rgba(236, 60, 57, 0) 78%),
    radial-gradient(ellipse 4.5rem 5.5rem at 78% 58%, rgba(175, 68, 40, 0.4) 0 24%, rgba(175, 68, 40, 0.16) 54%, rgba(175, 68, 40, 0) 78%),
    radial-gradient(ellipse 5.2rem 6.4rem at 14% 81%, rgba(255, 95, 93, 0.38) 0 24%, rgba(255, 95, 93, 0.16) 54%, rgba(255, 95, 93, 0) 78%),
    radial-gradient(ellipse 3.4rem 4.2rem at 57% 94%, rgba(255, 120, 71, 0.34) 0 24%, rgba(255, 120, 71, 0.14) 54%, rgba(255, 120, 71, 0) 78%);
  background-size: 23rem 26rem, 31rem 26rem, 18rem 26rem, 37rem 26rem;
  background-position: 0 0, 5rem 0, 11rem 0, 2rem 0;
  background-repeat: repeat;
  background-blend-mode: normal;
  animation: augustWaxSettle 61s linear infinite;
}

/* The lamp base: a hot dome of light off the bulb, capped by the dark metal foot.
   This is the month's ground element — no skyline, no fireworks, those are July's. */
body[data-theme-id="august"] .night-sky__aurora {
  display: block;
  z-index: 2;
  left: -2%;
  right: -2%;
  bottom: -1px;
  inset-block-start: auto;
  height: clamp(4.5rem, 12vh, 7.5rem);
  clip-path: none;
  background:
    radial-gradient(ellipse 40% 150% at 50% 116%, rgba(255, 197, 61, 0.5) 0 24%, rgba(255, 90, 31, 0.3) 52%, transparent 78%),
    radial-gradient(ellipse 72% 120% at 50% 128%, rgba(255, 52, 52, 0.28), transparent 72%),
    linear-gradient(180deg, transparent 0%, rgba(44, 19, 13, 0.5) 42%, #1d0c08 76%, #100604 100%);
  background-repeat: no-repeat;
  box-shadow: 0 -2rem 5rem rgba(255, 90, 31, 0.16);
}

body[data-theme-id="august"] .brand a {
  text-shadow:
    0 0 10px rgba(255, 197, 61, 0.6),
    0 0 26px rgba(255, 52, 52, 0.42),
    0 0 46px rgba(255, 90, 31, 0.24);
}

body[data-theme-id="august"] input,
body[data-theme-id="august"] textarea,
body[data-theme-id="august"] select,
body[data-theme-id="august"] code,
body[data-theme-id="august"] pre {
  background: rgba(36, 17, 13, 0.55);
  color: var(--tt-cyan);
}

body[data-theme-id="august"] th {
  background: var(--tt-red);
  color: #1c0505;
}

/* Fireworks are Independence Day furniture: July theme only. The JS also refuses to
   spawn them off-July, so this is belt-and-braces for any burst already on screen. */
body[data-theme-id="august"] .night-sky__fireworks {
  display: none;
}

@media (prefers-reduced-motion: reduce) {
  /* Month blocks set their ambient motion on higher-specificity selectors, so they
     need their own entry here. Motion stops; the first frame stays complete. */
  body[data-theme-id="august"] .night-sky::before,
  body[data-theme-id="august"] .night-sky__stars,
  body[data-theme-id="august"] .night-sky__aurora {
    animation: none !important;
    transform: none !important;
  }
}

@media (prefers-reduced-data: reduce) {
  /* Month themes set ambient motion on higher-specificity selectors; stop those too. */
  body[data-theme-id="august"] .night-sky::before,
  body[data-theme-id="august"] .night-sky__stars,
  body[data-theme-id="august"] .night-sky__aurora {
    animation: none;
    transform: none;
  }
}

/* ---------------------------------------------------------------------------
   AUGUST BY DAY — THE LAVA LAMP.

   User request (2026-08-11): the lava lamp is August's daylight appearance.
   This block is `public/themes/lava-lamp.css` folded into August's day branch
   rather than @imported — see the note at the foot of this comment for why.

   Base plus counterpart. The unmoded block above is August's canonical
   lighting and is UNTOUCHED: a body with no data-mode is the lamp at night,
   which is what the server sends and what a reader with JS off keeps for good.
   Every selector here carries both attributes, so it lands at (0,2,1)/(0,2,2)
   over the base's (0,1,1)/(0,1,2) and wins on specificity rather than on order
   — which matters, because every theme sheet is loaded on every page.

   The geometry is not re-cut. August's base is already a lava lamp — vessel,
   two convecting wax layers, bulb, metal foot — so daylight only changes what
   lights it. Every rule below restates PAINT (background, background-image,
   opacity, colour) and nothing else:

     * THE GROUND BECOMES THE LAMP'S OWN SUN-YELLOW. #ffd36b with the blob
       field burning through it, lifted from lava-lamp.css unchanged. This is
       the recognisable lava-lamp look and it is the whole point of the block.
     * THE WAX GOES TRANSLUCENT, NOT PALE. At night the wax is emissive —
       bright, low-alpha colour glowing out of a dark column. By day it is a
       dense saturated slug seen against bright glass, so the same blobs go
       DARKER and more saturated. Same tiles, same two loops, same seams.
     * THE GLASS INVERTS ITS EDGES. At night the cylinder is drawn by a cream
       sheen catching the sides. On a bright ground a pale sheen is invisible,
       so the silhouette is drawn by the DARK refracting rim with the specular
       stripe just inside it — the same edge, the other sign.
     * THE BULB LOSES. By day the room out-lights the lamp, so the foot becomes
       the brightest band at the bottom of the frame instead of the darkest.
       That is also what keeps the footer readable, since the footer scrolls
       across this element.

   WHAT WAS DELIBERATELY NOT COPIED FROM lava-lamp.css, and why. That sheet is
   the preserved 2025 original and it carries the exact defects
   `.github/agents/style/invariants.md` was written to prevent. Copying it
   verbatim would reinstate all four:
     1. Twelve `--tt-*` tokens set to `#000` — the named "August defect", which
        flattens headings, tags and eyebrows and makes the heading gradient
        invisible. Replaced here by a hue-separated set (red → orange → amber →
        chartreuse → green → teal → blue → violet → magenta), every stop
        checked at 4.5:1 or better against #ffd36b so any of them can carry
        body copy, a border, or a stop in the heading gradient.
     2. `border-color: transparent !important` + `border-image: none !important`
        + `box-shadow: none !important` blanketed across `*`, which kills the
        rainbow border system site-wide.
     3. `display: none` on `.heading-section::before` — the locked rainbow
        section rail — and on `.page-toc::before`.
     4. `display: none` on `header::before`, the locked animated neon strip.
   Items 3 and 4 are why the rainbow rails appeared to "vanish" during August
   daylight: nothing was ever deleted from the stylesheets, a reader was simply
   being moved onto a sheet that switched them off. The rail and the strip are
   both live in this block.

   FOLDED, NOT @IMPORTED. `@import` cannot re-scope a selector, so importing
   lava-lamp.css here would inject `body[data-theme-id="lava-lamp"]` rules that
   never match an August body — it cannot do the job at all. It would also
   parse the sheet twice, since lava-lamp.css is already <link>ed on every page
   as its own selectable theme, and `@import` must precede every rule in the
   file, which this block does not.

   The three heading gradients are declared in the base block entirely out of
   var(--tt-*), so they re-resolve from the tokens below at no cost and are
   deliberately not restated. --text / --text-soft / --muted / --border are
   var-based for the same reason. --bg and background are the two literals that
   have to be repeated.

   Nothing below declares `animation` or `transform`, so the sheet's existing
   prefers-reduced-motion and prefers-reduced-data blocks still reach and stop
   both wax loops in day mode exactly as they do at night. No new selector
   needs adding to them, and no new motion is introduced.
   --------------------------------------------------------------------------- */
body[data-theme-id="august"][data-mode="day"] {
  /* The lamp's own daylight ground, taken from lava-lamp.css unchanged. */
  --tt-bg: #ffd36b;
  --tt-bg-alt: #ff7a59;
  /* #ffd36b is light: #FF465A only measures 2.36:1 here, so day takes the
     same-hue dark variant, #BD0014 — 4.66:1. */
  --link-hover: #BC0900;
  /* Body ink. Near-black with a warm cast rather than a flat #000, so it sits
     in the lamp's own colour family instead of reading as printer black. */
  --tt-cyan: #140909;
  --tt-cyan-soft: #4a3226;
  /* The accent set. These are lava-lamp.css's own heading-gradient stops,
     which were already chosen to read on this exact ground, pulled down a
     further step so every one of them clears 4.5:1 on #ffd36b. Hue separation
     is the thing being protected: eight tones from one value band on a bright
     ground was the original August defect and it is not coming back through a
     mode switch. */
  --tt-orange: #b03f08;
  --tt-yellow: #7a5610;
  --tt-gold: #7a5610;
  --tt-chartreuse: #4d6608;
  --tt-green: #296729;
  --tt-teal: #595f3a;
  --tt-blue: #5e3816;
  --tt-purple: #863322;
  --tt-pink: #b52927;
  --tt-gray: #55402c;
  /* Red stays the anchor and stays a real saturated red — it still leads every
     gradient, frames the card and heads the table. This is lava-lamp.css's own
     red, unchanged. */
  --tt-red: #c01b19;
  --tt-breadcrumb-text: #9d1614;
  /* A glow is an emission, and emissions do not read on a bright ground. This
     drops to the tint a hot filament actually leaves on daylight — enough to
     warm the type, not enough to pretend it is night. */
  --tt-breadcrumb-glow: rgba(192, 27, 25, 0.2);
  /* Which is exactly why the chips need their own value: the halo that traces
     a glyph has to be DARK here or the hover and focus affordance disappears
     entirely. Red, so the chips stay on the month's anchor. Still a halo on
     the character, never a border — the rule that consumes this lives once, in
     main.css. */
  --zodiac-glow: rgba(192, 27, 25, 0.55);
  --border-dim: rgba(192, 27, 25, 0.34);
  --border-teal: rgba(89, 95, 58, 0.5);
  /* Cut the other way: on a bright face the lit lip of an engraved stroke is
     white below the glyph, not black. */
  --tt-engrave: 0 1px 0 rgba(242, 230, 210, 0.75);
  --bg: #ffd36b;
  background: #ffd36b;
  color: var(--tt-cyan);
  color-scheme: light;
}

body[data-theme-id="august"][data-mode="day"] .breadcrumb-nav {
  background: rgba(242, 230, 210, 0.24);
}

/* THE VESSEL BY DAY. The lava lamp's own ground, ported from lava-lamp.css:
   four blobs burning through a hot diagonal base. This is the single most
   recognisable thing about the theme, so it is carried over as-is rather than
   reinterpreted. */
body[data-theme-id="august"][data-mode="day"] .night-sky {
  background:
    radial-gradient(ellipse at 16% 18%, rgba(255, 248, 138, 0.95) 0 8%, rgba(255, 205, 74, 0.58) 20%, transparent 44%),
    radial-gradient(ellipse at 84% 14%, rgba(255, 68, 67, 0.82) 0 9%, rgba(255, 124, 124, 0.48) 24%, transparent 46%),
    radial-gradient(ellipse at 34% 92%, rgba(255, 127, 42, 0.88) 0 11%, rgba(255, 209, 102, 0.5) 28%, transparent 52%),
    radial-gradient(ellipse at 86% 86%, rgba(194, 114, 73, 0.44) 0 10%, rgba(202, 202, 139, 0.24) 28%, transparent 54%),
    linear-gradient(135deg, #fff06d 0%, #ffb13d 28%, #ff6867 58%, #d07f60 100%);
  background-repeat: no-repeat;
}

/* THE GLASS EDGES, other sign. At night the cylinder is drawn by a cream sheen
   catching each side; on a bright ground that sheen has nothing to be brighter
   than. What draws a glass cylinder in daylight is the DARK rim where the wall
   turns away and refracts, with the specular stripe immediately inside it — so
   each edge is now a dark stop and a white stop instead of one cream stop.
   The heat haze over the bulb stays, at the alpha a bright room leaves it.
   Still static: the wax owns all the motion in both modes. */
body[data-theme-id="august"][data-mode="day"] .night-sky::before {
  background-image:
    linear-gradient(
      90deg,
      rgba(74, 34, 8, 0.2) 0%,
      rgba(242, 230, 210, 0.55) 4.5%,
      transparent 14%,
      transparent 86%,
      rgba(242, 230, 210, 0.48) 95.5%,
      rgba(74, 34, 8, 0.18) 100%
    ),
    radial-gradient(ellipse 58% 30% at 50% 97%, rgba(255, 150, 60, 0.12), transparent 72%);
}

/* HOT WAX, RISING — the same four blobs on the same 34rem tile, lit as
   translucent rather than emissive. Alphas roughly double and the colours drop
   to the day inks, because wax against bright glass is dark saturated colour,
   not glow.
   The head alpha is capped at 0.5 under a layer opacity of 0.72, which is the
   one number here with arithmetic behind it: composited over #ffd36b that
   keeps the darkest point of a blob light enough that --tt-red (luminance
   0.10) still clears 3.5:1 for a heading crossing it. Deeper wax looks better
   and starts costing red type its contrast, so this is the ceiling. */
body[data-theme-id="august"][data-mode="day"] .night-sky__stars--far {
  opacity: 0.72;
  background-image:
    radial-gradient(ellipse 8.5rem 10.5rem at 23% 17%, rgba(192, 27, 25, 0.5) 0 24%, rgba(192, 27, 25, 0.21) 54%, rgba(192, 27, 25, 0) 78%),
    radial-gradient(ellipse 6.5rem 8rem at 69% 43%, rgba(176, 63, 8, 0.44) 0 24%, rgba(176, 63, 8, 0.19) 54%, rgba(176, 63, 8, 0) 78%),
    radial-gradient(ellipse 5rem 6.5rem at 42% 72%, rgba(122, 86, 16, 0.4) 0 24%, rgba(122, 86, 16, 0.17) 54%, rgba(122, 86, 16, 0) 78%),
    radial-gradient(ellipse 4rem 5rem at 87% 89%, rgba(77, 102, 8, 0.34) 0 24%, rgba(77, 102, 8, 0.14) 54%, rgba(77, 102, 8, 0) 78%);
}

/* COOLED WAX, SETTLING — the second layer, same 26rem tile, same opposite
   travel. Kept a step lighter than the rising layer so the two still separate
   in depth: at night the cooled wax is dimmer because it is further from the
   bulb, and by day it is paler because it is further from the viewer through
   more fluid. Same relationship, different reason. */
body[data-theme-id="august"][data-mode="day"] .night-sky__stars--near {
  opacity: 0.55;
  background-image:
    radial-gradient(ellipse 6rem 7.5rem at 34% 26%, rgba(181, 41, 39, 0.4) 0 24%, rgba(181, 41, 39, 0.17) 54%, rgba(181, 41, 39, 0) 78%),
    radial-gradient(ellipse 4.5rem 5.5rem at 78% 58%, rgba(134, 51, 34, 0.38) 0 24%, rgba(134, 51, 34, 0.15) 54%, rgba(134, 51, 34, 0) 78%),
    radial-gradient(ellipse 5.2rem 6.4rem at 14% 81%, rgba(94, 56, 22, 0.36) 0 24%, rgba(94, 56, 22, 0.15) 54%, rgba(94, 56, 22, 0) 78%),
    radial-gradient(ellipse 3.4rem 4.2rem at 57% 94%, rgba(89, 95, 58, 0.32) 0 24%, rgba(89, 95, 58, 0.13) 54%, rgba(89, 95, 58, 0) 78%);
}

/* THE LAMP BASE, INVERTED. At night the metal foot is a black silhouette and
   the dome of bulb light above it is the brightest thing on the page. By day
   the relationship flips: the bulb dome is a modest warm bloom and the foot is
   polished metal catching the room, so it becomes the LIGHTEST band at the
   bottom of the frame rather than the darkest.
   That is also what keeps the footer readable. This element is pinned to the
   foot of the fixed viewport and the footer scrolls across it, so a dark metal
   base would put dark ink on dark ground at the end of every page; bright
   brushed metal is both the honest daylight reading and the one that leaves
   the footer at better than 6:1. */
body[data-theme-id="august"][data-mode="day"] .night-sky__aurora {
  background:
    radial-gradient(ellipse 40% 150% at 50% 116%, rgba(255, 196, 90, 0.34) 0 24%, rgba(214, 110, 30, 0.2) 52%, transparent 78%),
    radial-gradient(ellipse 72% 120% at 50% 128%, rgba(192, 27, 25, 0.14), transparent 72%),
    linear-gradient(180deg, transparent 0%, rgba(196, 160, 120, 0.45) 42%, #d8bb8e 76%, #b9986c 100%);
  background-repeat: no-repeat;
  box-shadow: 0 -1.5rem 3rem rgba(214, 110, 30, 0.12);
}

/* The wordmark cannot be neon in daylight: three stacked blurs of amber on a
   bright ground read as a printing fault. It becomes painted signwriting
   instead — the lamp's own red, lifted off the glass by the same one-pixel
   white engraving the tarot card uses. The hover is restated because main.css
   sends it back to yellow with a neon bloom on the way. */
body[data-theme-id="august"][data-mode="day"] .brand a {
  color: var(--tt-red);
  text-shadow: 0 1px 0 rgba(242, 230, 210, 0.7);
}

body[data-theme-id="august"][data-mode="day"] .brand a:hover {
  color: var(--tt-red);
  text-shadow: 0 1px 0 rgba(242, 230, 210, 0.85), 0 0 14px rgba(192, 27, 25, 0.22);
}

/* main.css rings visited links with a near-black 3px halo so purple survives
   on the July ground. On a bright ground that halo is a visible dark fringe
   around every read link, so it is replaced by the same white engraving the
   rest of the light surfaces use.
   :not(.celestial-chip) is load-bearing. The zodiac chips are anchors, and a
   selector at (0,2,2) would outrank the .celestial-chip.celestial-chip carve-
   out in main.css at (0,2,0) — a text-shadow inherits, so it would bloom
   behind the WEST/CELTIC labels and the moon's phase text. Excluding the class
   costs nothing and keeps the strip out of reach by construction. */
body[data-theme-id="august"][data-mode="day"] a:visited:not(.celestial-chip) {
  text-shadow: 0 1px 0 rgba(242, 230, 210, 0.6);
}

body[data-theme-id="august"][data-mode="day"] input,
body[data-theme-id="august"][data-mode="day"] textarea,
body[data-theme-id="august"][data-mode="day"] select,
body[data-theme-id="august"][data-mode="day"] code,
body[data-theme-id="august"][data-mode="day"] pre {
  background: rgba(242, 230, 210, 0.34);
  color: var(--tt-cyan);
}

/* The header bar keeps the red; only the ink on it changes sides, because the
   day red is a dark ink and no longer carries near-black type. */
body[data-theme-id="august"][data-mode="day"] th {
  background: var(--tt-red);
  color: #f2e6d2;
}

/* The tooltip's drop shadow is a --bg-filled card lifting off the page. The
   same 0.45 black that reads as depth over #140a1c reads as soot over a bright
   ground, so it comes down to the weight a light card actually casts. Its
   border is left alone: main.css draws it from --tt-heading-rainbow, which
   re-resolves from the day tokens above on its own. */
body[data-theme-id="august"][data-mode="day"] .celestial-tooltip {
  box-shadow: 0 4px 18px rgba(74, 34, 8, 0.22);
}

/* August wax convection: the hot layer rises, the cooled layer settles, each
   travelling exactly one background tile so the column loops with no seam.
   Transform only — no filter, no background-position, no repaint. Shared by
   both modes: the day counterpart re-lights these layers and never restates
   their motion. */
@keyframes augustWaxRise {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(0, -34rem, 0); }
}

@keyframes augustWaxSettle {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(0, 26rem, 0); }
}