﻿@charset "UTF-8";

:root {
    color-scheme: light;
    --accent: #a11460;
    --accent-dark: #5e173f;
    --accent-soft: #f6dbe8;
    --accent-pale: #fff3f8;
    --surface: rgba(255, 255, 255, 0.88);
    --surface-strong: #ffffff;
    --text: #23151d;
    --muted: #66525e;
    --line: rgba(161, 20, 96, 0.14);
    --shadow: 0 24px 60px rgba(73, 17, 49, 0.12);
    --shadow-soft: 0 18px 40px rgba(73, 17, 49, 0.08);
    --radius-xl: 32px;
    --radius-lg: 24px;
    --radius-md: 18px;
    --container: 1180px;
    --heading-font: "Palatino Linotype", "Book Antiqua", Georgia, serif;
    --body-font: "Segoe UI Variable", "Aptos", "Trebuchet MS", sans-serif;
    --page-radial-1: rgba(161, 20, 96, 0.12);
    --page-radial-2: rgba(255, 209, 228, 0.55);
    --page-bg-start: #fffafc;
    --page-bg-mid: #fff7fb;
    --page-bg-end: #fffaf6;
    --section-alt-start: rgba(255, 255, 255, 0.72);
    --section-alt-end: rgba(255, 245, 250, 0.94);
    --header-bg: rgba(255, 252, 253, 0.88);
    --header-scrolled-bg: rgba(255, 253, 254, 0.95);
    --panel-bg: rgba(255, 255, 255, 0.97);
    --control-bg: rgba(255, 255, 255, 0.92);
    --footer-start: #f7eff3;
    --footer-end: #f2e7ed;
    --admin-bg: linear-gradient(180deg, #fffafc 0%, #f9eff5 100%);
    --admin-panel: rgba(255, 255, 255, 0.9);
    --admin-line: rgba(161, 20, 96, 0.14);
}

:root[data-theme="dark"] {
    color-scheme: dark;
    --accent: #f05aa0;
    --accent-dark: #ffd9ea;
    --accent-soft: #3a1d2d;
    --accent-pale: #21151c;
    --surface: rgba(30, 20, 27, 0.88);
    --surface-strong: #241920;
    --text: #f7edf3;
    --muted: #c8b5c0;
    --line: rgba(255, 220, 236, 0.12);
    --shadow: 0 26px 62px rgba(0, 0, 0, 0.34);
    --shadow-soft: 0 18px 40px rgba(0, 0, 0, 0.24);
    --page-radial-1: rgba(240, 90, 160, 0.16);
    --page-radial-2: rgba(97, 37, 68, 0.36);
    --page-bg-start: #140f13;
    --page-bg-mid: #191117;
    --page-bg-end: #120d12;
    --section-alt-start: rgba(34, 21, 29, 0.92);
    --section-alt-end: rgba(28, 18, 25, 0.98);
    --header-bg: rgba(18, 12, 17, 0.84);
    --header-scrolled-bg: rgba(22, 14, 20, 0.94);
    --panel-bg: rgba(27, 18, 24, 0.96);
    --control-bg: rgba(36, 24, 32, 0.92);
    --footer-start: #161016;
    --footer-end: #120d12;
    --admin-bg: linear-gradient(180deg, #140f13 0%, #191117 100%);
    --admin-panel: rgba(29, 19, 26, 0.92);
    --admin-line: rgba(255, 220, 236, 0.12);
}

.theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    min-height: 2.95rem;
    padding: 0.62rem 0.95rem;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--control-bg);
    color: var(--accent-dark);
    box-shadow: var(--shadow-soft);
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

.theme-toggle:hover,
.theme-toggle:focus-visible {
    transform: translateY(-1px);
    box-shadow: var(--shadow);
}

.theme-toggle-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    background: rgba(161, 20, 96, 0.12);
    font-size: 0.9rem;
    line-height: 1;
}

.theme-toggle-label {
    font-size: 0.9rem;
    font-weight: 800;
    white-space: nowrap;
}

html[data-theme="dark"] body {
    background:
        radial-gradient(circle at top left, var(--page-radial-1), transparent 28rem),
        radial-gradient(circle at top right, var(--page-radial-2), transparent 24rem),
        linear-gradient(180deg, var(--page-bg-start) 0%, var(--page-bg-mid) 35%, var(--page-bg-end) 100%);
    color: var(--text);
}

html[data-theme="dark"] .section-alt {
    background: linear-gradient(180deg, var(--section-alt-start), var(--section-alt-end));
    border-block-color: var(--line);
}

html[data-theme="dark"] .site-header,
html[data-theme="dark"] .site-header.is-scrolled,
html[data-theme="dark"] .site-header.is-menu-open,
html[data-theme="dark"] .main-nav,
html[data-theme="dark"] .menu-toggle,
html[data-theme="dark"] .header-cta,
html[data-theme="dark"] .site-footer,
html[data-theme="dark"] .social-link,
html[data-theme="dark"] .pill,
html[data-theme="dark"] .button-secondary,
html[data-theme="dark"] .content-empty,
html[data-theme="dark"] .card-expand summary,
html[data-theme="dark"] .card-media span,
html[data-theme="dark"] .affiliation-badge,
html[data-theme="dark"] .admin-login-card,
html[data-theme="dark"] .admin-card,
html[data-theme="dark"] .admin-table-card,
html[data-theme="dark"] .admin-sidebar,
html[data-theme="dark"] .admin-page-header,
html[data-theme="dark"] .admin-stat,
html[data-theme="dark"] .admin-watch-item,
html[data-theme="dark"] .admin-field input,
html[data-theme="dark"] .admin-field textarea,
html[data-theme="dark"] .admin-field select,
html[data-theme="dark"] .admin-image-preview {
    background: var(--panel-bg);
    color: var(--text);
    border-color: var(--line);
}

html[data-theme="dark"] .site-header {
    background: var(--header-bg);
}

html[data-theme="dark"] .site-header.is-scrolled,
html[data-theme="dark"] .site-header.is-menu-open {
    background: var(--header-scrolled-bg);
}

html[data-theme="dark"] .site-footer {
    background: linear-gradient(180deg, var(--footer-start) 0%, var(--footer-end) 100%);
}

html[data-theme="dark"] .hero-aside-card {
    background:
        radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.08), transparent 35%),
        linear-gradient(145deg, rgba(46, 29, 39, 0.96), rgba(34, 21, 29, 0.96));
}

html[data-theme="dark"] .activity-card {
    background: linear-gradient(180deg, rgba(40, 24, 33, 0.96), rgba(31, 19, 27, 0.9)), var(--surface);
}

html[data-theme="dark"] .activity-step {
    background: linear-gradient(180deg, rgba(240, 90, 160, 0.18), rgba(240, 90, 160, 0.1));
    border-color: rgba(240, 90, 160, 0.18);
}

html[data-theme="dark"] .card-media {
    background: linear-gradient(135deg, rgba(240, 90, 160, 0.18), rgba(36, 24, 32, 0.92));
}

html[data-theme="dark"] .card-tag,
html[data-theme="dark"] .theme-toggle-icon,
html[data-theme="dark"] .admin-status.is-upcoming,
html[data-theme="dark"] .admin-status.is-current,
html[data-theme="dark"] .admin-status.is-published,
html[data-theme="dark"] .admin-status.is-draft,
html[data-theme="dark"] .admin-status.is-past {
    border-color: transparent;
}

html[data-theme="dark"] .submenu a,
html[data-theme="dark"] .footer-links a,
html[data-theme="dark"] .social-link span,
html[data-theme="dark"] .admin-sidebar-footer p,
html[data-theme="dark"] .admin-help,
html[data-theme="dark"] .admin-table-empty,
html[data-theme="dark"] .section-lead,
html[data-theme="dark"] .hero-lead,
html[data-theme="dark"] .page-lead,
html[data-theme="dark"] .detail-list li,
html[data-theme="dark"] .metric-card span,
html[data-theme="dark"] .footer-brand p,
html[data-theme="dark"] .footer-links li,
html[data-theme="dark"] .footer-meta,
html[data-theme="dark"] .card-meta,
html[data-theme="dark"] .admin-watch-date,
html[data-theme="dark"] .admin-watch-header p,
html[data-theme="dark"] .admin-watch-item p {
    color: var(--muted);
}

html[data-theme="dark"] .submenu a:hover,
html[data-theme="dark"] .submenu a:focus-visible {
    background: rgba(240, 90, 160, 0.14);
    color: var(--accent-dark);
}

html[data-theme="dark"] .button-primary {
    box-shadow: 0 16px 28px rgba(240, 90, 160, 0.18);
}

html[data-theme="dark"] .spotlight-note,
html[data-theme="dark"] .spotlight-point {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.12);
}
html[data-theme="dark"] .intro-card,
html[data-theme="dark"] .method-quote,
html[data-theme="dark"] .contact-panel,
html[data-theme="dark"] .contact-item,
html[data-theme="dark"] .info-card,
html[data-theme="dark"] .metric-card,
html[data-theme="dark"] .content-card,
html[data-theme="dark"] .hero-aside-card,
html[data-theme="dark"] .card-expand[open] summary {
    background: linear-gradient(145deg, rgba(39, 25, 34, 0.96), rgba(29, 19, 26, 0.94));
    color: var(--text);
}

html[data-theme="dark"] .method-quote {
    background:
        radial-gradient(circle at top right, rgba(240, 90, 160, 0.18), transparent 35%),
        linear-gradient(145deg, rgba(39, 25, 34, 0.96), rgba(29, 19, 26, 0.94));
}

html[data-theme="dark"] .contact-panel {
    background:
        radial-gradient(circle at top right, rgba(240, 90, 160, 0.12), transparent 32%),
        linear-gradient(180deg, rgba(35, 23, 31, 0.98), rgba(28, 18, 25, 0.96));
}

html[data-theme="dark"] .affiliations-strip {
    background:
        radial-gradient(circle at top left, rgba(240, 90, 160, 0.12), transparent 32%),
        linear-gradient(180deg, rgba(27, 18, 24, 0.98), rgba(20, 14, 19, 0.98));
}

html[data-theme="dark"] .affiliations-title {
    color: var(--accent-dark);
}

html[data-theme="dark"] .affiliation-badge {
    background: rgba(34, 22, 30, 0.96);
    border-color: rgba(255, 220, 236, 0.1);
    box-shadow: 0 18px 34px rgba(0, 0, 0, 0.22);
}
html[data-theme="dark"] .method-quote blockquote,
html[data-theme="dark"] .hero-aside-card h2,
html[data-theme="dark"] .page-hero-card h2,
html[data-theme="dark"] .contact-copy h2,
html[data-theme="dark"] .intro-card h3,
html[data-theme="dark"] .method-pillar h3,
html[data-theme="dark"] .content-card h3,
html[data-theme="dark"] .info-card h3 {
    color: var(--accent-dark);
}

html[data-theme="dark"] .method-quote p,
html[data-theme="dark"] .hero-aside-card p,
html[data-theme="dark"] .intro-card p,
html[data-theme="dark"] .contact-copy p,
html[data-theme="dark"] .contact-item span,
html[data-theme="dark"] .info-card p,
html[data-theme="dark"] .content-card p,
html[data-theme="dark"] .metric-card span,
html[data-theme="dark"] .footer-brand p,
html[data-theme="dark"] .footer-links li,
html[data-theme="dark"] .footer-meta,
html[data-theme="dark"] .card-meta,
html[data-theme="dark"] .card-resource-group h4,
html[data-theme="dark"] .card-resource-list a,
html[data-theme="dark"] .contact-hint {
    color: var(--muted);
}

html[data-theme="dark"] .card-resource-list a:hover,
html[data-theme="dark"] .card-resource-list a:focus-visible,
html[data-theme="dark"] .footer-links a:hover,
html[data-theme="dark"] .footer-links a:focus-visible,
html[data-theme="dark"] .social-link:hover,
html[data-theme="dark"] .social-link:focus-visible {
    color: var(--accent-dark);
}
html[data-theme="dark"] .submenu {
    background: rgba(32, 21, 28, 0.98);
    border-color: rgba(255, 220, 236, 0.12);
    box-shadow: 0 22px 38px rgba(0, 0, 0, 0.3);
}

html[data-theme="dark"] .submenu a {
    color: var(--muted);
}

html[data-theme="dark"] .submenu a[aria-current="page"] {
    color: var(--accent-dark);
    background: rgba(240, 90, 160, 0.14);
}
html[data-theme="dark"] .admin-button-secondary,
html[data-theme="dark"] .admin-link-button,
html[data-theme="dark"] .admin-pagination-link,
html[data-theme="dark"] .admin-pagination-separator {
    background: rgba(45, 29, 39, 0.96);
    color: var(--accent-dark);
    border-color: rgba(255, 220, 236, 0.14);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.18);
}

html[data-theme="dark"] .admin-button-secondary:hover,
html[data-theme="dark"] .admin-button-secondary:focus-visible,
html[data-theme="dark"] .admin-link-button:hover,
html[data-theme="dark"] .admin-link-button:focus-visible,
html[data-theme="dark"] .admin-pagination-link:hover,
html[data-theme="dark"] .admin-pagination-link:focus-visible {
    background: rgba(58, 37, 50, 0.98);
    color: #fff4fa;
    border-color: rgba(240, 90, 160, 0.28);
}

html[data-theme="dark"] .admin-button-danger {
    background: rgba(73, 24, 45, 0.92);
    color: #ffb7d3;
    border-color: rgba(240, 90, 160, 0.18);
}

html[data-theme="dark"] .admin-button-danger:hover,
html[data-theme="dark"] .admin-button-danger:focus-visible {
    background: rgba(92, 31, 57, 0.96);
    color: #ffe7f2;
    border-color: rgba(255, 183, 211, 0.3);
}

html[data-theme="dark"] .admin-list-filters select,
html[data-theme="dark"] .admin-field select {
    background-color: rgba(43, 28, 37, 0.98);
    background-image:
        linear-gradient(135deg, rgba(240, 90, 160, 0.16), rgba(255, 255, 255, 0.02)),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18' fill='none'%3E%3Cpath d='M4.5 6.75L9 11.25L13.5 6.75' stroke='%23ffd9ea' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    color: #f7edf3;
    border-color: rgba(255, 220, 236, 0.14);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03), 0 12px 24px rgba(0, 0, 0, 0.18);
}

html[data-theme="dark"] .admin-list-filters select:hover,
html[data-theme="dark"] .admin-list-filters select:focus,
html[data-theme="dark"] .admin-field select:hover,
html[data-theme="dark"] .admin-field select:focus {
    border-color: rgba(240, 90, 160, 0.28);
    box-shadow: 0 0 0 4px rgba(240, 90, 160, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.03), 0 14px 28px rgba(0, 0, 0, 0.22);
}

html[data-theme="dark"] .admin-list-filters option,
html[data-theme="dark"] .admin-field select option {
    background: #2a1b24;
    color: #f7edf3;
}

html[data-theme="dark"] .admin-text-link {
    color: var(--accent-dark);
}
