@import url('https://fonts.googleapis.com/css?family=Roboto');
@import url('https://fonts.googleapis.com/css2?family=Exo');
/* ERCS downstream theme: keep upstream eelKit CSS unchanged. */
:root {
  color-scheme: dark;
  --bg:#333; --panel:#222; --panel-soft:#2b2b2b; --card:#222;
  --text:#fff; --ink:#fff; --muted:#ccc; --line:#777;
  --primary:#0dd; --accent:#0dd; --primary-soft:#164747;
  --link:#0dd; --link-hover:#8fffff; --link-visited:#aee;
  --success:#9cdaa3; --success-soft:#193c24;
  --warning:#ffda8a; --warning-soft:#493718;
  --danger:#ffb5b5; --danger-soft:#592424;
  --header-bg:#292929; --table-lines:#555; --toolbar:#292929;
  --shadow:0 3px 12px #0003; --radius:4px;
  font-size:10pt;
}
html, body, button, input, select, textarea { font-family:'Exo','Roboto',Arial,sans-serif; font-size:10pt; line-height:1.4; }
body { background:#333; color:#fff; }
.main { padding:24px; }
.sidebar { background:#222; border-color:#777; }
.brand-mark, .auth-logo-mark { background:#862f2f; border-radius:4px; box-shadow:none; }
.brand-title, .auth-logo-title { overflow-wrap:anywhere; }
.auth-shell { background:#222; padding:24px; border-radius:4px; }
.auth-input, .selector-input, .sidebar-select, input:not([type=checkbox]):not([type=radio]):not([type=submit]), select, textarea {
  background:#333; color:#fff; border-color:#777; border-radius:3px; font:inherit;
}
input:not([type=checkbox]):not([type=radio]), select, textarea { padding:8px; }
option, .sidebar-select option { background:#333; color:#fff; }
button, .button, .btn, .auth-button { font-family:inherit; font-size:inherit; line-height:1.4; border-radius:3px; }
.auth-button, .reports-primary { display:inline-block; background:#222; color:#fff; border:2px solid #0dd; padding:8px 14px; text-decoration:none; box-shadow:0 0 .5em #00aaaa55; }
.auth-button:hover, .reports-primary:hover { background:#0dd; color:#111; }
.nav-link.active, .nav-link.active:hover { background:#862f2f; color:#fff; }
.nav-link:hover { background:#444; }
.nav-scroll-hint.top { background:linear-gradient(to bottom,#222,transparent); }
.nav-scroll-hint.bottom { background:linear-gradient(to top,#222,transparent); }
.auth-secret { background:#333; border-color:#777; }
.auth-error { background:#592424; color:#ffcece; }
.auth-copy, .auth-logo-subtitle, .reports-note { color:#ccc; }
.reports-welcome { max-width:65em; }
.reports-welcome p { margin:0 0 16px; }
.reports-website-link { color:#0dd; }
:where(a,button,input,select,textarea,summary):focus-visible { outline:2px solid #0dd; outline-offset:3px; }
button:disabled { opacity:.5; }
h1 { font-size:26px; } h2 { font-size:22px; } h3 { font-size:16px; }
@media (max-width:600px) { .main { padding:12px; } body:has(.auth-shell) { padding:12px; } .auth-shell { padding:20px; } h1 { font-size:22px; } }/* Components with upstream literal light colours. */
:root { --focus:#0dd; }
.status-panel, .month-card, .month-tile, .modal-content, dialog { background:#222; color:#fff; border-color:#777; }
.status-badge.neutral { background:#444; color:#eee; }
.alert.success, .status-badge.success, .month-card-ok, .month-tile.complete, .month-tile.green { background:var(--success-soft); color:var(--success); }
.alert.error, .status-badge.danger, .danger-panel, .month-card-bad, .month-tile.empty, .month-tile.red { background:var(--danger-soft); color:var(--danger); }
.warning-box, .path-status.warn, .status-badge.warning, .month-card-warn, .month-tile.attention, .month-tile.amber { background:var(--warning-soft); color:var(--warning); }
.month-tile.future, .month-tile.grey { background:#333; color:#ccc; }
.card-size-toggle { background:#333; color:#fff; }
.page-card-tab.is-active { background:#862f2f; color:#fff; }
/* Preserve white QR backgrounds and readable paper output. */
@media print {
  :root { color-scheme:light; --bg:#fff; --panel:#fff; --panel-soft:#fff; --text:#000; --ink:#000; --muted:#333; --line:#777; }
  body, .sidebar, .status-panel, .card, .auth-shell { background:#fff; color:#000; }
  .main { padding:0; }
}
/* Match legacy outlined actions while keeping text contrast on hover. */
.button.primary { background:#222; color:#fff; border:2px solid #0dd; box-shadow:0 0 .5em #00aaaa55; padding:8px 12px; }
.button.primary:hover:not(:disabled) { background:#0dd; color:#111; }
.button.danger { background:#222; color:#fff; border:2px solid #862f2f; }
.button.danger:hover:not(:disabled) { background:#862f2f; color:#fff; }
.button:disabled, .button.disabled, .button[aria-disabled=true] { background:#444; color:#ccc; border-color:#777; }