/* Projects use the same charcoal surfaces and purple accent as Overview. */
body.dashboard-page #projects {
  --projects-surface: var(--dash-charcoal, #202020);
  --projects-raised: var(--dash-charcoal-raised, #262626);
  --projects-line: var(--dash-charcoal-line, #393939);
  --projects-accent: var(--dash-purple, #a987ef);
  --projects-muted: #aaa7ae;
  --projects-text: #f5f3f8;
}
body.dashboard-page #projects .library-shell {
  padding: 0 0 30px;
  border: 0;
  background: transparent;
  box-shadow: none;
}
body.dashboard-page #projects .library-shell::before { content: none; }
body.dashboard-page #projects .library-toolbar {
  min-height: 132px;
  margin-bottom: 16px;
  padding: 22px 25px;
  border: 1px solid var(--projects-line);
  border-radius: 18px;
  background: var(--projects-surface);
  box-shadow: none;
}
body.dashboard-page #projects .library-heading { gap: 13px; }
body.dashboard-page #projects .library-heading-icon {
  width: 28px;
  height: 32px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--projects-accent);
}
body.dashboard-page #projects .library-heading-icon svg { width: 24px; height: 24px; }
body.dashboard-page #projects .library-toolbar .eyebrow { color: var(--projects-accent); font-size: 11px; }
body.dashboard-page #projects .library-toolbar h1 { color: var(--projects-text); font-size: clamp(23px,2.2vw,29px); }
body.dashboard-page #projects .library-subtitle { color: var(--projects-muted); font-size: 12px; }
body.dashboard-page #projects .library-new-project {
  min-height: 41px;
  padding: 8px 14px;
  border: 1px solid #665188;
  border-radius: 10px;
  background: #30283b;
  box-shadow: none;
  color: #f2eaff;
  font-size: 11px;
}
body.dashboard-page #projects .library-new-project:hover { border-color: var(--projects-accent); background: #403351; transform: none; }
body.dashboard-page #projects .library-summary { gap: 12px; margin-bottom: 16px; }
body.dashboard-page #projects .library-summary > button {
  min-height: 96px;
  padding: 15px 17px;
  border: 1px solid var(--projects-line);
  border-radius: 16px;
  background: var(--projects-surface);
  box-shadow: none;
  color: var(--projects-text);
}
body.dashboard-page #projects .library-summary > button:is(:hover,.active) {
  border-color: #665188;
  background: var(--projects-raised);
  box-shadow: none;
  transform: none;
}
body.dashboard-page #projects .library-summary > button.active { box-shadow: inset -2px 0 var(--projects-accent); }
body.dashboard-page #projects .summary-icon,
body.dashboard-page #projects .summary-icon:is(.all,.ready,.pending) {
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--projects-accent);
  font-size: 21px;
}
body.dashboard-page #projects .library-summary strong { font-size: 22px; }
body.dashboard-page #projects .library-summary small { color: var(--projects-muted); font-size: 11px; }
body.dashboard-page #projects .library-grid { gap: 16px; }
body.dashboard-page #projects .library-card .card-state-row { justify-content: space-between; gap: 8px; min-height: 34px; }
body.dashboard-page #projects .library-card .card-state-row .community-publish-button {
  display: inline-flex; align-items: center; justify-content: center; gap: 5px;
  width: auto; height: 31px; min-height: 31px; padding: 0 9px;
  border: 1px solid #5f5274; border-radius: 8px; background: transparent;
  color: #c9b5e7; font-size: 10px; line-height: 1;
}
body.dashboard-page #projects .library-card .card-state-row .community-publish-button svg { width: 16px; height: 16px; }
body.dashboard-page #projects .library-card .card-state-row .community-publish-button:hover { background: #a88be512; color: #eadcfb; }
@media (max-width:760px) {
  body.dashboard-page #projects .library-card .card-footer { align-items: start; }
  body.dashboard-page #projects .library-card .card-secondary-actions { flex-wrap: wrap; justify-content: flex-end; min-width: 0; }
}
body.dashboard-page #projects .library-card,
body.dashboard-page #projects .library-card[data-color] {
  min-height: 370px;
  border: 1px solid var(--projects-line);
  border-radius: 18px;
  background: var(--projects-surface);
  box-shadow: none;
  transition: border-color .18s ease,background-color .18s ease;
}
body.dashboard-page #projects .library-card:is(:hover,:focus-within) {
  border-color: #665188;
  background: var(--projects-raised);
  box-shadow: none;
  transform: none;
}
body.dashboard-page #projects .library-card-image {
  width: 100%;
  padding: 0;
  color: inherit;
  font: inherit;
  cursor: pointer;
  min-height: 170px;
  border: 1px solid var(--projects-line);
  border-radius: 13px;
  background: #292929;
  box-shadow: none;
}
body.dashboard-page #projects .library-card-image:is(:hover,:focus-visible) { border-color: #8c70bb; }
body.dashboard-page #projects .library-card-image:focus-visible { outline: 2px solid #b99ae9; outline-offset: 3px; }
body.dashboard-page #projects .library-card-image .library-cover { border-radius: 12px; box-shadow: none; }
body.dashboard-page #projects .library-card-placeholder { color: var(--projects-accent); }
body.dashboard-page #projects .library-card .library-type,
body.dashboard-page #projects .library-card .library-type.text { color: #cfbaf7; }
body.dashboard-page #projects .library-card .library-branding-tag { color: #cfbaf7; }
body.dashboard-page #projects .library-card time { color: var(--projects-muted); }
body.dashboard-page #projects .library-card h3 { color: var(--projects-text); font-size: 17px; }
body.dashboard-page #projects .library-card .card-description { color: var(--projects-muted); font-size: 11px; }
body.dashboard-page #projects .library-card .library-detail {
  border: 1px solid var(--projects-line);
  border-radius: 9px;
  background: var(--projects-raised);
  box-shadow: none;
}
body.dashboard-page #projects .library-card .library-detail small { color: var(--projects-muted); }
body.dashboard-page #projects .library-card .library-detail strong { color: var(--projects-text); }
body.dashboard-page #projects .library-card .card-progress { border-color: var(--projects-line); background: var(--projects-raised); }
body.dashboard-page #projects .library-card .card-progress > i { background: #39373d; }
body.dashboard-page #projects .library-card .card-progress > i b { background: var(--projects-accent); }
body.dashboard-page #projects .library-card .card-footer { border-top-color: var(--projects-line); }
body.dashboard-page #projects .library-card .card-icon-button,
body.dashboard-page #projects .library-card .community-publish-button {
  border: 1px solid transparent;
  border-radius: 9px;
  background: transparent;
  box-shadow: none;
  color: #bcb7c5;
}
body.dashboard-page #projects .library-card .card-icon-button:is(:hover,:focus-visible),
body.dashboard-page #projects .library-card .community-publish-button:is(:hover,:focus-visible) {
  border-color: #665188;
  background: #30283b;
  box-shadow: none;
  color: #f2eaff;
  transform: none;
}
body.dashboard-page #projects .library-card .card-listen {
  width: 48px;
  height: 48px;
  border: 1px solid #665188;
  border-radius: 12px;
  background: #30283b;
  box-shadow: none;
  color: #f2eaff;
}
body.dashboard-page #projects .library-card .card-listen:hover { border-color: var(--projects-accent); background: #403351; box-shadow: none; }
body.dashboard-page #projects :is(.library-empty-state,.library-no-results) {
  border-color: var(--projects-line);
  background: var(--projects-surface);
  box-shadow: none;
  color: var(--projects-muted);
}
body.dashboard-page #projects .library-empty-state::before { content: none; }
body.dashboard-page #projects :is(.empty-icon,.no-result-icon) { border: 0; background: transparent; color: var(--projects-accent); box-shadow: none; }
body.dashboard-page #projects :is(.library-new-project,.library-summary > button,.library-card button):focus-visible { outline: 2px solid var(--projects-accent); outline-offset: 2px; }

/* Project preview belongs to the same surface family as the cards. */
body.dashboard-page .media-modal .media-dialog,
body.dashboard-page .media-modal :is(.media-player,.media-text-wrap,.media-content-grid .media-player,.media-content-grid .media-text-wrap) {
  border-color: var(--dash-charcoal-line, #393939);
  background: var(--dash-charcoal, #202020);
  box-shadow: none;
}
body.dashboard-page .media-modal :is(.media-dialog-header,.media-text-wrap .text-toolbar) { border-color: var(--dash-charcoal-line, #393939); background: transparent; }
body.dashboard-page .media-modal :is(.media-cover-wrap,.media-wave,.media-text) { border-color: var(--dash-charcoal-line, #393939); background: #171717; }
body.dashboard-page .media-modal :is(.media-action,.media-close) { border-color: var(--dash-charcoal-line, #393939); background: #262626; box-shadow: none; }
body.dashboard-page .media-modal .media-action-primary { border-color: #665188; background: #30283b; color: #f2eaff; }
body.dashboard-page .media-modal .media-action-primary:hover { border-color: #a987ef; background: #403351; }
@media (max-width: 760px) {
  body.dashboard-page #projects .library-toolbar { align-items: stretch; flex-direction: column; gap: 16px; min-height: 0; padding: 19px; }
  body.dashboard-page #projects .library-summary { gap: 8px; }
  body.dashboard-page #projects .library-summary > button { min-height: 98px; padding: 12px 7px; }
  body.dashboard-page #projects .library-summary strong { font-size: 19px; }
  body.dashboard-page #projects .library-summary small { font-size: 9px; }
  body.dashboard-page #projects .library-card-image { min-height: 150px; }
}
@media (prefers-reduced-motion: reduce) {
  body.dashboard-page #projects .library-card { transition: none; }
}