/* THE SEASON'S STYLESHEET (design round 53; round 55: the V3 wordmark (in the header's and footer's markup), kit A's
   garland along the header's top, the R1 palette below, and the snow cap on the price tiles and pills). Hand-written,
   fixed: it draws nothing of its own. Linked only while a season is active, and every rule is scoped to the root's
   season attributes, which the browser drops on every never-on route (lib/season-never.ts: the cart, checkout,
   confirmation, an order, an offer, a trade, a tab's payment, the advent checkout, a drop and the admin), on a fresh
   load or after an in-app click. */

/* THE GARLAND's file at each screen's density: 1x below 1.5 device pixels per CSS pixel, 2x up to 2.5, 3x above (a
   resolution query, not image-set, which WebKit misreads) */
.v2[data-season-art~="garland"] { --ss-garland: var(--ss-garland-1x); }
@media (min-resolution: 1.5dppx), (-webkit-min-device-pixel-ratio: 1.5) { .v2[data-season-art~="garland"] { --ss-garland: var(--ss-garland-2x); } }
@media (min-resolution: 2.5dppx), (-webkit-min-device-pixel-ratio: 2.5) { .v2[data-season-art~="garland"] { --ss-garland: var(--ss-garland-3x); } }

/* THE GARLAND along the header's top: whole files side by side from the middle out, so both edges crop alike; never
   squashed (drawn at the file's own size, 144 x 18). Behind the header's links and icons. Gone while the header is
   shrunk on scroll (it would be a sliver cut by the top of the screen). */
.v2[data-season-art~="garland"] .lx-header .ss-garland {
  position: absolute; z-index: -1; left: 0; right: 0; top: env(safe-area-inset-top, 0px); height: var(--ss-garland-h); pointer-events: none;
  background: var(--ss-garland) center top / var(--ss-garland-w) var(--ss-garland-h) repeat-x;
}
.v2[data-season-art~="garland"] .lx-header.is-shrunk .ss-garland { visibility: hidden; }
/* THE WORDMARK'S CLEAR SPACE (round 55: the bulbs touched the letter tops on a phone and passed behind them at 1280).
   The garland's bulbs reach 18 px down; the wordmark's ink starts 0.7 px under its box, which sits at 13 px. The header's
   row (the wordmark's link and the icons, kept level) moves 7 px down, by a translate, so no layout box moves: the ink
   then starts at 20.7 px (2.7 px under the lowest bulb) and ends at 53 px (4 px above the header's rule at 57 px).
   Measured at 320, 390, 768, 1280 and 1440 (tests/design/season-garland.mjs). Not while the header is shrunk (the
   garland is hidden then and the shrink moves the row itself). */
.v2[data-season-art~="garland"] .lx-header:not(.is-shrunk) > a,
.v2[data-season-art~="garland"] .lx-header:not(.is-shrunk) .lx-headicons { translate: 0 7px; }

/* THE SNOW CAP (Austin, rounds 55b and 55): the kit's snow-strip-long, bent by the browser along each element's top
   outline (components/v2/season/snowcap.ts). Painted only once drawn, outside the box's layout; nothing here takes
   pointer events, and no size, padding, tap area or press changes.
   A PRICE TILE: an ::after inside its real border, 20 percent of the tile's height.
   A PILL: the layer snowcap.ts adds as the pill's last child (span.ss-snow, aria-hidden), ABOVE the crayon frame, about
   30 percent of the pill's height, its foot on the frame's stroke. THE SMALL CHIPS: none. */
.v2[data-season-art~="snow-cap"] .ss-snow {
  position: absolute; z-index: 1; pointer-events: none;
  background: 0 0 / 100% 100% no-repeat;
}
/* the price tiles' grid (always three across, so five tiles make two rows): a cap reaches 18 px above its tile and the
   rows sat 8 px apart, so the second row's snow covered the first row's bottom edge (round 55 review). The rows sit
   22 px apart while the snow is on (4 px clear); everything under the grid moves 14 px down, nothing else changes. */
.v2[data-season-art~="snow-cap"] .lx-hb-prices { row-gap: 22px; }
/* A DISABLED CONTROL IS NEVER DECORATED (Austin, round 62, fix 1: the mystery builder's next read as the old pink under
   snow). In the season a disabled drawn button is plain: the R1 snow fill without the crayon texture, its frame at half
   strength, its words in the shop's mute ink at full opacity (a faded red read as pink), and no snow (snowcap.ts
   skips it; the layer is hidden here too, for the moment before the script looks again). Only busy (a request in flight:
   aria-busy="true", or data-busy="true" from season/busy.ts busyMark, which every seasonal drawn button disabled while its
   request runs carries, round 63; held by tests/design/lib/busy-scan.mjs): the holiday look. */
.v2[data-season-palette] .lx-btn.drawn:disabled:not([aria-busy="true"]):not([data-busy="true"]) { opacity: 1; color: var(--mute); cursor: not-allowed; }
.v2[data-season-palette] .lx-btn.drawn:disabled:not([aria-busy="true"]):not([data-busy="true"])::before { background: var(--ss-snow); }
.v2[data-season-palette] .lx-btn.drawn:disabled:not([aria-busy="true"]):not([data-busy="true"])::after { opacity: 0.5; }
.v2[data-season-art~="snow-cap"] .lx-btn:disabled:not([aria-busy="true"]):not([data-busy="true"]) > .ss-snow { display: none; }
/* THE SIGN-IN FORM AT A DESKTOP WIDTH (Austin, round 62, fix 4): a readable width, centered, as the Board Room's join
   form (420 px); a phone keeps today's full width. Under the season only, so the season-off shop reads 0 differences
   (the round's rule: only the pin page may change with the season off). */
@media (min-width: 640px) { .v2[data-season-palette] .lx-signform { justify-self: center; width: 100%; max-width: 420px; margin-inline: auto; box-sizing: border-box; } }
.v2[data-season-art~="snow-cap"] .lx-hb-price[style*="--ss-cap:"] { position: relative; }
.v2[data-season-art~="snow-cap"] .lx-hb-price[style*="--ss-cap:"]::after {
  content: ""; position: absolute; left: var(--ss-cap-pl); top: var(--ss-cap-pt); width: var(--ss-cap-w); height: var(--ss-cap-h);
  background: var(--ss-cap) 0 0 / 100% 100% no-repeat; pointer-events: none;
}

/* THE PALETTE, R1 RED-LED (Austin, round 55). The V3 wordmark's own colours, sampled from its master file
   (docs/design/seasons/christmas-2026-wordmark-v3-master.png, the median of each opaque cluster):
     wordmark red   #f51a24   the glossy red letters
     wordmark green #30a22b   the green letters
     star gold      #fbd119   the two stars: in the wordmark's own art only, never a fill, tile, chip or selected state
     snow           #fbfaf8   the white letters and the snow
   THE RULE FOR RED AND GREEN, site-wide: RED is for acting and for alerts (the main button, the step you are on, an
   unread mark, sold, held for you). GREEN is for choosing and progress (a selected chip, tile, toggle or answer, a step
   done, see all, the next board, a secondary button, and every fill that was yellow). Today's pairs that mark two
   states (done and now, sold and on hold, on hold and held for you) land on different colours.
   The swap is the five accent tokens; where a rule mixes a token into a pale tint, the tint becomes the shop's own grey
   plate (no pastels); the few literal colours v2.css paints outside the tokens are named below. */
.v2[data-season-palette] { --ss-red: #f51a24; --ss-green: #30a22b; --ss-gold: #fbd119; --ss-snow: #fbfaf8; }
.v2[data-season-palette="r1"] {
  --pink: var(--ss-red); --coral: var(--ss-red); --cyan: var(--ss-green); --lilac: var(--ss-green); --marigold: var(--ss-green);
  --ss-link: var(--ss-red); --ss-focus: var(--ss-red);
}

/* THE MEMBER'S OWN PICK (Austin, round 56, decision 3; round 57, decision 2): a Board Room member's colour is theirs, not
   the shop's decor, so it keeps today's colour all year in exactly three places: the colour picker's swatches, the
   member card's fill, and the member's avatar disc wherever it shows (on the card and in the sticker grid). Nothing else
   on the card or the page: its lockup, chips, buttons (next included) and links take the season.
   tests/design/season-audit.mjs allows exactly these fills, by name. */
/* THE COLOUR PICKER'S SWATCH (Austin, round 56; here since round 58, when it went behind the season: the picker draws
   it only where the root carries the season, and this rule is scoped to the same attribute): a disc of the colour
   itself, drawn like the avatar's (the paper texture over the colour, an ink ring), before the colour's name; on the
   picked (ink) chip a white ring keeps it apart */
.v2[data-season] .br-swatch { flex: none; width: 18px; height: 18px; margin-right: 3px; border: 2px solid var(--ink); border-radius: 50%;
  background: var(--paper-tex) 0 0 / 48px 48px, var(--c); }
.v2[data-season] .lx-chip.is-on .br-swatch { box-shadow: 0 0 0 2px #fff; }
.v2[data-season-palette] :is(.br-swatch, .br-card, .br-av-in).c-pink { --c: var(--v2-pink); }
.v2[data-season-palette] :is(.br-swatch, .br-card, .br-av-in).c-marigold { --c: var(--v2-marigold); }
.v2[data-season-palette] :is(.br-swatch, .br-card, .br-av-in).c-lilac { --c: var(--v2-lilac); }
.v2[data-season-palette] :is(.br-swatch, .br-card, .br-av-in).c-cyan { --c: var(--v2-cyan); }
.v2[data-season-palette] :is(.br-swatch, .br-card, .br-av-in).c-coral { --c: var(--v2-coral); }

/* TODAY'S OLDER PARTS INSIDE A 2.0 PAGE (round 55 audit: the advent's curated brief still draws today's older card,
   fields and pink button, which colour from globals.css's own tokens, not the five above). Inside the seasonal root
   those tokens take R1 too: the buttons red (with ink text, 4.72:1, where today's cream text on red would fail), the
   other accents green, every pale tint the shop's grey plate, the warm hairline the 2.0 shop's grey line. */
.v2[data-season-palette="r1"] {
  --color-pink: var(--ss-red); --color-accent: var(--ss-red); --color-peri: var(--ss-red); --color-primary: var(--ss-red); --color-primary-hover: var(--ss-red); --color-primary-ink: var(--ink);
  --color-mint: var(--ss-green); --color-sky: var(--ss-green); --color-gold: var(--ss-green);
  --color-pink-soft: var(--plate); --color-peri-soft: var(--plate); --color-gold-lite: var(--plate);
  --color-line: #dcdad4; --color-hair: #dcdad4;
  /* a warning's amber and an error's rose take the dark reds the 2.0 shop already uses for its own errors */
  --color-warn: #9b1c2e; --color-danger: #b3122d;
}
.v2[data-season-palette="r1"] :is(.btn:not(.btn-plum, .btn-ghost, .btn-danger), .btn-pink) { color: var(--ink); }
/* the same pair written as utilities (round 58: the Vault offer panel's "Open now" mark is cream text on bg-peri,
   3.84:1 once peri is the season's red): cream or white text on a red utility fill takes the ink too, 4.72:1 */
.v2[data-season-palette="r1"] :is(.bg-peri, .bg-pink, .bg-primary, .bg-accent):is(.text-cream, .text-white) { color: var(--ink); }
/* today's older link and accent TEXT (text-peri) would be red text on white under the swap, 3.9:1: it takes the ink
   instead, and a link among it the season's red underline, as a 2.0 link has */
.v2[data-season-palette="r1"] :is(.text-peri, .text-primary, .text-pink) { color: var(--ink); }
.v2[data-season-palette="r1"] a:is(.text-peri, .text-primary, .text-pink) { text-decoration-line: underline; text-decoration-color: var(--ss-red); text-decoration-thickness: 2px; text-underline-offset: 3px; }

/* THE ADVENT'S DARK GREEN ROOM (round 55 review): a green letter in a heading's logotype sat on the room's dark green
   at 1.8:1 and nearly vanished. On that ground the logotype's green letters (today's marigold, cyan and lilac) take the
   snow, so the heading reads red and snow on green; red stays. */
.v2[data-season-palette="r1"] :is(.lx-room.is-advent, .lx-notice.is-advent) .lx-lt:is(.c-marigold, .c-cyan, .c-lilac) { --c: var(--ss-snow); }

/* links keep today's ink text (its contrast unchanged) and take the palette's colour in their underline. The shop's
   base focus ring (3 px ink on the page, v2.css's `.v2 :focus-visible`) takes the palette's colour at the same
   strength as that rule (:where adds nothing), so every ring v2.css sets for a particular place (white in the photo
   viewer and the night room, ink inside a coloured strip) stays as it is. */
.v2[data-season-palette] .lx-link { text-decoration-color: var(--ss-link); }
.v2:where([data-season-palette]) :focus-visible { outline-color: var(--ss-focus); }