/* Picturoo's colours (Crayon box, direction A; packs 8 and 9, m88 and m89, c330), defined once for the web app and the
   share player. The rules are in the project doc 'Picturoo brand kit'. Paper (light) is the default everywhere.
   A page whose root carries data-theme="phone" follows the phone's light or dark setting: the web app's parent screens
   do. Stories, the reading page, the player and every shared link always stay on paper: they never set it, and an
   element with the class "paper" inside a page that follows the phone is put back on paper.
   Oo blue is for Oo and shapes only, never for text. test/theme.test.ts checks every text pair against WCAG AA. */
:root, .paper {
  --pc-page: #FFFAF0;
  --pc-card: #FFFFFF;
  --pc-ink: #2B2622;
  --pc-quiet: #6B6158;
  --pc-line: #E6DCCB;
  --pc-primary: #2F5DA8;
  --pc-on-primary: #FFFFFF;
  --pc-coral: #F27D62;
  --pc-coral-text: #A8432B;
  --pc-lilac: #C49AD6;
  --pc-success: #2E7445;
  --pc-error: #B3261E;
  --pc-oo: #6E9FD9;
  /* The design standard (m161, pack 17, c640): the soft blue band for tips, notices and information chips, and the
     scrim behind a drawer or sheet. The band is light in both themes: anything on it is drawn on paper (the classes
     "paper" and "piece-band-text"), so its words keep the light pairs (ink and primary on the band). */
  --pc-soft: #EEF3FB;
  --pc-scrim: rgba(43, 38, 34, .42);
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root[data-theme="phone"] {
    --pc-page: #1D1A20;
    --pc-card: #29252E;
    --pc-ink: #F6F0E6;
    --pc-quiet: #C2B8AC;
    --pc-line: #3E3843;
    --pc-primary: #8FB4EA;
    --pc-on-primary: #10213D;
    --pc-coral: #F4937B;
    --pc-coral-text: #F4937B;
    --pc-lilac: #C9A6DB;
    --pc-success: #74CF98;
    --pc-error: #FF8C82;
    color-scheme: dark;
  }
}
/* Text inside a paper element takes paper's ink, not the colour it would inherit from a dark page around it. */
.paper { color: var(--pc-ink); }