:root { --agenda-ink: #172033; --agenda-muted: #748096; --agenda-line: #e2e7ef; --agenda-soft: #f5f7fb; --agenda-blue: #2858d8; --agenda-shadow: 0 1.25rem 3rem rgba(36, 50, 81, .1); }
body { background: #edf1f7; color: var(--agenda-ink); }
.agenda-page { width: min(100% - 2rem, 80rem); margin: 0 auto; padding: clamp(1.5rem, 4vw, 4rem) 0; }
.agenda-header { padding-bottom: 1.5rem; }
.back-link { display: inline-flex; margin-bottom: 1.3rem; color: var(--agenda-muted); font-size: .82rem; font-weight: 700; text-decoration: none; }
.back-link:hover, .agenda-links a:hover, .agenda-footer a:hover { color: var(--agenda-blue); }
.planning-resources { display: grid; grid-template-columns: minmax(14rem, .8fr) minmax(0, 1.7fr); gap: 1rem; margin: 0 0 1.25rem; padding: 1.15rem 1.25rem; border: 1px solid #d8e0f4; border-radius: 1rem; background: linear-gradient(135deg, #f5f7ff, #fff); box-shadow: 0 .5rem 1.5rem #2432510d; }
.planning-resources h2 { margin: 0; font-size: 1.25rem; letter-spacing: -.03em; }
.planning-resources p:not(.panel-kicker) { margin: .55rem 0 0; color: var(--agenda-muted); font-size: .78rem; line-height: 1.5; }
.planning-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; }
.planning-links a { display: flex; flex-direction: column; gap: .2rem; padding: .75rem .85rem; border: 1px solid var(--agenda-line); border-radius: .7rem; background: white; color: var(--agenda-blue); text-decoration: none; }
.planning-links a:hover { border-color: #9bb0f4; box-shadow: 0 .3rem .8rem #2858d814; }
.planning-links strong { font-size: .78rem; }
.planning-links span { color: var(--agenda-muted); font-size: .68rem; line-height: 1.35; }
.agenda-header-row { display: flex; align-items: end; justify-content: space-between; gap: 2rem; }
.agenda-header h1 { max-width: none; margin: 0; font-size: clamp(2.8rem, 7vw, 5.8rem); letter-spacing: -.07em; }
.agenda-header .eyebrow { margin: 0 0 .35rem; color: var(--agenda-blue); }
.agenda-header .lede { max-width: 42rem; margin: .8rem 0 0; color: var(--agenda-muted); font-size: 1.08rem; }
.agenda-links { display: flex; flex-wrap: wrap; justify-content: end; gap: .6rem; }
.agenda-links a { display: inline-flex; padding: .72rem .9rem; border-radius: .65rem; background: white; color: var(--agenda-blue); box-shadow: 0 .35rem 1rem #24325112; font-size: .77rem; font-weight: 800; text-decoration: none; }
.agenda-links a:first-child { background: var(--agenda-blue); color: white; }
.agenda-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) minmax(18rem, 22rem); gap: 1.25rem; padding: 1.1rem 1.25rem; border: 1px solid var(--agenda-line); border-radius: 1rem; background: white; box-shadow: var(--agenda-shadow); }
.toolbar-label, .agenda-filters label { display: block; margin: 0 0 .55rem; color: var(--agenda-muted); font-size: .7rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.today-button { margin-left: .4rem; padding: .25rem .45rem; border: 1px solid #b4c2f5; border-radius: 999px; background: #eef2ff; color: var(--agenda-blue); font-size: .62rem; font-weight: 900; letter-spacing: 0; text-transform: none; cursor: pointer; }
.agenda-mode-row { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.mode-switch { display: inline-flex; padding: .2rem; border-radius: .65rem; background: var(--agenda-soft); }
.mode-button { padding: .42rem .65rem; border: 0; border-radius: .45rem; background: transparent; color: var(--agenda-muted); font-size: .72rem; font-weight: 800; cursor: pointer; }
.mode-button.is-active { background: white; color: var(--agenda-blue); box-shadow: 0 .15rem .45rem #24325116; }
.day-tabs { display: flex; gap: .4rem; overflow-x: auto; padding: .1rem 0 .25rem; scrollbar-width: thin; }
.day-tab { min-width: 4.1rem; padding: .6rem .45rem; border: 1px solid var(--agenda-line); border-radius: .65rem; background: white; color: var(--agenda-muted); cursor: pointer; }
.day-tab:hover, .day-tab:focus-visible { border-color: #9bb0f4; color: var(--agenda-blue); }
.day-tab[aria-selected="true"] { border-color: var(--agenda-blue); background: var(--agenda-blue); color: white; box-shadow: 0 .35rem .8rem #2858d82e; }
.day-tab .day-name, .day-tab .day-number { display: block; }
.day-tab .day-name { font-size: .64rem; font-weight: 800; text-transform: uppercase; }
.day-tab .day-number { margin-top: .2rem; font-size: 1.1rem; font-weight: 900; }
.agenda-filters input { width: 100%; padding: .7rem .8rem; border: 1px solid var(--agenda-line); border-radius: .6rem; background: var(--agenda-soft); color: var(--agenda-ink); font: inherit; outline: 0; }
.agenda-filters input:focus { border-color: #9bb0f4; background: white; box-shadow: 0 0 0 .2rem #2858d814; }
.category-filters { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .65rem; }
.category-filter { padding: .35rem .55rem; border: 1px solid var(--agenda-line); border-radius: 999px; background: white; color: var(--agenda-muted); font-size: .66rem; font-weight: 800; cursor: pointer; }
.category-filter[aria-pressed="true"] { border-color: #b4c2f5; background: #eef2ff; color: var(--agenda-blue); }
.agenda-filter-row, .agenda-view-row { display: flex; align-items: end; flex-wrap: wrap; gap: .55rem; margin-top: .75rem; }
.agenda-filter-row label, .agenda-view-row label { margin: 0; font-size: .64rem; letter-spacing: .08em; }
.agenda-filter-row select, .agenda-view-row select { min-width: 7rem; padding: .48rem .55rem; border: 1px solid var(--agenda-line); border-radius: .55rem; background: var(--agenda-soft); color: var(--agenda-ink); font: inherit; font-size: .75rem; }
.agenda-filter-row select:focus, .agenda-view-row select:focus { border-color: #9bb0f4; outline: 0; box-shadow: 0 0 0 .2rem #2858d814; }
.agenda-view-row { align-items: center; justify-content: space-between; }
.view-switch { display: inline-flex; padding: .2rem; border-radius: .65rem; background: var(--agenda-soft); }
.view-button { padding: .42rem .65rem; border: 0; border-radius: .45rem; background: transparent; color: var(--agenda-muted); font-size: .72rem; font-weight: 800; cursor: pointer; }
.view-button.is-active { background: white; color: var(--agenda-blue); box-shadow: 0 .15rem .45rem #24325116; }
.clear-labels { padding: .42rem .55rem; border: 1px solid #b4c2f5; border-radius: .55rem; background: #eef2ff; color: var(--agenda-blue); font: inherit; font-size: .7rem; font-weight: 800; cursor: pointer; }
.active-labels { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .55rem; }
.active-label { display: inline-flex; align-items: center; gap: .35rem; padding: .25rem .45rem; border: 1px solid #b4c2f5; border-radius: 999px; background: #eef2ff; color: var(--agenda-blue); font-size: .65rem; font-weight: 800; }
.active-label button { padding: 0; border: 0; background: none; color: inherit; font: inherit; font-weight: 900; cursor: pointer; }
.agenda-summary { display: flex; gap: 2rem; margin: 1.5rem 0 .8rem; padding: 0 .25rem; }
.agenda-summary > div { display: flex; flex-direction: column; gap: .15rem; }
.summary-label { color: var(--agenda-muted); font-size: .68rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.agenda-summary strong { font-size: 1rem; }
.agenda-list { display: grid; gap: .75rem; }
.agenda-card { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr) auto; gap: 1rem; align-items: start; padding: 1rem 1.15rem; border: 1px solid var(--agenda-line); border-radius: .9rem; background: white; box-shadow: 0 .35rem .9rem #24325109; }
.agenda-card.is-committed { border-color: #97d6ac; background: linear-gradient(135deg, #e9f9ef, #fafffb); box-shadow: 0 .45rem 1rem #1f7a4317; }
.agenda-card.is-committed.unscheduled { background: linear-gradient(135deg, #e9f9ef, #fafffb); }
.agenda-card.is-all-day .agenda-time { color: #6c4ca1; }
.agenda-time { color: var(--agenda-blue); font-size: .88rem; font-weight: 900; line-height: 1.25; }
.agenda-time small { display: block; margin-top: .2rem; color: var(--agenda-muted); font-size: .66rem; font-weight: 700; }
.agenda-card h2 { margin: 0 0 .35rem; font-size: 1.05rem; letter-spacing: -.02em; }
.agenda-meta { display: flex; flex-wrap: wrap; gap: .45rem .7rem; color: var(--agenda-muted); font-size: .76rem; }
.agenda-date-range { margin-bottom: .35rem; color: var(--agenda-blue); font-size: .68rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.agenda-meta span::before { margin-right: .3rem; color: #a1acbc; }
.agenda-location::before { content: '⌖'; }
.agenda-category::before { content: '◈'; }
.agenda-genre { font-style: italic; }
.agenda-ticket-meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: .45rem .7rem; margin-top: .55rem; color: var(--agenda-blue); font-size: .76rem; }
.agenda-ticket-meta span { color: var(--agenda-muted); font-size: .68rem; }
.agenda-detail { margin: .55rem 0 0; color: #566278; font-size: .78rem; line-height: 1.5; }
.agenda-tags { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .7rem; }
.agenda-tag { padding: .2rem .45rem; border: 0; border-radius: 999px; background: #eef2ff; color: var(--agenda-blue); font: inherit; font-size: .63rem; font-weight: 800; cursor: pointer; }
.agenda-tag:hover, .agenda-tag:focus-visible { background: #dce5ff; }
.agenda-committed { display: inline-flex; vertical-align: middle; padding: .18rem .4rem; border-radius: 999px; background: #e7f7ed; color: #1f7a43; font-size: .58rem; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.agenda-original { margin-top: .7rem; padding: .55rem .7rem; border-left: 3px solid #c6cedc; background: #f8f9fc; color: var(--agenda-muted); font-size: .7rem; line-height: 1.45; }
.agenda-original summary { color: var(--agenda-blue); font-size: .68rem; font-weight: 800; cursor: pointer; }
.agenda-original h3 { margin: .55rem 0 .2rem; color: var(--agenda-ink); font-size: .76rem; }
.agenda-original p { margin: .2rem 0 0; }
.agenda-insights { margin-top: .7rem; padding: .55rem .7rem; border-left: 3px solid #b4c2f5; background: #f7f9ff; color: var(--agenda-muted); font-size: .7rem; line-height: 1.45; }
.agenda-insights summary { color: var(--agenda-blue); font-size: .68rem; font-weight: 800; cursor: pointer; }
.agenda-insights p { margin: .4rem 0 0; }
.agenda-insights strong { color: var(--agenda-ink); }
.agenda-card-links { display: flex; flex-wrap: wrap; gap: .35rem .7rem; margin-top: .7rem; }
.agenda-card-links a { color: var(--agenda-blue); font-size: .68rem; font-weight: 800; text-decoration: none; }
.agenda-card-links a:hover { text-decoration: underline; }
.agenda-plan-toggle { margin-top: .7rem; padding: .4rem .55rem; border: 1px solid #b4c2f5; border-radius: .55rem; background: #eef2ff; color: var(--agenda-blue); font: inherit; font-size: .68rem; font-weight: 800; cursor: pointer; }
.agenda-card.is-committed .agenda-plan-toggle { border-color: #97d6ac; background: white; color: #1f7a43; }
.agenda-source { align-self: center; padding: .5rem .6rem; border-radius: .55rem; background: var(--agenda-soft); color: var(--agenda-blue); font-size: .7rem; font-weight: 800; text-decoration: none; white-space: nowrap; }
.agenda-source:hover { background: #e9eeff; }
.agenda-divider { display: flex; align-items: center; gap: .8rem; margin: 1rem 0 .25rem; color: var(--agenda-muted); font-size: .7rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.agenda-divider::after { height: 1px; flex: 1; background: var(--agenda-line); content: ''; }
.committed-divider { color: #1f7a43; }
.agenda-card.unscheduled { grid-template-columns: 7.5rem minmax(0, 1fr) auto; background: #fbfcfe; }
.agenda-card.unscheduled .agenda-time { color: var(--agenda-muted); }
.empty-agenda { padding: 3rem 1rem; border: 1px dashed #cbd4e1; border-radius: .9rem; color: var(--agenda-muted); text-align: center; }
.calendar-panel { margin-bottom: 1rem; padding: 1rem; border: 1px solid var(--agenda-line); border-radius: 1rem; background: white; box-shadow: var(--agenda-shadow); }
.calendar-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: .8rem; }
.calendar-heading h2 { margin: 0; font-size: 1.2rem; letter-spacing: -.03em; }
.month-button { width: 2rem; height: 2rem; border: 1px solid var(--agenda-line); border-radius: .5rem; background: var(--agenda-soft); color: var(--agenda-blue); font-size: 1rem; cursor: pointer; }
.calendar-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--agenda-line); border-radius: .65rem; background: var(--agenda-line); }
.calendar-weekday { padding: .55rem .4rem; background: var(--agenda-soft); color: var(--agenda-muted); font-size: .65rem; font-weight: 900; text-align: center; text-transform: uppercase; }
.calendar-cell { min-height: 7rem; padding: .45rem; background: white; }
.calendar-cell.is-selected { background: #f2f5ff; box-shadow: inset 0 0 0 2px #b4c2f5; }
.calendar-cell.is-outside { background: #f8f9fc; }
.calendar-date { width: 1.8rem; height: 1.8rem; border: 0; border-radius: 50%; background: transparent; color: var(--agenda-ink); font-size: .75rem; font-weight: 900; cursor: pointer; }
.calendar-cell.is-selected .calendar-date { background: var(--agenda-blue); color: white; }
.calendar-events { display: grid; gap: .2rem; margin-top: .25rem; }
.calendar-event { overflow: hidden; padding: .28rem .35rem; border: 0; border-radius: .35rem; background: #eef2ff; color: var(--agenda-blue); font-size: .62rem; line-height: 1.25; text-align: left; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }
.calendar-event.is-committed { background: #dff5e7; color: #1f7a43; }
.calendar-event:hover, .calendar-event:focus-visible { background: #dce5ff; }
.calendar-event-time { margin-right: .25rem; font-weight: 900; }
.calendar-empty { color: #c4cbd6; font-size: .7rem; }
.agenda-footer { margin-top: 1.5rem; padding: 1rem .25rem; border-top: 1px solid var(--agenda-line); color: var(--agenda-muted); font-size: .72rem; line-height: 1.5; }
.agenda-footer p { margin: .4rem 0; }
.agenda-footer a { color: var(--agenda-blue); font-weight: 800; text-decoration: none; }
.agenda-footer span { margin: 0 .4rem; color: #b8c1ce; }
@media (max-width: 760px) { .agenda-page { width: min(100% - 1.25rem, 80rem); } .agenda-header-row { align-items: start; flex-direction: column; gap: 1rem; } .agenda-links { justify-content: start; } .planning-resources { grid-template-columns: 1fr; } .agenda-toolbar { grid-template-columns: 1fr; } .agenda-mode-row { align-items: start; flex-direction: column; } .day-tabs { margin-right: -.5rem; } .agenda-summary { gap: 1rem; justify-content: space-between; } .agenda-summary > div:last-child { display: none; } .agenda-card, .agenda-card.unscheduled { grid-template-columns: 5.5rem minmax(0, 1fr); gap: .7rem; } .agenda-source { grid-column: 2; justify-self: start; } .calendar-cell { min-height: 5.5rem; padding: .3rem; } .calendar-event { font-size: .56rem; } .calendar-event-time { display: none; } }
@media (max-width: 440px) { .agenda-header h1 { font-size: 3.5rem; } .agenda-links a { flex: 1; justify-content: center; } .agenda-card, .agenda-card.unscheduled { grid-template-columns: 1fr; } .agenda-source { grid-column: auto; } .agenda-time { margin-bottom: .2rem; } }