/* PALETTE (v37): ONE palette for frame, cards and buttons. Colour-only overrides; load this stylesheet LAST.
   Layout, fonts and sizes are untouched. To revert: remove the <link> to this file (and js/v7.js keeps working with the v7.css defaults).
   Sources:
     --pal-pink    #FE3EA6  the pink of the book-cover title (sampled from img/cover.webp, most frequent title pixel)
     --pal-yellow  #D6CF2A  the site's dominant yellow (robot-frame tiles; most frequent yellow on the rendered page)
     --pal-orange  #E0782C  existing frame orange        --pal-teal #7E978A  existing frame teal
     --pal-ink / --pal-cream / --pal-paper / --pal-space   existing ink, card cream, light paper box, space black
   Deep tones (same hue, darker) are only for SMALL text on cream, so it stays readable (contrast ≥ 4.5:1). */
:root{
  --pal-pink:#FE3EA6; --pal-pink-deep:#CB016E;
  --pal-yellow:#D6CF2A; --pal-yellow-lite:#E6E05C;
  --pal-orange:#E0782C; --pal-orange-deep:#A05118;
  --pal-teal:#7E978A;
  --pal-ink:#2A2420; --pal-cream:#F3EDE2; --pal-paper:#FBF7EF; --pal-space:#141210;
  /* map the site's existing variables onto the palette */
  --pink:var(--pal-pink); --hot:var(--pal-pink);
  --ochre:var(--pal-yellow); --ochreD:var(--pal-orange-deep);
  --p-pink:var(--pal-pink); --p-orange:var(--pal-orange); --p-yellow:var(--pal-yellow); --p-teal:var(--pal-teal);
  --ink:var(--pal-ink); --cream:var(--pal-cream);
}
/* small pink text on cream: deep tone of the cover pink */
.mlabel b,.mnav button[aria-current=true],.stamp,.cn,.more span,#msg,.contact h3,.ten b,.chip.hl small,.about-k,.about-more,.chal-k b,.pv-top b,
.look-x:hover,.fn .fl:hover,.chal a:hover,.fn .fn-ct a:hover,.contact .mail:hover,.contact .mail:focus-visible,.doc a:hover,.pv-top a:hover{color:var(--pal-pink-deep)}
/* pink-filled buttons and labels: ink lettering on the cover pink (readable; cream on this pink is too faint) */
.btn,.chal-tg,.chal-go,.burst .soon,.li-label{color:var(--pal-ink)}
.chal summary:hover .chal-tg,.chal-go:hover{color:var(--pal-cream)}
.lookcover:hover .li-label,.lookcover:focus-visible .li-label{color:var(--pal-cream)}
.su button:hover{color:var(--pal-ink)}
.btn[aria-disabled=true]{background:var(--pal-cream);color:var(--pal-ink)}
/* yellows: one value everywhere */
.burst .b-main,.li-arrow .li-ar{fill:var(--pal-yellow)}
.lookcover:hover .li-arrow .li-ar,.lookcover:focus-visible .li-arrow .li-ar{fill:var(--pal-yellow-lite)}
/* audiobook box: same paper, ink and pink as the other boxes */
.audiobook{background:var(--pal-paper);border-color:var(--pal-ink);box-shadow:4px 4px 0 var(--pal-pink)}
.audiobook-title{color:var(--pal-ink)}
/* hard-coded glows and offsets that used the old reds/ochre */
.fly{filter:drop-shadow(0 0 6px rgba(254,62,166,.9))}
.shoot{box-shadow:2px 2px 0 rgba(254,62,166,.45)}
.sat{box-shadow:1px 1px 0 rgba(254,62,166,.6)}
.moon{filter:drop-shadow(-3px 2px 0 rgba(254,62,166,.32))}
.cap{box-shadow:2px 2px 0 rgba(254,62,166,.5)}
.chip{box-shadow:3px 3px 0 rgba(254,62,166,.55)}
.chip.hl{box-shadow:5px 5px 0 var(--pal-pink)}
.konst line{stroke:rgba(214,207,42,.6)}
.rline{border-top-color:rgba(214,207,42,.55)}
@media (max-width:760px){.konst line{stroke:rgba(214,207,42,.75)}.konst circle{fill:var(--pal-yellow);filter:drop-shadow(0 0 3px rgba(214,207,42,.8))}}
/* shop buttons (css/shop.css) */
.shop .btn.alt,.ty .dl .btn.alt{background:var(--pal-yellow);color:var(--pal-ink)}
.shop .btn.alt:hover,.ty .dl .btn.alt:hover{background:var(--pal-ink);color:var(--pal-yellow)}
.shop .btn:hover,.ty .dl .btn:hover{background:var(--pal-ink);color:var(--pal-pink)}
.ty .dl .btn{color:var(--pal-ink)}
/* CHALLENGE SIGN-UP toggle + Sign up (Oct 4, recolor 2): deep indigo #2F4A7A, white text 8.8:1; hover ~8% darker #2B4470 (9.7:1).
   The open-state toggle (cream, "Close") and the focus outline are unchanged. */
.chal-tg,.chal-go{background:#2F4A7A;color:#FFF}
.chal summary:hover .chal-tg,.chal-go:hover{background:#2B4470;color:#FFF}
/* BUY BUTTONS (Oct 4, recolor 2). Here because palette.css loads last; the locked state in shop.css keeps its !important hatching.
   Ebook: the frame-tile pink (--pal-pink #FE3EA6, the .cell background behind the robots) with the frame's Ben-Day dots
   (same 5px grid as .band::after, but lighter: ink at 10% instead of 20%, so the label stays readable). Black text: 6.5:1 on the pink, 5.6:1 at a dot centre;
   hover ~8% darker #EA3999: 5.5:1 (4.8:1 at a dot centre).
   Audiobook: the frame orange (--pal-orange #E0782C), solid. Black text: 6.9:1; hover ~8% darker #CE6E28: 5.9:1. */
.shop .shop-b{background:radial-gradient(rgba(42,36,32,.1) .9px,transparent 1.4px) 0 0/5px 5px,#FE3EA6;color:#000}
.shop .shop-b:hover,.shop .shop-b:focus-visible{background:radial-gradient(rgba(42,36,32,.1) .9px,transparent 1.4px) 0 0/5px 5px,#EA3999;color:#000}
.shop .shop-b.alt{background:#E0782C;color:#000}
.shop .shop-b.alt:hover,.shop .shop-b.alt:focus-visible{background:#CE6E28;color:#000}
.shop .shop-b:focus-visible{outline:2px solid var(--ink);outline-offset:2px}