/* Blue is the foundation throughout the year. Only the small accent changes. */
:root {
  --ink:#18344f;
  --muted:#526a80;
  --cream:#f1f6fc;
  --paper:#fff;
  --sage:#e5effa;
  --line:#cdddec;
  --green:#215b91;
  --blue:#215b91;
  --blue-deep:#153e68;
  --blue-soft:#e5effa;
  --blue-mid:#83abc9;
  --accent:#397ca4;
  --accent-soft:#e6f2f7;
  --orange:var(--accent);
  --season-mist:#e6effa;
  --focus:#1264a3;
  --panel-shadow:0 14px 38px rgba(28,67,103,.07);
}
:root[data-appearance="spring"] {--accent:#26766a;--accent-soft:#e3f4ef;--season-mist:#e1f0f2}
:root[data-appearance="summer"] {--accent:#97621b;--accent-soft:#fff2d9;--season-mist:#e4f3fc}
:root[data-appearance="autumn"] {--accent:#9c502e;--accent-soft:#fcece2;--season-mist:#eceaf6}
:root[data-appearance="winter"] {--accent:#6167a3;--accent-soft:#eeedf9;--season-mist:#e4edfc}
html {background:var(--cream)}
body {background:radial-gradient(ellipse at 95% 0,var(--season-mist),transparent 48%),var(--cream);color:var(--ink)}
::selection {background:#c6e2fa;color:#18344f}
a,button,input,select,textarea {outline-color:var(--focus)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible {outline:3px solid var(--focus);outline-offset:4px}
button:disabled {cursor:default}
.site-header {padding-top:27px;padding-bottom:27px}
.brand {letter-spacing:-.7px}
.brand-icon {background:linear-gradient(140deg,#377eaf,var(--blue-deep));box-shadow:0 5px 14px #204e7920}
.brand-icon span,.brand-icon i {color:#c8e8ff}
.brand-icon i {background:#c8e8ff}
.brand-caption {color:var(--muted)}
.private-pill {border-color:var(--line);background:#ffffffa6;color:var(--blue)}
.private-pill>span,.eyebrow,.lock-icon {color:var(--blue)}
h1 em {color:var(--blue)}
.eyebrow>span,.coast-dot {background:var(--accent)}
.family-nav {gap:6px;padding-bottom:14px;align-items:center;border-color:var(--line)}
.family-nav>a {padding:10px 14px;min-height:44px;display:inline-flex;align-items:center;border:1px solid transparent;border-radius:24px;color:var(--blue);line-height:1.4;transition:background .16s,color .16s,box-shadow .16s}
.family-nav>a[aria-current="page"] {background:var(--blue);color:white;border-color:var(--blue);box-shadow:0 3px 8px #215b9117}
.primary {background:var(--blue);border-color:var(--blue);color:#fff;box-shadow:0 3px 9px #215b9114;transition:background .16s,transform .16s,box-shadow .16s}
.primary:hover {background:var(--blue-deep);border-color:var(--blue-deep)}
.secondary-button {border-color:#9db7d0;color:var(--blue);background:#f7fbff;transition:background .16s,border-color .16s,transform .16s}
.secondary-button:hover {border-color:var(--blue);background:var(--blue-soft)}
.text-button,.admin-link,.back-link,.conversation-link,.board-settings-invite,.calendar-detail-link,.calendar-bottom-bar>a {color:var(--blue)}
.admin-link {border-color:#9db7d0;text-underline-offset:4px}
.login-card,.board-card,.feed-card,.calendar-provider-card,.private-family-notes,.calendar-agenda-event,.private-family-person {border-color:var(--line);box-shadow:var(--panel-shadow)}
.login-card {border-radius:23px}
.small-mark {color:var(--blue-mid)}
.form-intro,.access-note,.under-card,.privacy-note p,.coast-note {color:var(--muted)}
.login-form label,.board-form label,.private-family-form label {color:var(--ink)}
.login-form input,.board-form input,.board-form textarea,.board-form select,.calendar-view-form input,.calendar-view-form select,.private-family-form select {background:#fbfdff;border-color:#b6cce0;color:var(--ink)}
.login-form input:focus {border-color:var(--blue)}
.privacy-note a {color:var(--blue);border-color:var(--line)}
.card-divider {background:var(--line)}
.notice,.site-messages p {background:var(--blue-soft);border-color:var(--line);color:var(--ink)}
.photo-banner {background:linear-gradient(118deg,#194c7c,#286a9e);color:#fff;box-shadow:0 12px 27px #215b911c;transition:transform .18s,box-shadow .18s}
.photo-banner .eyebrow {color:#d2e9fc}
.photo-banner span span:last-child {color:#e3effa}
.banner-arrow {color:#d6edff}
.plex-banner {box-shadow:var(--panel-shadow);transition:transform .18s,box-shadow .18s}
.board-card {border-radius:20px;transition:transform .18s,box-shadow .18s,border-color .18s}
.board-symbol {color:var(--blue)}
.everyone-card {background:linear-gradient(145deg,var(--blue-soft),#f5faff)}
.everyone-card .board-symbol {color:var(--accent)}
.audience-tag,.board-chip {background:var(--blue-soft);color:var(--blue);border-color:var(--line)}
.everyone-card .audience-tag {background:#fff;color:var(--blue)}
.board-card-bottom,.conversation-link {border-color:var(--line);color:var(--blue)}
.board-toolbar,.post-byline,.post-byline span {color:var(--muted)}
.audience-notice {border-color:var(--accent);background:var(--accent-soft);color:var(--ink)}
.audience-notice p,.field-note,.empty-note,.member-row,.private-family-updated {color:var(--muted)}
.empty-board,.calendar-empty,.calendar-desktop-empty,.private-family-empty {background:#f5faff;border-color:#a8c2db;color:var(--muted)}
.empty-board>span {color:var(--accent)}
.calendar-empty h2,.calendar-empty h3,.calendar-agenda-event h2,.calendar-agenda-event h3,.private-family-empty h3,.private-family-person h3 {color:var(--blue)}
.calendar-empty p,.calendar-home-date,.calendar-home-time,.calendar-home-location,.calendar-agenda-date,.calendar-agenda-times,.calendar-event-place,.calendar-detail-date,.calendar-event-facts dt,.calendar-event-facts dd,.calendar-event-body,.calendar-bottom-bar,.calendar-desktop-empty,.private-family-body,.private-family-empty p,.private-family-person p,.calendar-source-note,.calendar-source-label {color:var(--muted)}
.calendar-day-events a {background:var(--blue-soft);border-color:var(--blue-mid);color:var(--blue)}
.calendar-day-events a:hover {background:#d6e8fa}
.calendar-day-events span {color:var(--muted)}
.calendar-day-number {color:var(--blue)}
.calendar-today .calendar-day-number {background:var(--blue);color:white}
.calendar-home-event {border-color:var(--line)}
.calendar-home-event strong,.calendar-home-actions a,.calendar-view-note a {color:var(--blue)}
.calendar-event-facts>div,.calendar-provider-card,.calendar-device-instructions,.calendar-disconnect,.calendar-remove-summary {border-color:var(--line)}
.calendar-provider-icon {background:var(--blue-soft);color:var(--blue);border-color:var(--line)}
.calendar-provider-apple {background:#eef2f8;color:var(--blue-deep)}
.calendar-provider-card>p,.calendar-device-instructions ol,.calendar-device-instructions>p,.calendar-disconnect>p {color:var(--muted)}
.calendar-connection-ready {background:var(--blue-soft);border-color:var(--line);color:var(--muted)}
.calendar-event-form input,.calendar-event-form select,.calendar-event-form textarea {border-color:#b6cce0;color:var(--ink);background:#fbfdff}
.calendar-remove-summary {background:var(--blue-soft)}
.private-family-body {color:var(--ink)}
.private-family-person .audience-tag {color:var(--blue)}
.private-family-empty {background:var(--blue-soft)}
.private-family-form select {color:var(--ink)}
.recent-update {border-radius:12px;transition:background .16s,transform .16s}
.recent-update:hover {background:var(--blue-soft)}
/* Existing private photographs stay behind their authenticated image endpoint. */
.family-background::after {background:rgba(238,246,255,.67)}
.family-background-grid img {filter:saturate(.62)}
.has-family-background .site-header,.has-family-background .family-nav,.has-family-background footer {background:rgba(241,246,252,.95)}
.has-family-background main {background:rgba(255,255,255,.96);border-color:rgba(193,215,235,.9);box-shadow:var(--panel-shadow)}
footer {border-color:var(--line);color:var(--muted);align-items:center;gap:28px;flex-wrap:wrap}
footer a {color:var(--blue)}
.footer-tools {display:flex;gap:24px;align-items:center;flex-wrap:wrap}
.appearance-control {display:flex;align-items:center;gap:9px;position:relative}
.appearance-control[hidden] {display:none}
.appearance-control label {font-size:11px;color:var(--muted)}
.appearance-control select {font:12px/1.4 Arial,Helvetica,sans-serif;min-height:44px;max-width:185px;border:1px solid var(--line);border-radius:9px;background:var(--paper);color:var(--blue);padding:8px 27px 8px 10px}
.appearance-status {position:absolute;left:0;top:100%;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
/* Keep the illustrated login art consistent with the blue foundation. */
.art-grid {background-image:radial-gradient(#b9cfe2 1px,transparent 1px)}
.orbit {border-color:#aec8de}
.paper {border-color:var(--line);box-shadow:0 8px 22px #215b9117}
.paper>span,.art-label,.little-note {color:var(--muted)}
.art-star {color:var(--accent)}
.landscape {background:#d6e8f6}
.mountain {background:#376b94}
.mountain-back {background:#92b5d0}
.path {background:#bed5e6}
.sea {background:#e0f0fa}
.wave {background:#70a6ca}
.wave.second {background:#beddec}
@media(hover:hover) and (pointer:fine) {
 .family-nav>a:not([aria-current="page"]):hover {background:var(--blue-soft);text-decoration:none}
 .board-card:hover,.photo-banner:hover,.plex-banner:hover {transform:translateY(-4px);box-shadow:0 16px 32px #1c43671a;border-color:#8bafce}
 .primary:active,.secondary-button:active {transform:translateY(1px)}
 .brand-icon {transition:transform .18s}
 .brand:hover .brand-icon {transform:rotate(-4deg)}
}
@media(max-width:767px) {
 .site-header {padding-top:calc(18px + env(safe-area-inset-top,0px));padding-bottom:17px}
 .family-nav {gap:8px;padding-top:6px;scroll-snap-type:x proximity}
 .family-nav>a {border-color:var(--line);background:#fff;scroll-snap-align:center;min-height:46px;padding:11px 15px}
 .family-nav>a[aria-current="page"] {background:var(--blue);border-color:var(--blue)}
 .primary,.secondary-button {min-height:48px}
 .appearance-control select {font-size:16px;min-height:48px;max-width:210px}
 .footer-tools {width:100%;justify-content:space-between;gap:12px}
 .appearance-control {flex-wrap:wrap;gap:5px}
 .appearance-control label {font-size:12px}
 footer {gap:17px;align-items:flex-start}
 footer>a,.footer-tools>a {min-height:44px;display:inline-flex;align-items:center}
 .login-card {border-radius:19px}
 .private-family-body {font-size:14px}
}
@media(max-width:430px) {
 .footer-tools {align-items:flex-start;flex-direction:column;gap:8px}
 .appearance-control {width:100%;justify-content:space-between}
 .appearance-control select {max-width:230px;flex:1}
}
@media(prefers-reduced-motion:reduce) {
 *,*::before,*::after {animation:none!important;transition:none!important;scroll-behavior:auto!important}
 .board-card:hover,.photo-banner:hover,.plex-banner:hover,.brand:hover .brand-icon {transform:none}
}
/* Consistent blue surfaces for scheduling, invitations and the sideline. */
.site-header {border-top:3px solid var(--accent)}
.home-invite,.photo-invite-status,.album-role-help,.included-board,.calendar-home-empty {background:var(--blue-soft);border-color:var(--line)}
.person-card,.album-choices,.album-choice-row,.album-grant-row,.board-form .board-choice,.person-actions {border-color:var(--line)}
.person-avatar,.invite-step b,.album-grant-state {background:var(--blue-soft);color:var(--blue)}
.invite-step,.included-board p,.board-choice small,.restore-choice small,.person-note,.person-photo-note,.album-role-help p,.album-search-meta,.album-choice-info>span,.album-no-results,.album-grant-row>p {color:var(--muted)}
.included-board strong,.included-board>span:first-child,.member-status,.person-actions,.share-label,.copy-feedback,.album-grant-row>a {color:var(--blue)}
.member-status {border-color:var(--line)}
.board-choice:has(input:checked) {border-color:var(--blue);background:var(--blue-soft);box-shadow:inset 3px 0 0 var(--blue)}
.invitation-message,.login-link-box input,.album-choice-control select {background:#fbfdff;color:var(--ink);border-color:#b6cce0}
.album-unavailable,.pll-empty {background:#f5faff;color:var(--muted);border-color:#a8c2db}
.album-unavailable strong {color:var(--blue)}
.calendar-month-grid {border-color:var(--line)}
.calendar-table thead,.calendar-month-navigation>a {background:var(--blue-soft)}
.calendar-table th,.calendar-table td,.calendar-month-navigation>a {border-color:var(--line)}
.calendar-table th,.calendar-day-heading,.calendar-view-form label,.calendar-view-note {color:var(--muted)}
.calendar-day-outside {background:#f5f8fc}
.calendar-day-outside .calendar-day-heading {color:#74879b}
.calendar-day-today .calendar-day-heading time {background:var(--blue);color:#fff}
.calendar-month-navigation>a {color:var(--blue)}
.calendar-month-navigation>a:hover {background:#d4e7f8}
.calendar-home-event:hover strong,.calendar-agenda-event h3 a:hover {color:var(--blue-deep)}
.calendar-view-note a {border-color:var(--line)}
.calendar-provider-card .primary:disabled {background:#849cb1;border-color:#849cb1;color:#fff}
.pll-panel {background:#edf4fc;border-color:var(--line)}
.pll-panel-heading h2 em,.pll-season,.pll-results>h3,.pll-score-row>span,.pll-score-row strong,.pll-next h3,.pll-next-teams,.pll-next-date,.pll-game-details dd,.pll-schedule-link {color:var(--blue)}
.pll-next {background:var(--blue-soft);border-color:var(--line)}
.pll-result,.pll-game-details>div,.pll-panel-footer,.pll-season {border-color:var(--line)}
.pll-final {background:var(--blue-soft);color:var(--blue)}
.pll-game-meta,.pll-next .eyebrow,.pll-next-teams>span,.pll-game-details dt,.pll-game-details dd>span,.pll-next-note,.pll-panel-footer {color:var(--muted)}
.pll-schedule-link {border-color:#9db7d0}
.pll-schedule-link:hover {color:var(--blue-deep);border-color:var(--blue)}
.plex-banner {background:#eaf0f8;border-color:var(--line)}
.plex-banner:hover {background:#e2ecf7;border-color:#9db7d0}
.plex-banner .eyebrow {color:#7c5d26}
.plex-note,.plex-invite-status>p,.plex-invite-steps,.plex-handled-note p,.person-plex-note {color:var(--muted)}
.plex-invite-status {background:#f0f5fb;border-color:var(--line)}
.plex-invite-status .eyebrow,.plex-invite-status .share-label,.plex-invite-steps strong,.plex-handled-note {color:var(--blue)}
.plex-handled-note,.plex-email-box input {border-color:var(--line)}
.plex-email-box input {background:#fff}
@media(max-width:767px) {
 .invitation-message,.login-link-box input,.album-choice-control select {font-size:16px}
}