:root,
html[data-theme="dark"] {
    color-scheme: dark;
    --primary-color: #58d7ff;
    --primary-dark: #1c91d2;
    --secondary-color: #10192b;
    --secondary-dark: #050816;
    --accent-color: #70ece1;
    --success-color: #00d68f;
    --warning-color: #ffb800;
    --danger-color: #ff3860;
    --light-color: #dff5ff;
    --dark-color: #050816;
    --text-color: #e8f4ff;
    --text-secondary: #8ea7c2;
    --box-shadow: 0 18px 42px rgba(0, 0, 0, 0.26);
    --box-shadow-hover: 0 24px 52px rgba(0, 0, 0, 0.34);
    --border-color: rgba(143, 220, 255, 0.18);
    --card-bg: rgba(9, 15, 29, 0.82);
    --page-bg: #050816;
    --surface: #0f1728;
    --surface-strong: #132033;
    --surface-soft: #19283d;
    --ink: #e8f4ff;
    --ink-soft: #90a8c4;
    --line: rgba(143, 220, 255, 0.14);
    --accent: #8fdcff;
    --accent-soft: rgba(143, 220, 255, 0.12);
    --accent-deep: #dff5ff;
    --highlight: #89efe6;
    --shadow: 0 18px 42px rgba(0, 0, 0, 0.3);
    --shadow-soft: 0 12px 28px rgba(0, 0, 0, 0.24);
}

html[data-theme="light"] {
    color-scheme: light;
    --primary-color: #1a8bda;
    --primary-dark: #1265b4;
    --secondary-color: #ffffff;
    --secondary-dark: #edf3fb;
    --accent-color: #5d74d8;
    --success-color: #129f67;
    --warning-color: #cf890a;
    --danger-color: #d84e68;
    --light-color: #f7fbff;
    --dark-color: #183b63;
    --text-color: #1b2b3f;
    --text-secondary: #64748b;
    --box-shadow: 0 16px 36px rgba(67, 89, 122, 0.12);
    --box-shadow-hover: 0 22px 46px rgba(67, 89, 122, 0.16);
    --border-color: rgba(24, 59, 99, 0.12);
    --card-bg: rgba(255, 255, 255, 0.92);
    --page-bg: #f3f0ea;
    --surface: #ffffff;
    --surface-strong: #f8f6f1;
    --surface-soft: #ece7dd;
    --ink: #1f2d3d;
    --ink-soft: #52606d;
    --line: #d7d0c4;
    --accent: #183b63;
    --accent-soft: #dfe8f0;
    --accent-deep: #102944;
    --highlight: #8f6b3c;
    --shadow: 0 18px 40px rgba(31, 45, 61, 0.08);
    --shadow-soft: 0 12px 26px rgba(31, 45, 61, 0.05);
}

.theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.4rem;
    height: 2.4rem;
    padding: 0;
    border: none;
    background: transparent;
    color: var(--accent);
    cursor: pointer;
    font: inherit;
    font-size: 1rem;
    box-shadow: none;
    transition: color 0.25s ease, transform 0.25s ease, opacity 0.25s ease;
}

.theme-toggle:hover {
    transform: translateY(-2px);
    opacity: 0.8;
}

.theme-toggle:focus-visible {
    outline: 2px solid rgba(88, 215, 255, 0.5);
    outline-offset: 3px;
}

.theme-toggle-icon {
    font-size: 1rem;
}

.theme-toggle-floating {
    position: fixed;
    top: 18px;
    right: 20px;
    z-index: 1200;
}

.site-header-actions .theme-toggle {
    flex: 0 0 auto;
}

.nav-utility-group {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-shrink: 0;
}

.nav-utility-group .user-info-link {
    margin: 0;
}

html[data-theme="light"] .theme-toggle {
    background: transparent;
    color: var(--accent);
}

html[data-theme="light"] .theme-toggle:hover {
    opacity: 0.72;
}

html[data-theme="light"] body[data-site-page="home"] {
    color: var(--ink);
    background: #f7f4ef;
}

html[data-theme="light"] body[data-site-page="home"] .site-header {
    background: rgba(243, 240, 234, 0.92);
    border-bottom-color: rgba(24, 59, 99, 0.1);
}

html[data-theme="light"] body[data-site-page="home"] .site-brand-text strong,
html[data-theme="light"] body[data-site-page="home"] .site-button-secondary,
html[data-theme="light"] body[data-site-page="home"] .footer-links a:hover {
    color: var(--accent);
}

html[data-theme="light"] body[data-site-page="home"] .site-brand-text small,
html[data-theme="light"] body[data-site-page="home"] .site-nav-list a,
html[data-theme="light"] body[data-site-page="home"] .footer-copy,
html[data-theme="light"] body[data-site-page="home"] .footer-bottom,
html[data-theme="light"] body[data-site-page="home"] .footer-links a {
    color: var(--ink-soft);
}

html[data-theme="light"] body[data-site-page="home"] .site-nav-list a:hover,
html[data-theme="light"] body[data-site-page="home"] .site-nav-list a[aria-current="page"] {
    color: var(--ink);
    background: rgba(24, 59, 99, 0.08);
}

html[data-theme="light"] body[data-site-page="home"] .site-button {
    background: var(--accent);
    border-color: var(--accent);
    color: #ffffff;
}

html[data-theme="light"] body[data-site-page="home"] .site-button:hover {
    background: var(--accent-deep);
    border-color: var(--accent-deep);
}

html[data-theme="light"] body[data-site-page="home"] .site-button-secondary {
    background: rgba(255, 255, 255, 0.7);
    border-color: rgba(24, 59, 99, 0.18);
    color: var(--accent);
}

html[data-theme="light"] body[data-site-page="home"] .site-button-secondary:hover {
    background: rgba(255, 255, 255, 0.95);
    border-color: rgba(24, 59, 99, 0.28);
    color: var(--accent-deep);
}

html[data-theme="light"] body[data-site-page="home"] .home-main {
    background: #f7f4ef;
}

html[data-theme="light"] body[data-site-page="home"] .home-chapter::after {
    background: rgba(24, 59, 99, 0.14);
}

html[data-theme="light"] body[data-site-page="home"] .home-chapter-delivery {
    background: rgba(255, 255, 255, 0.24);
}

html[data-theme="light"] body[data-site-page="home"] .home-intro-text,
html[data-theme="light"] body[data-site-page="home"] .home-intro-copy-noscript,
html[data-theme="light"] body[data-site-page="home"] .home-overview-lead,
html[data-theme="light"] body[data-site-page="home"] .home-overview-panel h3,
html[data-theme="light"] body[data-site-page="home"] .home-delivery-copy h2,
html[data-theme="light"] body[data-site-page="home"] .home-delivery-item h3,
html[data-theme="light"] body[data-site-page="home"] .home-cta-panel h2,
html[data-theme="light"] body[data-site-page="home"] .home-thanks-panel h2,
html[data-theme="light"] body[data-site-page="home"] .home-story-copy h2,
html[data-theme="light"] body[data-site-page="home"] .home-path-copy h2,
html[data-theme="light"] body[data-site-page="home"] .home-path-item h3 {
    color: var(--ink);
}

html[data-theme="light"] body[data-site-page="home"] .home-intro-text::after {
    background: var(--accent);
}

html[data-theme="light"] body[data-site-page="home"] .home-overview-panel p,
html[data-theme="light"] body[data-site-page="home"] .home-delivery-copy p,
html[data-theme="light"] body[data-site-page="home"] .home-delivery-item p,
html[data-theme="light"] body[data-site-page="home"] .home-cta-panel p,
html[data-theme="light"] body[data-site-page="home"] .home-thanks-panel p,
html[data-theme="light"] body[data-site-page="home"] .home-story-copy p,
html[data-theme="light"] body[data-site-page="home"] .home-path-copy p,
html[data-theme="light"] body[data-site-page="home"] .home-path-item p,
html[data-theme="light"] body[data-site-page="home"] .stats-total-label,
html[data-theme="light"] body[data-site-page="home"] .stats-breakdown-text,
html[data-theme="light"] body[data-site-page="home"] .stats-loading,
html[data-theme="light"] body[data-site-page="home"] .stats-error {
    color: var(--ink-soft);
}

html[data-theme="light"] body[data-site-page="home"] .home-overview-panel-meta,
html[data-theme="light"] body[data-site-page="home"] .home-scroll-cue {
    color: rgba(31, 45, 61, 0.66);
}

html[data-theme="light"] body[data-site-page="home"] .home-scroll-cue:hover {
    color: var(--accent-deep);
}

html[data-theme="light"] body[data-site-page="home"] .home-overview-panel-icon,
html[data-theme="light"] body[data-site-page="home"] .home-delivery-item-isolated,
html[data-theme="light"] body[data-site-page="home"] .home-delivery-item-isolated .home-delivery-icon,
html[data-theme="light"] body[data-site-page="home"] .stats-title,
html[data-theme="light"] body[data-site-page="home"] .stats-total-number,
html[data-theme="light"] body[data-site-page="home"] .stats-count-highlight,
html[data-theme="light"] body[data-site-page="home"] .home-path-item span {
    color: var(--accent);
}

html[data-theme="light"] body[data-site-page="home"] .home-delivery-item-direct,
html[data-theme="light"] body[data-site-page="home"] .home-delivery-item-direct .home-delivery-icon {
    color: var(--highlight);
}

html[data-theme="light"] body[data-site-page="home"] .home-story-copy,
html[data-theme="light"] body[data-site-page="home"] .home-path-copy,
html[data-theme="light"] body[data-site-page="home"] .home-stats-shell,
html[data-theme="light"] body[data-site-page="home"] .home-path-item,
html[data-theme="light"] body[data-site-page="home"] .stats-total-item {
    border-color: rgba(24, 59, 99, 0.1);
    background: rgba(255, 255, 255, 0.82);
    box-shadow: var(--shadow);
}

html[data-theme="light"] body[data-site-page="home"] .home-delivery-flags span {
    color: var(--accent-deep);
}

html[data-theme="light"] body[data-initial-page],
html[data-theme="light"] body[data-current-page] {
    color: var(--text-color);
    background-color: var(--secondary-dark);
    background-image: none;
}

html[data-theme="light"] body[data-initial-page]::before,
html[data-theme="light"] body[data-current-page]::before {
    display: none;
}

html[data-theme="light"] body[data-current-page="ad"] main,
html[data-theme="light"] body[data-initial-page="ad"] main,
html[data-theme="light"] main:has(#ad-page.active) {
    background: rgba(255, 255, 255, 0.45);
}

html[data-theme="light"] footer {
    background-color: rgba(255, 255, 255, 0.88);
    color: var(--text-secondary);
}

html[data-theme="light"] header {
    background: rgba(255, 255, 255, 0.97);
    color: var(--text-color);
    box-shadow: 0 8px 28px rgba(67, 89, 122, 0.14);
    border-bottom-color: rgba(24, 59, 99, 0.1);
}

html[data-theme="light"] .logo,
html[data-theme="light"] .nav-links a {
    color: var(--text-color);
    text-shadow: none;
}

html[data-theme="light"] .logo i,
html[data-theme="light"] .hero-text h1 i {
    filter: none;
}

html[data-theme="light"] .logo::after {
    background: var(--primary-color);
}

html[data-theme="light"] .nav-links a:before {
    background: var(--primary-color);
}

html[data-theme="light"] .nav-links a i {
    color: rgba(27, 43, 63, 0.72);
}

html[data-theme="light"] .user-info {
    background-color: transparent;
    border: none;
    box-shadow: none;
}

html[data-theme="light"] .user-info::before {
    display: none;
}

html[data-theme="light"] .user-info .divider,
html[data-theme="light"] .user-info #nickname,
html[data-theme="light"] .user-info-link {
    color: var(--text-color);
}

html[data-theme="light"] .user-info #nickname.not-logged,
html[data-theme="light"] .user-info #points.not-logged {
    color: var(--warning-color);
}

html[data-theme="light"] .menu-toggle:hover {
    background: rgba(26, 139, 218, 0.08);
}

html[data-theme="light"] .menu-toggle span {
    background: var(--text-color);
}

html[data-theme="light"] .hero-text h1,
html[data-theme="light"] .updates-header h2,
html[data-theme="light"] .timeline-title,
html[data-theme="light"] .notice-container h2,
html[data-theme="light"] .notice-section h3,
html[data-theme="light"] .rankings-table-header h3,
html[data-theme="light"] .detail-header h1,
html[data-theme="light"] .modal-header h2,
html[data-theme="light"] .announcement-modal-title,
html[data-theme="light"] .comments-header h3 {
    color: var(--text-color);
    text-shadow: none;
}

html[data-theme="light"] .hero-inline-stats,
html[data-theme="light"] .hero-inline-stats-value,
html[data-theme="light"] .time-text,
html[data-theme="light"] .detail-item h3,
html[data-theme="light"] .description-text,
html[data-theme="light"] .notice-alert .alert-content h5,
html[data-theme="light"] .comment-author {
    color: var(--text-color);
}

html[data-theme="light"] .hero-inline-stats.is-loading .hero-inline-stats-value {
    color: rgba(24, 59, 99, 0.6);
}

html[data-theme="light"] .hero-inline-stats-label,
html[data-theme="light"] .hero-inline-stats-separator,
html[data-theme="light"] .timeline-desc,
html[data-theme="light"] .timeline-type,
html[data-theme="light"] .timeline-meta,
html[data-theme="light"] .timeline-target-tag,
html[data-theme="light"] .detail-item p,
html[data-theme="light"] .notice-alert .alert-content p,
html[data-theme="light"] .comments-count,
html[data-theme="light"] .comment-time,
html[data-theme="light"] .updates-empty,
html[data-theme="light"] .timeline-loading,
html[data-theme="light"] .loading-container {
    color: var(--text-secondary);
}

html[data-theme="light"] .target-card,
html[data-theme="light"] .category-sidebar,
html[data-theme="light"] .announcement-modal-content,
html[data-theme="light"] .rankings-header,
html[data-theme="light"] .rankings-content,
html[data-theme="light"] .rankings-stats,
html[data-theme="light"] .detail-header,
html[data-theme="light"] .detail-right-main,
html[data-theme="light"] .detail-item.description-item,
html[data-theme="light"] .detail-item,
html[data-theme="light"] .comments-item,
html[data-theme="light"] .target-detail-modal,
html[data-theme="light"] .modal-left .detail-item,
html[data-theme="light"] .modal-right .description-item,
html[data-theme="light"] .modal-content,
html[data-theme="light"] .notice-content,
html[data-theme="light"] .rankings-table,
html[data-theme="light"] .comments-load-more-btn {
    background: var(--card-bg);
    border-color: rgba(24, 59, 99, 0.12);
    box-shadow: var(--box-shadow);
}

html[data-theme="light"] .target-card:hover,
html[data-theme="light"] .category-btn:hover,
html[data-theme="light"] .comments-item:hover,
html[data-theme="light"] .detail-item:hover {
    box-shadow: var(--box-shadow-hover);
}

html[data-theme="light"] .notice-section {
    background: transparent;
    border-color: transparent;
    box-shadow: none;
}

html[data-theme="light"] .notice-content {
    background: transparent;
    box-shadow: none;
}

html[data-theme="light"] .notice-section:hover {
    box-shadow: none;
}

html[data-theme="light"] .faq-item {
    background: transparent;
    border-color: transparent;
    box-shadow: none;
}

html[data-theme="light"] .faq-item:hover {
    border-color: transparent;
    box-shadow: none;
}

html[data-theme="light"] .faq-question {
    background: transparent;
}

html[data-theme="light"] .faq-question:hover {
    background: transparent;
}

html[data-theme="light"] .faq-index {
    color: var(--text-secondary);
}

html[data-theme="light"] .faq-question h4,
html[data-theme="light"] .faq-question-text {
    color: var(--text-color);
}

html[data-theme="light"] .faq-question .toggle-icon {
    color: var(--text-secondary);
}

html[data-theme="light"] .faq-answer {
    background: transparent;
}

html[data-theme="light"] .faq-answer p {
    color: var(--text-secondary);
}

html[data-theme="light"] .faq-answer strong {
    color: var(--text-color);
}

html[data-theme="light"] .faq-answer .answer-highlight {
    background: transparent;
    border-left-color: transparent;
    color: var(--text-color);
}

html[data-theme="light"] .faq-answer .answer-highlight strong {
    color: var(--text-color);
}

html[data-theme="light"] .faq-item.active .faq-index,
html[data-theme="light"] .faq-item.active .faq-question .toggle-icon {
    color: var(--primary-color);
}

html[data-theme="light"] .card-header h3,
html[data-theme="light"] .timeline-title a:hover {
    color: var(--text-color);
}

html[data-theme="light"] .difficulty-stars,
html[data-theme="light"] .announcement-item,
html[data-theme="light"] .comment-item,
html[data-theme="light"] .rankings-table thead,
html[data-theme="light"] .rankings-table tr:hover,
html[data-theme="light"] .notice-alert,
html[data-theme="light"] .timeline-target-tag {
    background: rgba(24, 59, 99, 0.05);
    border-color: rgba(24, 59, 99, 0.08);
}

html[data-theme="light"] .search-input,
html[data-theme="light"] .toolbar-search-input,
html[data-theme="light"] .comment-textarea,
html[data-theme="light"] .sort-select,
html[data-theme="light"] .toolbar-sort-select,
html[data-theme="light"] .category-btn,
html[data-theme="light"] .search-clear-btn,
html[data-theme="light"] .comments-load-more-btn {
    background: transparent;
    border-color: transparent;
    color: var(--text-color);
}

html[data-theme="light"] .search-input::placeholder,
html[data-theme="light"] .toolbar-search-input::placeholder,
html[data-theme="light"] .comment-textarea::placeholder,
html[data-theme="light"] .sort-title h4,
html[data-theme="light"] .toolbar-sort-label,
html[data-theme="light"] .page-size-label {
    color: var(--text-secondary);
}

html[data-theme="light"] .sort-select:hover,
html[data-theme="light"] .sort-select:focus,
html[data-theme="light"] .toolbar-sort-select:hover,
html[data-theme="light"] .toolbar-sort-select:focus,
html[data-theme="light"] .search-input:focus,
html[data-theme="light"] .toolbar-search-input:focus,
html[data-theme="light"] .comment-textarea:focus {
    background: transparent;
    border-color: transparent;
}

html[data-theme="light"] .btn-info,
html[data-theme="light"] .announcement-modal-close,
html[data-theme="light"] .btn-load-more,
html[data-theme="light"] .filter-btn {
    color: var(--text-secondary);
}

html[data-theme="light"] .btn-info:hover,
html[data-theme="light"] .filter-btn:hover,
html[data-theme="light"] .btn-load-more:hover,
html[data-theme="light"] .announcement-modal-close:hover {
    color: var(--text-color);
}

html[data-theme="light"] .filter-btn.active {
    color: var(--text-color);
    border-bottom-color: var(--text-color);
}

html[data-theme="light"] .updates-list::before {
    background: #c8d5e3;
}

html[data-theme="light"] .timeline-dot {
    background: #ffffff;
    border-color: #8ab7de;
}

html[data-theme="light"] .timeline-item:hover .timeline-dot {
    background: #dfe9f6;
    border-color: #4d86c4;
}

html[data-theme="light"] .timeline-date .day {
    color: #36587d;
}

html[data-theme="light"] .timeline-date .month,
html[data-theme="light"] .timeline-date .year {
    color: #6e8095;
}

html[data-theme="light"] .announcement-modal-overlay,
html[data-theme="light"] .modal-overlay {
    background: rgba(19, 33, 52, 0.45);
}

html[data-theme="light"] .modal-header,
html[data-theme="light"] .detail-header {
    border-bottom-color: rgba(24, 59, 99, 0.1);
}

html[data-theme="light"] .description-text th {
    background: rgba(24, 59, 99, 0.08);
}

html[data-theme="light"] .description-text td {
    background: rgba(255, 255, 255, 0.9);
}

html[data-theme="light"] .btn-primary {
    background: var(--primary-color);
    box-shadow: 0 6px 16px rgba(26, 139, 218, 0.2);
    text-shadow: none;
}

html[data-theme="light"] .btn-primary:hover {
    background: var(--primary-dark);
    box-shadow: 0 8px 20px rgba(26, 139, 218, 0.25);
    transform: translateY(-2px) scale(1.01);
}

html[data-theme="light"] .btn-primary::before {
    display: none;
}

html[data-theme="light"] .btn-success {
    background: var(--success-color);
    box-shadow: 0 6px 16px rgba(18, 159, 103, 0.2);
    text-shadow: none;
}

html[data-theme="light"] .flag-input-group .btn {
    background: var(--primary-color);
    border-color: rgba(26, 139, 218, 0.4);
    box-shadow: none;
}

html[data-theme="light"] .flag-input-group .btn:hover {
    background: var(--primary-dark);
    border-color: rgba(26, 139, 218, 0.6);
}

html[data-theme="light"] .btn-success:hover {
    background: #0f8a5b;
}

html[data-theme="light"] .btn-danger {
    background: var(--danger-color);
    box-shadow: 0 6px 16px rgba(216, 78, 104, 0.2);
    text-shadow: none;
}

html[data-theme="light"] .btn-danger:hover {
    background: #c7455c;
}

html[data-theme="light"] .tab-button {
    background: transparent;
    border: none;
    color: var(--text-color);
    box-shadow: none;
}

html[data-theme="light"] .tab-button:hover {
    background: transparent;
    color: var(--primary-color);
    transform: translateY(-1px);
}

html[data-theme="light"] .tab-button.active {
    background: transparent;
    color: var(--primary-color);
}

html[data-theme="light"] .year-filter {
    background: transparent;
    border: none;
    box-shadow: none;
}

html[data-theme="light"] .year-filter:hover {
    background: transparent;
    border: none;
}

html[data-theme="light"] .year-select {
    color: var(--text-color);
}

html[data-theme="light"] .year-select:hover,
html[data-theme="light"] .year-select:focus {
    color: var(--primary-color);
}

html[data-theme="light"] .comment-submit-btn {
    background: var(--primary-color);
    color: #ffffff;
    border: none;
    box-shadow: 0 6px 16px rgba(26, 139, 218, 0.2);
}

html[data-theme="light"] .comment-submit-btn:hover {
    background: var(--primary-dark);
}

html[data-theme="light"] .comment-submit-btn:active {
    transform: translateY(1px);
}

html[data-theme="light"] .target-card {
    border-color: rgba(24, 59, 99, 0.12);
}

html[data-theme="light"] .target-toolbar {
    background: transparent;
    box-shadow: none;
}

html[data-theme="light"] .pagination-btn {
    background: transparent;
    border: none;
    color: var(--text-color);
    box-shadow: none;
}

html[data-theme="light"] .pagination-btn:hover:not(:disabled) {
    background: transparent;
    color: var(--primary-color);
}

html[data-theme="light"] .pagination-btn.active {
    background: transparent;
    color: var(--primary-color);
    border-color: transparent;
}

html[data-theme="light"] .pagination-items-per-page,
html[data-theme="light"] .pagination-jump {
    background: transparent;
    border: none;
    box-shadow: none;
}

html[data-theme="light"] .items-per-page-select,
html[data-theme="light"] .pagination-input {
    background: transparent;
    border: none;
    color: var(--text-color);
}

html[data-theme="light"] .items-per-page-select:hover,
html[data-theme="light"] .pagination-input:focus {
    background: transparent;
    border-color: transparent;
}

html[data-theme="light"] .pagination-jump-btn {
    background: transparent;
    border: none;
    color: var(--primary-color);
    box-shadow: none;
}

html[data-theme="light"] .pagination-jump-btn:hover {
    background: transparent;
    border-color: transparent;
}

html[data-theme="light"] .cleared-card {
    border-color: rgba(17, 163, 90, 0.55) !important;
    box-shadow: 0 10px 26px rgba(17, 163, 90, 0.12);
}

html[data-theme="light"] .cleared-card:hover {
    border-color: rgba(17, 163, 90, 0.75) !important;
    box-shadow: 0 14px 30px rgba(17, 163, 90, 0.18);
}

html[data-theme="light"] .cleared-stamp {
    opacity: 0.45;
}

html[data-theme="light"] .cleared-card .cleared-stamp {
    opacity: 0.55;
}

html[data-theme="light"] .cleared-card:hover .cleared-stamp {
    opacity: 0.7;
}

html[data-theme="light"] .stamp-inner {
    border-color: #11a35a;
    background: transparent;
}

html[data-theme="light"] .stamp-inner::before {
    border-color: rgba(17, 163, 90, 0.9);
}

html[data-theme="light"] .stamp-inner i {
    color: #11a35a;
    filter: none;
}

html[data-theme="light"] .stamp-text {
    color: #11864a;
    text-shadow: none;
}

html[data-theme="light"] .comments-item {
    background: #ffffff;
    border-color: rgba(24, 59, 99, 0.12);
    box-shadow: var(--box-shadow);
    backdrop-filter: none;
}

html[data-theme="light"] .comments-item:hover {
    background: #ffffff;
    border-color: rgba(24, 59, 99, 0.2);
}

html[data-theme="light"] .comments-header {
    border-bottom-color: rgba(24, 59, 99, 0.12);
}

html[data-theme="light"] .comments-header h3 {
    color: var(--text-color);
    text-shadow: none;
}

html[data-theme="light"] .comments-header h3 i {
    color: var(--primary-color);
    filter: none;
}

html[data-theme="light"] .comments-count i {
    color: var(--text-secondary);
}

html[data-theme="light"] .comments-count {
    background: transparent;
    border: none;
    color: var(--text-secondary);
}

html[data-theme="light"] .comment-input-section {
    background: transparent;
    border: none;
    border-top: 1px solid rgba(24, 59, 99, 0.12);
    box-shadow: none;
}

html[data-theme="light"] .comment-textarea {
    background: rgba(24, 59, 99, 0.04);
    border-color: transparent;
    color: var(--text-color);
    box-shadow: none;
}

html[data-theme="light"] .comment-textarea:focus {
    background: #ffffff;
    border-color: rgba(26, 139, 218, 0.45);
    box-shadow: 0 0 0 2px rgba(26, 139, 218, 0.15);
}

html[data-theme="light"] .comment-input-footer {
    border-top-color: rgba(24, 59, 99, 0.12);
}

html[data-theme="light"] .comment-submit-btn {
    border: none;
    box-shadow: 0 6px 16px rgba(26, 139, 218, 0.2);
}

html[data-theme="light"] .comments-list::-webkit-scrollbar-track {
    background: rgba(24, 59, 99, 0.08);
}

html[data-theme="light"] .comments-list::-webkit-scrollbar-thumb {
    background: rgba(24, 59, 99, 0.28);
}

html[data-theme="light"] .comments-list::-webkit-scrollbar-thumb:hover {
    background: rgba(24, 59, 99, 0.42);
}

html[data-theme="light"] .comment-card {
    background: rgba(24, 59, 99, 0.04);
    border: none;
    box-shadow: none;
}

html[data-theme="light"] .comment-card:hover {
    background: rgba(24, 59, 99, 0.06);
    box-shadow: none;
}

html[data-theme="light"] .comment-content {
    background: transparent;
    border: none;
    color: var(--text-color);
}

html[data-theme="light"] .comment-avatar {
    background: var(--primary-color);
    border-color: rgba(255, 255, 255, 0.6);
    box-shadow: 0 6px 12px rgba(26, 139, 218, 0.2);
}

html[data-theme="light"] .comment-edit-btn {
    background: rgba(93, 116, 216, 0.08);
    border-color: rgba(93, 116, 216, 0.2);
    color: var(--accent);
}

html[data-theme="light"] .comment-edit-btn:hover {
    background: rgba(93, 116, 216, 0.16);
    border-color: rgba(93, 116, 216, 0.35);
}

html[data-theme="light"] .comment-delete-btn {
    background: rgba(216, 78, 104, 0.08);
    border-color: rgba(216, 78, 104, 0.2);
}

html[data-theme="light"] .comment-delete-btn:hover {
    background: rgba(216, 78, 104, 0.16);
    border-color: rgba(216, 78, 104, 0.35);
}

html[data-theme="light"] .comment-edit-textarea {
    background: rgba(24, 59, 99, 0.04);
    border-color: transparent;
    color: var(--text-color);
    box-shadow: none;
}

html[data-theme="light"] .comment-edit-textarea:focus {
    background: #ffffff;
    border-color: rgba(26, 139, 218, 0.45);
    box-shadow: 0 0 0 2px rgba(26, 139, 218, 0.12);
}

html[data-theme="light"] .comment-save-btn {
    background: var(--primary-color);
    border: none;
    box-shadow: 0 6px 14px rgba(26, 139, 218, 0.2);
}

html[data-theme="light"] .comment-save-btn:hover {
    background: var(--primary-dark);
}

html[data-theme="light"] .comment-cancel-btn {
    background: transparent;
    border-color: rgba(24, 59, 99, 0.2);
    color: var(--text-secondary);
}

html[data-theme="light"] .comment-cancel-btn:hover {
    background: rgba(24, 59, 99, 0.06);
    border-color: rgba(24, 59, 99, 0.3);
}

html[data-theme="light"] .comments-load-more-btn {
    background: transparent;
    border-color: rgba(24, 59, 99, 0.2);
    color: var(--text-color);
}

html[data-theme="light"] .comments-load-more-btn:hover {
    background: rgba(24, 59, 99, 0.06);
    border-color: rgba(24, 59, 99, 0.3);
}

html[data-theme="light"] .comments-error {
    background: rgba(216, 78, 104, 0.08);
    border-color: rgba(216, 78, 104, 0.2);
}

html[data-theme="light"] .comment-login-tip {
    background: rgba(24, 59, 99, 0.05);
    border-color: rgba(24, 59, 99, 0.16);
    color: var(--text-secondary);
}

html[data-theme="light"] .card-header h3 {
    color: var(--text-color);
    text-shadow: none;
}

html[data-theme="light"] .card-content::before {
    display: none;
}

html[data-theme="light"] .difficulty-stars {
    background: rgba(24, 59, 99, 0.04);
    border-color: rgba(24, 59, 99, 0.08);
}

html[data-theme="light"] .stars i {
    text-shadow: none;
}

html[data-theme="light"] .stars .far.fa-star {
    color: rgba(24, 59, 99, 0.35);
}

html[data-theme="light"] .stars .fa-star-half-alt {
    background: none;
    -webkit-text-fill-color: currentColor;
    color: var(--warning-color);
}

html[data-theme="light"] .solved-count-info,
html[data-theme="light"] .time-info,
html[data-theme="light"] .card-actions {
    border-top-color: rgba(24, 59, 99, 0.12);
}

html[data-theme="light"] .time-info i {
    color: var(--primary-color);
}

html[data-theme="light"] .time-text {
    color: var(--text-color);
}

html[data-theme="light"] .category-sidebar {
    border: none;
}

html[data-theme="light"] .category-title h3 i {
    color: var(--text-secondary);
}

html[data-theme="light"] .category-btn {
    background: transparent;
    border: none;
    color: var(--text-color);
}

html[data-theme="light"] .category-btn::before {
    display: none;
}

html[data-theme="light"] .category-btn::after {
    background: var(--primary-color);
}

html[data-theme="light"] .category-btn:hover {
    background: transparent;
    color: var(--text-color);
}

html[data-theme="light"] .category-btn.active {
    background: transparent;
    color: var(--text-color);
    box-shadow: none;
}

html[data-theme="light"] .category-count,
html[data-theme="light"] .category-btn:hover .category-count,
html[data-theme="light"] .category-btn.active .category-count {
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0;
    min-width: auto;
    height: auto;
    text-shadow: none;
}

html[data-theme="light"] .category-count {
    color: var(--text-secondary);
}

html[data-theme="light"] .category-btn.active .category-count {
    color: var(--primary-color);
}

html[data-theme="light"] .detail-header {
    background: var(--card-bg);
}

html[data-theme="light"] .detail-header h1 {
    color: var(--text-color);
    text-shadow: none;
}

html[data-theme="light"] .detail-header h1 i {
    color: var(--primary-color);
    filter: none;
}

html[data-theme="light"] .detail-item {
    background: var(--card-bg);
    border-color: rgba(24, 59, 99, 0.12);
}

html[data-theme="light"] .detail-item:hover {
    background: rgba(255, 255, 255, 0.98);
    border-color: rgba(24, 59, 99, 0.2);
}

html[data-theme="light"] .detail-item h3 {
    color: var(--text-color);
    text-shadow: none;
}

html[data-theme="light"] .detail-item h3 i {
    color: var(--primary-color);
    filter: none;
}

html[data-theme="light"] #description-content h1,
html[data-theme="light"] #description-content h2,
html[data-theme="light"] #description-content h3,
html[data-theme="light"] #description-content h4,
html[data-theme="light"] #description-content h5,
html[data-theme="light"] #description-content h6 {
    color: var(--text-color);
}

html[data-theme="light"] #description-content a {
    color: var(--primary-color);
    border-bottom-color: rgba(26, 139, 218, 0.4);
}

html[data-theme="light"] #description-content a:hover {
    color: var(--primary-dark);
    border-bottom-color: var(--primary-dark);
}

html[data-theme="light"] #description-content code {
    background: rgba(24, 59, 99, 0.08);
    color: var(--accent);
}

html[data-theme="light"] .ip-address-item {
    background: rgba(24, 59, 99, 0.04);
    border-color: rgba(24, 59, 99, 0.12);
}

html[data-theme="light"] .ip-label {
    color: var(--text-secondary);
}

html[data-theme="light"] .ip-label i {
    color: var(--text-secondary);
}

html[data-theme="light"] .ip-value {
    background: rgba(255, 255, 255, 0.96);
    border-color: rgba(24, 59, 99, 0.12);
    color: var(--text-color);
}

html[data-theme="light"] .ip-value:hover {
    background: rgba(255, 255, 255, 1);
    border-color: rgba(24, 59, 99, 0.22);
}

html[data-theme="light"] .ip-value.target-ip {
    color: var(--primary-color);
    border-left-color: var(--primary-color);
}

html[data-theme="light"] .ip-value.vpn-ip {
    color: var(--highlight);
    border-left-color: var(--highlight);
}

html[data-theme="light"] .flag-submission-content {
    background: transparent;
    border: none;
}

html[data-theme="light"] .flag-header {
    border-bottom-color: rgba(24, 59, 99, 0.12);
}

html[data-theme="light"] .flag-status-display {
    border-bottom-color: rgba(24, 59, 99, 0.12);
}

html[data-theme="light"] .flag-status-solved {
    background: transparent;
    border: none;
    color: var(--success-color);
}

html[data-theme="light"] .flag-result {
    background: transparent;
    border: none;
    border-top: 1px solid rgba(24, 59, 99, 0.12);
    color: var(--text-secondary);
}

html[data-theme="light"] .flag-result.success {
    color: var(--success-color);
}

html[data-theme="light"] .flag-result.error {
    color: var(--danger-color);
}

html[data-theme="light"] .flag-result.info {
    background: transparent;
    border: none;
    color: var(--text-secondary);
    padding: 0;
    gap: 0;
    align-items: flex-start;
}

html[data-theme="light"] .flag-input-group .form-input {
    background: rgba(255, 255, 255, 0.95);
    border-color: rgba(24, 59, 99, 0.2);
    color: var(--text-color);
}

html[data-theme="light"] .flag-input-group .form-input:focus {
    background: #ffffff;
    border-color: rgba(26, 139, 218, 0.4);
    box-shadow: none;
}

html[data-theme="light"] .flag-hint {
    background: transparent;
    border: none;
}

html[data-theme="light"] .flag-hint i {
    color: var(--primary-color);
}

html[data-theme="light"] .stars-container {
    background: rgba(24, 59, 99, 0.04);
    border-color: rgba(24, 59, 99, 0.12);
    box-shadow: none;
}

html[data-theme="light"] .target-detail-modal::before {
    background: var(--primary-color);
}

html[data-theme="light"] .modal-header {
    background: rgba(255, 255, 255, 0.98);
}

html[data-theme="light"] .modal-header h2 i {
    color: var(--primary-color);
    filter: none;
}

html[data-theme="light"] .modal-content {
    background: #ffffff;
}

html[data-theme="light"] .modal-content::-webkit-scrollbar-thumb {
    background: rgba(24, 59, 99, 0.35);
}

html[data-theme="light"] .modal-left .detail-item,
html[data-theme="light"] .modal-right .description-item {
    background: rgba(255, 255, 255, 0.96);
    border-color: rgba(24, 59, 99, 0.12);
    box-shadow: var(--box-shadow);
}

html[data-theme="light"] .modal-left .detail-item:hover {
    background: rgba(255, 255, 255, 1);
    box-shadow: var(--box-shadow-hover);
}

html[data-theme="light"] .detail-item::before {
    background: var(--primary-color);
}

html[data-theme="light"] .modal-right .description-text {
    background: rgba(255, 255, 255, 0.96);
    border-left-color: var(--primary-color);
    box-shadow: none;
}

html[data-theme="light"] .description-text hr {
    background: rgba(24, 59, 99, 0.2);
}

html[data-theme="light"] .description-text::-webkit-scrollbar-thumb {
    background: rgba(24, 59, 99, 0.35);
}

html[data-theme="light"] .description-text blockquote {
    background: rgba(24, 59, 99, 0.04);
    color: var(--text-secondary);
    border-left-color: var(--primary-color);
}

html[data-theme="light"] .walkthrough-btn {
    color: var(--primary-color);
}

html[data-theme="light"] .modal-close {
    background: rgba(24, 59, 99, 0.06);
    border-color: rgba(24, 59, 99, 0.12);
    color: var(--text-secondary);
}

html[data-theme="light"] .announcement-modal-content {
    background: #ffffff;
    border-color: rgba(24, 59, 99, 0.12);
    box-shadow: 0 16px 40px rgba(67, 89, 122, 0.18);
}

html[data-theme="light"] .announcement-item {
    background: transparent;
    border-bottom-color: rgba(24, 59, 99, 0.08);
}

html[data-theme="light"] .announcement-item .announcement-text {
    color: var(--text-color);
}

html[data-theme="light"] .announcement-item .announcement-tag {
    color: #1473b8;
}

html[data-theme="light"] .announcement-item .announcement-tag-info {
    color: #9a6a06;
}

html[data-theme="light"] .announcement-modal-btn {
    color: var(--text-color);
}

html[data-theme="light"] .announcement-modal-close {
    color: var(--text-secondary);
}

@media (max-width: 992px) {
    .nav-utility-group {
        order: 2;
        flex: 1;
        justify-content: flex-end;
        min-width: 0;
        margin-left: auto;
    }

    .nav-utility-group .user-info-link {
        flex: 1;
        min-width: 0;
    }

    .nav-utility-group .theme-toggle {
        min-height: 40px;
        padding: 0.58rem 0.8rem;
    }

    html[data-theme="light"] .nav-links {
        background-color: var(--secondary-color) !important;
        box-shadow: 0 14px 32px rgba(67, 89, 122, 0.16) !important;
        border-top-color: var(--primary-color) !important;
    }

    html[data-theme="light"] .nav-links a {
        color: var(--text-color) !important;
    }

    html[data-theme="light"] .nav-links a:hover {
        background: rgba(26, 139, 218, 0.08) !important;
        color: var(--text-color) !important;
        box-shadow: 0 6px 14px rgba(26, 139, 218, 0.12) !important;
    }
}

@media (max-width: 720px) {
    .site-header-actions .theme-toggle {
        margin-left: auto;
    }
}

@media (max-width: 480px) {
    .theme-toggle {
        width: 2rem;
        height: 2rem;
    }

    .theme-toggle-floating {
        top: 14px;
        right: 14px;
    }
}