:root {
  --brand-primary: #2d6d99;
  --brand-primary-dark: #1d5278;
  --brand-navy: #102c42;
  --brand-sidebar-start: #173f5c;
  --brand-sidebar-end: #0b2639;
  --brand-accent: #5a9bc2;
  --brand-soft: #e3eff5;
  --brand-pale: #e8f3f8;
  --yellow: var(--brand-primary);
  --yellow-dark: var(--brand-primary-dark);
  --black: var(--brand-navy);
  --ink: var(--brand-navy);
  --muted: #5b7080;
  --line: #d6e1e8;
  --canvas: #edf3f6;
  --green: #2d7456;
  --shadow: 0 18px 50px rgba(16, 44, 66, .10);
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible { outline-color: rgba(45, 109, 153, .48); }

.primary-button,
.public-login,
.public-member-note > a {
  border-color: var(--brand-primary);
  color: #fff;
  background: var(--brand-primary);
  box-shadow: 0 8px 22px rgba(45, 109, 153, .20);
}

.primary-button:hover { background: var(--brand-primary-dark); }

.sidebar {
  background: linear-gradient(165deg, var(--brand-sidebar-start), var(--brand-sidebar-end) 72%);
}

.brand-logo,
.public-brand img,
.admin-head img,
.auth-card > img,
.access-card > img,
.public-form-card header img,
.print-application header img {
  border-radius: 50%;
}

.nav-item.active {
  color: #fff;
  background: var(--brand-primary);
  box-shadow: 0 9px 24px rgba(45, 109, 153, .25);
}

.sidebar-card .eyebrow { color: #9ec2da; }
.sidebar-card > span:last-child { color: #d7e9f3; }
.avatar { color: #fff; background: var(--brand-primary); }
.role-badge,
.role-pill { color: #164765; background: #e2eff6; }

.welcome-card {
  border-top-color: var(--brand-accent);
  background: linear-gradient(125deg, #174664, #0d2c42 66%, #245b7c);
}

.welcome-card:after { border-color: rgba(135, 191, 222, .15); }
.event-kicker,
.event-meta b,
.profile-card .eyebrow { color: #9dcce4; }
.choice.primary { border-color: #83bad9; color: #fff; background: var(--brand-primary); }
.choice.selected { background: rgba(158, 204, 228, .16); }

.section-heading .eyebrow,
.workspace-heading .eyebrow,
.tag,
.modal > .eyebrow,
.public-intro .eyebrow,
.public-category { color: #276488; }

.section-heading button,
.auth-link a { color: #1d587d; }
.stat-icon,
.news-date,
.calendar-tile,
.large-date,
.channel-symbol { color: #174664; background: #e3eff5; }
.news-card { border-left-color: var(--brand-primary); }
.filter-row button.active,
.public-filters button.active { border-color: var(--brand-primary); color: #fff; background: var(--brand-primary); }
.rsvp-buttons button.active { color: #174664; background: #e2eff6; }
.message-avatar { color: #fff; background: var(--brand-primary); }
.message.own p { background: #174664; }
.message-form button { color: #fff; background: var(--brand-primary); }
.read-only-note { color: #174664; background: #e8f3f8; }
.messages-layout.single-channel { grid-template-columns: minmax(0, 1fr); }
.sr-only {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.message-body { min-width: 0; }
.message p { overflow-wrap: anywhere; }
.message-menu {
  width: 25px;
  height: 25px;
  margin-left: auto;
  padding: 0;
  border: 0;
  border-radius: 50%;
  color: #69717d;
  background: transparent;
  font-size: 19px;
  line-height: 1;
  cursor: pointer;
}
.message.own .message-menu { color: #b7c8d3; }
.message-menu:hover,
.message-menu:focus-visible { color: #fff; background: var(--brand-primary); }

.profile-card {
  border-top-color: var(--brand-accent);
  background: linear-gradient(130deg, #174664, #0b2639);
}

.profile-avatar { color: #fff; background: var(--brand-primary); }
.toast { border-left-color: #69a9ce; background: #102c42; }

.auth-body,
.access-page { background: radial-gradient(circle at 50% 10%, #2b668d, #0d2c42 60%); }
.auth-card,
.access-card { border-top-color: var(--brand-accent); }
.auth-card > .eyebrow,
.access-card > .eyebrow,
.signed-in-row b { color: #1d587d; }

.public-events-body { background: #edf3f6; }
.public-header { border-bottom-color: var(--brand-accent); background: #123a57; }
.public-brand small { color: #c9dbe6; }
.public-footer { border-top-color: #d6e1e8; color: #527080; background: #f8fbfc; }
.public-member-note { border-color: #bed9e8; background: #e8f3f8; }

.admin-tabs { background: #123a57; }
.admin-tabs a:hover { color: #fff; background: var(--brand-primary); }
.export-grid > a { color: #174664; background: #e2eff6; }

@media (max-width: 1100px) {
  .main-panel { padding-bottom: calc(112px + env(safe-area-inset-bottom)); }

  .bottom-nav {
    height: calc(86px + env(safe-area-inset-bottom));
    padding: 7px 8px env(safe-area-inset-bottom);
    border-top: 2px solid #bfd2de;
    background: rgba(255, 255, 255, .99);
    box-shadow: 0 -8px 28px rgba(16, 44, 66, .16);
  }

  .bottom-nav button {
    min-width: 0;
    margin: 0 3px;
    padding: 7px 2px 6px;
    border-radius: 13px;
    color: #425f72;
    font-weight: 800;
  }

  .bottom-nav button > span {
    width: 34px;
    height: 31px;
    display: grid;
    place-items: center;
    color: #244d67;
    font-size: 25px;
    font-weight: 900;
    line-height: 1;
  }

  .bottom-nav button small {
    display: block;
    color: inherit;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.1;
  }

  .bottom-nav button.active {
    color: #fff;
    background: var(--brand-primary);
    box-shadow: 0 6px 16px rgba(45, 109, 153, .28);
  }

  .bottom-nav button.active > span { color: #fff; }
  .bottom-nav button.active:before { display: none; }
}

@media (max-width: 430px) {
  .bottom-nav { padding-left: 4px; padding-right: 4px; }
  .bottom-nav button { margin-left: 1px; margin-right: 1px; }
  .bottom-nav button small { font-size: 11px; }
}
