/* Rail.fm page layout. Every value references theme.css variables. */

.wrap {
  max-width: 960px;
  margin: 0 auto;
  padding: var(--space-6) var(--space-4) var(--space-20);
  display: grid;
  gap: var(--space-10);
}

.site-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--space-4);
}
.site-header nav { display: flex; gap: var(--space-4); }
.site-header nav a {
  color: var(--text-secondary);
  text-decoration: none;
  font-size: var(--text-sm);
  font-weight: 500;
}
.site-header nav a:hover { color: var(--text-primary); }
.wordmark .rail { font-size: var(--text-4xl); }
.wordmark .fm { font-size: var(--text-base); }

.site-footer {
  border-top: 1px solid var(--border-default);
  padding-top: var(--space-4);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4);
  color: var(--text-tertiary);
  font-size: var(--text-sm);
}
.site-footer a { color: var(--text-tertiary); }

.hero { display: grid; gap: var(--space-4); padding: var(--space-12) 0; }
.hero .headline { font-size: clamp(var(--text-5xl), 10vw, var(--text-8xl)); }
.hero .pitch {
  font-size: var(--text-xl);
  color: var(--text-secondary);
  max-width: 65ch;
  margin: 0;
}
.hero .actions { display: flex; flex-wrap: wrap; gap: var(--space-3); }

.page-title { font-size: clamp(var(--text-4xl), 8vw, var(--text-7xl)); overflow-wrap: anywhere; }
.page-sub { color: var(--text-secondary); margin: 0; }

.meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-4);
  color: var(--text-secondary);
  font-size: var(--text-sm);
  align-items: center;
}

.event-list { display: grid; gap: var(--space-4); }
.event-card { padding: var(--space-5); display: grid; gap: var(--space-2); }
.event-card .artist {
  font-size: clamp(var(--text-2xl), 5vw, var(--text-4xl));
  overflow-wrap: anywhere;
}
.event-card a.artist-link { text-decoration: none; }
.event-card .support { color: var(--text-secondary); font-size: var(--text-sm); margin: 0; }

.day-group { display: grid; gap: var(--space-3); }
.day-heading {
  font-size: var(--text-lg);
  font-weight: 600;
  border-bottom: 1px solid var(--border-default);
  padding-bottom: var(--space-2);
}

.genre-row { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.genre-row .badge { text-decoration: none; }
.genre-row .badge.active {
  color: var(--text-accent);
  border-color: var(--text-accent);
}

.badge-warning { color: var(--feedback-warning); border-color: var(--feedback-warning); }
.badge-error { color: var(--feedback-error); border-color: var(--feedback-error); }

.detail-grid { display: grid; gap: var(--space-6); }
.ticket-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); }

.prose { max-width: 65ch; }
.prose h1 { font-size: var(--text-3xl); }
.prose h2 { font-size: var(--text-xl); margin-top: var(--space-6); }
.prose a { overflow-wrap: anywhere; }

.stat-row { display: flex; flex-wrap: wrap; gap: var(--space-6); color: var(--text-secondary); }
.stat-row .num { color: var(--text-primary); font-weight: 700; }

.empty-note { color: var(--text-secondary); }

/* --- accounts, feed, feedback (B5+B6) --- */

.site-header nav { align-items: baseline; flex-wrap: wrap; }
.nav-cta { color: var(--text-accent) !important; font-weight: 600; }
.inline-form { display: inline-flex; gap: var(--space-2); flex-wrap: wrap; }
.linklike {
  background: none; border: none; padding: 0; cursor: pointer;
  color: var(--text-secondary); font: inherit; font-size: var(--text-sm);
  font-weight: 500; min-height: 24px;
}
.linklike:hover { color: var(--text-primary); }

.messages { display: grid; gap: var(--space-2); }
.message {
  margin: 0; padding: var(--space-3) var(--space-4);
  border: 1px solid var(--border-default); border-radius: var(--radius-md);
  background: var(--surface-card); color: var(--text-primary);
}
.message.warning { border-color: var(--feedback-warning); }
.message.success { border-color: var(--feedback-success); }

.auth-panel { max-width: 480px; display: grid; gap: var(--space-6); }
.stack-form { display: grid; gap: var(--space-4); }
.field { display: grid; gap: var(--space-1); }
.field label, .field legend { font-weight: 500; font-size: var(--text-sm); }
.field input, .field select {
  background: var(--surface-card); color: var(--text-primary);
  border: 1px solid var(--border-strong); border-radius: var(--radius-md);
  padding: var(--space-3) var(--space-3); font-size: var(--text-base);
  min-height: 44px; width: 100%;
}

/* Shared profile and input styles. */
.profile-heading { display: grid; gap: var(--space-5); }
.profile-heading .page-title { max-width: 18ch; }
.profile-heading .page-sub { max-width: 65ch; }
.eyebrow { color: var(--text-accent); font-size: var(--text-sm); margin: 0; }
.field textarea {
  width: 100%; min-width: 0; resize: vertical; font: inherit;
  padding: var(--space-3); border: 1px solid var(--border-strong);
  border-radius: var(--radius-md); background: var(--surface-card); color: var(--text-primary);
}
.field textarea:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.choice-field > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); }
.choice-field label { display: flex; align-items: center; gap: var(--space-2); min-height: 44px; cursor: pointer; }
.choice-field input[type="checkbox"] { width: var(--space-5); height: var(--space-5); min-height: 0; flex: none; margin: 0; accent-color: var(--action-primary); }
.discovery-prompt { padding: var(--space-5); }
.history-note { white-space: pre-wrap; }
.picker-progress { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-4); margin: var(--space-5) 0; }
@media (max-width: 540px) {
  .choice-field > div { grid-template-columns: minmax(0, 1fr); }
}
.field input:focus-visible, .field select:focus-visible,
.chip:focus-visible, .linklike:focus-visible {
  outline: 2px solid var(--focus-ring); outline-offset: 2px;
}
.field.has-error input { border-color: var(--feedback-error); }

/* Radio groups (Django RadioSelect renders ul > li > label > input) */
.field ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-2); }
.field ul label {
  display: flex; align-items: center; gap: var(--space-3);
  font-weight: 400; font-size: var(--text-base); min-height: 44px; cursor: pointer;
}
.field input[type="radio"] {
  width: 20px; height: 20px; min-height: 0; flex: none;
  accent-color: var(--action-primary); margin: 0;
}
fieldset.field { border: 1px solid var(--border-default); border-radius: var(--radius-md);
  padding: var(--space-4); }
fieldset.field legend { padding: 0 var(--space-2); }
.help { color: var(--text-tertiary); font-size: var(--text-sm); margin: 0; }
.form-error { color: var(--feedback-error); font-size: var(--text-sm); margin: 0; }
.fineprint { color: var(--text-tertiary); font-size: var(--text-sm); }

.search-row { display: flex; gap: var(--space-2); max-width: 480px; }
.search-row input {
  flex: 1; background: var(--surface-card); color: var(--text-primary);
  border: 1px solid var(--border-strong); border-radius: var(--radius-md);
  padding: var(--space-3); min-height: 44px;
}
.chip-grid { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.chip {
  background: var(--surface-card); color: var(--text-primary);
  border: 1px solid var(--border-strong); border-radius: var(--radius-full, 999px);
  padding: var(--space-2) var(--space-4); min-height: 44px;
  font-size: var(--text-sm); font-weight: 500; cursor: pointer;
}
.chip:hover { border-color: var(--text-accent); }
.chip-on { border-color: var(--text-accent); color: var(--text-accent); }

.feed-section { display: grid; gap: var(--space-4); }
.section-title { font-size: clamp(var(--text-3xl), 6vw, var(--text-5xl)); }
.match-score { color: var(--text-accent); font-weight: 700; font-size: var(--text-lg); }
.reasons {
  margin: 0; padding-left: var(--space-5);
  color: var(--text-secondary); font-size: var(--text-sm);
}
.report-card { padding: var(--space-5); display: grid; gap: var(--space-2); }
.howto { color: var(--text-secondary); }
.howto summary { cursor: pointer; font-weight: 500; color: var(--text-primary); }
.source-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-2); }

.visually-hidden {
  position: absolute; width: 1px; height: 1px; margin: -1px;
  clip-path: inset(50%); overflow: hidden; white-space: nowrap;
}

/* --- Responsive card grid: 1 / 3 / 5 per row (Henry, 2026-08-23) -------- */
.wrap { max-width: 1408px; }
.event-list {
  grid-template-columns: 1fr;
  align-items: start;
}
@media (min-width: 768px) {
  .event-list { grid-template-columns: repeat(3, 1fr); }
  .event-list .artist { font-size: var(--text-3xl); }
}
@media (min-width: 1280px) {
  .event-list { grid-template-columns: repeat(5, 1fr); }
  .event-list .artist { font-size: var(--text-2xl); }
  .event-list .card { padding: var(--space-4); }
}
.event-list .ticket-actions { flex-wrap: wrap; gap: var(--space-2); }

/* Event page prose sections (description / good-to-know) */
.prose {
  max-width: 65ch;
  color: var(--text-primary);
  white-space: pre-line;
}
.prose-note { color: var(--text-secondary); font-size: var(--text-sm); }
.section-label {
  color: var(--text-tertiary);
  font-size: var(--text-sm);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

/* --- Festivals ---------------------------------------------------------- */
.festival-banner {
  display: block;
  padding: var(--space-3) var(--space-4);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-md);
  color: var(--text-accent);
  font-weight: 600;
  text-decoration: none;
}
.festival-banner:hover { border-color: var(--action-primary); }
.badge-festival { color: var(--text-accent); border-color: var(--text-accent); }
.fest-summary {
  display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: center;
}
.fest-throwback { color: var(--feedback-warning); font-weight: 600; }
.lineup-day { display: grid; gap: var(--space-3); }
.lineup-artists { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.artist-chip {
  padding: var(--space-1) var(--space-3);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  color: var(--text-primary);
  display: inline-flex; gap: var(--space-2); align-items: baseline;
}
.artist-chip.current { border-color: var(--text-accent); }
.artist-chip.current .chip-note { color: var(--text-accent); }
.artist-chip.throwback { border-color: var(--feedback-warning); }
.artist-chip.throwback .chip-note { color: var(--feedback-warning); }
.chip-note { font-size: var(--text-sm); }

/* --- Compact feedback icon row on cards (Henry, 2026-08-23) ------------- */
.icon-actions { display: flex; gap: var(--space-1); margin-left: auto; }
.ticket-actions { align-items: center; }
.icon-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 44px; height: 44px;                /* WCAG target size */
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: transparent;
  color: var(--text-secondary);
  cursor: pointer;
  transition: color var(--motion-fast, 120ms) ease-out,
              border-color var(--motion-fast, 120ms) ease-out;
}
.icon-btn:hover { color: var(--text-primary); border-color: var(--border-strong); }
.icon-btn:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.icon-btn.icon-active { color: var(--text-accent); border-color: var(--text-accent); }
.event-list .ticket-actions { justify-content: center; }
.event-list .icon-actions { margin-left: 0; }

/* Quiet surfaces, one question at a time. Shared theme tokens keep both themes usable. */
[hidden] { display: none !important; }
.skip-link { position: fixed; top: var(--space-3); left: var(--space-3); z-index: 30; padding: var(--space-3); background: var(--surface-card); transform: translateY(-200%); }
.skip-link:focus { transform: translateY(0); }
a:focus-visible, summary:focus-visible, button:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 3px; }
.history-layout { display: grid; max-width: 760px; margin: var(--space-2) auto var(--space-8); gap: var(--space-6); }
.history-heading { display: flex; align-items: start; justify-content: space-between; gap: var(--space-5); }
.history-heading > div { display: grid; gap: var(--space-3); min-width: 0; }
.history-heading .eyebrow { color: var(--text-secondary); }
.history-title { font-size: clamp(var(--text-3xl), 5vw, var(--text-4xl)); }
.history-heading .page-sub { font-size: var(--text-sm); }
.history-exit { flex-shrink: 0; font-size: var(--text-sm); color: var(--text-secondary); padding: var(--space-2) 0; text-underline-offset: var(--space-1); }
.history-form { padding: var(--space-6); border: 1px solid var(--border-default); border-radius: var(--radius-lg); background: var(--surface-card); display: grid; gap: var(--space-6); }
.survey-progress { display: flex; list-style: none; margin: 0; padding: 0; gap: var(--space-4); }
.survey-progress li { flex: 1; display: flex; align-items: center; gap: var(--space-2); padding-bottom: var(--space-3); border-bottom: 2px solid var(--border-default); font-size: var(--text-xs); color: var(--text-secondary); }
.survey-progress li[aria-current] { color: var(--text-primary); border-color: var(--text-accent); }
.survey-progress .is-complete { border-color: var(--border-strong); }
.survey-progress span { font-variant-numeric: tabular-nums; }
.survey-step { display: grid; gap: var(--space-5); min-width: 0; }
.survey-question { display: grid; gap: var(--space-2); }
.survey-question h2 { font-size: var(--text-2xl); font-weight: 600; margin: 0; letter-spacing: -0.02em; }
.survey-question h2:focus { outline: none; }
.survey-question p { font-size: var(--text-sm); }
.survey-pair { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: var(--space-4); }
.history-form .field { min-width: 0; gap: var(--space-2); }
.history-form input:not([type=checkbox]):not([type=radio]), .history-form select, .history-form textarea { background: var(--surface-page); border-color: var(--border-strong); }
.history-form .help { color: var(--text-secondary); }
.history-form fieldset { min-width: 0; border: 0; padding: 0; margin: 0; }
.history-form fieldset legend { padding: 0; margin-bottom: var(--space-3); }
.history-form .choice-field > div { gap: var(--space-2); }
.history-form .choice-field label { padding: var(--space-3); border: 1px solid var(--border-strong); border-radius: var(--radius-md); height: 100%; background: var(--surface-page); }
.history-form .choice-field label:has(:checked) { color: var(--text-accent); border-color: var(--text-accent); }
.history-form .choice-field label:has(:focus-visible) { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.history-form .choice-field input { flex: none; }
.survey-ratings .choice-field > div { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.survey-return .choice-field > div { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.history-form .choice-field label:has([value=""]:checked) { color: var(--text-primary); border-color: var(--border-strong); }
.factor-options { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.factor-options label { position: relative; cursor: pointer; }
.factor-options input[type=checkbox] { position: absolute; opacity: 0; width: 1px; height: 1px; min-height: 0; }
.factor-options label span { display: flex; align-items: center; gap: var(--space-2); min-height: 44px; border: 1px solid var(--border-strong); border-radius: var(--radius-full); padding: var(--space-2) var(--space-3); font-size: var(--text-sm); background: var(--surface-page); }
.factor-options label span::before { content: '+'; width: var(--space-3); text-align: center; }
.factor-options :checked + span { border-color: var(--text-accent); color: var(--text-accent); }
.factor-options :checked + span::before { content: '✓'; }
.factor-options :focus-visible + span { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.factor-options label:hover span { border-color: var(--text-accent); }
.factor-chips legend .help { margin-left: var(--space-2); font-weight: 400; }
.more-factors summary, .survey-disclosure summary, .history-memory summary { cursor: pointer; color: var(--text-secondary); font-size: var(--text-sm); min-height: 44px; align-content: center; }
.more-factors[open] .factor-options { margin-top: var(--space-2); }
.survey-disclosure { border-top: 1px solid var(--border-default); }
.survey-disclosure > summary { color: var(--text-primary); }
.survey-disclosure > summary .help { float: right; }
.survey-disclosure[open] > :not(summary) { margin-top: var(--space-4); }
.atmosphere-group { border-bottom: 1px solid var(--border-default); }
.atmosphere-group > .survey-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: var(--space-4) 0; }
.atmosphere-group .choice-field { grid-column: 1 / -1; }
.survey-controls { display: flex; align-items: center; gap: var(--space-4); padding-top: var(--space-5); border-top: 1px solid var(--border-default); }
.survey-count { margin-right: auto; }
.survey-save { margin-left: auto; display: grid; justify-items: end; gap: var(--space-3); }
.survey-privacy { text-align: center; font-size: var(--text-xs); }
.history-toolbar { display: flex; gap: var(--space-4); align-items: center; justify-content: space-between; }
.history-list { display: grid; gap: 0; }
.history-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; gap: var(--space-5); border-top: 1px solid var(--border-default); padding: var(--space-6) 0; }
.history-year { color: var(--text-secondary); font-size: var(--text-sm); padding-top: var(--space-1); min-width: var(--space-10); }
.history-record h2 { font-size: var(--text-2xl); overflow-wrap: anywhere; margin: 0 0 var(--space-2); }
.history-record { min-width: 0; overflow-wrap: anywhere; }
.history-card p { font-size: var(--text-sm); margin: 0 0 var(--space-2); }
.history-rating { color: var(--text-secondary); }
.history-edit { font-size: var(--text-sm); min-height: 44px; padding: var(--space-1); color: var(--text-secondary); }
.history-memory p { color: var(--text-secondary); }
.history-memory a { font-size: var(--text-sm); }
.history-delete { margin-top: var(--space-4); }
.card-heading { display: flex; align-items: start; gap: var(--space-2); position: relative; }
.card-heading .artist-link { flex: 1; min-width: 0; }
.recommendation-info { flex: none; }
.recommendation-info summary { list-style: none; border-color: transparent; margin-top: calc(-1 * var(--space-2)); margin-right: calc(-1 * var(--space-2)); }
.recommendation-info summary::-webkit-details-marker { display: none; }
.recommendation-info[open] summary { color: var(--text-accent); }
.recommendation-bubble { position: absolute; top: calc(100% + var(--space-2)); right: 0; width: 100%; z-index: 10; padding: var(--space-4); background: var(--surface-raised); border: 1px solid var(--border-strong); border-radius: var(--radius-md); box-shadow: var(--shadow-raised); overflow-wrap: anywhere; }
.recommendation-bubble > p { font-size: var(--text-sm); font-weight: 600; margin: 0 0 var(--space-2); }
.recommendation-bubble .reasons { color: var(--text-primary); display: grid; gap: var(--space-2); }
@media (max-width: 760px) {
  .site-header { flex-wrap: wrap; align-items: center; }
  .site-header nav { width: 100%; padding-top: var(--space-3); gap: var(--space-3) var(--space-5); }
  .site-header nav a, .site-header .linklike { display: inline-flex; min-height: 44px; align-items: center; }
  .history-layout { margin: 0 auto; gap: var(--space-6); }
  .history-heading { flex-wrap: wrap; gap: var(--space-2); }
}
@media (max-width: 540px) {
  .history-form { padding: var(--space-5) var(--space-4); gap: var(--space-6); }
  .survey-progress { gap: var(--space-2); }
  .survey-progress li { display: grid; gap: var(--space-1); font-size: var(--text-xs); }
  .survey-pair { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); }
  .atmosphere-group > .survey-pair { grid-template-columns: minmax(0, 1fr); }
  .survey-return .choice-field label { padding: var(--space-2); gap: var(--space-1); }
  .survey-controls { flex-wrap: wrap; gap: var(--space-3); }
  .survey-save { width: 100%; justify-items: stretch; }
  .history-card { gap: var(--space-3); }
  .history-toolbar { flex-wrap: wrap; }
}

@media (max-width: 360px) {
  .survey-count { position: absolute; width: 1px; height: 1px; clip-path: inset(50%); overflow: hidden; }
  .survey-controls [data-next] { margin-left: auto; }
}

/* The show carries the identity; navigation and controls stay quiet. */
a, a:hover, a:focus, a:active { text-decoration: none; }
a { transition: color var(--duration-fast) var(--ease-out); }
a:hover { color: var(--text-primary); }
.prose a, .fineprint a, .page-sub a, .help a { font-weight: 500; }
.site-header { align-items: center; position: relative; z-index: 20; }
.site-header nav { align-items: center; gap: var(--space-6); }
.site-header nav > a, .profile-menu > summary { min-height: 44px; display: flex; align-items: center; }
.site-header nav a[aria-current=page] { color: var(--text-primary); }
.profile-menu { position: relative; font-size: var(--text-sm); color: var(--text-secondary); }
.profile-menu > summary { list-style: none; cursor: pointer; gap: var(--space-2); }
.profile-menu > summary::-webkit-details-marker, .card-more > summary::-webkit-details-marker { display: none; }
.profile-menu[open] > summary, .profile-menu > summary:hover { color: var(--text-primary); }
.profile-links { position: absolute; right: 0; top: calc(100% + var(--space-2)); width: calc(var(--space-20) * 2.5); padding: var(--space-2); border: 1px solid var(--border-default); border-radius: var(--radius-lg); background: var(--surface-card); box-shadow: var(--shadow-raised); }
.profile-links a, .profile-links .linklike { width: 100%; display: flex; align-items: center; min-height: 44px; padding: var(--space-3); border-radius: var(--radius-sm); }
.profile-links a:hover, .profile-links .linklike:hover { background: var(--surface-raised); }
.site-footer { font-size: var(--text-xs); gap: var(--space-5); }
.site-footer > span { margin-right: auto; }
.page-title { font-size: clamp(var(--text-3xl), 6vw, var(--text-6xl)); }
.auth-panel { margin: var(--space-8) auto; }
.auth-panel h1 { font-size: var(--text-3xl); }
.auth-panel .page-sub, .auth-panel .fineprint { font-size: var(--text-sm); margin: 0; }
main > .feed-section + .feed-section { margin-top: var(--space-10); }
.section-title { font-size: clamp(var(--text-2xl), 4vw, var(--text-4xl)); }
.event-card { position: relative; box-shadow: none; gap: var(--space-3); }
.feed-card:has(.ui-disclosure[open]) { z-index: 10; }
.card-heading { align-items: center; }
.card-heading .artist { line-height: var(--leading-heading); }
.card-actions { display: flex; gap: var(--space-1); align-items: center; position: relative; margin-top: var(--space-2); }
.card-ticket { flex: 1; min-width: 0; padding: 0 var(--space-3); font-size: var(--text-sm); }
.card-actions .icon-btn { border: 0; flex: none; }
.card-actions .icon-btn:hover, .card-more[open] > summary { background: var(--surface-raised); }
.card-more > summary { list-style: none; }
.card-more-menu { position: absolute; bottom: calc(100% + var(--space-2)); right: 0; width: min(100%, calc(var(--space-20) * 2.5)); display: grid; padding: var(--space-2); background: var(--surface-raised); border: 1px solid var(--border-strong); border-radius: var(--radius-md); box-shadow: var(--shadow-raised); z-index: 15; }
.card-more-menu button { border: 0; color: var(--text-primary); background: transparent; font: inherit; font-size: var(--text-sm); min-height: 44px; text-align: left; padding: var(--space-2) var(--space-3); cursor: pointer; border-radius: var(--radius-sm); }
.card-more-menu button:hover { background: var(--surface-card); }
.card-more-menu button[aria-pressed=true] { color: var(--text-accent); }
button[aria-busy=true] { opacity: .6; cursor: progress; }
.quick-action-error { margin: var(--space-2) 0 0; width: 100%; }
.artist-picker { max-width: 760px; margin: var(--space-8) auto; display: grid; gap: var(--space-6); }
.artist-picker .page-title { font-size: var(--text-4xl); }
.artist-picker .chip-grid { gap: var(--space-3); }
.artist-picker .picker-progress { margin: 0; }
.chip { display: inline-flex; align-items: center; gap: var(--space-2); transition: color var(--duration-fast) var(--ease-out), border-color var(--duration-fast) var(--ease-out), background var(--duration-fast) var(--ease-out); }
.chip [data-follow-check] { flex: none; }
@media (max-width: 760px) {
  .site-header:has(.nav-toggle:not([hidden])) nav { position: absolute; top: calc(100% + var(--space-3)); right: 0; width: min(100%, calc(var(--space-20) * 4)); display: grid; grid-template-columns: 1fr; gap: 0; padding: var(--space-2); border: 1px solid var(--border-default); border-radius: var(--radius-lg); background: var(--surface-card); box-shadow: var(--shadow-raised); }
  .site-header nav > a, .profile-menu > summary { padding: var(--space-2) var(--space-3); }
  .profile-links { position: static; width: auto; border: 0; border-top: 1px solid var(--border-default); box-shadow: none; padding: 0 var(--space-3); }
  .artist-picker, .auth-panel { margin: 0 auto; }
}
.page-heading { display: grid; gap: var(--space-3); }
.account-links { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-3); font-size: var(--text-sm); }
.account-danger { border-top: 1px solid var(--border-default); padding-top: var(--space-3); }
.account-danger summary, .calendar-filter summary { cursor: pointer; min-height: 44px; align-content: center; font-size: var(--text-sm); color: var(--text-secondary); }
.account-danger[open] > .stack-form { margin-top: var(--space-4); }
.calendar-filters { display: grid; gap: var(--space-3); }
.calendar-filters .badge { text-transform: none; letter-spacing: normal; font-weight: 500; min-height: 40px; display: inline-flex; align-items: center; padding: var(--space-2) var(--space-4); }
.calendar-filter-options { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-6); }
.calendar-filter { max-width: 100%; }
.calendar-filter[open] { flex-basis: 100%; }
.calendar-filter[open] > nav { padding-bottom: var(--space-4); }
.event-more { position: relative; }
.event-more > summary { list-style: none; }
.event-more > summary::-webkit-details-marker { display: none; }
.event-more > .event-more-panel { position: absolute; top: calc(100% + var(--space-2)); left: 0; padding: var(--space-2); width: calc(var(--space-20) * 2.5); z-index: 10; background: var(--surface-card); border: 1px solid var(--border-default); border-radius: var(--radius-md); box-shadow: var(--shadow-raised); display: grid; }
.event-more > .event-more-panel button { min-height: 44px; justify-content: start; }

.event-more > summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; padding: var(--space-2) var(--space-3); color: var(--text-secondary); font-size: var(--text-sm); }
.event-list:has(.feed-card) { align-items: stretch; }
.feed-card { display: flex; flex-direction: column; }
.feed-card .card-actions { margin-top: auto; padding-top: var(--space-2); }
main, .artist-picker, .search-row input { min-width: 0; }
.messages { margin-bottom: var(--space-6); }
.btn-primary:hover { color: var(--text-on-accent); }
.artist-picker { grid-template-columns: minmax(0, 1fr); }
.artist-picker .search-row { min-width: 0; width: 100%; }
.artist-picker[data-leaving] [data-artist-follow] { pointer-events: none; }