/* Tokens the chrome and the six chrome routes need that design/palette.css and
 * site/light.tokens.css do not yet declare. Same --resurs-* namespace, same
 * rule as every other token layer here: a component never carries a literal
 * colour or duration, because he intends to run whole colour schemes against
 * ad response and a palette hard-wired into a component is a defect.
 *
 * Ported from mocks/pages/ef/pages-ef.tokens.css, narrowed to what the picked
 * versions actually use. They belong in design/palette.css; that file is shared
 * by six lanes tonight, so they land here and the move is listed in the report.
 */
:root {
  /* The chrome that opens out of the header: a veil under the panel and the
     panel's own lift. Navy never becomes ground; the veil is ink at low alpha. */
  --resurs-veil:             rgba(12, 16, 24, 0.32);
  --resurs-panel-lift:       0 24px 60px -20px rgba(9, 14, 24, 0.35);
  --resurs-header-shadow:    0 1px 0 rgba(16, 22, 34, 0.06), 0 8px 24px -16px rgba(16, 22, 34, 0.2);
  --resurs-band-hover:       #EEF0F3;
  --resurs-open:             260ms;   /* a panel opening */

  /* Forms: field edges, the invalid ring, the two status tints. */
  --resurs-field-edge:       #D5D9E0;
  --resurs-field-edge-hover: #B9BFC9;
  --resurs-field-ground:     #FFFFFF;
  --resurs-invalid:          #C0392B;
  --resurs-invalid-soft:     #FBECEA;
  --resurs-saved:            #1F7A4D;
  --resurs-saved-soft:       #E8F5EE;

  /* An empty slot on a page whose content is still being written. */
  --resurs-slot-ground:      #FAFBFC;

  --resurs-size-page-title:  40px;
}
@media (max-width: 1080px) {
  :root { --resurs-size-page-title: 34px; }
}
@media (max-width: 560px) {
  :root { --resurs-size-page-title: 28px; }
}
