/* Postbus — design tokens.
   Idea: a sorting office. Airmail blue + red are the only brand colours; every domain gets its own stamp colour. */
@font-face{font-family:"Familjen Grotesk";src:url(../fonts/familjen-grotesk-latin-wght-normal.woff2) format("woff2");font-weight:400 700;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Familjen Grotesk";src:url(../fonts/familjen-grotesk-latin-ext-wght-normal.woff2) format("woff2");font-weight:400 700;font-style:normal;font-display:swap;unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Familjen Grotesk";src:url(../fonts/familjen-grotesk-latin-wght-italic.woff2) format("woff2");font-weight:400 700;font-style:italic;font-display:swap}
@font-face{font-family:Newsreader;src:url(../fonts/newsreader-latin-wght-normal.woff2) format("woff2");font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:Newsreader;src:url(../fonts/newsreader-latin-wght-italic.woff2) format("woff2");font-weight:200 800;font-style:italic;font-display:swap}

:root{
  --ui:"Familjen Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif;
  --letter:Newsreader,Georgia,"Times New Roman",serif;

  --paper:#f3f5f9;       /* app background */
  --surface:#ffffff;     /* panes */
  --wall:#e9edf5;        /* the rail: the pigeonhole wall */
  --wall-2:#dde3ef;
  --ink:#101828;
  --ink-2:#475467;
  --ink-3:#778399;
  --line:#dde2ec;
  --line-2:#eceff5;
  --hover:#eef1f7;
  --sel:#e3eafe;         /* selected row */
  --blue:#2250d9;        /* airmail blue: actions, unread */
  --blue-ink:#ffffff;
  --blue-soft:#e3eafe;
  --red:#d8342c;         /* airmail red: danger, alerts */
  --red-soft:#fde7e5;
  --green:#12805c; --green-soft:#dff4ec;
  --amber:#a15c00; --amber-soft:#fdf0d5;
  --shadow:0 1px 2px rgba(16,24,40,.06),0 8px 24px -8px rgba(16,24,40,.16);
  --shadow-lg:0 2px 6px rgba(16,24,40,.08),0 24px 60px -12px rgba(16,24,40,.28);
  --radius:10px; --radius-sm:6px;
  --rail:288px; --list:408px;
  --row-pad:12px;
  color-scheme:light;
}
:root[data-density="compact"]{--row-pad:7px}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --paper:#0c111e; --surface:#121a2b; --wall:#0a0f1b; --wall-2:#161f33;
    --ink:#e8edf7; --ink-2:#a9b4c8; --ink-3:#7381a0; --line:#243049; --line-2:#1a2438; --hover:#182238; --sel:#1b2c5c;
    --blue:#7a9cff; --blue-ink:#0b1226; --blue-soft:#1b2c5c; --red:#ff7266; --red-soft:#3a1a1b; --green:#4fd1a0; --green-soft:#10302a; --amber:#f0b44c; --amber-soft:#35290f;
    --shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px -8px rgba(0,0,0,.6); --shadow-lg:0 2px 6px rgba(0,0,0,.5),0 24px 60px -12px rgba(0,0,0,.7);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --paper:#0c111e; --surface:#121a2b; --wall:#0a0f1b; --wall-2:#161f33;
  --ink:#e8edf7; --ink-2:#a9b4c8; --ink-3:#7381a0; --line:#243049; --line-2:#1a2438; --hover:#182238; --sel:#1b2c5c;
  --blue:#7a9cff; --blue-ink:#0b1226; --blue-soft:#1b2c5c; --red:#ff7266; --red-soft:#3a1a1b; --green:#4fd1a0; --green-soft:#10302a; --amber:#f0b44c; --amber-soft:#35290f;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px -8px rgba(0,0,0,.6); --shadow-lg:0 2px 6px rgba(0,0,0,.5),0 24px 60px -12px rgba(0,0,0,.7);
  color-scheme:dark;
}
