/* ------------------------------------------------------------- tokens ---- */
:root {
  /* the sky — the page around everything */
  --sky:      #DEE8F2;
  --sky-2:    #EFF4F9;
  --sky-3:    #C7D8E9;
  --ink:      #16202B;
  --ink-soft: #4B5A6B;
  --ink-faint:#8393A5;
  --rule:     #C0CEDC;

  /* the pass — printed card stock */
  --pass:      #FCF8F0;
  --pass-2:    #F2ECDE;
  --pass-ink:  #1A212A;
  --pass-soft: #6A7381;
  --pass-rule: #DCD3C0;
  --punch:     #DEE8F2;   /* what shows through the perforation holes */

  /* accents: sunset over the Gulf, indigo over the Atlantic */
  --mx:      #D9622B;
  --fr:      #1E4E8C;
  --accent:  var(--mx);
  --ok:      #2E9E6B;
  --warn:    #B8820F;
  --alert:   #C24132;

  --shadow: 0 22px 48px -32px rgba(16, 32, 52, .55);
  --r: 14px;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --sky:      #070C14;
    --sky-2:    #0D1622;
    --sky-3:    #0F1B29;
    --ink:      #E9EFF6;
    --ink-soft: #9AAABC;
    --ink-faint:#68788B;
    --rule:     #1E2C3C;
    --pass:      #141D28;
    --pass-2:    #101822;
    --pass-ink:  #EBF1F8;
    --pass-soft: #92A3B5;
    --pass-rule: #26374B;
    --punch:     #070C14;
    --mx:      #F0843F;
    --fr:      #7EA8DE;
    --ok:      #4FBF8B;
    --warn:    #E0AA3E;
    --alert:   #E2705A;
    --shadow: 0 22px 48px -30px rgba(0, 0, 0, .8);
  }
}
:root[data-theme="dark"] {
  --sky:      #070C14;
  --sky-2:    #0D1622;
  --sky-3:    #0F1B29;
  --ink:      #E9EFF6;
  --ink-soft: #9AAABC;
  --ink-faint:#68788B;
  --rule:     #1E2C3C;
  --pass:      #141D28;
  --pass-2:    #101822;
  --pass-ink:  #EBF1F8;
  --pass-soft: #92A3B5;
  --pass-rule: #26374B;
  --punch:     #070C14;
  --mx:      #F0843F;
  --fr:      #7EA8DE;
  --ok:      #4FBF8B;
  --warn:    #E0AA3E;
  --alert:   #E2705A;
  --shadow: 0 22px 48px -30px rgba(0, 0, 0, .8);
}