/* -------------------------------------------------------------------------- */
/* Universal (AA/AAA-leaning) winter palette                                  */
/* -------------------------------------------------------------------------- */

:root {
  /* Light / colorful baseline: soft blue winter canvas */
  --color-bg: #f4f7fb;          /* page background */
  --color-entry: #ffffff;       /* cards, posts */
  --color-fg: #111827;          /* primary text */
  --color-muted: #4b5563;       /* secondary text */
  --color-border: #cbd5e1;      /* borders, outlines */
  --color-code-bg: #e2e8f0;     /* code blocks */
  --color-hljs-bg: #0b1020;     /* syntax highlight background (dark) */
  --color-accent: #1d3a8a;      /* primary accent (links/buttons) */
  --color-accent-contrast: #ffffff;
  --color-accent2: #0f766e;     /* secondary accent (tags/pills) */
  --color-accent2-contrast: #ffffff;
  --color-success: #166534;
  --color-error: #b91c1c;
  --color-focus: #f97316;       /* focus rings, highlights */
  --color-focus-contrast: #0b1020;
}

/* -------------------------------------------------------------------------- */
/* Circus palette: stripe colors (purple, green, yellow, red, violet)         */
/* -------------------------------------------------------------------------- */

body[data-theme="circus"],
body.circus {
  /* Calm base for readability */
  --color-bg: #fffdf7;
  --color-entry: #ffffff;
  --color-fg: #111827;
  --color-muted: #4b5563;
  --color-border: #e5e7eb;

  /* Inline / block code */
  --color-code-bg: #fef9c3;     /* soft yellow */
  --color-hljs-bg: #020617;     /* very dark blue */

  /* Stripe-inspired accents */
  --color-accent: #ef4444;      /* bright red */
  --color-accent-contrast: #ffffff;
  --color-accent2: #4f46e5;     /* purple/blue */
  --color-accent2-contrast: #ffffff;

  --color-success: #16a34a;     /* green */
  --color-error: #b91c1c;

  --color-focus: #eab308;       /* warm golden focus */
  --color-focus-contrast: #111827;
}

body {
  --theme: var(--color-bg);
  --entry: var(--color-entry);
  --primary: var(--color-fg);
  --secondary: var(--color-muted);
  --tertiary: var(--color-border);
  --content: var(--color-fg);
  --hljs-bg: var(--color-hljs-bg);
  --code-bg: var(--color-code-bg);
  --border: var(--color-border);
  --accent-1: var(--color-accent);
  --accent-1-contrast: var(--color-accent-contrast);
  --accent-2: var(--color-accent2);
  --accent-2-contrast: var(--color-accent2-contrast);
  --accent-hover: var(--color-focus);
  --accent-hover-contrast: var(--color-focus-contrast);
  --accent-error: var(--color-error);
  --accent-success: var(--color-success);
  --neutral: var(--color-muted);
}

body[data-theme="dark"],
body.dark {
  --color-bg: #020617;
  --color-entry: #020617;
  --color-fg: #e5e7eb;
  --color-muted: #9ca3af;
  --color-border: #1f2937;
  --color-code-bg: #020617;
  --color-hljs-bg: #020617;
  --color-accent: #38bdf8;
  --color-accent-contrast: #020617;
  --color-accent2: #22c55e;
  --color-accent2-contrast: #020617;
  --color-success: #22c55e;
  --color-error: #f97373;
  --color-focus: #facc15;
  --color-focus-contrast: #020617;
}

body[data-theme="mono"],
body.monochrome {
  --color-bg: #FFFFFF;
  --color-entry: #FFFFFF;
  --color-fg: #000000;
  --color-muted: #2B2B2B;
  --color-border: #000000;
  --color-code-bg: #000000;
  --color-hljs-bg: #000000;
  --color-accent: #111111;
  --color-accent-contrast: #FFFFFF;
  --color-accent2: #000000;
  --color-accent2-contrast: #FFFFFF;
  --color-success: #000000;
  --color-error: #000000;
  --color-focus: #000000;
  --color-focus-contrast: #FFFFFF;
}

body[data-theme="seasonal"],
body.seasonal {
  /* Winter seasonal: white/blue variation on the universal palette */
  --color-bg: #eef4fb;
  --color-entry: #ffffff;
  --color-fg: #0f172a;
  --color-muted: #475569;
  --color-border: #cbd5e1;
  --color-code-bg: #e2e8f0;
  --color-hljs-bg: #020617;
  --color-accent: #1d4ed8;
  --color-accent-contrast: #ffffff;
  --color-accent2: #0284c7;
  --color-accent2-contrast: #0b1020;
  --color-success: #15803d;
  --color-error: #b91c1c;
  --color-focus: #f97316;
  --color-focus-contrast: #0b1020;
}

.skip-link {
  position: absolute;
  left: -9999px;
  top: 8px;
  padding: 10px 14px;
  background: var(--accent-1);
  color: var(--accent-1-contrast);
  border-radius: 8px;
  z-index: 2000;
  text-decoration: none;
}

.skip-link:focus,
.skip-link:focus-visible {
  left: 12px;
  display: inline-block;
  box-shadow: 0 0 0 3px var(--color-focus);
}

body {
  background-color: var(--theme);
  color: var(--primary);
}

/* Ensure main layout uses the light Harmony background, regardless of
 * any legacy dark styles from the base theme. */
body,
.list {
  background-color: var(--color-bg) !important;
  color: var(--color-fg) !important;
}

a {
  color: var(--accent-1);
  text-decoration-thickness: 1.5px;
  text-underline-offset: 0.18em;
}

#menu a,
.logo a,
.footer a {
  color: var(--primary);
  text-decoration: none;
}

body.dark #menu a,
body.dark .logo a,
body.dark .footer a,
body.monochrome #menu a,
body.monochrome .logo a,
body.monochrome .footer a {
  color: var(--primary);
}

.command-toggle {
  margin-right: 12px;
  padding: 6px 14px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: transparent;
  color: var(--primary);
  font-size: 0.9rem;
  line-height: 1;
}

.command-toggle:hover,
.command-toggle:focus {
  background: var(--accent-1);
  color: var(--accent-1-contrast);
  border-color: var(--accent-1);
}

.command-toggle:focus-visible {
  background: var(--accent-1);
  color: var(--accent-1-contrast);
}

body[data-theme="mono"] .header,
body.monochrome .header,
body[data-theme="mono"] .nav,
body.monochrome .nav {
  background: #000000;
  color: #FFFFFF;
}

body[data-theme="mono"] .logo a,
body.monochrome .logo a {
  color: #FFFFFF !important;
}

body[data-theme="mono"] .nav--custom #menu,
body.monochrome .nav--custom #menu {
  background: #ffffff;
  color: #000000;
  border-color: #000000;
}
body[data-theme="mono"] .nav--custom #menu a,
body[data-theme="mono"] .nav--custom #menu button,
body.monochrome .nav--custom #menu a,
body.monochrome .nav--custom #menu button {
  color: #000000 !important;
}
body[data-theme="mono"] .nav--custom #menu a:hover,
body[data-theme="mono"] .nav--custom #menu a:focus,
body.monochrome .nav--custom #menu a:hover,
body.monochrome .nav--custom #menu a:focus {
  color: #111111 !important;
}
body[data-theme="mono"] .nav--custom #menu .menu-item--command .command-toggle,
body.monochrome .nav--custom #menu .menu-item--command .command-toggle {
  background: #f3f3f3;
  border-color: #000000;
  color: #000000 !important;
}

body[data-theme="mono"] .home-info,
body.monochrome .home-info,
body[data-theme="mono"] .home-info .entry-content,
body.monochrome .home-info .entry-content {
  color: #000000;
}

a:hover,
a:focus {
  color: var(--accent-hover);
  text-decoration: underline;
}

a:focus-visible {
  outline: 3px solid var(--color-focus);
  outline-offset: 3px;
}

.entry-content a,
.post-content a,
.post-footer a,
.post-meta a,
.breadcrumbs a {
  color: var(--accent-1);
}

body.dark .entry-content a,
body.dark .post-content a,
body.dark .post-footer a,
body.dark .post-meta a,
body.dark .breadcrumbs a,
body.monochrome .entry-content a,
body.monochrome .post-content a,
body.monochrome .post-footer a,
body.monochrome .post-meta a,
body.monochrome .breadcrumbs a {
  color: var(--accent-1);
}

.entry-content a:hover,
.post-content a:hover,
.post-footer a:hover,
.post-meta a:hover,
.breadcrumbs a:hover,
.entry-content a:focus,
.post-content a:focus,
.post-footer a:focus,
.post-meta a:focus,
.breadcrumbs a:focus {
  color: var(--accent-hover);
}

#menu .active {
  border-bottom-color: var(--accent-1);
}

.post-entry,
.post-tags a,
.share-buttons,
.paginav {
  border-color: rgba(0, 0, 0, 0.04);
  background: var(--entry);
  border-radius: 10px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.05);
}

.post-tags a {
  color: var(--accent-1);
  background: var(--code-bg);
}

.post-entry--favorite,
.post-single--favorite {
  border-color: var(--favorite-accent, #f6b93b);
  box-shadow: 0 16px 32px rgba(0, 0, 0, 0.18);
  position: relative;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.post-entry--favorite:hover,
.post-entry--favorite:focus-within {
  transform: translateY(-4px);
  box-shadow: 0 22px 44px rgba(0, 0, 0, 0.22);
}

.favorite-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.15em;
  margin-right: 0.4em;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.35));
}

.favorite-label {
  display: inline-block;
  margin-left: 0.6rem;
  padding: 0.1rem 0.4rem;
  border-radius: 999px;
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--favorite-accent, #f6b93b);
  background: rgba(246, 185, 59, 0.12);
}

.post-single--favorite {
  border: 2px solid var(--favorite-accent, #f6b93b);
  border-radius: 20px;
  box-shadow: 0 28px 52px rgba(0, 0, 0, 0.22);
  padding: 32px;
}

.post-single--favorite .favorite-badge {
  font-size: 1.25em;
}

.favorite-ribbon {
  margin-top: 1rem;
  display: inline-block;
  padding: 0.3rem 0.6rem;
  border-radius: 6px;
  font-size: 0.75rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  background: rgba(246, 185, 59, 0.14);
  color: var(--favorite-accent, #f6b93b);
}

.post-tags a:hover,
.post-tags a:focus,
.paginav a:hover,
.paginav a:focus {
  background: var(--accent-2);
  color: var(--accent-2-contrast);
}

.pagination a,
.paginav a {
  background: var(--accent-1);
  color: var(--accent-1-contrast);
}

body[data-theme="mono"] .pagination a,
body[data-theme="mono"] .paginav a,
body.monochrome .pagination a,
body.monochrome .paginav a {
  color: #FFFFFF;
}

body[data-theme="mono"] .page-header,
body[data-theme="mono"] .page-header *,
body.monochrome .page-header,
body.monochrome .page-header * {
  color: #FFFFFF !important;
}

button,
input[type="button"],
input[type="submit"] {
  border-radius: var(--radius);
  background: var(--accent-1);
  color: var(--accent-1-contrast);
  padding: 6px 16px;
}

button:hover,
button:focus,
input[type="button"]:hover,
input[type="button"]:focus,
input[type="submit"]:hover,
input[type="submit"]:focus {
  background: var(--accent-hover);
  color: var(--accent-hover-contrast);
}

button:focus-visible,
input[type="button"]:focus-visible,
input[type="submit"]:focus-visible,
.command-toggle:focus-visible,
#theme-toggle:focus-visible,
.paginav a:focus-visible,
.pagination a:focus-visible,
.post-tags a:focus-visible,
.command-palette__close:focus-visible,
.command-palette__results a:focus-visible,
.site-gate__fallback:focus-visible {
  outline: 3px solid var(--color-focus);
  outline-offset: 3px;
}

blockquote {
  border-left: 4px solid var(--accent-1);
  padding-left: 1rem;
  font-style: italic;
}

hr,
.table th,
.table td {
  border-color: var(--border);
}

pre {
  background: var(--code-bg);
  color: var(--content);
}

/* Inline code: readable pill on light or dark backgrounds */

.post-content code {
  font-size: 0.95em;
  padding: 0.1em 0.4em;
  border-radius: 0.25rem;
  background: #e0e7ff;
  color: #111827;
  box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.12);
}

.post-content pre code,
.post-content .highlight code {
  background: transparent;
  color: inherit;
  padding: 0;
  box-shadow: none;
}

.alert,
.notice--warning {
  border-left: 4px solid var(--accent-error);
}

.notice--success {
  border-left: 4px solid var(--accent-success);
}

::selection,
::-moz-selection {
  background: var(--accent-1);
  color: var(--accent-1-contrast);
}

#searchbox input {
  border: 1px solid var(--border);
  color: var(--primary);
  background: var(--entry);
}

#searchbox input:focus {
  border-color: var(--accent-hover);
  box-shadow: 0 0 0 3px rgba(255, 153, 0, 0.35);
}

.top-link {
  border: 2px solid var(--accent-1);
  color: var(--accent-1);
  background: var(--entry);
}

.top-link:focus,
.top-link:hover {
  border-color: var(--accent-hover);
  color: var(--accent-hover);
}

.footer {
  border-top: 1px solid var(--border);
}

.footer a:hover {
  color: var(--accent-hover);
}

.notice--info {
  border-left: 4px solid var(--accent-2);
}

.monochrome pre,
.monochrome code,
body[data-theme="mono"] pre,
body[data-theme="mono"] code {
  color: #FFFFFF;
}

.monochrome .highlight,
body[data-theme="mono"] .highlight {
  color: #FFFFFF;
}

body[data-theme="seasonal"] pre,
body.seasonal pre {
  color: inherit;
}

body[data-theme="seasonal"] .highlight,
body.seasonal .highlight {
  color: #FCF2E3;
}

body[data-theme="mono"] .toc,
body.monochrome .toc {
  background: #000000;
  color: #FFFFFF;
  border-color: #FFFFFF;
}

body[data-theme="mono"] .toc a,
body.monochrome .toc a,
body[data-theme="mono"] .toc summary,
body.monochrome .toc summary,
body[data-theme="mono"] .toc summary span,
body.monochrome .toc summary span {
  color: #FFFFFF;
}

body[data-theme="mono"] .toc summary svg,
body.monochrome .toc summary svg {
  stroke: #FFFFFF;
}

body[data-theme="mono"] .footer,
body.monochrome .footer {
  background: #000000;
  color: #FFFFFF;
  border-top-color: #FFFFFF;
}

body[data-theme="mono"] .footer a,
body.monochrome .footer a {
  color: #FFFFFF;
}

body[data-theme="mono"] .footer a:hover,
body.monochrome .footer a:hover {
  color: #CCCCCC;
}

body[data-theme="mono"] .post-tags,
body.monochrome .post-tags,
body[data-theme="mono"] .post-tags a,
body.monochrome .post-tags a {
  color: #000000;
  background: #FFFFFF;
}

body[data-theme="mono"] .post-tags a:hover,
body.monochrome .post-tags a:hover,
body[data-theme="mono"] .post-tags a:focus,
body.monochrome .post-tags a:focus {
  background: #000000;
  color: #FFFFFF;
}

body[data-theme="seasonal"] .header,
body.seasonal .header {
  background:
    radial-gradient(circle at 0% 0%, #0b1120 0%, transparent 55%),
    radial-gradient(circle at 100% 0%, #020617 0%, transparent 55%),
    linear-gradient(135deg, #020617 0%, #020617 100%);
  color: #e5e7eb;
  border-bottom: 1px solid rgba(15, 23, 42, 0.85);
}

body[data-theme="seasonal"] .nav,
body.seasonal .nav {
  align-items: center;
}

body[data-theme="seasonal"] .logo a,
body.seasonal .logo a,
body[data-theme="seasonal"] #menu a,
body.seasonal #menu a {
  color: #e5e7eb;
}

body[data-theme="seasonal"] #menu a:hover,
body.seasonal #menu a:hover,
body[data-theme="seasonal"] #menu a:focus,
body.seasonal #menu a:focus {
  color: #38bdf8 !important;
}

body[data-theme="seasonal"] #menu .active,
body.seasonal #menu .active {
  color: #38bdf8 !important;
  border-bottom-color: #38bdf8;
}

body[data-theme="seasonal"] .logo a:hover,
body[data-theme="seasonal"] .logo a:focus,
body.seasonal .logo a:hover,
body.seasonal .logo a:focus {
  color: #38bdf8;
}

body[data-theme="seasonal"] #theme-toggle,
body.seasonal #theme-toggle {
  color: #38bdf8;
  border: 1px solid rgba(148, 163, 184, 0.75);
  background: transparent;
  box-shadow: none;
}

body[data-theme="seasonal"] #theme-toggle:hover,
body[data-theme="seasonal"] #theme-toggle:focus,
body.seasonal #theme-toggle:hover,
body.seasonal #theme-toggle:focus {
  color: #0b1020;
  background: #38bdf8;
  border-color: #38bdf8;
}

body[data-theme="seasonal"] a,
body.seasonal a {
  text-decoration-color: #38bdf8;
}

body[data-theme="seasonal"] a:hover,
body[data-theme="seasonal"] a:focus,
body.seasonal a:hover,
body.seasonal a:focus {
  text-decoration-color: #f97316;
}

body[data-theme="seasonal"] .post-entry,
body.seasonal .post-entry {
  border: 1px solid rgba(15, 23, 42, 0.35);
  box-shadow: 0 16px 32px rgba(15, 23, 42, 0.18);
  background: var(--color-entry);
  color: var(--color-fg);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

body[data-theme="seasonal"] .post-entry:hover,
body[data-theme="seasonal"] .post-entry:focus-within,
body.seasonal .post-entry:hover,
body.seasonal .post-entry:focus-within {
  transform: translateY(-3px);
  box-shadow: 0 24px 48px rgba(15, 23, 42, 0.7);
}

body[data-theme="seasonal"] .home-info,
body.seasonal .home-info {
  background: #020b1f;
  color: #e5e7eb;
  border: 1px solid rgba(15, 23, 42, 0.85);
  border-left: 4px solid #38bdf8;
  box-shadow: 0 22px 48px rgba(15, 23, 42, 0.85);
  text-align: left;
  max-width: 840px;
  margin: 32px auto;
  padding: 32px;
  border-radius: 18px;
}

body[data-theme="seasonal"] .home-info a,
body.seasonal .home-info a {
  color: #e5e7eb;
}

body[data-theme="seasonal"] .home-info a:hover,
body.seasonal .home-info a:hover,
body[data-theme="seasonal"] .home-info a:focus,
body.seasonal .home-info a:focus {
  color: #38bdf8;
  text-decoration-color: #38bdf8;
}

body[data-theme="seasonal"] .home-info .entry-content,
body.seasonal .home-info .entry-content {
  color: #e5e7eb;
}

body[data-theme="seasonal"] .home-info--projects,
body.seasonal .home-info--projects {
  background: #041225;
  color: #f8fafc;
  border-color: rgba(34, 197, 94, 0.5);
  border-left: 5px solid #22c55e;
  box-shadow: 0 26px 56px rgba(0, 0, 0, 0.55);
}

body[data-theme="seasonal"] .home-info--projects .entry-header h2,
body.seasonal .home-info--projects .entry-header h2 {
  color: #bbf7d0;
}

body[data-theme="seasonal"] .home-info--projects .entry-content,
body.seasonal .home-info--projects .entry-content {
  color: #e5e7eb;
}

body[data-theme="seasonal"] .home-info--projects a,
body.seasonal .home-info--projects a {
  color: #86efac;
  text-decoration-color: #22c55e;
}

body[data-theme="seasonal"] .home-info--projects a:hover,
body[data-theme="seasonal"] .home-info--projects a:focus,
body.seasonal .home-info--projects a:hover,
body.seasonal .home-info--projects a:focus {
  color: #22c55e;
  text-decoration-color: #bbf7d0;
}

/* Seasonal menu contrast */
body[data-theme="seasonal"] .nav--custom #menu,
body.seasonal .nav--custom #menu {
  background: #ffffff;
  color: #0f172a;
  border-color: rgba(15, 23, 42, 0.12);
}
body[data-theme="seasonal"] .nav--custom #menu a,
body[data-theme="seasonal"] .nav--custom #menu button,
body.seasonal .nav--custom #menu a,
body.seasonal .nav--custom #menu button {
  color: #0f172a;
}
body[data-theme="seasonal"] .nav--custom #menu .menu-item--command .command-toggle,
body.seasonal .nav--custom #menu .menu-item--command .command-toggle {
  background: #e2e8f0;
  border-color: #cbd5e1;
  color: #0f172a;
}

.nav.nav--custom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: nowrap;
  position: relative;
}

.nav--custom .nav-start,
.nav--custom .nav-middle,
.nav--custom .nav-end {
  display: flex;
  align-items: center;
  gap: 12px;
}

.nav--custom .nav-middle--left {
  flex: 1 1 auto;
  justify-content: flex-start;
}

.nav--custom .nav-middle {
  flex: 2 1 auto;
  justify-content: center;
}

.nav--custom #menu {
  margin: 0;
  display: none;
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  padding: 10px 12px;
  background: var(--entry);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.18);
  min-width: 200px;
  z-index: 10;
  color: var(--primary);
}

.nav--custom .nav-end {
  margin-left: auto;
  gap: 8px;
}

.menu-toggle {
  display: inline-flex;
  border-radius: 10px;
  padding: 2px 8px;
  font-size: 1.1rem;
  border: 1px solid var(--border);
  background: var(--entry);
  color: var(--primary);
  line-height: 1;
}

.nav--custom #menu a,
.nav--custom #menu button {
  color: var(--primary);
  opacity: 1;
}

.nav--custom #menu .menu-item--command .command-toggle {
  background: var(--code-bg);
  border-color: var(--border);
}

#menu span {
  color: inherit;
  opacity: 1;
  font-weight: 600;
}

.command-toggle {
  padding: 4px 9px;
  font-size: 0.82rem;
  border-radius: 999px;
}

#theme-toggle {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px;
}

.logo-switches {
  gap: 8px;
}

.nav.nav--custom.nav--open #menu {
  display: flex;
}

body[data-theme="seasonal"] button,
body[data-theme="seasonal"] input[type="button"],
body[data-theme="seasonal"] input[type="submit"],
body.seasonal button,
body.seasonal input[type="button"],
body.seasonal input[type="submit"] {
  background: #38bdf8;
  color: #020617;
  border: 1px solid rgba(15, 23, 42, 0.85);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.6);
}

body[data-theme="seasonal"] button:hover,
body[data-theme="seasonal"] button:focus,
body[data-theme="seasonal"] input[type="button"]:hover,
body[data-theme="seasonal"] input[type="button"]:focus,
body[data-theme="seasonal"] input[type="submit"]:hover,
body[data-theme="seasonal"] input[type="submit"]:focus,
body.seasonal button:hover,
body.seasonal button:focus,
body.seasonal input[type="button"]:hover,
body.seasonal input[type="button"]:focus,
body.seasonal input[type="submit"]:hover,
body.seasonal input[type="submit"]:focus {
  background: #0ea5e9;
  color: #020617;
  border-color: #0ea5e9;
}

body[data-theme="seasonal"] .paginav a,
body[data-theme="seasonal"] .pagination a,
body.seasonal .paginav a,
body.seasonal .pagination a {
  background: #1d4ed8;
  color: #ffffff;
  border: 1px solid rgba(15, 23, 42, 0.9);
}

body[data-theme="seasonal"] .paginav a:hover,
body[data-theme="seasonal"] .paginav a:focus,
body.seasonal .paginav a:hover,
body.seasonal .paginav a:focus {
  background: #0ea5e9;
  color: #020617;
}

body[data-theme="seasonal"] blockquote,
body.seasonal blockquote {
  border-left-color: #38bdf8;
  background: rgba(15, 23, 42, 0.75);
  padding-left: 1.25rem;
}

body[data-theme="seasonal"] .toc,
body.seasonal .toc {
  border: 1px solid rgba(15, 23, 42, 0.85);
  background: #020b1f;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.85);
}

body[data-theme="seasonal"] .toc summary,
body.seasonal .toc summary,
body[data-theme="seasonal"] .toc summary span,
body.seasonal .toc summary span {
  color: #e5e7eb;
}

body[data-theme="seasonal"] .toc a,
body.seasonal .toc a {
  color: #e5e7eb;
}

body[data-theme="seasonal"] .toc a:hover,
body[data-theme="seasonal"] .toc a:focus,
body.seasonal .toc a:hover,
body.seasonal .toc a:focus {
  color: #38bdf8;
}

body[data-theme="seasonal"] .footer,
body.seasonal .footer {
  background: #020617;
  color: #e5e7eb;
  border-top: 1px solid rgba(15, 23, 42, 0.95);
}

body[data-theme="seasonal"] .footer a,
body.seasonal .footer a {
  color: #38bdf8;
  text-decoration-color: #38bdf8;
}

body[data-theme="seasonal"] .footer a:hover,
body[data-theme="seasonal"] .footer a:focus,
body.seasonal .footer a:hover,
body.seasonal .footer a:focus {
  color: #e5e7eb;
  text-decoration-color: #e5e7eb;
}

mark {
  background: var(--color-focus);
  color: var(--color-focus-contrast);
  padding: 0 2px;
  border-radius: 3px;
}

/* Harmony reading experience */

.post-content,
.entry-content {
  font-size: 1.02rem;
  line-height: 1.7;
  max-width: 68ch;
  margin-inline: auto;
  font-family: "Georgia", "Iowan Old Style", "Palatino Linotype",
               "Book Antiqua", "Times New Roman", serif;
}

.post-title {
  margin-bottom: 0.3em;
}

.post-meta {
  margin-bottom: 1.25em;
  font-size: 0.9rem;
  color: var(--secondary);
}

.post-content h2,
.post-content h3 {
  margin-top: 2.1em;
  margin-bottom: 0.6em;
}

/* Circus-specific tweaks */

body[data-theme="circus"] .header,
body.circus .header {
  /* Big-top feel: tempered bright stripes across a deep-blue band */
  background:
    linear-gradient(to bottom, rgba(0,0,0,0.25), transparent 45%),
    repeating-linear-gradient(
      90deg,
      #4f46e5 0,
      #4f46e5 60px,
      #16a34a 60px,
      #16a34a 120px,
      #eab308 120px,
      #eab308 180px,
      #ef4444 180px,
      #ef4444 240px,
      #7c3aed 240px,
      #7c3aed 300px
    );
  color: #ffffff;
  border-bottom: 4px solid #eab308;
}

body[data-theme="circus"] .nav,
body.circus .nav {
  align-items: center;
}

body[data-theme="circus"] .logo a,
body.circus .logo a,
body[data-theme="circus"] #menu a,
body.circus #menu a {
  color: #f9fafb;
}

body[data-theme="circus"] #menu a:hover,
body.circus #menu a:hover,
body[data-theme="circus"] #menu a:focus,
body.circus #menu a:focus {
  color: #facc15 !important;
}

body[data-theme="circus"] #menu .active,
body.circus #menu .active {
  color: #e11d22 !important;
  border-bottom-color: #e11d22;
}

body[data-theme="circus"] button,
body[data-theme="circus"] input[type="button"],
body[data-theme="circus"] input[type="submit"],
body.circus button,
body.circus input[type="button"],
body.circus input[type="submit"] {
  background: #ef4444;
  color: #ffffff;
  border: 2px solid #000000;
  box-shadow: 0 3px 0 rgba(0, 0, 0, 0.7);
}

body[data-theme="circus"] button:hover,
body[data-theme="circus"] button:focus,
body[data-theme="circus"] input[type="button"]:hover,
body[data-theme="circus"] input[type="button"]:focus,
body[data-theme="circus"] input[type="submit"]:hover,
body[data-theme="circus"] input[type="submit"]:focus,
body.circus button:hover,
body.circus button:focus,
body.circus input[type="button"]:hover,
body.circus input[type="button"]:focus,
body.circus input[type="submit"]:hover,
body.circus input[type="submit"]:focus {
  background: #facc15;
  color: #111827;
  border-color: #000000;
}

body[data-theme="circus"] a,
body.circus a {
  text-decoration-color: #d00000;
}

body[data-theme="circus"] a:hover,
body[data-theme="circus"] a:focus,
body.circus a:hover,
body.circus a:focus {
  text-decoration-color: #000000;
}

/* Hero entry tweaks */

.home-info {
  margin-top: 32px;
}

@media (min-width: 960px) {
  .home-info {
    margin-top: 24px;
  }
}

.home-info .entry-header h1 {
  font-size: 2.1rem;
  color: var(--color-fg);
}

body[data-theme="seasonal"] .home-info .entry-header h1,
body.seasonal .home-info .entry-header h1 {
  color: #e5e7eb;
}

.home-info--projects {
  border-left: 4px solid var(--color-success);
}

.home-info--projects .entry-header h2 {
  color: var(--color-success);
}

.home-info--projects .entry-content {
  color: var(--color-fg);
}

.home-info--projects a {
  color: var(--color-success);
  text-decoration-color: var(--color-success);
}

.home-info--projects a:hover,
.home-info--projects a:focus {
  color: #16a34a;
  text-decoration-color: #16a34a;
}

.home-info--quote {
  display: flex;
  flex-direction: column;
  gap: 1.1rem;
}

.home-info--quote .entry-content {
  margin-bottom: 0;
}

.home-info--quote .home-quote {
  margin: 0;
  border-left: 4px solid var(--accent-1);
  padding: 0.75rem 1rem;
  color: inherit;
  background: rgba(255, 255, 255, 0.08);
  font-style: italic;
}

.home-info--quote .entry-footer {
  margin-top: auto;
}

body[data-theme="seasonal"] .home-info--quote .home-quote,
body.seasonal .home-info--quote .home-quote {
  border-left-color: #38bdf8;
  background: rgba(56, 189, 248, 0.16);
  color: #e5e7eb;
}

body[data-theme="mono"] .home-info--quote,
body.monochrome .home-info--quote {
  background: #ffffff;
  border: 1px solid #000000;
}

body[data-theme="mono"] .home-info--quote .home-quote,
body.monochrome .home-info--quote .home-quote {
  border-left-color: #000000;
  background: #f3f3f3;
  color: #111111;
}


.command-palette {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1200;
}

.command-palette[hidden] {
  display: none !important;
}

.command-palette__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(19, 17, 15, 0.55);
}

.command-palette__panel {
  position: relative;
  max-width: 640px;
  width: min(640px, 92%);
  background: var(--entry);
  color: var(--primary);
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 24px;
  box-shadow: 0 32px 64px rgba(0, 0, 0, 0.35);
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.command-palette__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.command-palette__header h2 {
  margin: 0;
  font-size: 1.25rem;
}

.command-palette__close {
  background: transparent;
  color: var(--primary);
  border: 1px solid var(--border);
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 0.9rem;
}

.command-palette__close:hover,
.command-palette__close:focus {
  background: var(--accent-1);
  color: var(--accent-1-contrast);
}

.command-palette__body {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.command-palette__label {
  font-size: 0.85rem;
  font-weight: 600;
}

.command-palette__input {
  width: 100%;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--entry);
  color: var(--primary);
  font-size: 1rem;
}

.command-palette__input:focus {
  border-color: var(--accent-hover);
  box-shadow: 0 0 0 3px rgba(255, 153, 0, 0.25);
}

.command-palette__status {
  margin: 0;
  font-size: 0.85rem;
  color: var(--secondary);
}

.command-palette__results {
  margin: 0;
  padding: 0;
  list-style: none;
  max-height: 320px;
  overflow: auto;
  border: 1px solid var(--border);
  border-radius: 12px;
}

.command-palette__result + .command-palette__result {
  border-top: 1px solid var(--border);
}

.command-palette__results a {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px 16px;
  color: var(--primary);
  text-decoration: none;
}

.command-palette__results a.is-active,
.command-palette__results a:hover {
  background: var(--accent-1);
  color: var(--accent-1-contrast);
}

.command-palette__result-title {
  font-weight: 600;
  font-size: 1rem;
}

.command-palette__result-snippet {
  font-size: 0.85rem;
  color: var(--secondary);
}

.command-palette__result-snippet mark {
  background: var(--accent-2);
  color: var(--accent-2-contrast);
}

@media (prefers-reduced-motion: reduce) {
  .skip-link {
    transition: none;
  }
  body[data-theme="seasonal"] .post-entry,
  body.seasonal .post-entry {
    transition: none;
  }
  body[data-theme="seasonal"] .post-entry:hover,
  body[data-theme="seasonal"] .post-entry:focus-within,
  body.seasonal .post-entry:hover,
  body.seasonal .post-entry:focus-within {
    transform: none;
    box-shadow: 0 18px 36px rgba(19, 17, 15, 0.12);
  }
}

.site-gate__instruction {
  margin: 24px 0 16px;
  font-size: 1.1rem;
  font-weight: 600;
}

.site-gate__shapes {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin: 24px 0 40px;
}

.gate-shape {
  --shape-color: #4a90e2;
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 24px;
  border: 6px solid rgba(255, 255, 255, 0.55);
  background: var(--shape-color);
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
  position: relative;
}

.gate-shape::before {
  content: "";
  position: absolute;
  inset: 12%;
  background: inherit;
  border-radius: inherit;
  clip-path: inherit;
}

.gate-shape:hover,
.gate-shape:focus,
.gate-shape:focus-visible {
  transform: translateY(-6px);
  box-shadow: 0 24px 44px rgba(0, 0, 0, 0.35);
  border-color: rgba(255, 255, 255, 0.85);
}

.gate-shape.is-correct {
  box-shadow: 0 0 0 6px rgba(33, 140, 116, 0.6), 0 22px 38px rgba(0, 0, 0, 0.32);
}

.gate-shape.is-disabled {
  opacity: 0.55;
  cursor: default;
  transform: none;
  box-shadow: none;
}

.gate-shape.is-wrong {
  animation: gate-shape-shake 0.35s ease;
}

@keyframes gate-shape-shake {
  0%,
  100% {
    transform: translateX(0);
  }
  20%,
  60% {
    transform: translateX(-10px);
  }
  40%,
  80% {
    transform: translateX(10px);
  }
}

.gate-shape--color-red { --shape-color: #d64541; }
.gate-shape--color-blue { --shape-color: #2d98da; }
.gate-shape--color-green { --shape-color: #218c74; }
.gate-shape--color-gold { --shape-color: #f6b93b; }
.gate-shape--color-purple { --shape-color: #8854d0; }
.gate-shape--color-teal { --shape-color: #0fb9b1; }

.gate-shape--form-square {
  border-radius: 24px;
  clip-path: inset(0);
}

.gate-shape--form-circle {
  border-radius: 50%;
  clip-path: inset(0);
}

.gate-shape--form-triangle {
  border-radius: 0;
  clip-path: polygon(50% 6%, 6% 94%, 94% 94%);
}

.gate-shape--form-hexagon {
  border-radius: 0;
  clip-path: polygon(25% 8%, 75% 8%, 94% 50%, 75% 92%, 25% 92%, 6% 50%);
}

.gate-shape--form-diamond {
  border-radius: 0;
  clip-path: polygon(50% 4%, 94% 50%, 50% 96%, 6% 50%);
}

.gate-shape--form-star {
  border-radius: 0;
  clip-path: polygon(
    50% 4%,
    61% 36%,
    96% 36%,
    68% 57%,
    79% 92%,
    50% 72%,
    21% 92%,
    32% 57%,
    4% 36%,
    39% 36%
  );
}

.gate-page {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--theme);
  color: var(--primary);
}

.site-gate {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 48px 16px;
}

.site-gate__panel {
  background: var(--entry);
  color: var(--primary);
  border-radius: 20px;
  padding: 40px;
  max-width: 760px;
  width: min(760px, 100%);
  box-shadow: 0 28px 60px rgba(0, 0, 0, 0.28);
  border: 2px solid var(--accent-1);
  text-align: center;
}

.site-gate__title {
  margin: 0 0 12px;
  font-size: 28px;
}

.site-gate__lead {
  font-size: 18px;
  margin: 0 0 8px;
  color: var(--primary);
}

.site-gate__copy {
  color: var(--secondary);
  margin: 0 0 24px;
  font-size: 16px;
}

.site-gate__button {
  display: inline-block;
  width: 100%;
  font-size: 16px;
  font-weight: 600;
  text-align: center;
  padding: 10px 16px;
}

.site-gate__button[disabled] {
  cursor: progress;
  opacity: 0.6;
  background: var(--accent-2);
  color: var(--accent-2-contrast);
}

.site-gate__status {
  margin-top: 16px;
  font-size: 14px;
  color: var(--secondary);
}

.site-gate__fallback {
  display: inline-block;
  margin-top: 16px;
  font-size: 14px;
  color: var(--accent-1);
  text-decoration: underline;
}