/* Shared accents give actions and content types a consistent visual identity.
   Article prose and editable writing retain the selected reading palette. */
:root {
  --accent-blue: #0369a1;
  --accent-violet: #6d28d9;
  --accent-teal: #0f665e;
  --accent-amber: #92400e;
  --accent-rose: #be123c;
  --accent-red: #dc2626;
  --accent-action-ink: #ffffff;
}
:root[data-palette="sepia"] { --accent-blue: #075985; }
:root[data-theme="dark"] {
  --accent-blue: #67e8f9;
  --accent-violet: #c4b5fd;
  --accent-teal: #5eead4;
  --accent-amber: #fbbf24;
  --accent-rose: #fda4af;
  --accent-red: #ff6b6b;
  --accent-action-ink: #142230;
}

/* Navigation keeps the primary action clear, with separate cues for saved work. */
.site-header .desktop-nav a { color: var(--accent-blue); }
.site-header .desktop-nav a[href="/authors"],
.site-header .desktop-nav a[href="/series"] { color: var(--accent-violet); }
.site-header .desktop-nav a.active { background: color-mix(in srgb, currentColor 9%, var(--white)); }
.site-header .header-actions [data-action="search"],
.site-header .header-actions .login-button { color: var(--accent-blue); }
.site-header .header-actions a[href="/library"] { color: var(--accent-amber); }
.site-header .header-actions .write-button {
  color: var(--accent-action-ink);
  background: var(--accent-blue);
  border-color: var(--accent-blue);
}
.site-header .header-actions .write-button:hover {
  color: var(--accent-action-ink);
  background: color-mix(in srgb, var(--accent-blue) 88%, var(--ink));
  border-color: var(--accent-blue);
}
.mobile-nav > :is(a, button) { --nav-accent: var(--accent-blue); }
.mobile-nav > a[href="/library"] { --nav-accent: var(--accent-amber); }
.mobile-nav > a[href="/write"],
.mobile-nav > [data-action="mobile-menu"] { --nav-accent: var(--accent-violet); }
.mobile-nav > :is(a, button) > .icon { color: var(--nav-accent); }
.mobile-nav > [aria-current="page"], .mobile-nav > button.active {
  color: var(--nav-accent);
}
.mobile-nav > :is([aria-current="page"], button.active) > span {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}

/* Category colours are shared by the filter label and its post badge. */
.category-nav > a, [data-category] { --category-accent: var(--accent-blue); }
.category-nav > a[href^="/tamil-poems"], [data-category="கவிதை"] { --category-accent: var(--accent-rose); }
.category-nav > a[href^="/tamil-essays"], [data-category="கட்டுரை"] { --category-accent: var(--accent-teal); }
.category-nav > a[href^="/tamil-personal-blogs"], [data-category="அனுபவம்"] { --category-accent: var(--accent-amber); }
.category-nav > a[href^="/tamil-book-reviews"], [data-category="புத்தக விமர்சனம்"] { --category-accent: var(--accent-violet); }
.category-nav > a[href^="/tamil-travel-blogs"], [data-category="பயணம்"] { --category-accent: var(--accent-teal); }
.category-nav > a { color: var(--category-accent); }
.category-nav > a:is(.selected, [aria-current="page"]) {
  color: var(--category-accent);
  background: color-mix(in srgb, var(--category-accent) 10%, var(--white));
  box-shadow: inset 0 -2px var(--category-accent);
}
.category-label {
  color: var(--category-accent, var(--accent-blue));
  background: color-mix(in srgb, var(--category-accent, var(--accent-blue)) 9%, var(--white));
}
.card-top .card-title, .card-top .card-title :is(h2, h3),
.trending-list .trending-title, .discovery-item-copy :is(h2, h4) a,
.series-summary-content h2 a, .related-post-content h3 { color: var(--accent-blue); }
.card-top .card-title:hover, .trending-list .trending-title:hover,
.discovery-item-copy :is(h2, h4) a:hover, .series-summary-content h2 a:hover {
  text-decoration: underline; text-underline-offset: 4px;
}
.card-bottom .card-author, .trending-list .trending-author,
.discovery-item-copy .discovery-author { color: var(--accent-violet); }
.card-bottom .card-keyword, .article-tags a { color: var(--accent-teal); }
.card-bottom .card-stat .icon[data-icon="heart"] { color: var(--accent-red); }
.card-bottom .card-stat .icon[data-icon="message-circle"] { color: var(--accent-blue); }
.card-bottom .card-stat .icon[data-icon="eye"] { color: var(--accent-teal); }
.card-actions .bookmark-button { color: var(--accent-amber); }
.card-actions .bookmark-button.selected {
  color: var(--accent-amber);
  background: color-mix(in srgb, var(--accent-amber) 12%, var(--white));
}

/* Short reads, ongoing series, and completed work are easy to distinguish. */
.discovery-shelf, .discovery-tabs > a { --discovery-accent: var(--accent-amber); }
.discovery-shelf[data-discovery-kind="new-series"],
.discovery-tabs > a[href*="kind=new-series"] { --discovery-accent: var(--accent-violet); }
.discovery-shelf[data-discovery-kind="completed-series"],
.discovery-tabs > a[href*="kind=completed-series"] { --discovery-accent: var(--accent-teal); }
.discovery-shelf > h3 { color: var(--discovery-accent); }
.discovery-tabs > a { color: var(--discovery-accent); }
.discovery-tabs > a[aria-current="page"] {
  color: var(--discovery-accent);
  background: color-mix(in srgb, var(--discovery-accent) 10%, var(--white));
  border-color: var(--discovery-accent);
}
.trending-section > h3 .icon { color: var(--accent-amber); }
.trending-section > h3 .icon[data-icon="user"] { color: var(--accent-violet); }
.trending-list .trending-rank {
  color: var(--accent-amber);
  background: color-mix(in srgb, var(--accent-amber) 10%, var(--white));
}
.series-cover-placeholder { color: var(--accent-violet); background: color-mix(in srgb, var(--accent-violet) 8%, var(--white)); }
.series-state { color: var(--accent-violet); background: color-mix(in srgb, var(--accent-violet) 9%, var(--white)); }
.series-state.is-complete { color: var(--accent-teal); background: color-mix(in srgb, var(--accent-teal) 9%, var(--white)); }

/* Community and trust cues have restrained, consistent colour. */
.community-intro .eyebrow, .publication-heading .eyebrow { color: var(--accent-teal); }
.community-assurances > a { --assurance-accent: var(--accent-teal); }
.community-assurances > a[href="/terms"] { --assurance-accent: var(--accent-violet); }
.community-assurances > a[href="/privacy"] { --assurance-accent: var(--accent-blue); }
.community-assurances .assurance-icon {
  color: var(--assurance-accent);
  background: color-mix(in srgb, var(--assurance-accent) 9%, var(--white));
}
.community-assurances > a strong, .community-assurances > a:hover strong { color: var(--assurance-accent); }
.publication-step-number { color: var(--accent-blue); }
.publication-steps li:nth-child(2) .publication-step-number { color: var(--accent-violet); }
.publication-steps li:nth-child(3) .publication-step-number { color: var(--accent-teal); }
.about-shortcuts a { --shortcut-accent: var(--accent-blue); color: var(--shortcut-accent); }
.about-shortcuts a[href="/editors"] { --shortcut-accent: var(--accent-violet); }
.about-shortcuts a[href="#guidelines"] { --shortcut-accent: var(--accent-teal); }
.about-shortcuts a > .icon:first-child { color: var(--shortcut-accent); }
.author-card h2 a, .author-card h3 a, .editor-role { color: var(--accent-violet); }
.author-stats dt .icon[data-icon="book"] { color: var(--accent-violet); }
.author-stats dt .icon[data-icon="arrow-up"] { color: var(--accent-teal); }
.footer-assurance > .icon { color: var(--accent-teal); }
.footer-assurance > a, .footer-contact { color: var(--accent-blue); }
.footer-link-group[aria-label="வாசிக்க"] h2 { color: var(--accent-blue); }
.footer-link-group[aria-label="தளம்"] h2 { color: var(--accent-violet); }
.footer-link-group[aria-label="உதவி"] h2 { color: var(--accent-teal); }

/* Reading controls remain separate from authors' text and formatting tools. */
.reading-actions [data-action="bookmark"] { color: var(--accent-amber); }
.reading-actions [data-action="bookmark"].selected {
  color: var(--accent-amber); background: color-mix(in srgb, var(--accent-amber) 12%, var(--white));
}
.reading-actions [data-action="share"] { color: var(--accent-blue); }
.article-author-identity h3 a { color: var(--accent-violet); }
.article-author-posts, .related-posts-panel > .section-heading a { color: var(--accent-blue); }
.writer-follow-actions .button.secondary { color: var(--accent-violet); }
.writer-follow-actions .button.secondary[aria-pressed="true"] { background: color-mix(in srgb, var(--accent-violet) 10%, var(--white)); }
.writer-follow-actions .icon-button { color: var(--accent-amber); }
.reactions .button[data-value="1"] { color: var(--accent-teal); }
.reactions .button[data-value="1"].selected { background: color-mix(in srgb, var(--accent-teal) 12%, var(--white)); }
.article-series-read .series-read-toggle[aria-pressed="true"] { color: var(--accent-teal); }
.quiet-link, .publication-heading > a, .publication-actions > a:last-child,
.category-reading-links a, .about-page .prose a, .policy-page .prose a { color: var(--accent-blue); }
.about-page .prose a, .policy-page .prose a { text-decoration: underline; text-underline-offset: 3px; }

/* Phones use colour on compact navigation and existing icon shapes, without
   adding another row, decoration, or padding to the task at hand. */
@media (max-width: 760px) {
  .mobile-nav > .mobile-write { color: var(--accent-violet); }
  .mobile-nav > .mobile-write > .icon { color: inherit; }
  .category-nav > a:is(.selected, [aria-current="page"]) { box-shadow: inset 0 -2px var(--category-accent); }
}
@media (forced-colors: active) {
  .category-nav > a:is(.selected, [aria-current="page"]), .mobile-nav > [aria-current="page"],
  .discovery-tabs > a[aria-current="page"] { outline: 2px solid Highlight; outline-offset: -2px; }
}
