/* styles.css — WUWM broadcast calendar CHROME.
   Brand palette sampled from the WUWM logos: black #231F20, gold #FFC20E, white.
   The gold is a SPARING accent (active view, focus, today, now-line) — never a fill.

   HARD RULE: this file styles chrome only. It NEVER sets .fc-event background or
   border COLOR — event colors come from the ViewConfig colorMap and are applied
   inline by engine.js. (Only event radius / spacing / weight are touched here.) */

:root {
  --wuwm-black: #231F20;
  --wuwm-gold: #FFC20E;
  --wuwm-gold-rgb: 255,194,14;     /* accent as RGB so rgba(...) tints theme with the accent too */
  --wuwm-gold-soft: #FFF4D2;
  --paper: #FAF8F4;
  --surface: #FFFFFF;
  --ink: #231F20;
  --ink-2: #6B6258;
  --ink-3: #9C9486;
  --hairline: #ECE6DA;
  --hairline-strong: #D9D2C4;
  --shadow: 0 1px 2px rgba(35,31,32,.04), 0 10px 30px rgba(35,31,32,.06);
  --display: "Fraunces", Georgia, "Times New Roman", serif;
  --ui: "Archivo", -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: var(--ui);
  color: var(--ink);
  background:
    radial-gradient(1100px 360px at 100% -8%, rgba(var(--wuwm-gold-rgb),.07), transparent 62%),
    var(--paper);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
/* full-bleed, viewport-height app shell (no page scroll; the calendar scrolls internally) */
#app { max-width: none; margin: 0; padding: 16px 22px 14px; min-height: 100vh; height: 100vh; display: flex; flex-direction: column; }

/* ---------- header ---------- */
header.bc-head {
  display: flex; align-items: center; flex-wrap: wrap; gap: 18px;
  padding-bottom: 14px; margin-bottom: 14px;
  border-bottom: 1px solid var(--hairline);
  flex: 0 0 auto;
}
.bc-logo { height: 40px; width: auto; display: block; }
.bc-divider { width: 1px; height: 34px; background: var(--hairline-strong); }
.bc-titles { display: flex; flex-direction: column; gap: 3px; }
.bc-titles h1 {
  margin: 0; font-family: var(--display); font-optical-sizing: auto;
  font-weight: 600; font-size: 1.5rem; line-height: 1; letter-spacing: -.012em; color: var(--ink);
}
.bc-titles .bc-sub {
  font-size: .68rem; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; color: var(--ink-3);
}

/* ---------- legend ---------- */
.bc-legend { display: flex; flex-wrap: wrap; gap: 9px 16px; margin-left: 8px; align-items: center; }
.bc-legend-item { display: inline-flex; align-items: center; gap: 7px; font-size: .72rem; font-weight: 500; color: var(--ink-2); }
.bc-legend-dot { width: 11px; height: 11px; border-radius: 3px; display: inline-block; box-shadow: inset 0 0 0 1px rgba(0,0,0,.07); }
.bc-legend-dot-rule { background: var(--wuwm-black); box-shadow: inset 0 0 0 1px rgba(0,0,0,.2); }

/* ---------- calendar surface ---------- */
#calendar {
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-top: 3px solid var(--wuwm-gold);
  border-radius: 12px;
  box-shadow: var(--shadow);
  padding: 6px 12px 14px;
  flex: 1 1 auto; min-height: 0;   /* fill remaining viewport height; FC scrolls internally */
}

.fc {
  font-family: var(--ui);
  --fc-border-color: var(--hairline);
  --fc-page-bg-color: transparent;
  --fc-today-bg-color: var(--wuwm-gold-soft);
  --fc-now-indicator-color: var(--wuwm-gold);
  --fc-list-event-hover-bg-color: #FBF6EC;
  --fc-button-text-color: var(--ink-2);
  --fc-button-bg-color: transparent;
  --fc-button-border-color: transparent;
  --fc-button-hover-bg-color: #F2ECE0;
  --fc-button-hover-border-color: transparent;
  --fc-button-active-bg-color: #ffffff;
  --fc-button-active-border-color: var(--hairline-strong);
}
.fc a { color: inherit; text-decoration: none; }

/* toolbar */
.fc .fc-toolbar.fc-header-toolbar { margin: 14px 6px 20px; align-items: center; }
.fc .fc-toolbar-title { font-family: var(--display); font-weight: 600; font-size: 1.18rem; letter-spacing: -.01em; color: var(--ink); }

/* buttons -> ghost / refined (kills the blocky solid look) */
.fc .fc-button {
  border-radius: 8px; font-family: var(--ui); font-weight: 500; font-size: .82rem;
  text-transform: none; padding: .44em .82em; box-shadow: none !important;
  transition: background .15s, color .15s, border-color .15s, box-shadow .15s;
}
.fc .fc-button-primary:hover { color: var(--ink); }
.fc .fc-button-primary:not(:disabled):focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(var(--wuwm-gold-rgb),.5) !important; }
.fc .fc-button-primary:disabled { color: var(--ink-3); opacity: 1; }
.fc .fc-button-primary:not(:disabled).fc-button-active {
  color: var(--ink); box-shadow: inset 0 -2px 0 var(--wuwm-gold) !important;
}
.fc .fc-today-button:not(:disabled) { border-color: var(--hairline-strong); color: var(--ink); }
.fc .fc-icon { font-size: 1.35em; }

/* month/week column headers */
.fc .fc-col-header-cell-cushion { font-size: .66rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; color: var(--ink-3); padding: 12px 4px; }
.fc-theme-standard .fc-scrollgrid { border-color: var(--hairline); }
.fc .fc-daygrid-day-number { font-size: .8rem; color: var(--ink-2); padding: 7px 9px; }
.fc .fc-day-today .fc-daygrid-day-number { color: var(--ink); font-weight: 700; }

/* events: spacing / weight ONLY — never color */
.fc .fc-event { border-radius: 5px; font-size: .8rem; padding: 1px 3px; }
.fc .fc-event-title { font-weight: 500; }
.fc-event.bc-bold, .fc-event.bc-bold .fc-event-title { font-weight: 700; }
.fc-event.bc-strike .fc-event-title { text-decoration: line-through; }

/* list view */
.fc .fc-list { border: none; }
.fc .fc-list-day-cushion { background: transparent; padding: 18px 6px 6px; }
.fc-theme-standard .fc-list-day-cushion { border-top: 1px solid var(--hairline); }
.fc .fc-list-day-text, .fc .fc-list-day-side-text {
  font-family: var(--display); font-weight: 600; font-size: 1.02rem; color: var(--ink); text-transform: none;
}
.fc .fc-list-table td { padding: 10px 14px; border-color: var(--hairline); }
.fc .fc-list-event-time { color: var(--ink-3); font-size: .78rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.fc .fc-list-event-title { color: var(--ink); }
.fc .fc-list-event-graphic { padding-right: 2px; }

/* list-view group sub-header rows (Day -> Group -> rows) */
.bc-list-group-row td {
  background: transparent; border: none; padding: 13px 14px 3px;
  font-size: .64rem; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; color: var(--ink-3);
}
.bc-group-dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 10px; vertical-align: middle; box-shadow: inset 0 0 0 1px rgba(0,0,0,.09); }
/* second-level sub-group header (Day -> Group -> Sub-group -> rows) */
.bc-list-subgroup-row td {
  background: transparent; border: none; padding: 4px 14px 2px 30px;
  font-size: .62rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-3);
}
.bc-list-subgroup-row td::before { content: "└ "; color: var(--hairline-strong); font-weight: 400; }

@media (max-width: 640px) {
  #app { height: auto; padding: 14px 14px 24px; }   /* mobile: natural page scroll */
  .bc-legend { margin-left: 0; width: 100%; }
  .fc .fc-toolbar.fc-header-toolbar { flex-direction: column; gap: 10px; }
}

/* ===================== Tier 2: settings drawer ===================== */
/* keep the legend + gear clustered on the right; gear last */
.bc-legend { order: 1; }
/* right-aligned masthead cluster: [filter status] [Sign out] [gear] */
.bc-head-right { order: 5; margin-left: auto; display: flex; align-items: center; gap: 12px; }

.bc-signout {
  font-size: .74rem; font-weight: 600; color: var(--ink-2); text-decoration: none;
  padding: 6px 10px; border-radius: 8px; border: 1px solid var(--hairline);
  white-space: nowrap; transition: background .15s, color .15s, border-color .15s;
}
.bc-signout:hover { background: #F2ECE0; color: var(--ink); border-color: var(--hairline-strong); }

.bc-gear {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; border-radius: 9px;
  background: transparent; border: 1px solid var(--hairline); color: var(--ink-2);
  cursor: pointer; transition: background .15s, color .15s, border-color .15s, box-shadow .15s;
}
.bc-gear:hover { background: #F2ECE0; color: var(--ink); }
.bc-gear:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(var(--wuwm-gold-rgb),.5); }
.bc-gear[aria-expanded="true"] { border-color: var(--hairline-strong); color: var(--ink); box-shadow: inset 0 -2px 0 var(--wuwm-gold); }

.bc-drawer {
  position: fixed; top: 0; right: 0; height: 100vh; width: 820px; max-width: 96vw;
  background: var(--surface); border-left: 1px solid var(--hairline);
  box-shadow: -16px 0 40px rgba(35,31,32,.10);
  transform: translateX(100%); transition: transform .26s cubic-bezier(.22,.61,.36,1);
  z-index: 60; display: flex; flex-direction: column; font-family: var(--ui);
}
.bc-drawer.open { transform: translateX(0); }
.bc-drawer-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 20px 22px 16px; border-bottom: 1px solid var(--hairline); flex: 0 0 auto;
}
.bc-drawer-head h2 { margin: 0; flex: 1; font-family: var(--display); font-weight: 600; font-size: 1.18rem; color: var(--ink); }
.bc-saved {
  font-size: .72rem; font-weight: 600; color: #2E7D46; white-space: nowrap; margin-right: 8px;
  opacity: 0; transform: translateY(-2px); transition: opacity .2s ease, transform .2s ease;
}
.bc-saved.show { opacity: 1; transform: none; }
.bc-autosave-note { margin-top: 4px; color: var(--ink-3); font-style: italic; }
.bc-drawer-close {
  background: transparent; border: none; font-size: 1.5rem; line-height: 1; color: var(--ink-3);
  cursor: pointer; width: 32px; height: 32px; border-radius: 8px;
}
.bc-drawer-close:hover { background: #F2ECE0; color: var(--ink); }
.bc-drawer-body { overflow-y: auto; padding: 6px 22px 22px; flex: 1 1 auto; }

/* tabbed settings */
.bc-tabbar { display: flex; flex-wrap: wrap; gap: 4px; padding: 6px 0 10px; margin-bottom: 4px; border-bottom: 1px solid var(--hairline); position: sticky; top: 0; background: var(--surface); z-index: 1; }
.bc-tab { font-family: var(--ui); font-size: 1.08rem; font-weight: 600; color: var(--ink-3); background: transparent; border: 1px solid transparent; border-radius: 8px; padding: 9px 16px; cursor: pointer; }
.bc-tab:hover { background: #F2ECE0; color: var(--ink-2); }
.bc-tab.active { color: var(--ink); background: var(--wuwm-gold-soft); box-shadow: inset 0 -2px 0 var(--wuwm-gold); }
.bc-tabcontent { padding-top: 6px; max-width: 720px; }
/* much larger, accessible text inside the panel (~2x). .bc-drawer-body prefix beats the
   base drawer rules regardless of source order. */
.bc-drawer-body .bc-section > h3 { font-size: 1.06rem; }
.bc-drawer-body .bc-subhead { font-size: 1.45rem; margin: 22px 0 10px; }
.bc-drawer-body .bc-row { padding: 12px 0; }
.bc-drawer-body .bc-row-label { font-size: 1.4rem; }
.bc-drawer-body .bc-hint { font-size: 1.18rem; line-height: 1.55; }
.bc-drawer-body .bc-select, .bc-drawer-body .bc-seg-btn { font-size: 1.28rem; padding: 9px 13px; }
.bc-drawer-body .bc-check { width: 24px; height: 24px; }
.bc-drawer-body .bc-color { width: 54px; height: 34px; }
.bc-drawer-body .bc-add-btn, .bc-drawer-body .bc-text, .bc-drawer-body .bc-num { font-size: 1.18rem; padding: 9px 13px; }
.bc-drawer-head h2 { font-size: 1.85rem; }
.bc-drawer-body .bc-rule-summary { font-size: 1.18rem; }
.bc-drawer-body .bc-rule-kw { font-size: .9rem; flex-basis: 46px; }
.bc-drawer-body .bc-rule-line .bc-select, .bc-drawer-body .bc-filter-row .bc-select { font-size: 1.12rem; }
.bc-drawer-body .bc-cfg-name { font-size: 1.2rem; }
/* saved-configuration list */
.bc-cfg-list { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; }
.bc-cfg-row { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--hairline); border-radius: 9px; background: #FCFBF8; }
.bc-cfg-name { font-size: .92rem; color: var(--ink); font-weight: 500; }
.bc-drawer-foot {
  flex: 0 0 auto; display: flex; gap: 10px; padding: 13px 22px calc(13px + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid var(--hairline); background: var(--surface);
}
.bc-reset-btn, .bc-done-btn {
  flex: 1; font-family: var(--ui); font-size: .82rem; font-weight: 600;
  border-radius: 9px; padding: 10px 14px; cursor: pointer;
  transition: background .15s, color .15s, border-color .15s;
}
.bc-reset-btn { color: var(--ink-2); background: #fff; border: 1px solid var(--hairline-strong); }
.bc-reset-btn:hover { background: #FBE9E6; color: #8A3B30; border-color: #F2C9C2; }
.bc-done-btn { color: #fff; background: var(--ink); border: 1px solid var(--ink); }
.bc-done-btn:hover { background: #000; }
.bc-reset-btn:focus-visible, .bc-done-btn:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(var(--wuwm-gold-rgb),.45); }

.bc-section { padding: 18px 0; border-bottom: 1px solid var(--hairline); }
.bc-section:last-child { border-bottom: none; }
.bc-section > h3 {
  margin: 0 0 12px; font-size: .68rem; font-weight: 700; letter-spacing: .15em;
  text-transform: uppercase; color: var(--ink-3);
}
.bc-subhead { margin: 16px 0 8px; font-size: .82rem; font-weight: 600; color: var(--ink); }
.bc-subhead:first-of-type { margin-top: 2px; }
.bc-hint { font-size: .74rem; color: var(--ink-3); margin: 0 0 10px; }

.bc-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 0; }
.bc-row-label { font-size: .85rem; color: var(--ink); }
.bc-color { width: 38px; height: 26px; padding: 0; border: 1px solid var(--hairline-strong); border-radius: 6px; background: none; cursor: pointer; }
.bc-check { width: 17px; height: 17px; accent-color: var(--wuwm-gold); cursor: pointer; }
.bc-select {
  font-family: var(--ui); font-size: .82rem; color: var(--ink); padding: 6px 10px;
  border: 1px solid var(--hairline-strong); border-radius: 8px; background: #fff; cursor: pointer;
}
.bc-select:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(var(--wuwm-gold-rgb),.45); }

.bc-seg { display: inline-flex; border: 1px solid var(--hairline-strong); border-radius: 9px; overflow: hidden; }
.bc-seg-btn {
  font-family: var(--ui); font-size: .78rem; text-transform: capitalize; padding: 6px 14px;
  background: #fff; border: none; color: var(--ink-2); cursor: pointer; transition: background .15s, color .15s;
}
.bc-seg-btn + .bc-seg-btn { border-left: 1px solid var(--hairline); }
.bc-seg-btn.active { background: var(--ink); color: #fff; }

/* density (compact tightens chrome spacing only; engine output unchanged) */
.bc-density-compact .fc .fc-list-table td { padding: 6px 14px; }
.bc-density-compact .fc-event { font-size: .76rem; padding: 0 3px; }
.bc-density-compact .fc .fc-list-day-cushion { padding: 12px 6px 4px; }
.bc-density-compact .bc-list-group-row td { padding: 9px 14px 2px; }
.bc-density-compact .fc .fc-daygrid-day-number { padding: 4px 6px; }

/* event detail popover */
.bc-popover {
  position: absolute; z-index: 70; min-width: 220px; max-width: 320px;
  background: #fff; border: 1px solid var(--hairline-strong); border-radius: 10px;
  box-shadow: var(--shadow); padding: 12px 14px; font-family: var(--ui);
}
.bc-popover-title { font-weight: 600; font-size: .9rem; color: var(--ink); padding-left: 9px;
  border-left: 3px solid var(--wuwm-gold); margin-bottom: 8px; }
.bc-popover-row { display: flex; justify-content: space-between; gap: 14px; padding: 3px 0; }
.bc-popover-key { color: var(--ink-3); text-transform: uppercase; letter-spacing: .04em; font-size: .66rem; font-weight: 700; padding-top: 2px; }
.bc-popover-val { color: var(--ink); text-align: right; font-size: .8rem; }
.bc-popover-empty { font-size: .78rem; color: var(--ink-3); }
/* edit mode (write tier) */
.bc-popover-input { font-family: var(--ui); font-size: .8rem; padding: 3px 7px; border: 1px solid var(--hairline-strong); border-radius: 6px; min-width: 130px; text-align: right; }
select.bc-popover-input { text-align: left; background: #fff; cursor: pointer; }
input[type="date"].bc-popover-input { text-align: left; }
.bc-popover-check { width: 18px; height: 18px; accent-color: var(--wuwm-gold); cursor: pointer; }

/* ---------- toolbar dropdown menus (View / Filters) ---------- */
.bc-tb-menu {
  position: absolute; z-index: 80; min-width: 300px; max-width: 580px;
  max-height: 80vh; overflow-y: auto;
  background: #fff; border: 1px solid var(--hairline-strong); border-radius: 10px;
  box-shadow: var(--shadow); padding: 12px; font-family: var(--ui);
}
.bc-tb-menu.bc-tb-wide { width: min(1080px, 96vw); max-width: 96vw; padding: 22px 24px; }
.bc-tb-h { font-size: .9rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); padding: 16px 6px 7px; }
.bc-tb-empty { font-size: 1.08rem; color: var(--ink-3); padding: 4px 6px 10px; }
.bc-tb-item { display: block; width: 100%; text-align: left; font-family: var(--ui); font-size: 1.05rem; color: var(--ink); background: transparent; border: none; border-radius: 7px; padding: 11px 12px; cursor: pointer; }
.bc-tb-item:hover { background: #F2ECE0; }
.bc-tb-item.active { font-weight: 700; box-shadow: inset 2px 0 0 var(--wuwm-gold); }
.bc-tb-clear { color: #8A3B30; }
.bc-tb-frow { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; padding: 10px 4px; }
.bc-tb-select { flex: 1 1 150px; min-width: 140px; font-family: var(--ui); font-size: 1.12rem; padding: 13px 15px; border: 1px solid var(--hairline-strong); border-radius: 8px; background: #fff; }
.bc-tb-valsel { flex: 2 1 300px; }   /* the filter VALUE field — give it ~2x the room */
.bc-tb-x { flex: 0 0 auto; width: 40px; height: 40px; border: 1px solid var(--hairline); border-radius: 8px; background: #fff; color: var(--ink-3); cursor: pointer; font-size: 1.45rem; line-height: 1; }
.bc-tb-x:hover { background: #FBE9E6; color: #8A3B30; }
.bc-tb-savedname { flex: 1 1 auto; text-align: left; font-size: 1.12rem; color: var(--ink); border: none; border-radius: 6px; padding: 9px 8px; }
.bc-tb-saverow { margin-top: 7px; }
.bc-tb-input { flex: 1 1 auto; min-width: 0; font-family: var(--ui); font-size: 1.12rem; padding: 13px 16px; border: 1px solid var(--hairline-strong); border-radius: 8px; }
.bc-tb-savebtn { flex: 0 0 auto; font-family: var(--ui); font-size: 1.05rem; font-weight: 600; color: #fff; background: var(--ink); border: 1px solid var(--ink); border-radius: 8px; padding: 12px 22px; cursor: pointer; }
.bc-tb-savebtn:hover { background: #000; }
.bc-tb-savebtn:disabled { opacity: .45; cursor: default; }
/* View / Filters dropdown buttons + active-filter highlight */
.fc .fc-bcViews-button, .fc .fc-bcFilters-button { font-weight: 600; }
.fc .fc-bcFilters-button.bc-tb-on { color: var(--ink); box-shadow: inset 0 -2px 0 var(--wuwm-gold) !important; }
/* one-click Clear filters, sits between Filters and Print. Hidden by default (so a freshly
   re-rendered toolbar button stays hidden); updateToolbarLabels reveals it when filters are on. */
.fc .fc-bcClearFilters-button { display: none; font-size: .78rem; color: #8A3B30; font-weight: 600; margin-left: 8px; }
.fc .fc-bcClearFilters-button:hover { color: #6E2A22; }
/* Print / PNG: lighter + separated, distinct from the dropdowns */
.fc .fc-bcPrint-button, .fc .fc-bcPng-button { font-size: .74rem; color: var(--ink-3); font-weight: 500; }
.fc .fc-bcPrint-button { margin-left: 12px; }
.fc .fc-bcPrint-button:hover, .fc .fc-bcPng-button:hover { color: var(--ink); }
.fc .fc-bcRefresh-button { font-size: .8rem; color: var(--ink-3); font-weight: 500; margin-left: 8px; }
.fc .fc-bcRefresh-button:hover { color: var(--ink); }
.fc .fc-bcRefresh-button.bc-refreshing { opacity: .5; }
/* search + go-to-date: quiet, like Refresh; Search highlights when a query is active */
.fc .fc-bcSearch-button, .fc .fc-bcDate-button { font-size: .8rem; color: var(--ink-3); font-weight: 500; }
.fc .fc-bcSearch-button:hover, .fc .fc-bcDate-button:hover { color: var(--ink); }
.fc .fc-bcSearch-button.bc-tb-on { color: var(--ink); box-shadow: inset 0 -2px 0 var(--wuwm-gold) !important; }
/* clickable legend (D3): click a swatch to filter to that value */
.bc-legend-click { cursor: pointer; border-radius: 999px; padding: 2px 9px; }
.bc-legend-click:hover { background: rgba(var(--wuwm-gold-rgb), .16); }
.bc-legend-active { background: rgba(var(--wuwm-gold-rgb), .24); font-weight: 700; box-shadow: inset 0 0 0 1px var(--hairline-strong); }
/* loading + data-error affordances (C6) */
#bc-loading { display: none; align-items: center; justify-content: center; gap: 10px; padding: 16px; color: var(--ink-2); font-size: .92rem; }
.bc-spinner { width: 18px; height: 18px; border: 2px solid var(--hairline-strong); border-top-color: var(--wuwm-gold); border-radius: 50%; display: inline-block; animation: bc-spin .7s linear infinite; }
@keyframes bc-spin { to { transform: rotate(360deg); } }
#bc-data-error { display: none; align-items: center; gap: 12px; margin: 0 2px 10px; padding: 10px 14px; font-size: .86rem; color: #8A3B30; background: #FBE9E6; border: 1px solid #F2C9C2; border-radius: 8px; }
.bc-data-retry { font-family: var(--ui); font-size: .82rem; font-weight: 600; color: #fff; background: #8A3B30; border: none; border-radius: 6px; padding: 6px 13px; cursor: pointer; }
.bc-data-retry:hover { background: #6E2A22; }
/* branding tab: logo upload preview */
.bc-drawer-body .bc-logo-upload { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin: 6px 0 4px; }
.bc-logo-preview { height: 44px; max-width: 200px; width: auto; border: 1px solid var(--hairline); border-radius: 7px; background: #fff; padding: 5px 8px; object-fit: contain; }
.bc-accent-swatches { display: flex; gap: 8px; flex-wrap: wrap; margin: 6px 0; }
.bc-accent-swatch { width: 30px; height: 30px; border-radius: 8px; border: 2px solid transparent; cursor: pointer; box-shadow: inset 0 0 0 1px rgba(0,0,0,.08); }
.bc-accent-swatch.active { border-color: var(--ink); }
/* Smartsheet-like filter builder */
.bc-tb-conj { flex: 0 0 auto; font-size: .92rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-3); min-width: 54px; }
.bc-tb-applybtn { flex: 0 0 auto; font-family: var(--ui); font-size: 1.02rem; font-weight: 600; color: var(--ink); background: #fff; border: 1px solid var(--hairline-strong); border-radius: 8px; padding: 11px 20px; cursor: pointer; }
.bc-tb-applybtn:hover { background: #F2ECE0; }
.bc-popover-input:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(var(--wuwm-gold-rgb),.45); }
.bc-popover-readonly { color: var(--ink-3); }
.bc-popover-msg { font-size: .72rem; color: var(--ink-3); margin-top: 8px; min-height: 1em; }
.bc-pop-reauth { color: #8A6D26; font-weight: 700; text-decoration: underline; cursor: pointer; }
.bc-pop-reauth:hover { color: var(--ink); }
.bc-popover-foot { display: flex; justify-content: flex-end; gap: 8px; margin-top: 10px; }
.bc-pop-btn { font-family: var(--ui); font-size: .76rem; font-weight: 600; padding: 5px 12px; border-radius: 7px; border: 1px solid var(--hairline-strong); background: #fff; color: var(--ink-2); cursor: pointer; }
.bc-pop-btn:hover { background: #F2ECE0; color: var(--ink); }
.bc-pop-save { background: var(--ink); color: #fff; border-color: var(--ink); }
.bc-pop-save:hover { background: #000; }
.bc-pop-save:disabled { opacity: .6; cursor: default; }

/* filter status affordance ("X of N shown") — a quiet neutral pill in the masthead */
#bc-filter-status {
  font-size: .82rem; color: var(--ink-2); padding: 5px 12px; white-space: nowrap;
  background: #fff; border: 1px solid var(--hairline-strong); border-radius: 999px;
}
/* a zero-match filter stays a soft red warning (not yellow) so "showing nothing" is obvious */
#bc-filter-status.bc-filter-status-empty { background: #FBE9E6; border-color: #F2C9C2; color: #8A3B30; font-weight: 600; }

/* filters surface */
.bc-filter-list { display: flex; flex-direction: column; gap: 10px; margin-bottom: 10px; }
.bc-filter-row { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.bc-filter-conj { flex: 0 0 auto; font-size: .82rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-3); min-width: 46px; }
.bc-filter-row .bc-select { flex: 1 1 30%; min-width: 0; font-size: .76rem; padding: 5px 7px; }
.bc-add-btn {
  font-family: var(--ui); font-size: .78rem; color: var(--ink); background: #fff;
  border: 1px solid var(--hairline-strong); border-radius: 8px; padding: 6px 12px; cursor: pointer;
}
.bc-add-btn:hover { background: #F2ECE0; }
.bc-del-btn {
  flex: 0 0 auto; width: 26px; height: 26px; border-radius: 7px; border: 1px solid var(--hairline);
  background: #fff; color: var(--ink-3); font-size: 1.05rem; line-height: 1; cursor: pointer;
}
.bc-del-btn:hover { background: #FBE9E6; color: #8A3B30; border-color: #F2C9C2; }

/* conditional rules editor */
.bc-rule-list { display: flex; flex-direction: column; gap: 10px; margin-bottom: 10px; }
.bc-rule-card { border: 1px solid var(--hairline); border-radius: 10px; padding: 10px 11px; background: #FCFBF8; }
.bc-rule-card.bc-rule-off { opacity: .5; }
.bc-rule-head { display: flex; align-items: flex-start; gap: 8px; }
.bc-rule-summary { flex: 1; min-width: 0; font-size: .76rem; font-weight: 600; color: var(--ink); line-height: 1.3; overflow-wrap: anywhere; padding-top: 1px; }
.bc-order-btn { width: 24px; height: 24px; border: 1px solid var(--hairline); border-radius: 6px; background: #fff; color: var(--ink-2); cursor: pointer; font-size: .82rem; line-height: 1; }
.bc-order-btn:disabled { opacity: .35; cursor: default; }
.bc-order-btn:not(:disabled):hover { background: #F2ECE0; color: var(--ink); }
.bc-rule-line { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; margin-top: 7px; }
.bc-rule-kw { font-size: .66rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-3); flex: 0 0 34px; }
.bc-rule-line .bc-select { flex: 1 1 28%; min-width: 0; font-size: .74rem; padding: 4px 6px; }
.bc-then-params { display: inline-flex; align-items: center; gap: 4px; }
.bc-num { width: 52px; font-family: var(--ui); font-size: .76rem; padding: 4px 6px; border: 1px solid var(--hairline-strong); border-radius: 7px; }
.bc-unit { font-size: .76rem; color: var(--ink-3); }
.bc-rule-nomatch { margin-top: 8px; font-size: .7rem; color: #8A6D26; background: var(--wuwm-gold-soft); border: 1px solid #F0DFA8; border-radius: 6px; padding: 4px 8px; }
/* live preview chip for a rule's effect */
.bc-rule-preview { display: inline-flex; align-items: center; gap: 5px; margin-left: auto; padding: 3px 8px; border-radius: 5px; font-size: .72rem; font-weight: 500; white-space: nowrap; }
.bc-rule-preview-badge { font-size: .56rem; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; line-height: 1; padding: 2px 4px; border-radius: 3px; background: rgba(255,255,255,.92); color: #231F20; }
.bc-text { font-family: var(--ui); font-size: .76rem; padding: 4px 7px; border: 1px solid var(--hairline-strong); border-radius: 7px; width: 88px; }

/* rule-effect badges rendered on events (A1) */
.bc-badges { display: inline-flex; gap: 4px; margin-left: 6px; vertical-align: middle; }
.bc-badge {
  font-size: .58rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; line-height: 1;
  padding: 2px 5px; border-radius: 4px; background: rgba(255,255,255,.92); color: #231F20;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.14);
}
.fc-list-event .bc-badge { background: var(--wuwm-black); color: #fff; box-shadow: none; }

/* empty states — read as intentional, not broken */
.fc .fc-list-empty { background: var(--paper); }
.fc .fc-list-empty-cushion {
  font-family: var(--ui); font-weight: 500; font-size: .92rem; color: var(--ink-3);
  letter-spacing: .005em;
}
.fc .fc-list-empty-cushion::before {
  content: ""; display: block; width: 26px; height: 2px; margin: 0 auto 14px;
  background: var(--wuwm-gold); border-radius: 2px;
}

/* ---------- empty-state overlay for grid views (A6) ---------- */
#bc-empty-overlay { position: absolute; inset: 0; display: none; align-items: center; justify-content: center; pointer-events: none; z-index: 5; }
#bc-empty-overlay .bc-empty-inner { text-align: center; background: rgba(250,248,244,.78); padding: 22px 30px; border-radius: 12px; }
#bc-empty-overlay .bc-empty-rule { display: block; width: 26px; height: 2px; margin: 0 auto 14px; background: var(--wuwm-gold); border-radius: 2px; }
#bc-empty-overlay .bc-empty-msg { font-family: var(--ui); font-weight: 500; font-size: .92rem; color: var(--ink-3); }

/* ---------- print / export (A3) ---------- */
#bc-print-footer { display: none; }
@media print {
  .bc-gear, #bc-drawer { display: none !important; }
  .fc .fc-toolbar .fc-button { display: none !important; }      /* hide nav/view/export buttons; keep the title */
  header.bc-head .bc-legend { display: none !important; }        /* legend prints in the footer instead */
  body { background: #fff !important; }
  #app { max-width: none; margin: 0; padding: 12px 0 0; }
  * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }  /* print event colors */
  #calendar { box-shadow: none; }
  #bc-print-footer {
    display: block; position: fixed; bottom: 0; left: 0; right: 0;
    border-top: 1px solid #999; padding: 8px 10px; background: #fff;
    font-family: var(--ui); font-size: 9pt;
  }
  .bc-print-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-bottom: 4px; }
  .bc-print-legend-item { display: inline-flex; align-items: center; gap: 6px; color: #222; }
  .bc-print-dot { width: 10px; height: 10px; border-radius: 2px; display: inline-block; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15); }
  .bc-print-meta { color: #555; font-size: 8pt; }
  @page { margin: 12mm; }
}

/* ---------- Config Page (front door) ---------- */
#config-page { flex: 1 1 auto; overflow-y: auto; padding-top: 8px; }
.bc-cfgpage-loading { color: var(--ink-3); padding: 24px; }
.bc-cfg-toolbar { display: flex; align-items: center; gap: 12px; margin: 8px 0 18px; }
.bc-cfg-h2 { font-family: var(--display); font-size: 1.5rem; font-weight: 600; color: var(--ink); }
.bc-primary-btn { font-family: var(--ui); font-size: .95rem; font-weight: 600; color: #fff; background: var(--ink); border: 1px solid var(--ink); border-radius: 9px; padding: 10px 18px; cursor: pointer; }
.bc-primary-btn:hover { background: #000; }
.bc-link-btn { background: none; border: none; color: var(--ink-2); text-decoration: underline; cursor: pointer; font-family: var(--ui); font-size: .92rem; padding: 6px 2px; }
.bc-link-btn:hover { color: var(--ink); }
.bc-cfg-empty { background: var(--surface); border: 1px solid var(--hairline); border-radius: 14px; padding: 40px; text-align: center; box-shadow: var(--shadow); }
.bc-cfg-emptyrow { display: flex; gap: 12px; justify-content: center; margin-top: 16px; }
.bc-cfg-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 18px; }
.bc-cfg-card { position: relative; background: var(--surface); border: 1px solid var(--hairline); border-radius: 14px; padding: 20px; box-shadow: var(--shadow); }
.bc-cfg-card-title { font-family: var(--display); font-size: 1.25rem; font-weight: 600; color: var(--ink); margin: 6px 0 4px; }
.bc-cfg-card-meta { font-size: .85rem; color: var(--ink-3); margin-bottom: 16px; }
.bc-cfg-card-actions { display: flex; align-items: center; gap: 8px; }
.bc-cfg-role { position: absolute; top: 16px; right: 16px; font-size: .66rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; padding: 3px 8px; border-radius: 999px; }
.bc-cfg-role-owner { background: rgba(var(--wuwm-gold-rgb), .25); color: #6b5300; }
.bc-cfg-role-editor { background: #E5F0FF; color: #1F5Fb0; }
.bc-cfg-role-viewer { background: #EEEAE0; color: var(--ink-2); }
/* modal */
.bc-cfg-overlay { position: fixed; inset: 0; background: rgba(35,31,32,.4); display: flex; align-items: flex-start; justify-content: center; z-index: 200; padding: 5vh 16px; overflow-y: auto; }
.bc-cfg-modal { background: var(--surface); border-radius: 16px; width: min(1100px, 96vw); box-shadow: 0 20px 60px rgba(0,0,0,.25); display: flex; flex-direction: column; max-height: 94vh; }
.bc-cfg-modal-head { display: flex; align-items: center; gap: 12px; padding: 22px 28px; border-bottom: 1px solid var(--hairline); }
.bc-cfg-modal-head h2 { margin: 0; flex: 1; font-family: var(--display); font-size: 1.5rem; font-weight: 600; }
.bc-cfg-modal-body { padding: 22px 28px; overflow-y: auto; }
.bc-cfg-modal-body .bc-row-label { font-size: 1.05rem; }
.bc-cfg-modal-body .bc-select, .bc-cfg-modal-body .bc-text { font-size: 1rem; padding: 9px 11px; }
.bc-cfg-modal-foot { display: flex; align-items: center; gap: 10px; padding: 18px 28px; border-top: 1px solid var(--hairline); }
.bc-cfg-modal-foot .bc-hint { flex: 1; margin: 0; }
.bc-cfg-row { display: flex; align-items: center; gap: 8px; margin: 8px 0; flex-wrap: wrap; }
.bc-cfg-selected { font-size: 1rem; font-weight: 600; color: #2E7D32; min-height: 1.2em; margin: 8px 0; }
.bc-cfg-tree { border: 1px solid var(--hairline); border-radius: 10px; max-height: 440px; overflow-y: auto; margin: 8px 0; }
.bc-cfg-node { display: flex; align-items: center; gap: 10px; padding: 13px 16px; border-bottom: 1px solid var(--hairline); font-size: 1.02rem; }
.bc-cfg-node:last-child { border-bottom: none; }
.bc-cfg-node-open { cursor: pointer; }
.bc-cfg-node-open:hover { background: #F7F3EA; }
.bc-cfg-node-label { flex: 0 1 auto; }
.bc-cfg-crumb { display: none; align-items: center; gap: 12px; margin: 10px 0 2px; }
.bc-cfg-path { font-size: .92rem; color: var(--ink-2); }
.bc-colorfield { display: inline-flex; align-items: center; gap: 8px; }
.bc-hex { width: 100px; font-family: var(--ui); font-size: .95rem; padding: 8px 9px; border: 1px solid var(--hairline-strong); border-radius: 7px; text-transform: lowercase; }
/* tabbed config editor */
.bc-cfg-tabbar { display: flex; flex-wrap: wrap; gap: 2px; border-bottom: 1px solid var(--hairline); margin-bottom: 18px; }
.bc-cfg-tab { font-family: var(--ui); font-size: 1rem; font-weight: 600; color: var(--ink-3); background: none; border: none; border-bottom: 2px solid transparent; margin-bottom: -1px; padding: 9px 16px; cursor: pointer; }
.bc-cfg-tab:hover { color: var(--ink-2); }
.bc-cfg-tab.active { color: var(--ink); border-bottom-color: var(--wuwm-gold); }
.bc-cfg-tabcontent { min-height: 300px; }
.bc-chip-row { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 4px; }
.bc-chip { font-family: var(--ui); font-size: .86rem; background: #F2ECE0; border: 1px solid var(--hairline); border-radius: 999px; padding: 5px 12px; cursor: pointer; color: var(--ink); }
.bc-chip:hover { background: var(--wuwm-gold-soft); }

/* ---------- grouped grid (matrix: groups x days) ---------- */
.fc.bc-grouped-mode .fc-view-harness { display: none; }
#bc-grouped { display: none; }
.fc.bc-grouped-mode #bc-grouped { display: block; flex: 1 1 auto; min-height: 0; }
.bc-grid-scroll { overflow: auto; height: 100%; }
.bc-grid { border-collapse: separate; border-spacing: 0; width: 100%; table-layout: fixed; }
.bc-grid th, .bc-grid td { border-right: 1px solid var(--hairline); border-bottom: 1px solid var(--hairline); vertical-align: top; }
.bc-grid thead th { position: sticky; top: 0; z-index: 3; background: var(--surface); font-family: var(--ui); font-size: .8rem; font-weight: 600; color: var(--ink-2); padding: 10px 8px; text-align: center; }
.bc-grid-corner { position: sticky; left: 0; z-index: 4; text-align: left !important; width: 180px; min-width: 180px; }
.bc-grid-dayhead.bc-grid-today { color: var(--ink); box-shadow: inset 0 -3px 0 var(--wuwm-gold); }
.bc-grid-grouphead { position: sticky; left: 0; z-index: 2; background: var(--surface); font-family: var(--ui); font-size: .95rem; font-weight: 600; color: var(--ink); padding: 12px; width: 180px; min-width: 180px; white-space: nowrap; }
.bc-grid-dot { display: inline-block; width: 11px; height: 11px; border-radius: 3px; margin-right: 8px; vertical-align: middle; box-shadow: inset 0 0 0 1px rgba(0,0,0,.07); }
.bc-grid-cell { padding: 6px; height: 64px; }
.bc-grid-cell.bc-grid-today { background: rgba(var(--wuwm-gold-rgb), .06); }
.bc-grid-chip { font-family: var(--ui); font-size: .82rem; line-height: 1.25; border-radius: 6px; padding: 4px 8px; margin-bottom: 4px; cursor: grab; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bc-grid-chip:hover { filter: brightness(.93); }
.bc-grid-chip:active { cursor: grabbing; }
.bc-grid-chip.bc-grid-dragging { opacity: .4; }
/* the floating clone that follows the cursor during a pointer drag */
.bc-grid-ghost { position: fixed; pointer-events: none; z-index: 10000; opacity: .92; box-shadow: 0 10px 24px rgba(0,0,0,.35); }
body.bc-grid-dragging-active { cursor: grabbing !important; user-select: none; -webkit-user-select: none; }
/* drop-target highlight while dragging a chip onto a day cell */
.bc-grid-cell.bc-drop-target { outline: 2px dashed var(--wuwm-gold, #FFC20E); outline-offset: -3px; background: rgba(var(--wuwm-gold-rgb, 255,194,14), .12); }
/* transient toast (drag-drop feedback / write errors) */
.bc-flash { position: fixed; left: 50%; bottom: 26px; transform: translate(-50%, 16px); z-index: 9999;
  background: #231F20; color: #fff; font-family: var(--ui); font-size: .9rem; font-weight: 600;
  padding: 10px 16px; border-radius: 10px; box-shadow: 0 8px 28px rgba(0,0,0,.28);
  opacity: 0; pointer-events: none; transition: opacity .18s ease, transform .18s ease; max-width: 80vw; }
.bc-flash.show { opacity: 1; transform: translate(-50%, 0); }
.bc-flash.bc-flash-error { background: #8A3B30; }
.bc-grid-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; height: 100%; min-height: 200px; color: var(--ink-3); font-size: .95rem; }
/* saving modal: blocks input while a write is in flight (progress bar), then resolves into a
   summary the viewer must close */
.bc-saving-overlay { position: fixed; inset: 0; z-index: 10001; display: none; align-items: center; justify-content: center;
  background: rgba(26, 22, 22, .16); backdrop-filter: blur(1.5px); -webkit-backdrop-filter: blur(1.5px); cursor: progress; }
.bc-saving-overlay.show { display: flex; }
.bc-saving-overlay.bc-saving-done { cursor: default; }
.bc-saving-card { background: #fff; border-radius: 14px; padding: 20px 24px; min-width: 300px; max-width: min(440px, 86vw);
  box-shadow: 0 18px 48px rgba(0,0,0,.28); font-family: var(--ui); text-align: left; }
.bc-saving-label { font-weight: 700; font-size: 1rem; color: #231F20; margin-bottom: 12px; }
.bc-saving-label.bc-save-ok { color: #2E7D46; }
.bc-saving-label.bc-save-err { color: #8A3B30; }
.bc-progress { height: 8px; border-radius: 999px; background: #ECE6DA; overflow: hidden; position: relative; }
.bc-progress-bar { position: absolute; top: 0; bottom: 0; width: 38%; border-radius: 999px;
  background: var(--wuwm-gold, #FFC20E); animation: bc-indeterminate 1.05s ease-in-out infinite; }
@keyframes bc-indeterminate { 0% { left: -40%; } 100% { left: 100%; } }
@media (prefers-reduced-motion: reduce) { .bc-progress-bar { animation-duration: 2s; } }
.bc-saving-detail { font-size: .92rem; color: var(--ink-2, #3a3a3a); line-height: 1.45; }
.bc-move-name { font-weight: 700; color: #231F20; font-size: 1rem; margin-bottom: 10px; word-break: break-word; }
.bc-move-row { display: flex; align-items: baseline; gap: 10px; padding: 3px 0; }
.bc-move-k { flex: 0 0 68px; font-size: .78rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-3, #7a7268); }
.bc-move-v { font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: .95rem; color: #231F20; }
/* "＋ New" story modal + popover Delete */
.bc-modal-overlay { position: fixed; inset: 0; z-index: 10002; display: flex; align-items: center; justify-content: center; background: rgba(26,22,22,.28); padding: 16px; }
.bc-modal-card { background: #fff; border-radius: 14px; padding: 20px 22px; width: min(460px, 94vw); max-height: 88vh; overflow: auto; box-shadow: 0 18px 48px rgba(0,0,0,.3); font-family: var(--ui); }
.bc-modal-title { font-family: var(--display, var(--ui)); font-weight: 700; font-size: 1.15rem; color: #231F20; margin-bottom: 14px; }
.bc-modal-row { display: flex; flex-direction: column; gap: 4px; margin-bottom: 12px; }
.bc-modal-key { font-size: .78rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-3, #7a7268); }
.bc-modal-row input, .bc-modal-row select, .bc-modal-row textarea { font-family: var(--ui); font-size: .95rem; padding: 8px 10px; border: 1px solid var(--hairline-strong, #E5DDCD); border-radius: 8px; width: 100%; }
.bc-modal-msg { font-size: .85rem; color: #8A3B30; min-height: 1.1em; margin: 4px 0; }
.bc-modal-foot { display: flex; justify-content: flex-end; gap: 8px; margin-top: 8px; }
.bc-pop-del { color: #CF222E; }
.bc-pop-del:hover { background: #FBE9E6; }
.bc-saving-actions { margin-top: 16px; display: flex; justify-content: flex-end; }
.bc-saving-close { font-family: var(--ui); font-weight: 700; font-size: .88rem; color: #fff; background: #231F20;
  border: 0; border-radius: 9px; padding: 8px 18px; cursor: pointer; }
.bc-saving-close:hover { background: #000; }
.bc-saving-close:focus-visible { outline: 3px solid rgba(var(--wuwm-gold-rgb, 255,194,14), .6); outline-offset: 2px; }
/* roomier time-grid rows so 15-minute slots are easy to read and drop onto (Week/Day views) */
.fc .fc-timegrid-slot { height: 1.8em; }
/* settings drawer: admin/viewer role badge + locked config-level controls */
.bc-role { font-family: var(--ui); font-size: .68rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; padding: 2px 8px; border-radius: 999px; margin-left: 8px; }
.bc-role-admin { background: #E7F4EA; color: #2E7D46; }
.bc-role-editor { background: #E6EEF9; color: #1F5FA8; }
.bc-role-viewer { background: #F0ECE2; color: #7a7268; }
.bc-access-tag { font-size: .72rem; font-weight: 600; color: var(--ink-3, #7a7268); background: #F2ECE0; border-radius: 999px; padding: 1px 8px; margin-left: 8px; white-space: nowrap; }
/* app-native group cards in the Access tab */
.bc-group-card { border: 1px solid var(--hairline-strong, #E5DDCD); border-radius: 10px; padding: 10px 12px; margin: 8px 0; background: #FCFAF5; }
.bc-group-head { display: flex; align-items: center; gap: 8px; }
.bc-group-name { font-weight: 700; color: #231F20; }
.bc-group-members { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; }
.bc-member-chip { display: inline-flex; align-items: center; gap: 4px; font-size: .82rem; background: #EEF1F5; color: #2b2b2b; border-radius: 999px; padding: 2px 6px 2px 10px; }
.bc-member-x { border: 0; background: transparent; color: #7a7268; cursor: pointer; font-size: 1rem; line-height: 1; padding: 0 2px; }
.bc-member-x:hover { color: #CF222E; }
.bc-lock-note { font-size: .82rem; color: #7a5a1e; background: #FBF3DF; border: 1px solid #F0E2B8; border-radius: 8px; padding: 8px 10px; margin: 8px 0 12px; line-height: 1.4; }
.bc-drawer .bc-tabcontent [disabled], .bc-drawer .bc-cfg-block [disabled] { opacity: .5; cursor: not-allowed; }
.bc-cfg-block.bc-locked { opacity: .95; }
/* build stamp in the masthead (confirms which bundle the browser loaded) */
.bc-build { display: inline-block; margin-top: 3px; font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: .72rem; font-weight: 700; letter-spacing: .04em; color: #fff; background: #C8102E; padding: 1px 8px; border-radius: 999px; }
/* "← Calendars" back-link in the calendar masthead (config mode) */
.bc-configs-link { order: 0; font-size: .82rem; font-weight: 600; color: var(--ink-2); text-decoration: none; padding: 6px 10px; border: 1px solid var(--hairline-strong); border-radius: 999px; margin-right: 4px; }
.bc-configs-link:hover { background: #F2ECE0; color: var(--ink); }

/* ============================ accessibility + responsive ============================ */
/* visible keyboard focus everywhere (low specificity so components can still override) */
:where(button, a, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid rgba(var(--wuwm-gold-rgb, 255,194,14), .75); outline-offset: 2px; border-radius: 4px;
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .bc-progress-bar { animation: none; left: 0; width: 100%; opacity: .6; }
}

/* tablet */
@media (max-width: 820px) {
  .bc-head { flex-wrap: wrap; row-gap: 6px; }
  .bc-legend { flex-wrap: wrap; }
}
/* phone */
@media (max-width: 640px) {
  .bc-drawer { width: 100vw; max-width: 100vw; }
  .bc-head { padding: 8px 12px; gap: 8px; }
  .bc-titles h1 { font-size: 1.1rem; }
  .bc-sub { font-size: .78rem; }
  .fc .fc-toolbar.fc-header-toolbar { flex-wrap: wrap; gap: 6px 8px; }
  .fc .fc-toolbar-title { font-size: 1.05rem; }
  .fc .fc-toolbar-chunk { display: flex; flex-wrap: wrap; gap: 4px; }
  .bc-popover { max-width: 92vw; }
  .bc-tabbar { flex-wrap: wrap; }
  .bc-grid-scroll { -webkit-overflow-scrolling: touch; }
  .bc-modal-card { padding: 16px; }
}
/* larger tap targets on touch devices */
@media (pointer: coarse) {
  .fc .fc-button, .bc-add-btn, .bc-del-btn, .bc-seg-btn, .bc-saving-close, .bc-tab { min-height: 40px; }
  .bc-member-x { min-width: 28px; min-height: 28px; }
}