/* Vulmir's existing fonts and palette. Fonts retain their OFL notices. */
/* Public presentation is delivered atomically without restarting webmail. */
@font-face {
  font-family: 'Vulmir Sans';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('/branding/vulmir-instrument-sans.woff2') format('woff2');
}
@font-face {
  font-family: 'Vulmir Display';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('/branding/vulmir-fraunces.woff2') format('woff2');
}
@font-face {
  font-family: 'Vulmir Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/branding/vulmir-space-mono.woff2') format('woff2');
}
:root {
  --color-background: #f7f5ef;
  --color-foreground: #26221c;
  --color-card: #ffffff;
  --color-card-foreground: #26221c;
  --color-popover: #ffffff;
  --color-popover-foreground: #26221c;
  --color-primary: #c4480a;
  --color-primary-foreground: #ffffff;
  --color-ring: #c4480a;
  --color-secondary: #f2eee2;
  --color-secondary-foreground: #26221c;
  --color-muted: #f2eee2;
  --color-muted-foreground: #665f53;
  --color-accent: #f5e2d3;
  --color-accent-foreground: #6f2806;
  --color-border: #d9d1c2;
  --color-input: #d9d1c2;
  --color-selection: #f5d8c2;
  --color-selection-foreground: #6f2806;
  --color-unread: #c4480a;
  --color-sidebar: #f2eee2;
  --color-sidebar-foreground: #26221c;
  --color-sidebar-primary: #c4480a;
  --color-sidebar-primary-foreground: #ffffff;
  --color-sidebar-accent: #f5e2d3;
  --color-sidebar-accent-foreground: #6f2806;
  --color-sidebar-border: #d9d1c2;
}
.dark {
  --color-background: #191c19;
  --color-foreground: #f7f5ef;
  --color-card: #22302c;
  --color-card-foreground: #f7f5ef;
  --color-popover: #22302c;
  --color-popover-foreground: #f7f5ef;
  --color-primary: #e8863f;
  --color-primary-foreground: #26221c;
  --color-ring: #e8863f;
  --color-secondary: #2c3630;
  --color-secondary-foreground: #f7f5ef;
  --color-muted: #2c3630;
  --color-muted-foreground: #cbc6bc;
  --color-accent: #493023;
  --color-accent-foreground: #f7f5ef;
  --color-border: #525a50;
  --color-input: #525a50;
  --color-selection: #644027;
  --color-selection-foreground: #f7f5ef;
  --color-unread: #e8863f;
  --color-sidebar: #22302c;
  --color-sidebar-foreground: #f7f5ef;
  --color-sidebar-primary: #e8863f;
  --color-sidebar-primary-foreground: #26221c;
  --color-sidebar-accent: #493023;
  --color-sidebar-accent-foreground: #f7f5ef;
  --color-sidebar-border: #525a50;
}

/* Only the login page adopts the site's editorial frame and typography. */
[data-login-page] {
  background: var(--color-background);
  font-family: 'Vulmir Sans', system-ui, sans-serif;
  min-height: 100svh;
  padding: 5rem 1.5rem 3rem;
}
[data-login-page] * { border-radius: 0; }
[data-login-container] { max-width: 26rem; }
[data-login-card] {
  background: var(--color-background);
  border: 1px solid var(--color-foreground);
  box-shadow: 6px 6px 0 color-mix(in srgb, var(--color-foreground) 10%, transparent);
  backdrop-filter: none;
}
[data-login-header] { padding: 2rem 2rem 1.75rem; text-align: left; }
[data-login-logo] { width: 3rem; height: 3rem; margin-bottom: 1.25rem; }
[data-login-logo] img { display: block; width: 3rem; height: 3rem; }
[data-login-header] h1 {
  font-family: 'Vulmir Display', Georgia, serif;
  font-size: 2rem;
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -.035em;
}
[data-login-form] { padding: 0 2rem 2rem; }
[data-login-form] label:not(:has(input[type='checkbox'])) {
  font-family: 'Vulmir Mono', monospace;
  font-size: .6875rem;
  letter-spacing: .07em;
  text-transform: uppercase;
}
[data-login-form] input:not([type='checkbox']) {
  height: 3rem;
  font-size: .9375rem;
  background: var(--color-background);
  border-color: var(--color-muted-foreground);
}
[data-login-form] button[type='submit'] {
  height: 3rem;
  font-size: .9375rem;
  font-weight: 600;
}
[data-login-page] button:not(:focus-visible) { box-shadow: none; }
[data-login-page] :is(input, button, a):focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 3px;
}
[data-login-container] > div:last-child :is(a, p) { color: var(--color-muted-foreground); }
@media (max-width: 480px) {
  [data-login-page] { padding: 5rem 1rem 2rem; }
  [data-login-header] { padding: 1.5rem; }
  [data-login-form] { padding: 0 1.5rem 1.5rem; }
}