@import url('https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:ital,wght@0,400;0,700;1,400&display=swap');
/* Event Bucket city staff dashboard, "Almanac" styling (approved 2026-10-13)
   on top of the Layout 1 structure (2026-10-06).
   Scoped to the admin dashboard only: #view-admin.eb-l1 and, while an admin
   session is visible (body.eb-l1-admin), the admin modals. The public board,
   lobby TV, and login views keep their own look; the font import above only
   downloads the face, it is applied inside the admin scope alone.
   Grounds are white and a light wash. Colour carries meaning only: event
   blue, civic green (approve), notice amber, alert red (decline). Every
   text and background pair used here measures 4.5:1 or better. */

/* ── 1. Tokens, and a remap of the board's legacy dark tokens ── */
#view-admin.eb-l1,
body.eb-l1-admin #previewModal, body.eb-l1-admin #editEventModal, body.eb-l1-admin #rejectModal,
body.eb-l1-admin #conflictModal, body.eb-l1-admin #reauthModal, body.eb-l1-admin .l1-dialog,
body.eb-l1-admin #toastWrap, body.eb-l1-admin .toast-wrap {
  --eb-ink: #14213D; --eb-muted: #4F5D78; --eb-slate: #4F5D78; --eb-line: #DDE3EE; --eb-wash: #EEF2F8; --eb-surface: #FFFFFF;
  --eb-event: #2350E0; --eb-event-hover: #1A3DB5; --eb-event-wash: #E6ECFD;
  --eb-civic: #1E7A4C; --eb-civic-hover: #17603C; --eb-civic-wash: #E3F2EA;
  --eb-notice: #9A5B00; --eb-notice-wash: #FFF1D6;
  --eb-alert: #C0352B; --eb-alert-wash: #FBE5E3;
  --eb-btn-line: #C9D1DF; --eb-field-line: #74819A;
  --eb-radius: 12px; --eb-radius-sm: 8px; --eb-letter: 17 / 22;
  --eb-font: 'Atkinson Hyperlegible', 'Segoe UI', system-ui, sans-serif;
  --eb-card-shadow: 0 1px 2px rgba(20,33,61,0.06);
  /* older names still used below and by inline styles */
  --eb-cobalt: var(--eb-event); --eb-cobalt-hover: var(--eb-event-hover); --eb-paper: var(--eb-wash); --eb-tint: var(--eb-event-wash);
  --eb-danger: var(--eb-alert); --eb-danger-bg: var(--eb-alert-wash); --eb-success: var(--eb-civic); --eb-success-bg: var(--eb-civic-wash);
  --eb-warn: var(--eb-notice); --eb-warn-bg: var(--eb-notice-wash); --eb-focus: var(--eb-event);
  /* legacy tokens the board markup uses inline, repainted for a light shell */
  --bg-base: var(--eb-wash); --navy: var(--eb-wash); --bg-elevated: var(--eb-surface); --bg-card: var(--eb-surface);
  --bg-input: var(--eb-surface); --text-primary: var(--eb-ink); --text-secondary: var(--eb-muted); --text-muted: var(--eb-muted);
  --gold: var(--eb-event); --gold-light: var(--eb-event-hover); --gold-dim: var(--eb-event-wash); --gold-glow: rgba(35,80,224,0.16);
  --on-gold: #FFFFFF; --civic-light: var(--eb-event);
  --green: var(--eb-civic); --red: var(--eb-alert); --red-light: var(--eb-alert); --danger: var(--eb-alert);
  --font-display: var(--eb-font); --font-body: var(--eb-font);
  color-scheme: light;
  font-family: var(--eb-font);
  font-variant-numeric: tabular-nums;
  color: var(--eb-ink);
  -webkit-font-smoothing: antialiased;
}
#view-admin.eb-l1 button, #view-admin.eb-l1 input, #view-admin.eb-l1 select, #view-admin.eb-l1 textarea,
.l1-dialog button, .l1-dialog input, .l1-dialog select, .l1-dialog textarea,
body.eb-l1-admin .modal-overlay button, body.eb-l1-admin .modal-overlay input, body.eb-l1-admin .modal-overlay select, body.eb-l1-admin .modal-overlay textarea { font-family: var(--eb-font, inherit); }
#view-admin.eb-l1 ::selection { background: var(--eb-event-wash); color: var(--eb-ink); }

/* ── 2. Shell: slim header and one row of tabs ── */
#view-admin.eb-l1 { background: var(--eb-wash); min-height: 100vh; font-size: 1rem; line-height: 1.5; }
#view-admin.eb-l1 .admin-hdr { display: none !important; }
.eb-l1 .l1-skip { position: absolute; left: 16px; top: -100px; z-index: 1000; background: var(--eb-surface); color: var(--eb-event);
  padding: 12px 16px; border: 2px solid var(--eb-event); border-radius: 8px; font-weight: 700; text-decoration: none; }
.eb-l1 .l1-skip:focus { top: 12px; }

.eb-l1 .l1-header { display: flex; align-items: center; gap: 12px 16px; flex-wrap: wrap;
  min-height: 60px; padding: 8px 28px; background: var(--eb-surface); border-bottom: 1.5px solid var(--eb-line); }
.eb-l1 .l1-ident { display: flex; align-items: baseline; gap: 6px 14px; flex-wrap: wrap; margin: 0; min-width: 0; }
.eb-l1 .l1-board-name { font-size: 1.1875rem; line-height: 1.5rem; font-weight: 700; color: var(--eb-ink); }
.eb-l1 .l1-board-sub { font-size: 0.875rem; color: var(--eb-muted); }
.eb-l1 .l1-header-actions { margin-left: auto; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.eb-l1 .l1-header-actions .btn { min-height: 40px; padding: 7px 12px; font-size: 0.875rem; }

.eb-l1 .l1-tabs { position: sticky; top: 0; z-index: 60; background: var(--eb-surface); border-bottom: 1.5px solid var(--eb-line); }
.eb-l1 .l1-tab-list { list-style: none; margin: 0; padding: 0 20px; display: flex; gap: 4px; overflow-x: auto; scrollbar-width: thin; }
.eb-l1 .l1-tab-list > li { flex: none; display: flex; }
.eb-l1 .l1-nav-link { display: flex; align-items: center; gap: 8px; min-height: 52px; padding: 0 14px; white-space: nowrap;
  font-size: 0.9375rem; font-weight: 700; color: var(--eb-muted); text-decoration: none;
  border-bottom: 3px solid transparent; margin-bottom: -1.5px; }
.eb-l1 .l1-nav-link:hover { color: var(--eb-ink); border-bottom-color: var(--eb-line); }
.eb-l1 .l1-nav-link[aria-current="page"] { color: var(--eb-ink); border-bottom-color: var(--eb-event); }
#view-admin.eb-l1 .l1-nav-link:focus-visible { outline-offset: -4px !important; }
.eb-l1 .l1-nav-count { background: var(--eb-event); color: #FFFFFF; font-size: 0.75rem; line-height: 1.125rem; font-weight: 700; border-radius: 999px; padding: 1px 8px; min-width: 22px; text-align: center; }

#view-admin.eb-l1 .admin-body { min-width: 0; padding: 28px 40px 40px; overflow: visible; }
#view-admin.eb-l1 .admin-body:focus { outline: none; }

@media (max-width: 1023px) {
  #view-admin.eb-l1 .admin-body { padding: 20px 20px 32px; }
  .eb-l1 .l1-header { padding: 8px 20px; }
  .eb-l1 .l1-tab-list { padding: 0 8px; }
}
@media (max-width: 600px) {
  #view-admin.eb-l1 .admin-body { padding: 16px 16px 28px; }
  .eb-l1 .l1-header { padding: 10px 16px; }
  .eb-l1 .l1-board-name { font-size: 1.0625rem; }
  .eb-l1 .l1-header-actions { margin-left: 0; }
  .eb-l1 .l1-nav-link { padding: 0 10px; min-height: 48px; }
}

/* ── 3. Page heads, typography ── */
.eb-l1 .l1-page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px 20px; flex-wrap: wrap; margin: 0 0 20px; }
.eb-l1 .l1-page-title { font-size: 1.75rem; line-height: 2.125rem; font-weight: 700; color: var(--eb-ink); margin: 0; }
.eb-l1 .l1-page-title:focus { outline: none; }
.eb-l1 .l1-page-title:focus-visible { outline: 3px solid var(--eb-focus); outline-offset: 4px; border-radius: 4px; }
.eb-l1 .l1-page-sub { font-size: 0.9375rem; line-height: 1.4rem; color: var(--eb-muted); margin: 4px 0 0; max-width: 76ch; }
.eb-l1 .l1-page-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.eb-l1 .l1-section-title, .eb-l1 .settings-card-title, .eb-l1 .psa-form-card h3 { font-size: 1.1875rem; line-height: 1.625rem; }
.eb-l1 .l1-help { font-size: 0.875rem; line-height: 1.3rem; color: var(--eb-muted); }
#view-admin.eb-l1 h1, #view-admin.eb-l1 h2, #view-admin.eb-l1 h3 { color: var(--eb-ink); font-family: var(--eb-font); letter-spacing: 0; }
@media (max-width: 600px) { .eb-l1 .l1-page-title { font-size: 1.5rem; line-height: 1.875rem; } }

/* Segmented toggle (Pending review order) */
.eb-l1 .l1-seg { display: inline-flex; gap: 4px; padding: 4px; background: var(--eb-surface); border-radius: 10px; box-shadow: inset 0 0 0 1.5px var(--eb-line); }
.eb-l1 .l1-seg[hidden] { display: none; }
.eb-l1 .l1-seg button { all: unset; box-sizing: border-box; cursor: pointer; min-height: 36px; padding: 6px 12px; border-radius: 7px;
  font-family: var(--eb-font); font-size: 0.875rem; font-weight: 700; color: var(--eb-muted); display: inline-flex; align-items: center; }
.eb-l1 .l1-seg button:hover { color: var(--eb-ink); background: var(--eb-wash); }
.eb-l1 .l1-seg button[aria-pressed="true"] { background: var(--eb-ink); color: #FFFFFF; }
#view-admin.eb-l1 .l1-seg button:focus-visible { outline-offset: 1px !important; }

/* ── 4. Buttons ── */
.eb-l1 .btn, .l1-dialog .btn, body.eb-l1-admin .modal-overlay .btn {
  font-family: var(--eb-font); font-size: 0.9375rem; line-height: 1.4; font-weight: 700; border-radius: var(--eb-radius-sm); min-height: 44px; padding: 10px 16px;
  text-transform: none; letter-spacing: 0; box-shadow: none; transform: none; opacity: 1 !important; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
}
.eb-l1 .btn svg, .l1-dialog .btn svg { width: 16px; height: 16px; flex: none; }
.eb-l1 .btn-sm, .l1-dialog .btn-sm, body.eb-l1-admin .modal-overlay .btn-sm { font-size: 0.875rem; padding: 8px 12px; min-height: 40px; }
.eb-l1 .btn-primary, .l1-dialog .btn-primary, body.eb-l1-admin .modal-overlay .btn-primary,
.eb-l1 .l1-btn-primary { background: var(--eb-event) !important; color: #FFFFFF !important; border: 1.5px solid var(--eb-event) !important; }
.eb-l1 .btn-primary:hover, .l1-dialog .btn-primary:hover, body.eb-l1-admin .modal-overlay .btn-primary:hover,
.eb-l1 .l1-btn-primary:hover { background: var(--eb-event-hover) !important; border-color: var(--eb-event-hover) !important; transform: none; box-shadow: none; }
.eb-l1 .btn-ghost, .l1-dialog .btn-ghost, body.eb-l1-admin .modal-overlay .btn-ghost,
.eb-l1 .l1-btn-secondary { background: var(--eb-surface) !important; color: var(--eb-ink) !important; border: 1.5px solid var(--eb-btn-line) !important; }
.eb-l1 .btn-ghost:hover, .l1-dialog .btn-ghost:hover, body.eb-l1-admin .modal-overlay .btn-ghost:hover,
.eb-l1 .l1-btn-secondary:hover { background: var(--eb-wash) !important; border-color: var(--eb-field-line) !important; }
.eb-l1 .btn-success, body.eb-l1-admin .modal-overlay .btn-success { background: var(--eb-civic) !important; color: #FFFFFF !important; border: 1.5px solid var(--eb-civic) !important; }
.eb-l1 .btn-success:hover, body.eb-l1-admin .modal-overlay .btn-success:hover { background: var(--eb-civic-hover) !important; border-color: var(--eb-civic-hover) !important; }
.l1-dialog .btn-danger, body.eb-l1-admin .modal-overlay .btn-danger { background: var(--eb-alert) !important; color: #FFFFFF !important; border: 1.5px solid var(--eb-alert) !important; }
/* Inside the dashboard, Remove and other routine destructive buttons are a red
   outline (each still asks to confirm); the solid red stays for the final
   confirm step in dialogs. */
.eb-l1 .btn-danger { background: var(--eb-surface) !important; color: var(--eb-alert) !important; border: 1.5px solid #E3A39C !important; }
.eb-l1 .btn-danger:hover { background: var(--eb-alert-wash) !important; border-color: var(--eb-alert) !important; }
.eb-l1 .l1-btn-text { background: none; border: none; color: var(--eb-event); font-weight: 700; font-size: 0.9375rem; min-height: 44px; padding: 8px 4px;
  text-decoration: underline; text-underline-offset: 3px; cursor: pointer; font-family: var(--eb-font); }
.eb-l1 .btn:disabled, .eb-l1 .btn[aria-disabled="true"] { background: #E4E9F1 !important; color: #4F5D78 !important; border-color: #C9D1DF !important; cursor: not-allowed; }

/* Approve and Decline (pending rows) */
.eb-l1 .l1-btn-go { background: var(--eb-civic) !important; color: #FFFFFF !important; border: 1.5px solid var(--eb-civic) !important; }
.eb-l1 .l1-btn-go:hover { background: var(--eb-civic-hover) !important; border-color: var(--eb-civic-hover) !important; }
.eb-l1 .l1-btn-stop { background: var(--eb-surface) !important; color: var(--eb-alert) !important; border: 1.5px solid #E3A39C !important; }
.eb-l1 .l1-btn-stop:hover { background: var(--eb-alert-wash) !important; border-color: var(--eb-alert) !important; }

/* Focus: one clear event-blue ring with separation, everywhere in the admin */
#view-admin.eb-l1 :focus-visible, .l1-dialog :focus-visible, body.eb-l1-admin .modal-overlay :focus-visible {
  outline: 3px solid var(--eb-focus) !important; outline-offset: 3px !important; box-shadow: 0 0 0 2px #FFFFFF;
}

/* ── 5. Forms (native semantics kept) ── */
.eb-l1 .form-input, .eb-l1 .form-select, .eb-l1 .form-textarea,
.eb-l1 input[type="text"], .eb-l1 input[type="email"], .eb-l1 input[type="url"], .eb-l1 input[type="date"], .eb-l1 input[type="time"],
.eb-l1 input[type="number"], .eb-l1 input[type="search"], .eb-l1 input[type="password"], .eb-l1 select, .eb-l1 textarea,
.l1-dialog .form-input, .l1-dialog .form-select, .l1-dialog .form-textarea, .l1-dialog select, .l1-dialog textarea,
.l1-dialog input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
body.eb-l1-admin .modal-overlay .form-input, body.eb-l1-admin .modal-overlay .form-select, body.eb-l1-admin .modal-overlay .form-textarea {
  background: var(--eb-surface) !important; color: var(--eb-ink) !important; border: 1.5px solid var(--eb-field-line) !important; border-radius: var(--eb-radius-sm) !important;
  font-family: var(--eb-font); font-size: 1rem !important; line-height: 1.5; min-height: 44px; padding: 9px 12px; color-scheme: light; box-shadow: none;
}
.eb-l1 textarea, .l1-dialog textarea, .eb-l1 .form-textarea { min-height: 96px; }
.eb-l1 .form-input:focus, .eb-l1 .form-select:focus, .eb-l1 .form-textarea:focus, .eb-l1 select:focus, .eb-l1 textarea:focus, .eb-l1 input:focus,
.l1-dialog input:focus, .l1-dialog select:focus, .l1-dialog textarea:focus { border-color: var(--eb-event) !important; background: var(--eb-surface) !important; }
.eb-l1 .form-input::placeholder, .l1-dialog .form-input::placeholder, .eb-l1 textarea::placeholder, .eb-l1 input::placeholder { color: #5E6B84; }
.eb-l1 .form-label, .l1-dialog .form-label, body.eb-l1-admin .modal-overlay .form-label { color: var(--eb-ink); font-size: 0.9375rem; font-weight: 700; letter-spacing: 0; text-transform: none; }
.eb-l1 .form-hint, .l1-dialog .form-hint { font-size: 0.875rem; line-height: 1.3rem; color: var(--eb-muted); }
.eb-l1 input[type="file"] { font-size: 0.9375rem; color: var(--eb-ink); }
.eb-l1 input[type="checkbox"], .eb-l1 input[type="radio"], .l1-dialog input[type="checkbox"] { width: 20px; height: 20px; accent-color: var(--eb-event); }
.eb-l1 input[type="range"] { background: #C9D1DF; accent-color: var(--eb-event); }
.eb-l1 input[type="range"]::-webkit-slider-thumb { background: var(--eb-event); box-shadow: none; }

/* On/off settings drawn as switches (still real checkboxes: same ids, same
   change events, same label). Green when on, matching the civic colour. */
#view-admin.eb-l1 #modotEnabled, #view-admin.eb-l1 #windowOn {
  -webkit-appearance: none; appearance: none; flex: none; width: 44px; height: 26px; margin: 0; border-radius: 999px; cursor: pointer;
  background: #FFFFFF; border: 1.5px solid var(--eb-field-line); position: relative; transition: background-color .15s ease; }
#view-admin.eb-l1 #modotEnabled::after, #view-admin.eb-l1 #windowOn::after {
  content: ''; position: absolute; top: 3px; left: 3px; width: 17px; height: 17px; border-radius: 50%; background: var(--eb-field-line); transition: transform .15s ease; }
#view-admin.eb-l1 #modotEnabled:checked, #view-admin.eb-l1 #windowOn:checked { background: var(--eb-civic); border-color: var(--eb-civic); }
#view-admin.eb-l1 #modotEnabled:checked::after, #view-admin.eb-l1 #windowOn:checked::after { transform: translateX(18px); background: #FFFFFF; }
@media (prefers-reduced-motion: reduce) { #view-admin.eb-l1 #modotEnabled, #view-admin.eb-l1 #windowOn, #view-admin.eb-l1 #modotEnabled::after, #view-admin.eb-l1 #windowOn::after { transition: none; } }

/* ── 6. Cards and panels ── */
.eb-l1 .settings-card, .eb-l1 .psa-form-card, .eb-l1 .l1-panel, .l1-dialog .psa-form-card {
  background: var(--eb-surface) !important; border: 1.5px solid var(--eb-line) !important; border-radius: var(--eb-radius) !important; box-shadow: var(--eb-card-shadow) !important;
}
.eb-l1 .settings-card-title, .eb-l1 .psa-form-card h3, .l1-dialog .psa-form-card h3 { color: var(--eb-ink) !important; font-weight: 700; font-family: var(--eb-font) !important; letter-spacing: 0 !important; text-transform: none !important; border-bottom-color: var(--eb-line) !important; }
.eb-l1 .settings-wrap { max-width: 1100px; }

/* ── 7. Pending review rows ── */
.eb-l1 .l1-rows { display: grid; gap: 16px; }
.eb-l1 .l1-row { background: var(--eb-surface); border-radius: var(--eb-radius); box-shadow: var(--eb-card-shadow), inset 0 0 0 1.5px var(--eb-line);
  display: grid; grid-template-columns: 140px minmax(0, 1fr) 220px; gap: 24px; padding: 16px; align-items: start; }
.eb-l1 .l1-row[aria-busy="true"] { opacity: .75; }
.eb-l1 .l1-row-thumb { all: unset; box-sizing: border-box; width: 140px; height: 176px; border-radius: var(--eb-radius-sm); overflow: hidden; background: var(--eb-wash);
  display: flex; align-items: center; justify-content: center; cursor: zoom-in; text-align: center; }
.eb-l1 .l1-row-thumb img { width: 100%; height: 100%; object-fit: cover; object-position: top; display: block; }
.eb-l1 .l1-row-thumb-empty { cursor: pointer; border: 1.5px dashed var(--eb-btn-line); padding: 12px; font-size: 0.875rem; font-weight: 700; color: var(--eb-muted); }
#view-admin.eb-l1 .l1-row-thumb:focus-visible { outline-offset: 2px !important; }
.eb-l1 .l1-row-main { min-width: 0; }
.eb-l1 .l1-row-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; }
.eb-l1 .l1-chip { display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; padding: 3px 10px; font-size: 0.8125rem; line-height: 1.25rem; font-weight: 700; }
.eb-l1 .l1-chip-ev { background: var(--eb-event-wash); color: var(--eb-event); }
.eb-l1 .l1-chip-civ { background: var(--eb-civic-wash); color: var(--eb-civic); }
.eb-l1 .l1-chip-no { background: var(--eb-notice-wash); color: var(--eb-notice); }
.eb-l1 .l1-chip-al { background: var(--eb-alert-wash); color: var(--eb-alert); }
#view-admin.eb-l1 .l1-row-title { font-size: 1.3125rem; line-height: 1.25; font-weight: 700; margin: 10px 0 0; overflow-wrap: anywhere; }
.eb-l1 .l1-facts { border-collapse: collapse; margin-top: 10px; font-size: 0.9375rem; line-height: 1.4; }
.eb-l1 .l1-facts th { color: var(--eb-muted); font-weight: 400; text-align: left; padding: 3px 18px 3px 0; width: 70px; vertical-align: top; white-space: nowrap; }
.eb-l1 .l1-facts td { padding: 3px 0; vertical-align: top; overflow-wrap: anywhere; color: var(--eb-ink); }
.eb-l1 .l1-missing { color: var(--eb-notice); font-weight: 700; }
.eb-l1 .l1-row-links { display: flex; flex-wrap: wrap; gap: 0 18px; margin: 8px 0 0; }
.eb-l1 .l1-link { all: unset; box-sizing: border-box; cursor: pointer; min-height: 32px; display: inline-flex; align-items: center;
  font-family: var(--eb-font); font-size: 0.875rem; font-weight: 700; color: var(--eb-event); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.eb-l1 .l1-link:hover { color: var(--eb-event-hover); text-decoration-thickness: 2px; }
.eb-l1 .l1-row-acts { display: flex; flex-direction: column; gap: 8px; align-self: center; }
.eb-l1 .l1-row-acts > .btn { width: 100%; }
.eb-l1 .l1-row-small { display: flex; gap: 8px; }
.eb-l1 .l1-row-small .btn { flex: 1 1 0; min-width: 0; font-size: 0.8125rem; padding: 8px; min-height: 40px; white-space: nowrap; }
@media (max-width: 900px) {
  .eb-l1 .l1-row { grid-template-columns: 112px minmax(0, 1fr); gap: 16px; }
  .eb-l1 .l1-row-thumb { width: 112px; height: 140px; }
  .eb-l1 .l1-row-acts { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; }
  .eb-l1 .l1-row-small { grid-column: 1 / -1; }
}
@media (max-width: 480px) {
  .eb-l1 .l1-row { grid-template-columns: 84px minmax(0, 1fr); gap: 12px; padding: 12px; }
  .eb-l1 .l1-row-thumb { width: 84px; height: 106px; }
  #view-admin.eb-l1 .l1-row-title { font-size: 1.125rem; margin-top: 8px; }
  .eb-l1 .l1-facts { font-size: 0.875rem; }
  .eb-l1 .l1-facts th { width: auto; padding-right: 10px; }
  .eb-l1 .l1-row-links { gap: 0 14px; }
}

/* ── 8. Event cards (Events tab) ── */
.eb-l1 .l1-grid { display: grid; gap: 20px; grid-template-columns: 1fr; }
@media (min-width: 640px) { .eb-l1 .l1-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .eb-l1 .l1-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1280px) { .eb-l1 .l1-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.eb-l1 .l1-card { background: var(--eb-surface); border-radius: var(--eb-radius); box-shadow: var(--eb-card-shadow), inset 0 0 0 1.5px var(--eb-line); display: flex; flex-direction: column; min-width: 0; }
.eb-l1 .l1-media { position: relative; aspect-ratio: var(--eb-letter); background: var(--eb-wash); margin: 10px 10px 0;
  border-radius: var(--eb-radius-sm); overflow: hidden; display: flex; align-items: center; justify-content: center; }
.eb-l1 .l1-media img { width: 100%; height: 100%; object-fit: contain; display: block; }
.eb-l1 .l1-media-btn { all: unset; position: absolute; inset: 0; cursor: zoom-in; }
.eb-l1 .l1-media-btn:focus-visible { outline: 3px solid var(--eb-focus); outline-offset: -3px; }
.eb-l1 .l1-media-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 16px; text-align: center; color: var(--eb-muted); font-size: 0.875rem; }
.eb-l1 .l1-media-empty strong { font-size: 1rem; color: var(--eb-ink); }
.eb-l1 .l1-body { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.eb-l1 .l1-titlerow { display: flex; gap: 12px; align-items: flex-start; }
.eb-l1 .l1-date { flex-shrink: 0; width: 52px; border-radius: var(--eb-radius-sm); background: var(--eb-event-wash); color: var(--eb-event); text-align: center; padding: 4px 0 6px; line-height: 1.1; }
.eb-l1 .l1-date-mon { display: block; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.04em; }
.eb-l1 .l1-date-day { display: block; font-size: 1.375rem; font-weight: 700; }
#view-admin.eb-l1 .l1-card-title { font-size: 1.0625rem; line-height: 1.45rem; font-weight: 700; color: var(--eb-ink); margin: 0; overflow-wrap: anywhere; }
.eb-l1 .l1-cat { font-size: 0.875rem; color: var(--eb-muted); margin: 0; }
.eb-l1 .l1-meta { list-style: none; margin: 0; padding: 0; font-size: 0.875rem; line-height: 1.3rem; color: var(--eb-muted); display: grid; gap: 2px; }
.eb-l1 .l1-meta li { overflow-wrap: anywhere; }
.eb-l1 .l1-statuses { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.eb-l1 .l1-status { display: inline-flex; align-items: center; gap: 6px; font-size: 0.8125rem; line-height: 1.25rem; font-weight: 700; border-radius: 999px; padding: 2px 10px; border: 0; }
.eb-l1 .l1-status svg { width: 14px; height: 14px; }
.eb-l1 .l1-st-pending  { color: var(--eb-notice); background: var(--eb-notice-wash); }
.eb-l1 .l1-st-approved { color: var(--eb-civic); background: var(--eb-civic-wash); }
.eb-l1 .l1-st-rejected { color: var(--eb-alert); background: var(--eb-alert-wash); }
.eb-l1 .l1-st-onboard  { color: var(--eb-event); background: var(--eb-event-wash); }
.eb-l1 .l1-st-offboard { color: var(--eb-muted); background: var(--eb-wash); }
.eb-l1 .l1-st-expired  { color: var(--eb-muted); background: var(--eb-wash); }
.eb-l1 .l1-st-psa      { color: var(--eb-notice); background: var(--eb-notice-wash); }
.eb-l1 .l1-st-canceled { color: var(--eb-alert); background: var(--eb-alert-wash); }
.eb-l1 .l1-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: auto; padding-top: 8px; }
.eb-l1 .l1-extra { border-top: 1.5px solid var(--eb-line); margin-top: 8px; padding-top: 8px; display: grid; gap: 8px; font-size: 0.875rem; color: var(--eb-muted); }
.eb-l1 .l1-extra .ev-dur-row { border-top: none; margin: 0; padding: 0; }
.eb-l1 .ev-dur-lbl { color: var(--eb-muted); font-size: 0.875rem; }
.eb-l1 .ev-dur-input { width: 80px; min-height: 40px; }

/* More actions: disclosure of native buttons */
.eb-l1 .l1-more { position: relative; }
.eb-l1 .l1-more-panel { position: absolute; z-index: 30; right: 0; bottom: calc(100% + 6px); min-width: 250px; background: var(--eb-surface);
  border: 1.5px solid var(--eb-line); border-radius: var(--eb-radius); box-shadow: 0 12px 32px rgba(20,33,61,0.16); padding: 6px; display: grid; gap: 2px; }
.eb-l1 .l1-more-panel[hidden] { display: none; }
.eb-l1 .l1-more-item { all: unset; box-sizing: border-box; display: flex; align-items: center; gap: 8px; width: 100%; min-height: 44px; padding: 8px 12px;
  border-radius: var(--eb-radius-sm); color: var(--eb-ink); font-size: 0.9375rem; line-height: 1.4; cursor: pointer; font-family: var(--eb-font); }
.eb-l1 .l1-more-item:hover { background: var(--eb-wash); }
.eb-l1 .l1-more-item:focus-visible { outline: 3px solid var(--eb-focus); outline-offset: -3px; }
.eb-l1 .l1-more-item small { display: block; color: var(--eb-muted); font-size: 0.8125rem; line-height: 1.2rem; }
.eb-l1 .l1-more-sep { height: 1.5px; background: var(--eb-line); margin: 4px 6px; }
.eb-l1 .l1-more-danger { color: var(--eb-alert); font-weight: 700; }

/* Events toolbar */
.eb-l1 .l1-views { display: flex; flex-wrap: wrap; gap: 4px; margin: 0 0 16px; padding: 4px; list-style: none; background: var(--eb-surface); border-radius: 10px; box-shadow: inset 0 0 0 1.5px var(--eb-line); width: fit-content; max-width: 100%; }
.eb-l1 .l1-view-btn { all: unset; box-sizing: border-box; cursor: pointer; min-height: 40px; padding: 6px 12px; border-radius: 7px;
  color: var(--eb-muted); font-weight: 700; font-size: 0.9375rem; font-family: var(--eb-font); display: inline-flex; align-items: center; gap: 6px; }
.eb-l1 .l1-view-btn:hover { color: var(--eb-ink); background: var(--eb-wash); }
.eb-l1 .l1-view-btn[aria-pressed="true"] { background: var(--eb-ink); color: #FFFFFF; }
.eb-l1 .l1-view-btn:focus-visible { outline: 3px solid var(--eb-focus); outline-offset: 1px; }
.eb-l1 .l1-view-count { font-size: 0.875rem; font-weight: 700; }
.eb-l1 .l1-filters { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; margin: 0 0 16px; }
.eb-l1 .l1-field { display: grid; gap: 4px; }
.eb-l1 .l1-field label { font-weight: 700; font-size: 0.9375rem; color: var(--eb-ink); }
.eb-l1 .l1-field input, .eb-l1 .l1-field select { min-width: 220px; }
.eb-l1 #l1EvSearch { width: 320px; max-width: 100%; min-width: 0; }
@media (max-width: 600px) {
  .eb-l1 .l1-filters .l1-field { flex: 1 1 100%; }
  .eb-l1 .l1-field input, .eb-l1 .l1-field select, .eb-l1 #l1EvSearch { width: 100%; min-width: 0; }
}
.eb-l1 .l1-results { font-size: 0.875rem; color: var(--eb-muted); margin: 0 0 12px; }

/* Event summary (former global stats strip), now local to Events */
.eb-l1 .l1-summary { background: var(--eb-surface); border-radius: var(--eb-radius); box-shadow: inset 0 0 0 1.5px var(--eb-line); margin: 0 0 16px; }
.eb-l1 .l1-summary > summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; padding: 8px 16px; font-weight: 700; color: var(--eb-ink); }
.eb-l1 .l1-summary[open] > summary { border-bottom: 1.5px solid var(--eb-line); }
.eb-l1 .l1-summary .stats-row { background: none !important; border: none !important; margin: 0 !important; padding: 16px !important;
  display: grid !important; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; }
.eb-l1 .l1-summary .stat { background: var(--eb-wash); border: 0; border-radius: var(--eb-radius-sm); padding: 12px; display: flex; flex-direction: column-reverse; gap: 2px; }
.eb-l1 .l1-summary .stat-val { color: var(--eb-ink) !important; opacity: 1 !important; font-size: 1.375rem !important; font-weight: 700; font-family: var(--eb-font) !important; }
.eb-l1 .l1-summary .stat-lbl { color: var(--eb-muted); font-size: 0.875rem; text-transform: none; letter-spacing: 0; }
.eb-l1 .l1-summary .l1-help { padding: 0 16px 16px; margin: 0; }

/* Empty, loading, error, stale */
.eb-l1 .empty-state, .eb-l1 .l1-empty { background: var(--eb-surface); border: 1.5px dashed var(--eb-btn-line); border-radius: var(--eb-radius); padding: 32px 24px; text-align: center; grid-column: 1 / -1; }
.eb-l1 .empty-title, .eb-l1 .l1-empty-title { color: var(--eb-ink) !important; font-size: 1.125rem; font-weight: 700; margin: 0 0 4px; }
.eb-l1 .empty-sub, .eb-l1 .l1-empty-sub { color: var(--eb-muted) !important; font-size: 1rem; max-width: 52ch; margin: 0 auto; }
.eb-l1 .empty-icon { display: none; }
.eb-l1 .l1-empty-actions { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin-top: 16px; }
.eb-l1 .l1-alert { border-radius: var(--eb-radius-sm); padding: 12px 16px; font-size: 0.9375rem; border: 0; margin: 0 0 16px; }
.eb-l1 .l1-alert-error { color: var(--eb-alert); background: var(--eb-alert-wash); }
.eb-l1 .l1-alert-info { color: var(--eb-event); background: var(--eb-event-wash); }
.eb-l1 .l1-alert-warn { color: var(--eb-notice); background: var(--eb-notice-wash); margin-top: 12px; }
/* Daily lineup preview (Broadcast schedule) */
.eb-l1 .l1-lineup { margin: 0 0 16px; }
.eb-l1 .l1-lineup-days { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 12px; }
.eb-l1 .l1-lineup-days .btn-primary { background: var(--eb-ink) !important; border-color: var(--eb-ink) !important; }
.eb-l1 .l1-lineup-table { width: 100%; border-collapse: collapse; font-size: 0.9375rem; }
.eb-l1 .l1-lineup-table th, .eb-l1 .l1-lineup-table td { text-align: left; padding: 8px 10px; border-bottom: 1.5px solid var(--eb-line); vertical-align: top; }
.eb-l1 .l1-lineup-table th { color: var(--eb-muted); font-weight: 700; font-size: 0.875rem; }
@media (max-width: 640px) { .eb-l1 .l1-lineup-table th:nth-child(4), .eb-l1 .l1-lineup-table td:nth-child(4) { display: none; } }
.eb-l1 .l1-skel { display: block; background: linear-gradient(90deg, #E4E9F1 0%, #F2F5FA 50%, #E4E9F1 100%); background-size: 200% 100%;
  animation: l1-shimmer 1.4s ease-in-out infinite; border-radius: 6px; }
@keyframes l1-shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { .eb-l1 .l1-skel { animation: none; } }
.eb-l1 .l1-skel-card { border-radius: var(--eb-radius); background: var(--eb-surface); box-shadow: inset 0 0 0 1.5px var(--eb-line); padding: 12px; display: grid; gap: 10px; }
.eb-l1 .l1-skel-row { display: grid; grid-template-columns: 120px 140px 1fr; gap: 12px; padding: 12px 0; border-bottom: 1.5px solid var(--eb-line); }
.eb-l1 .l1-sr, .l1-dialog .l1-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ── 9. Legacy admin pieces repainted ── */
#view-admin.eb-l1 .tabs-row, #view-admin.eb-l1 .tab-hamburger { display: none !important; }
#view-admin.eb-l1 .event-grid:not(.l1-grid) { gap: 20px; }
#view-admin.eb-l1 .l1-netgrid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.eb-l1 .ev-card { background: var(--eb-surface); border: 0; box-shadow: var(--eb-card-shadow), inset 0 0 0 1.5px var(--eb-line); border-radius: var(--eb-radius); }
.eb-l1 .ev-card-thumb { aspect-ratio: var(--eb-letter); height: auto !important; background: var(--eb-wash); border-radius: var(--eb-radius) var(--eb-radius) 0 0; }
.eb-l1 .ev-card-thumb img, .eb-l1 #netGrid .ev-card-thumb img { object-fit: contain !important; object-position: center !important; }
.eb-l1 .ev-card-name { font-size: 1.0625rem; line-height: 1.45rem; color: var(--eb-ink); font-family: var(--eb-font); }
.eb-l1 .ev-card-org, .eb-l1 .ev-card-meta { font-size: 0.875rem; color: var(--eb-muted); }
.eb-l1 .status-pill { font-size: 0.8125rem; letter-spacing: 0; text-transform: none; border-radius: 999px; }
.eb-l1 .s-pending  { background: var(--eb-notice-wash); color: var(--eb-notice); border: 0; }
.eb-l1 .s-approved { background: var(--eb-civic-wash); color: var(--eb-civic); border: 0; }
.eb-l1 .s-rejected { background: var(--eb-alert-wash); color: var(--eb-alert); border: 0; }
.eb-l1 .s-expired  { background: var(--eb-wash); color: var(--eb-muted); border: 0; }
.eb-l1 .badge { background: var(--eb-event); color: #FFFFFF; }
.eb-l1 .psa-item, .eb-l1 .video-item, .eb-l1 .audit-row { border-color: var(--eb-line) !important; }
.eb-l1 .psa-item, .eb-l1 .video-item { background: var(--eb-surface) !important; border-radius: var(--eb-radius-sm) !important; }
.eb-l1 .sched-type-btn { background: var(--eb-surface); border: 1.5px solid var(--eb-btn-line); color: var(--eb-ink); min-height: 44px; font-size: 0.9375rem; border-radius: var(--eb-radius-sm); font-family: var(--eb-font); }
.eb-l1 .sched-type-btn.active { background: var(--eb-ink); border-color: var(--eb-ink); color: #FFFFFF; font-weight: 700; }
.eb-l1 .ebslot { background: var(--eb-surface); border-color: var(--eb-btn-line); color: var(--eb-ink); }
.eb-l1 .ebslot:hover:not([disabled]) { border-color: var(--eb-event); color: var(--eb-event); }
.eb-l1 .ebslot.sel { background: var(--eb-event); border-color: var(--eb-event); color: #FFFFFF; }
.eb-l1 .ebslot.taken, .eb-l1 .ebslot[disabled] { background: var(--eb-wash); color: #4F5D78; border-style: dashed; }
.eb-l1 .eb-autosched { background: var(--eb-wash); border-color: var(--eb-line); }
.eb-l1 .eb-airtime-chip { background: var(--eb-event-wash); border-color: transparent; color: var(--eb-event); }
.eb-l1 .eb-airtime-chip.eb-airtime-warn { background: var(--eb-alert-wash); border-color: transparent; color: var(--eb-alert); }

/* Audit table */
.eb-l1 .audit-row { padding: 12px 16px; }
.eb-l1 .audit-time, .eb-l1 .audit-info .audit-detail, .eb-l1 .audit-info .audit-actor { color: var(--eb-muted); opacity: 1; font-size: 0.875rem; }
.eb-l1 .audit-badge { font-size: 0.8125rem; border: 0; border-radius: 999px; min-width: 96px; text-align: center; justify-content: center; }
.eb-l1 .audit-time { min-width: 150px; }
.eb-l1 .audit-badge.ab-approved { background: var(--eb-civic-wash); color: var(--eb-civic); }
.eb-l1 .audit-badge.ab-rejected, .eb-l1 .audit-badge.ab-deleted { background: var(--eb-alert-wash); color: var(--eb-alert); }
.eb-l1 .audit-badge.ab-revoked { background: var(--eb-notice-wash); color: var(--eb-notice); }
.eb-l1 .audit-badge.ab-archived { background: var(--eb-wash); color: var(--eb-muted); }
.eb-l1 .audit-badge.ab-reset { background: var(--eb-event-wash); color: var(--eb-event); }

/* Inline dark-theme literal colours in the board markup, repainted to AA pairs.
   The trailing "i" makes the match case-insensitive (#A78BFA and #a78bfa). */
#view-admin.eb-l1 [style*="color:#93C5FD" i], #view-admin.eb-l1 [style*="color:#7dd3fc" i], #view-admin.eb-l1 [style*="color:#60A5FA" i],
#view-admin.eb-l1 [style*="color:#818cf8" i], #view-admin.eb-l1 [style*="color: #93C5FD" i] { color: var(--eb-event) !important; }
#view-admin.eb-l1 [style*="color:#34D399" i], #view-admin.eb-l1 [style*="color:#22A06B" i], #view-admin.eb-l1 [style*="color:#6EE7B7" i],
#view-admin.eb-l1 [style*="color:#10B981" i] { color: var(--eb-civic) !important; }
#view-admin.eb-l1 [style*="color:#F87171" i], #view-admin.eb-l1 [style*="color:#ffb1b1" i], #view-admin.eb-l1 [style*="color:#ff9a9a" i],
#view-admin.eb-l1 [style*="color:#FCA5A5" i], #view-admin.eb-l1 [style*="color:#EF4444" i] { color: var(--eb-alert) !important; }
#view-admin.eb-l1 [style*="color:#a78bfa" i], #view-admin.eb-l1 [style*="color:#C4B5FD" i] { color: var(--eb-event) !important; }
#view-admin.eb-l1 [style*="color:#FBBF24" i], #view-admin.eb-l1 [style*="color:#F59E0B" i], #view-admin.eb-l1 [style*="color:#F97316" i], #view-admin.eb-l1 [style*="color:#ffb86b" i] { color: var(--eb-notice) !important; }
#view-admin.eb-l1 [style*="color:rgba(255,255,255" i] { color: var(--eb-muted) !important; }
/* Filled indigo buttons (team management) become event blue with white text */
#view-admin.eb-l1 button[style*="background:#6366f1" i] { background: var(--eb-event) !important; color: #FFFFFF !important; border: 1.5px solid var(--eb-event) !important; min-height: 44px; font-size: 0.9375rem !important; border-radius: var(--eb-radius-sm) !important; }
/* Annual report narrative highlights: ink text keeps the emphasis readable */
#view-admin.eb-l1 #tab-yearreview strong[style*="color"] { color: var(--eb-ink) !important; }

/* Status badges drawn by the board's list renderers (notices, videos) */
#view-admin.eb-l1 [class*="psa-badge"], #view-admin.eb-l1 [class*="sched-badge"], #view-admin.eb-l1 .video-type-badge {
  background: var(--eb-event-wash) !important; color: var(--eb-event) !important; border: 0 !important; border-radius: 999px !important; font-size: 0.8125rem; font-weight: 700; letter-spacing: 0; text-transform: none; }
#view-admin.eb-l1 .psa-badge-active, #view-admin.eb-l1 .video-active-badge, #view-admin.eb-l1 .sched-badge.plays {
  background: var(--eb-civic-wash) !important; color: var(--eb-civic) !important; }
#view-admin.eb-l1 .psa-badge-expired, #view-admin.eb-l1 [class*="sched-badge"].complete, #view-admin.eb-l1 [class*="sched-badge"].played {
  background: var(--eb-wash) !important; color: var(--eb-muted) !important; }
#view-admin.eb-l1 .psa-badge-sched { background: var(--eb-notice-wash) !important; color: var(--eb-notice) !important; }
#view-admin.eb-l1 [class*="psa-badge"][class*="alert"] { background: var(--eb-alert-wash) !important; color: var(--eb-alert) !important; }
#view-admin.eb-l1 [style*="background:rgba(255,255,255,0.0"], #view-admin.eb-l1 [style*="background:rgba(15,25,40"] { background: var(--eb-wash) !important; }
#view-admin.eb-l1 [style*="border-color:rgba(255,255,255"], #view-admin.eb-l1 [style*="border:1px solid rgba(255,255,255"],
#view-admin.eb-l1 [style*="border-top:1px solid rgba(255,255,255"], #view-admin.eb-l1 [style*="border-bottom:1px solid rgba(255,255,255"] { border-color: var(--eb-line) !important; }
#view-admin.eb-l1 [style*="opacity:0.6"] { opacity: 1 !important; }

/* ── 10. Admin modals while signed in ── */
body.eb-l1-admin .modal-overlay { background: rgba(20,33,61,0.48); backdrop-filter: none; -webkit-backdrop-filter: none; }
body.eb-l1-admin .modal-overlay .modal, body.eb-l1-admin #reauthModal > div, body.eb-l1-admin #conflictModal > div {
  background: var(--eb-surface) !important; color: var(--eb-ink); border: 1.5px solid var(--eb-line) !important; border-radius: var(--eb-radius) !important; box-shadow: 0 24px 64px rgba(20,33,61,0.24) !important;
}
body.eb-l1-admin .modal-overlay .modal h2, body.eb-l1-admin .modal-overlay .modal h3 { color: var(--eb-ink) !important; font-family: var(--eb-font); letter-spacing: 0; }
/* Preview / edit / decline modals draw their box with .modal-content, which
   has no background of its own (it relied on the old dark overlay). */
body.eb-l1-admin .modal-overlay .modal-content {
  background: var(--eb-surface) !important; color: var(--eb-ink); border: 1.5px solid var(--eb-line); border-radius: var(--eb-radius);
  box-shadow: 0 24px 64px rgba(20,33,61,0.24); padding: 24px; max-height: calc(100vh - 48px); overflow-y: auto; font-family: var(--eb-font); }
body.eb-l1-admin .modal-overlay .modal-title { color: var(--eb-ink) !important; font-size: 1.25rem; line-height: 1.75rem; font-family: var(--eb-font); letter-spacing: 0; }
body.eb-l1-admin .modal-overlay .modal-close { background: var(--eb-surface) !important; color: var(--eb-ink) !important; border: 1.5px solid var(--eb-btn-line) !important; min-width: 44px; min-height: 44px; border-radius: var(--eb-radius-sm); }
body.eb-l1-admin .modal-overlay [style*="color:#fff" i]:not(.btn) { color: var(--eb-ink) !important; }
body.eb-l1-admin .modal-overlay [style*="color:#93C5FD" i], body.eb-l1-admin .modal-overlay [style*="color:#60A5FA" i] { color: var(--eb-event) !important; }
body.eb-l1-admin .modal-overlay [style*="color:#a78bfa" i] { color: var(--eb-event) !important; }
body.eb-l1-admin .modal-overlay [style*="color:#FCA5A5" i], body.eb-l1-admin .modal-overlay [style*="color:#F87171" i] { color: var(--eb-alert) !important; }
/* Time picker AM/PM segments: the active fill was gold with dark text; gold now resolves to event blue */
#view-admin.eb-l1 .eb-tp-period button, body.eb-l1-admin .modal-overlay .eb-tp-period button { color: var(--eb-ink); background: var(--eb-surface); border-color: var(--eb-btn-line); }
#view-admin.eb-l1 .eb-tp-period button.active, body.eb-l1-admin .modal-overlay .eb-tp-period button.active { background: var(--eb-ink) !important; color: #FFFFFF !important; }
/* Broadcast schedule item names were white for the old dark cards */
#view-admin.eb-l1 #scheduleCalendarWrap [style*="color:#fff" i] { color: var(--eb-ink) !important; }
body.eb-l1-admin #previewModal img { object-fit: contain !important; background: var(--eb-wash); }

/* ── 11. Reusable dialog (confirmations, editor drawers) ── */
.l1-dialog { border: 1.5px solid #DDE3EE; border-radius: 12px; padding: 0; max-width: min(560px, calc(100vw - 32px)); width: 100%;
  color: #14213D; background: #FFFFFF; font-family: 'Atkinson Hyperlegible', 'Segoe UI', system-ui, sans-serif; font-variant-numeric: tabular-nums; box-shadow: 0 24px 64px rgba(20,33,61,0.24); }
.l1-dialog::backdrop { background: rgba(20,33,61,0.48); }
.l1-dialog .l1-dialog-body { padding: 24px; }
.l1-dialog .l1-dialog-title { font-size: 1.25rem; line-height: 1.75rem; font-weight: 700; margin: 0 0 8px; color: #14213D; overflow-wrap: anywhere; }
.l1-dialog .l1-dialog-text { font-size: 1rem; line-height: 1.5rem; color: #4F5D78; margin: 0 0 8px; }
.l1-dialog .l1-dialog-list { margin: 8px 0 0 20px; padding: 0; color: #4F5D78; line-height: 1.5rem; }
.l1-dialog .l1-dialog-actions { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; padding: 16px 24px; border-top: 1.5px solid #DDE3EE; background: #EEF2F8; border-radius: 0 0 12px 12px; }
.l1-dialog.l1-drawer { margin: 0 0 0 auto; height: 100vh; max-height: none; max-width: min(720px, 100vw); border-radius: 0; border-right: none; border-top: none; border-bottom: none; display: none; flex-direction: column; }
.l1-dialog.l1-drawer[open] { display: flex; }
.l1-dialog.l1-drawer .l1-drawer-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 24px; border-bottom: 1.5px solid #DDE3EE; }
.l1-dialog.l1-drawer .l1-drawer-scroll { flex: 1; overflow-y: auto; padding: 24px; background: #EEF2F8; }
.l1-dialog.l1-drawer .psa-form-card { margin: 0; }
.l1-dialog .l1-x { all: unset; cursor: pointer; width: 44px; height: 44px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; color: #14213D; font-size: 1.5rem; }
.l1-dialog .l1-x:hover { background: #EEF2F8; }
.l1-dialog .l1-x:focus-visible { outline: 3px solid #2350E0; outline-offset: 2px; }
.l1-dialog a { color: #2350E0; font-weight: 700; }

/* ── 12. Settings groups, Lobby TV page, Annual report ── */
.eb-l1 .l1-settings-group { margin: 0 0 32px; }
.eb-l1 .l1-settings-group > h2 { font-size: 1.25rem; line-height: 1.75rem; margin: 0 0 4px; }
.eb-l1 .l1-settings-group > .l1-help { margin: 0 0 12px; }
.eb-l1 .l1-settings-group-cards { display: grid; gap: 12px; }
.eb-l1 .l1-settings-group-cards > .settings-card { margin: 0 !important; }
#view-admin.eb-l1 #tab-settings > .settings-wrap { display: block !important; max-width: 900px; }
.eb-l1 .settings-card .settings-card-title { min-height: 44px; margin-bottom: 0; }
.eb-l1 .settings-card .settings-card-title::after { color: var(--eb-muted); }
.eb-l1 .settings-card.card-open .settings-card-title { margin-bottom: 16px; padding-bottom: 12px; }
.eb-l1 .settings-card .card-body { transition: none; }
.eb-l1 .settings-card .form-group > .form-label:not([for]) { display: block; margin-bottom: 6px; }
.eb-l1 #hoursSummary { background: var(--eb-wash); border-radius: var(--eb-radius-sm); padding: 10px 14px; color: var(--eb-ink); }
.eb-l1 #hoursSummary:empty { display: none; }
.eb-l1 #hoursDays label { min-height: 40px; padding: 4px 12px 4px 8px; border-radius: 999px; box-shadow: inset 0 0 0 1.5px var(--eb-btn-line); background: var(--eb-surface); font-weight: 700; }
.eb-l1 #hoursDays label:has(input:checked) { background: var(--eb-civic-wash); box-shadow: inset 0 0 0 1.5px #9CCBB3; color: var(--eb-civic); }
.eb-l1 #hoursDays input { accent-color: var(--eb-civic); }
.eb-l1 #closureList > * { background: var(--eb-wash); border-radius: var(--eb-radius-sm); }
.eb-l1 .l1-lobby-grid { display: grid; gap: 16px; max-width: 900px; }
.eb-l1 .l1-lobby-grid .settings-card .card-body { max-height: none; opacity: 1; overflow: visible; }
.eb-l1 .l1-lobby-grid .settings-card .settings-card-title { cursor: default; }
.eb-l1 .l1-lobby-grid .settings-card .settings-card-title::after { display: none; }
.eb-l1 .l1-report-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.eb-l1 .l1-period { display: inline-flex; align-items: center; gap: 6px; font-size: 0.875rem; font-weight: 700; color: var(--eb-event); background: var(--eb-event-wash); border-radius: 999px; padding: 4px 12px; }
#view-admin.eb-l1 #yrStatsRow > * { background: var(--eb-surface) !important; border: 1.5px solid var(--eb-line) !important; border-radius: var(--eb-radius) !important; color: var(--eb-ink); }
#view-admin.eb-l1 #tab-yearreview canvas { background: var(--eb-surface); }

/* Two-column legacy layouts become list-first single column */
#view-admin.eb-l1 #tab-videos > .settings-wrap { display: block !important; }
#view-admin.eb-l1 .l1-list-first > .settings-wrap { max-width: 1100px; }

/* Broadcast schedule */
.eb-l1 #scheduleCalendarWrap { display: grid; gap: 12px; }
.eb-l1 .l1-model-note { background: var(--eb-event-wash); border-radius: var(--eb-radius-sm); padding: 12px 16px; margin: 0 0 16px; color: var(--eb-ink); max-width: 90ch; }

/* Inactive or scheduled notices: shown with a status badge and a muted
   background instead of opacity, so the text keeps full contrast. */
#view-admin.eb-l1 .psa-inactive, #view-admin.eb-l1 .video-inactive { opacity: 1 !important; background: var(--eb-wash) !important; border-left-color: var(--eb-btn-line) !important; }

/* Toasts while signed in */
body.eb-l1-admin .toast { background: #FFFFFF !important; color: #14213D !important; border: 1.5px solid #DDE3EE; border-left-width: 4px; border-radius: 10px; box-shadow: 0 12px 32px rgba(20,33,61,0.16) !important; font-family: 'Atkinson Hyperlegible', 'Segoe UI', system-ui, sans-serif; }
body.eb-l1-admin .toast * { color: inherit; }
/* The demo board pins a "Demo" tag to the top right corner, which would sit on
   Log out; while the dashboard is showing it moves to the bottom right. */
body.eb-l1-admin #ebDemoBadge { top: auto !important; bottom: 12px !important; }
/* The drawer header already names the form */
.l1-dialog.l1-drawer .psa-form-card > h3:first-child { display: none; }

/* Print: keep the admin readable if printed */
@media print { .eb-l1 .l1-tabs, .eb-l1 .l1-header-actions, .eb-l1 .l1-actions, .eb-l1 .l1-row-acts, .eb-l1 .l1-row-links { display: none !important; } }

/* Spotlight calendar: each month card holds its two actions side by side,
   sharing the card width, so nothing sticks out past the card edge. Edit is
   a plain outline button; Remove is a red outline, not a solid red block,
   since it is routine and still asks to confirm. */
.eb-l1 .spotlight-grid { grid-template-columns: repeat(auto-fill, minmax(176px, 1fr)); gap: 12px; }
.eb-l1 .spot-month-card { background: #FFFFFF; border: 0; box-shadow: var(--eb-card-shadow), inset 0 0 0 1.5px var(--eb-line); border-radius: var(--eb-radius); padding: 14px; min-width: 0; gap: 8px; }
.eb-l1 .spot-month-card.spot-filled { border-color: transparent; }
.eb-l1 .spot-month-card.spot-active { box-shadow: var(--eb-card-shadow), inset 0 0 0 2px var(--eb-event); }
.eb-l1 .spot-month-card.spot-active .spot-month-label { color: var(--eb-event); }
.eb-l1 .spot-month-label { color: var(--eb-muted); font-family: var(--eb-font); letter-spacing: 0; }
.eb-l1 .spot-biz-name { color: var(--eb-ink); font-family: var(--eb-font); }
.eb-l1 .spot-biz-empty { color: var(--eb-muted); }
.eb-l1 .spot-biz-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: auto; }
.eb-l1 .spot-biz-actions .btn { width: 100%; min-width: 0; min-height: 40px; padding: 6px 8px; font-size: .875rem; justify-content: center; text-align: center; white-space: nowrap; }
.eb-l1 .spot-biz-actions .btn-ghost { background: #FFFFFF !important; color: var(--eb-ink) !important; border: 1.5px solid var(--eb-btn-line) !important; }
.eb-l1 .spot-biz-actions .btn-ghost:hover { background: var(--eb-wash) !important; }
.eb-l1 .spot-biz-actions .btn-danger { background: #FFFFFF !important; color: var(--eb-alert) !important; border: 1.5px solid #E3A39C !important; }
.eb-l1 .spot-biz-actions .btn-danger:hover { background: var(--eb-alert-wash) !important; border-color: var(--eb-alert) !important; }