/* The preview control is shared by both appearances. */
.appearance-switch {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 32px;
  padding: 5px 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
  color: var(--ink);
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}

.appearance-switch:hover { background: var(--mint); }
.appearance-switch .icon { width: 15px; height: 15px; }

/* Cool neutrals keep the focus on project state and primary actions. */
html[data-appearance="indigo"] {
  --bg: #fff;
  --surface: #fff;
  --ink: #19243b;
  --muted: #52617a;
  --line: #e1e6ef;
  --green: #5147e6;
  --green-hover: #4036cc;
  --mint: #eeecff;
  --lime: #e8e5ff;
  --amber: #83501b;
  --amber-bg: #fff3df;
  --red: #b53444;
  --radius: 8px;
  --shadow: 0 1px 2px #19243b06;
  --indigo-sidebar: #f8f9fd;
  --indigo-subtle: #f6f8fc;
  --indigo-info: #eaf3ff;
  --indigo-success: #e5f5ee;
  --indigo-success-ink: #17664d;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html[data-appearance="indigo"] body { font-size: 14px; }
html[data-appearance="indigo"] :is(button, a, input, select, textarea):focus-visible {
  outline: 2px solid var(--green);
  outline-offset: 3px;
}
html[data-appearance="indigo"] :is(input, select, textarea):focus { border-color: var(--green); }

/* Workspace navigation and header */
html[data-appearance="indigo"] .app-shell { grid-template-columns: 216px minmax(0, 1fr); }
html[data-appearance="indigo"] .sidebar {
  padding: 23px 13px 18px;
  background: var(--indigo-sidebar);
  border-color: var(--line);
}
html[data-appearance="indigo"] .brand { margin-bottom: 20px; padding: 0 8px; color: var(--ink); }
html[data-appearance="indigo"] .brand-lockup { display: block; width: 141px; height: auto; }
html[data-appearance="indigo"] .workspace-switch {
  padding: 7px 7px 19px;
  color: var(--ink);
  font-size: 12px;
}
html[data-appearance="indigo"] .workspace-badge {
  background: var(--surface);
  border-color: var(--line);
  color: var(--green);
  font-size: 13px;
}
html[data-appearance="indigo"] :is(.workspace-switch small, .sidebar-note, .tiny-label) { display: none; }
html[data-appearance="indigo"] .workspace-label { color: var(--muted); font-size: 10px; }
html[data-appearance="indigo"] .projects-label { margin-top: 25px; }
html[data-appearance="indigo"] .nav-item {
  min-height: 37px;
  margin-bottom: 3px;
  padding: 8px 11px;
  gap: 10px;
  border-radius: 6px;
  color: var(--muted);
  font-size: 13px;
}
html[data-appearance="indigo"] .nav-item:hover { background: #edf0f7; color: var(--ink); }
html[data-appearance="indigo"] .nav-item.active { background: var(--mint); color: var(--green); font-weight: 650; }
html[data-appearance="indigo"] :is(.nav-count, .tab-count, .task-group-title > span) {
  background: #edf0f7;
  color: var(--muted);
  font-size: 10px;
}
html[data-appearance="indigo"] :is(.nav-item.active, .tab.active) :is(.nav-count, .tab-count) {
  background: #e4e0ff;
  color: var(--green);
}
html[data-appearance="indigo"] .project-nav { color: var(--ink); background: #edf0f7; font-size: 12px; }
html[data-appearance="indigo"] .project-dot { background: #7369ef; }
html[data-appearance="indigo"] .project-nav-children { border-color: var(--line); }
html[data-appearance="indigo"] .project-nav-children button { font-size: 12px; color: var(--muted); }
html[data-appearance="indigo"] .project-nav-children button:hover { color: var(--green); }
html[data-appearance="indigo"] :is(.project-nav-caption, .project-nav-children button span) { color: var(--muted); }
html[data-appearance="indigo"] .sidebar-bottom { border-color: var(--line); }
html[data-appearance="indigo"] .sidebar-bottom .nav-item { min-height: 32px; font-size: 12px; }
html[data-appearance="indigo"] :is(.demo-label, .reset-button) { color: var(--muted); }
html[data-appearance="indigo"] .demo-dot { background: #7369ef; }

html[data-appearance="indigo"] .topbar { height: 58px; padding: 0 30px; background: var(--surface); }
html[data-appearance="indigo"] .topbar-end { gap: 14px; min-width: 0; }
html[data-appearance="indigo"] .breadcrumbs { color: var(--muted); font-size: 12px; }
html[data-appearance="indigo"] .breadcrumbs strong { color: var(--ink); }
html[data-appearance="indigo"] :is(.breadcrumbs .icon, .topbar-date) { color: var(--muted); }
html[data-appearance="indigo"] .topbar-date { font-size: 11px; }
html[data-appearance="indigo"] .global-search {
  width: min(255px, 25vw);
  min-height: 33px;
  padding: 5px 8px;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--indigo-subtle);
  color: var(--muted);
  font-size: 12px;
  text-align: left;
}
html[data-appearance="indigo"] .global-search:hover { border-color: #bdc7db; color: var(--ink); }
html[data-appearance="indigo"] .global-search kbd { background: var(--surface); color: var(--muted); }
html[data-appearance="indigo"] .you-avatar { background: var(--mint); color: var(--green); }

/* Project summary, primary action, and metrics */
html[data-appearance="indigo"] .main-content { max-width: 1440px; padding: 25px 30px 38px; }
html[data-appearance="indigo"] .project-header { gap: 16px; margin-bottom: 18px; }
html[data-appearance="indigo"] .project-title { color: var(--ink); font-size: clamp(24px, 2.5vw, 31px); font-weight: 650; }
html[data-appearance="indigo"] .eyebrow { color: var(--muted); font-size: 10px; }
html[data-appearance="indigo"] .project-symbol { color: var(--green); }
html[data-appearance="indigo"] .project-subtitle { color: var(--muted); font-size: 13px; margin-top: 5px; }
html[data-appearance="indigo"] .header-actions { gap: 12px; }
html[data-appearance="indigo"] .button {
  border-radius: 7px;
  min-height: 35px;
  padding: 7px 12px;
  font-size: 12px;
  font-weight: 625;
  white-space: nowrap;
}
html[data-appearance="indigo"] .button.small { min-height: 32px; padding: 6px 10px; font-size: 11px; }
html[data-appearance="indigo"] .button.primary { background: var(--green); color: #fff; box-shadow: 0 1px 2px #2e269b30; }
html[data-appearance="indigo"] .button.primary:hover { background: var(--green-hover); }
html[data-appearance="indigo"] .button.secondary { background: var(--surface); border-color: var(--line); color: var(--ink); }
html[data-appearance="indigo"] .button.secondary:hover { border-color: #b7b1ed; background: var(--indigo-subtle); color: var(--green); }
html[data-appearance="indigo"] .button.ghost { color: var(--muted); }
html[data-appearance="indigo"] .button.ghost:hover { background: var(--indigo-subtle); color: var(--green); }
html[data-appearance="indigo"] .tabs { gap: 24px; margin-bottom: 19px; border-color: var(--line); }
html[data-appearance="indigo"] .tab { padding-bottom: 11px; color: var(--muted); font-size: 13px; font-weight: 550; }
html[data-appearance="indigo"] .tab:hover { color: var(--green); }
html[data-appearance="indigo"] .tab.active { color: var(--green); border-color: var(--green); font-weight: 650; }
html[data-appearance="indigo"] .tab:focus-visible { outline-offset: -2px; }

html[data-appearance="indigo"] .project-brief {
  padding: 15px 18px 13px;
  border-color: #dfdef6;
  background: #f8f8ff;
  box-shadow: none;
}
html[data-appearance="indigo"] .brief-tag {
  margin-bottom: 0;
  color: var(--green);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: .07em;
}
html[data-appearance="indigo"] .brief-tag .icon { width: 14px; height: 14px; }
html[data-appearance="indigo"] .brief-updated { color: var(--muted); font-size: 11px; }
html[data-appearance="indigo"] .project-brief h2 {
  margin: 7px 0 4px;
  color: var(--ink);
  font-size: 18px;
  letter-spacing: -.3px;
  line-height: 1.25;
  font-weight: 650;
}
html[data-appearance="indigo"] .project-brief .brief-copy {
  max-width: 780px;
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
  letter-spacing: 0;
}
html[data-appearance="indigo"] .brief-footer { margin-top: 10px; padding-top: 8px; color: var(--muted); border-color: #e5e3f6; font-size: 11px; }
html[data-appearance="indigo"] .brief-footer .source-link { font-size: 11px; }

html[data-appearance="indigo"] .attention-banner {
  margin: 12px 0 0;
  padding: 9px 12px;
  gap: 10px;
  background: var(--surface);
  border-color: var(--line);
  border-radius: var(--radius);
}
html[data-appearance="indigo"] .banner-icon { background: var(--mint); color: var(--green); border-color: #e2ddff; }
html[data-appearance="indigo"] .banner-copy { gap: 1px; }
html[data-appearance="indigo"] .banner-copy strong { color: var(--ink); font-size: 13px; }
html[data-appearance="indigo"] .banner-copy > span { color: var(--muted); font-size: 12px; }
html[data-appearance="indigo"] .attention-banner .button { color: var(--green); }

html[data-appearance="indigo"] .stat-grid {
  margin: 15px 0 20px;
  gap: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
html[data-appearance="indigo"] .stat-card {
  min-width: 0;
  min-height: 94px;
  padding: 11px 15px;
  gap: 2px;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
html[data-appearance="indigo"] .stat-card:first-child { border-radius: 7px 0 0 7px; }
html[data-appearance="indigo"] .stat-card:last-child { border-radius: 0 7px 7px 0; }
html[data-appearance="indigo"] .stat-card + .stat-card { border-left: 1px solid var(--line); }
html[data-appearance="indigo"] .stat-card:hover { background: var(--indigo-subtle); }
html[data-appearance="indigo"] .stat-card:focus-visible { outline-offset: -3px; }
html[data-appearance="indigo"] .stat-label { color: var(--muted); font-size: 12px; }
html[data-appearance="indigo"] .stat-label .icon { color: var(--muted); }
html[data-appearance="indigo"] .stat-value { color: var(--ink); font-size: 28px; font-weight: 650; line-height: 1.1; font-variant-numeric: tabular-nums; }
html[data-appearance="indigo"] .stat-value.date-value { font-size: 25px; }
html[data-appearance="indigo"] .stat-detail { color: var(--muted); font-size: 11px; }
html[data-appearance="indigo"] .stat-detail .icon { color: var(--green); }

/* Overview cards and lists */
html[data-appearance="indigo"] .dashboard-grid { gap: 18px; }
html[data-appearance="indigo"] :is(.main-column, .aside-column) { gap: 16px; }
html[data-appearance="indigo"] .card { box-shadow: var(--shadow); border-color: var(--line); border-radius: var(--radius); }
html[data-appearance="indigo"] .card-header {
  align-items: center;
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
  background: var(--surface);
}
html[data-appearance="indigo"] .card-title { color: var(--ink); font-size: 15px; font-weight: 650; }
html[data-appearance="indigo"] .card-subtitle { color: var(--muted); font-size: 11px; margin-top: 3px; }
html[data-appearance="indigo"] :is(.task-list, .thread-list, .reminder-list, .event-list) { padding-right: 16px; padding-left: 16px; }
html[data-appearance="indigo"] :is(.task-row, .thread-row, .reminder-row, .event-row, .file-row, .person-row) { border-color: var(--line); }
html[data-appearance="indigo"] :is(.task-row, .thread-row) { padding-top: 10px; padding-bottom: 10px; }
html[data-appearance="indigo"] :is(.task-title, .thread-title, .reminder-title, .event-title, .person-info) {
  color: var(--ink);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
}
html[data-appearance="indigo"] :is(.task-title, .reminder-title):hover,
html[data-appearance="indigo"] :is(.thread-row, .event-row, .file-row):hover :is(.thread-title, .event-title, strong) { color: var(--green); }
html[data-appearance="indigo"] :is(.task-meta, .task-date, .thread-meta, .thread-time, .reminder-detail, .event-meta, .person-role, .manual-label) {
  color: var(--muted);
  font-size: 11px;
}
html[data-appearance="indigo"] .task-date.overdue { color: var(--red); }
html[data-appearance="indigo"] .task-check { width: 16px; height: 16px; border-color: #acb7cc; border-radius: 4px; }
html[data-appearance="indigo"] .task-check:hover { border-color: var(--green); background: var(--mint); }
html[data-appearance="indigo"] .task-check.completed { background: var(--green); color: #fff; border-color: var(--green); }
html[data-appearance="indigo"] .task-row.is-complete .task-title { color: var(--muted); }
html[data-appearance="indigo"] :is(.source-link, .section-link) { color: var(--green); font-size: 11px; font-weight: 625; }
html[data-appearance="indigo"] :is(.source-link, .section-link):hover { color: var(--green-hover); }
html[data-appearance="indigo"] :is(.thread-icon, .decision-icon) { background: var(--mint); color: var(--green); border-radius: 7px; }
html[data-appearance="indigo"] .thread-icon.original-icon { background: var(--indigo-info); color: #255c9d; }
html[data-appearance="indigo"] .reminder-icon { background: var(--amber-bg); color: var(--amber); }
html[data-appearance="indigo"] :is(.connection-footer, .quiet-note, .workspace-footer) {
  background: transparent;
  color: var(--muted);
  border-color: var(--line);
  font-size: 11px;
}
html[data-appearance="indigo"] .workspace-footer > span:last-child { display: none; }

html[data-appearance="indigo"] .status-pill {
  background: #edf0f7;
  color: var(--muted);
  font-size: 10px;
  font-weight: 625;
  border-radius: 4px;
}
html[data-appearance="indigo"] .status-pill:is(.linked, .done) { background: var(--indigo-success); color: var(--indigo-success-ink); }
html[data-appearance="indigo"] .status-pill.original { background: var(--indigo-info); color: #255c9d; }
html[data-appearance="indigo"] .status-pill:is(.waiting, .suggested) { background: var(--amber-bg); color: var(--amber); }
html[data-appearance="indigo"] .dot { background: #259a73; }
html[data-appearance="indigo"] .dot.amber { background: #be812a; }

/* Conversation, calendar, search, and decision views */
html[data-appearance="indigo"] .view-header h2 { color: var(--ink); font-size: 21px; font-weight: 650; }
html[data-appearance="indigo"] :is(.view-description, .search-hint, .search-result-count, .empty-state, .muted) { color: var(--muted); }
html[data-appearance="indigo"] .view-description { font-size: 13px; line-height: 1.55; }
html[data-appearance="indigo"] .filter-group { background: var(--indigo-subtle); border: 1px solid var(--line); }
html[data-appearance="indigo"] .filter-button { color: var(--muted); font-size: 12px; }
html[data-appearance="indigo"] .filter-button.active { color: var(--green); background: var(--surface); box-shadow: 0 1px 3px #26366018; }
html[data-appearance="indigo"] .conversation-card { border-color: var(--line); }
html[data-appearance="indigo"] .conversation-title { color: var(--ink); font-size: 15px; font-weight: 650; }
html[data-appearance="indigo"] .conversation-title:hover { color: var(--green); }
html[data-appearance="indigo"] .conversation-card .thread-preview { color: var(--muted); font-size: 12px; }
html[data-appearance="indigo"] .conversation-bottom { border-color: var(--line); }
html[data-appearance="indigo"] :is(.conversation-date, .email-count, .task-group-title) { color: var(--muted); font-size: 11px; }
html[data-appearance="indigo"] .match-evidence { color: var(--amber); background: var(--amber-bg); border-color: #f2dfbf; }
html[data-appearance="indigo"] .explain-card { background: var(--indigo-subtle); color: var(--muted); border-color: var(--line); }
html[data-appearance="indigo"] .explain-card strong { color: var(--ink); }
html[data-appearance="indigo"] :is(.calendar-heading, .calendar-month, .section-heading) { color: var(--ink); }
html[data-appearance="indigo"] .mini-calendar { padding-top: 10px; }
html[data-appearance="indigo"] :is(.calendar-weekdays, .calendar-legend, .calendar-today-key, .more-events) { color: var(--muted); }
html[data-appearance="indigo"] .calendar-weekdays { font-size: 10px; }
html[data-appearance="indigo"] .calendar-day { color: var(--ink); font-size: 11px; }
html[data-appearance="indigo"] button.calendar-day:hover { background: var(--indigo-subtle); color: var(--green); }
html[data-appearance="indigo"] .calendar-day.today :is(.day-number, .calendar-dot) { color: #fff; background: var(--green); }
html[data-appearance="indigo"] :is(.calendar-dot, .calendar-today-key .dot) { background: var(--green); }
html[data-appearance="indigo"] .full-calendar :is(.calendar-weekdays > div, .calendar-grid, .calendar-day) { border-color: var(--line); }
html[data-appearance="indigo"] .full-calendar .calendar-day.empty-day { background: var(--indigo-subtle); }
html[data-appearance="indigo"] .full-calendar .calendar-day.today { background: #f7f6ff; }
html[data-appearance="indigo"] .full-calendar .calendar-day.selected { background: #f7f6ff; box-shadow: inset 0 0 0 1px #c4bdf8; }
html[data-appearance="indigo"] .full-calendar .calendar-day:focus-visible { outline-offset: -2px; }
html[data-appearance="indigo"] .calendar-event { background: var(--mint); color: #4a40ac; border-color: #887df1; }
html[data-appearance="indigo"] .calendar-event.meeting { background: var(--indigo-info); color: #255c9d; border-color: #629ee7; }
html[data-appearance="indigo"] .calendar-event.task { background: var(--amber-bg); color: var(--amber); border-color: #ca9248; }
html[data-appearance="indigo"] .legend-dot { background: #887df1; }
html[data-appearance="indigo"] .legend-dot.meeting { background: #629ee7; }
html[data-appearance="indigo"] .legend-dot.task { background: #ca9248; }
html[data-appearance="indigo"] .event-date { background: var(--indigo-subtle); color: var(--ink); border-color: var(--line); }
html[data-appearance="indigo"] .event-date small { color: var(--muted); }
html[data-appearance="indigo"] :is(.decision-title, .file-row strong) { color: var(--ink); font-size: 14px; font-weight: 625; }
html[data-appearance="indigo"] :is(.decision-description, .decision-meta, .file-row small, .section-heading span) { color: var(--muted); font-size: 12px; }
html[data-appearance="indigo"] .file-row > .icon { color: var(--muted); }
html[data-appearance="indigo"] .decision-card.superseded { opacity: 1; }
html[data-appearance="indigo"] .decision-card.superseded :is(.decision-title, .decision-icon) { color: var(--muted); }
html[data-appearance="indigo"] .decision-card.superseded .decision-icon { background: var(--indigo-subtle); }
html[data-appearance="indigo"] .project-search-box { background: var(--surface); border-color: var(--line); color: var(--muted); }
html[data-appearance="indigo"] .search-input { color: var(--ink); }

/* Messages, review drawers, and editable project details */
html[data-appearance="indigo"] :is(.drawer-backdrop, .modal-backdrop) { background: #19243b50; }
html[data-appearance="indigo"] :is(.drawer, .modal) { background: var(--indigo-subtle); box-shadow: -8px 0 35px #19243b19; }
html[data-appearance="indigo"] :is(.drawer-title, .review-subject, .review-summary h3, .message-from, .form-label, .help-intro h3) { color: var(--ink); }
html[data-appearance="indigo"] .drawer-title { font-weight: 650; }
html[data-appearance="indigo"] :is(.drawer-subtitle, .drawer-summary, .archive-note, .message-date, .message-from > span, .form-hint, .form-help, .review-footnote, .checkbox-label, .help-steps) { color: var(--muted); }
html[data-appearance="indigo"] :is(.drawer-subtitle, .message-date, .archive-note, .form-hint) { font-size: 11px; }
html[data-appearance="indigo"] :is(.message-body, .drawer-summary, .review-reason, .review-summary p) { color: var(--muted); font-size: 13px; line-height: 1.65; }
html[data-appearance="indigo"] :is(.message-card, .review-summary) { border-color: var(--line); border-radius: var(--radius); }
html[data-appearance="indigo"] .message-card.source-highlight { border-color: #b7aff6; box-shadow: 0 0 0 3px #eeecff; }
html[data-appearance="indigo"] .source-highlight::before { background: var(--mint); color: var(--green); }
html[data-appearance="indigo"] :is(.attachment, .task-source-card, .sample-callout, .thread-context, .review-reason, .project-destination) {
  background: #f1f1fd;
  color: var(--muted);
  border-color: #e2e0f6;
}
html[data-appearance="indigo"] .review-reason { display: block; }
html[data-appearance="indigo"] :is(.attachment small, .task-source-card strong) { color: var(--muted); }
html[data-appearance="indigo"] :is(.source-label, .task-source-card > .icon, .thread-context > .icon, .review-reason > strong, .match-chips span) { color: var(--green); }
html[data-appearance="indigo"] .match-chips span { background: var(--mint); border-color: #e2ddff; }
html[data-appearance="indigo"] :is(.icon-button, .drawer-close) { color: var(--muted); }
html[data-appearance="indigo"] :is(.icon-button, .drawer-close):hover { background: var(--mint); color: var(--green); }
html[data-appearance="indigo"] .form-label { font-size: 12px; font-weight: 625; }
html[data-appearance="indigo"] :is(.form-input, .form-textarea, .form-select) { border-color: #ccd4e2; color: var(--ink); font-size: 13px; }
html[data-appearance="indigo"] :is(.form-input, .form-textarea)::placeholder { color: var(--muted); }
html[data-appearance="indigo"] .toast { background: #253458; color: #fff; }
html[data-appearance="indigo"] .toast .icon { color: #cdc7ff; }

@media (max-width: 1040px) {
  html[data-appearance="indigo"] .app-shell { grid-template-columns: 188px minmax(0, 1fr); }
  html[data-appearance="indigo"] .topbar { padding: 0 22px; }
  html[data-appearance="indigo"] .main-content { padding-right: 22px; padding-left: 22px; }
  html[data-appearance="indigo"] .stat-card { min-height: 90px; padding-right: 11px; padding-left: 11px; }
  html[data-appearance="indigo"] .stat-label { font-size: 11px; }
  html[data-appearance="indigo"] .stat-detail { font-size: 10px; }
}

@media (max-width: 800px) {
  html[data-appearance="indigo"] .sidebar { box-shadow: 8px 0 32px #19243b1a; }
  html[data-appearance="indigo"] .topbar { gap: 10px; }
  html[data-appearance="indigo"] .topbar-end { gap: 8px; }
  html[data-appearance="indigo"] .global-search { width: auto; }
}

@media (max-width: 600px) {
  .appearance-switch { width: 34px; padding: 5px; }
  .appearance-switch .theme-label { display: none; }
  html[data-appearance="indigo"] .topbar { padding: 0 14px; }
  html[data-appearance="indigo"] .main-content { padding: 20px 14px 30px; }
  html[data-appearance="indigo"] .project-brief { padding: 13px 14px 11px; }
  html[data-appearance="indigo"] .attention-banner { padding: 9px; }
  html[data-appearance="indigo"] .banner-copy { min-width: 115px; }
  html[data-appearance="indigo"] .banner-copy > span { font-size: 11px; }
  html[data-appearance="indigo"] .stat-card { min-height: 94px; padding: 9px 8px; }
  html[data-appearance="indigo"] .stat-value { font-size: 24px; }
  html[data-appearance="indigo"] .stat-value.date-value { font-size: 21px; }
  html[data-appearance="indigo"] .stat-detail { min-height: 0; padding-top: 1px; line-height: 1.4; }
  html[data-appearance="indigo"] .stat-label .icon { display: none; }
  html[data-appearance="indigo"] .tabs { gap: 17px; }
  html[data-appearance="indigo"] .tab { font-size: 12px; }
  html[data-appearance="indigo"] .calendar-weekdays { font-size: 9px; }
  html[data-appearance="indigo"] .calendar-event { font-size: 8px; }
}

@media (max-width: 480px) {
  html[data-appearance="indigo"] .project-title { max-width: calc(100% - 88px); }
  html[data-appearance="indigo"] .project-header .header-actions { gap: 0; }
  html[data-appearance="indigo"] .project-subtitle { font-size: 12px; }
  html[data-appearance="indigo"] .button { padding-right: 9px; padding-left: 9px; }
  html[data-appearance="indigo"] .calendar-controls .button { min-height: 30px; font-size: 11px; }
  html[data-appearance="indigo"] .drawer-footer { gap: 7px; }
}