/* !Единая дизайн-система WorkSpace: общие акценты для светлой и тёмной темы. */
:root {
   /* !Светлая тема здесь означает мягкую сумеречную палитру, а не белый интерфейс. */
   color-scheme: dark;
   --ws-bg: #21172d;
   --ws-bg-deep: #342044;
   --ws-surface: rgba(57, 39, 73, 0.78);
   --ws-surface-strong: #30203f;
   --ws-surface-muted: rgba(75, 49, 94, 0.76);
   --ws-text: #fbf6ff;
   --ws-text-soft: #d0bfdc;
   --ws-border: rgba(222, 177, 246, 0.23);
   --ws-shadow: 0 12px 34px rgba(8, 4, 14, 0.2);
   --ws-shadow-hover: 0 16px 38px rgba(8, 4, 14, 0.3), 0 0 22px rgba(230, 76, 168, 0.1);
   --ws-purple: #7d32c7;
   --ws-pink: #e64ca8;
   --ws-orange: #f59e42;
   --ws-cyan: #25b9db;
   --ws-green: #35b982;
   --ws-focus: rgba(230, 76, 168, 0.3);
   --ws-glow: 0 0 22px rgba(230, 76, 168, 0.12);
}

:root[data-theme='dark'] {
   color-scheme: dark;
   --ws-bg: #0d0916;
   --ws-bg-deep: #1a1028;
   --ws-surface: rgba(28, 20, 42, 0.76);
   --ws-surface-strong: rgba(31, 22, 46, 0.94);
   --ws-surface-muted: rgba(54, 35, 70, 0.68);
   --ws-text: #faf6ff;
   --ws-text-soft: #b8a8c8;
   --ws-border: rgba(222, 177, 246, 0.2);
   --ws-shadow: 0 14px 36px rgba(0, 0, 0, 0.2);
   --ws-shadow-hover: 0 16px 42px rgba(0, 0, 0, 0.32), 0 0 24px rgba(230, 76, 168, 0.12);
   --ws-focus: rgba(230, 76, 168, 0.3);
   --ws-glow: 0 0 0 1px rgba(230, 76, 168, 0.08), 0 0 25px rgba(230, 76, 168, 0.09);
}

html { color-scheme: dark; background: var(--ws-bg); }
html[data-theme='dark'] { color-scheme: dark; }
body {
   color: var(--ws-text);
   background:
      radial-gradient(ellipse at 92% 12%, color-mix(in srgb, var(--ws-pink) 12%, transparent), transparent 34%),
      radial-gradient(ellipse at 8% 78%, color-mix(in srgb, var(--ws-purple) 10%, transparent), transparent 38%),
      linear-gradient(145deg, var(--ws-bg), var(--ws-bg-deep));
   background-attachment: fixed;
   transition: color 240ms ease, background-color 240ms ease;
}

:focus-visible { outline-color: var(--ws-pink); }
.header {
   color: var(--ws-text);
   background: color-mix(in srgb, var(--ws-bg) 72%, transparent);
   border-bottom: 1px solid var(--ws-border);
   backdrop-filter: blur(18px);
   -webkit-backdrop-filter: blur(18px);
}
.logo, .nav a, .header a { color: var(--ws-text); }
.nav a:hover, .nav a[aria-current='page'] { color: var(--ws-pink); }

.card, .subject, .shot, .life-card, .lab-panel, .lab-sidebar, .item, .file,
.subjects > details, .project-docs__link, .github-labs, .github-sync-status,
.markdown-modal__dialog, .dashboard__glass, .dashboard__kpi, .dashboard__chart,
.dashboard__activity, .dashboard__progress, .dashboard__stat {
   color: var(--ws-text);
   background: var(--ws-surface);
   border: 1px solid var(--ws-border);
   box-shadow: var(--ws-shadow);
   backdrop-filter: blur(18px);
   -webkit-backdrop-filter: blur(18px);
}
.card:hover, .subject:hover, .subject[open], .shot:hover, .life-card:hover,
.file:hover, .item:hover, .item[aria-current='true'], .project-docs__link:hover {
   border-color: color-mix(in srgb, var(--ws-pink) 62%, var(--ws-border));
   box-shadow: var(--ws-shadow-hover), var(--ws-glow);
}
.card__subject, .page-head__subject { color: var(--ws-purple); }
:root[data-theme='dark'] .card__subject,
:root[data-theme='dark'] .page-head__subject { color: #e9a6ff; }

.search, input, textarea, select {
   color: var(--ws-text);
   background: var(--ws-surface-strong);
   border: 1px solid var(--ws-border);
}
.search::placeholder, input::placeholder, textarea::placeholder { color: var(--ws-text-soft); }
.search:focus, input:focus, textarea:focus, select:focus {
   border-color: var(--ws-pink);
   box-shadow: 0 0 0 3px var(--ws-focus);
   outline: none;
}
.tag-filter, .tag, .mobile-menu__nav {
   color: var(--ws-text);
   background: var(--ws-surface-muted);
   border: 1px solid var(--ws-border);
}
.tag-filter:hover, .tag-filter[aria-pressed='true'], .tag:hover {
   color: var(--ws-text);
   border-color: var(--ws-pink);
   background: color-mix(in srgb, var(--ws-pink) 12%, var(--ws-surface));
   box-shadow: var(--ws-glow);
}
button:not(.theme-toggle):not(.github-sync), .btn {
   color: var(--ws-text);
   border-color: var(--ws-border);
}
.btn-primary, .button-primary, .hero__button {
   color: #fff;
   background: linear-gradient(110deg, var(--ws-purple), var(--ws-pink));
   border-color: transparent;
}
.theme-toggle {
   color: var(--ws-text);
   background: var(--ws-surface);
   border-color: var(--ws-border);
   box-shadow: var(--ws-shadow);
}
.theme-toggle:hover { border-color: var(--ws-pink); box-shadow: var(--ws-glow); }
.footer { color: var(--ws-text-soft); border-color: var(--ws-border); }

/* !В основной теме используем сумеречный фиолетовый фон вместо белого, сохраняя читаемость. */
.hero::before {
   background: radial-gradient(circle, color-mix(in srgb, var(--ws-pink) 16%, transparent), transparent 68%);
}
::selection { color: #fff; background: var(--ws-purple); }

/* !В тёмной теме сохраняем те же розовый, оранжевый и голубой акценты. */
:root[data-theme='dark'] .header {
   background: rgba(13, 9, 22, 0.62);
   border-bottom-color: var(--ws-border);
}
:root[data-theme='dark'] .mobile-menu__nav {
   background: rgba(22, 14, 34, 0.96);
}

@media (prefers-reduced-motion: reduce) {
   *, *::before, *::after { scroll-behavior: auto !important; transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}

/* !Неоновая версия единой темы: обе палитры используют одни и те же акценты. */
:root {
   --ws-bg: #241333;
   --ws-bg-deep: #42205d;
   --ws-surface: rgba(66, 43, 88, 0.72);
   --ws-surface-strong: rgba(43, 27, 61, 0.9);
   --ws-surface-muted: rgba(100, 61, 128, 0.45);
   --ws-text: #fffaff;
   --ws-text-soft: #d9c6e9;
   --ws-border: rgba(221, 154, 255, 0.36);
   --ws-shadow: 0 14px 40px rgba(16, 5, 28, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.07);
   --ws-shadow-hover: 0 18px 44px rgba(14, 4, 25, 0.3), 0 0 18px rgba(230, 76, 168, 0.2), 0 0 34px rgba(125, 50, 199, 0.16);
   --ws-purple: #a653ff;
   --ws-pink: #ff5fc8;
   --ws-orange: #ffad52;
   --ws-cyan: #45dcff;
   --ws-green: #53e6a8;
   --ws-focus: rgba(255, 95, 200, 0.34);
   --ws-glow: 0 0 0 1px rgba(255, 95, 200, 0.12), 0 0 26px rgba(255, 95, 200, 0.16);
}

:root[data-theme='dark'] {
   --ws-bg: #0b0713;
   --ws-bg-deep: #1b0b2a;
   --ws-surface: rgba(26, 16, 41, 0.76);
   --ws-surface-strong: rgba(19, 12, 31, 0.94);
   --ws-surface-muted: rgba(67, 34, 88, 0.55);
   --ws-text: #fffaff;
   --ws-text-soft: #c3afd7;
   --ws-border: rgba(223, 139, 255, 0.32);
   --ws-shadow: 0 16px 42px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.045);
   --ws-shadow-hover: 0 18px 48px rgba(0, 0, 0, 0.4), 0 0 22px rgba(255, 95, 200, 0.19), 0 0 38px rgba(69, 220, 255, 0.07);
   --ws-purple: #a653ff;
   --ws-pink: #ff5fc8;
   --ws-orange: #ffad52;
   --ws-cyan: #45dcff;
   --ws-green: #53e6a8;
   --ws-focus: rgba(255, 95, 200, 0.34);
   --ws-glow: 0 0 0 1px rgba(255, 95, 200, 0.13), 0 0 28px rgba(255, 95, 200, 0.13);
}

body {
   background:
      radial-gradient(ellipse at 88% 8%, color-mix(in srgb, var(--ws-pink) 21%, transparent), transparent 32%),
      radial-gradient(ellipse at 7% 72%, color-mix(in srgb, var(--ws-cyan) 12%, transparent), transparent 30%),
      radial-gradient(ellipse at 55% 105%, color-mix(in srgb, var(--ws-purple) 25%, transparent), transparent 42%),
      linear-gradient(135deg, var(--ws-bg), var(--ws-bg-deep));
   background-attachment: fixed;
}

.card, .subject, .shot, .life-card, .lab-panel, .lab-sidebar, .item, .file,
.subjects > details, .project-docs__link, .github-labs, .github-sync-status,
.markdown-modal__dialog, .dashboard__glass, .dashboard__kpi, .dashboard__chart,
.dashboard__activity, .dashboard__progress, .dashboard__stat {
   border-color: var(--ws-border);
   box-shadow: var(--ws-shadow), inset 0 0 22px rgba(190, 93, 255, 0.035);
}

.card:hover, .subject:hover, .subject[open], .shot:hover, .life-card:hover,
.file:hover, .item:hover, .item[aria-current='true'], .project-docs__link:hover {
   border-color: var(--ws-pink);
   box-shadow: var(--ws-shadow-hover), var(--ws-glow);
}

.btn-primary, .button-primary, .hero__button {
   background: linear-gradient(110deg, #8b35e8 0%, #d943d5 58%, #ff6bc8 100%);
   box-shadow: 0 0 18px rgba(230, 76, 220, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.24);
   transition: transform 180ms ease, box-shadow 180ms ease, filter 180ms ease;
}

.btn-primary:hover, .button-primary:hover, .hero__button:hover {
   filter: saturate(1.16) brightness(1.08);
   box-shadow: 0 0 24px rgba(255, 95, 200, 0.32), 0 0 42px rgba(125, 50, 199, 0.2);
   transform: translateY(-2px);
}

.tag-filter[aria-pressed='true'], .tag-filter:hover, .tag:hover {
   box-shadow: 0 0 14px rgba(255, 95, 200, 0.13), inset 0 0 14px rgba(166, 83, 255, 0.08);
}

.header {
   box-shadow: 0 1px 0 rgba(255, 255, 255, 0.025), 0 8px 32px rgba(10, 4, 20, 0.08);
}

:root[data-theme='dark'] .header {
   background: rgba(11, 7, 19, 0.72);
}

:root:not([data-theme='dark']) .header {
   background: rgba(36, 19, 51, 0.58);
}

/* !Одинаковые смысловые цвета сохраняются в обеих темах. */
.status--success, .text-success { color: var(--ws-green); }
.status--warning, .text-warning { color: var(--ws-orange); }
.status--info, .text-info { color: var(--ws-cyan); }

@media (prefers-reduced-motion: no-preference) {
   .theme-toggle:hover, .github-sync:hover {
      box-shadow: 0 0 0 1px rgba(255, 95, 200, 0.25), 0 0 22px rgba(255, 95, 200, 0.18);
   }
}

/* !Точечная неоновая настройка главного проекта, статистики и синхронизации. */
.life-card {
   isolation: isolate;
   border: 1px solid rgba(255, 95, 200,  0.62) !important;
   background:
      radial-gradient(ellipse at 92% 8%, rgba(255, 95, 200, 0.22), transparent 42%),
      radial-gradient(ellipse at 8% 100%, rgba(69, 220, 255, 0.10), transparent 48%),
      linear-gradient(125deg, rgba(30, 15, 45, 0.96), rgba(75, 25, 103, 0.94)) !important;
   box-shadow:
      0 0 0 1px rgba(166, 83, 255, 0.2),
      0 0 22px rgba(166, 83, 255, 0.17),
      0 0 44px rgba(255, 95, 200, 0.10),
      inset 0 1px 0 rgba(255, 255, 255, 0.11) !important;
   transition: border-color 220ms ease, box-shadow 220ms ease, transform 220ms ease;
}

.life-card::after {
   content: '';
   position: absolute;
   z-index: -1;
   inset: 0;
   border-radius: inherit;
   pointer-events: none;
   background: linear-gradient(115deg, transparent 25%, rgba(255, 95, 200, 0.07), transparent 72%);
}

.life-card:hover,
a.life-card:hover {
   border-color: #ff5fc8 !important;
   box-shadow:
      0 0 0 1px rgba(255, 95, 200, 0.36),
      0 0 28px rgba(255, 95, 200, 0.28),
      0 0 58px rgba(166, 83, 255, 0.22),
      inset 0 0 28px rgba(166, 83, 255, 0.09) !important;
   transform: translateY(-2px);
}

:root[data-theme='dark'] .life-card {
   background:
      radial-gradient(ellipse at 92% 8%, rgba(255, 95, 200, 0.17), transparent 40%),
      radial-gradient(ellipse at 10% 100%, rgba(69, 220, 255, 0.08), transparent 46%),
      linear-gradient(125deg, rgba(16, 8, 27, 0.98), rgba(36, 12, 53, 0.98)) !important;
   border-color: rgba(255, 95, 200, 0.54) !important;
   box-shadow:
      0 0 0 1px rgba(166, 83, 255, 0.15),
      0 0 24px rgba(166, 83, 255, 0.13),
      0 0 38px rgba(255, 95, 200, 0.07),
      inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

/* !Дашборд не должен терять неоновый контраст в тёмной теме. */
.dashboard__glass {
   background:
      radial-gradient(ellipse at 100% 0%, rgba(166, 83, 255, 0.14), transparent 48%),
      linear-gradient(135deg, rgba(48, 27, 66, 0.91), rgba(25, 14, 39, 0.93)) !important;
   border-color: rgba(223, 139, 255, 0.42) !important;
   box-shadow:
      0 0 0 1px rgba(166, 83, 255, 0.12),
      0 0 24px rgba(166, 83, 255, 0.13),
      0 16px 44px rgba(0, 0, 0, 0.2),
      inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

.dashboard__kpi {
   background: rgba(28, 15, 43, 0.55) !important;
   border-color: rgba(223, 139, 255, 0.34) !important;
   box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

.dashboard__kpi:hover {
   border-color: rgba(255, 95, 200, 0.86) !important;
   background: rgba(68, 28, 88, 0.68) !important;
   box-shadow: 0 0 0 1px rgba(255, 95, 200, 0.12), 0 0 22px rgba(255, 95, 200, 0.16) !important;
}

.dashboard__bar-track {
   border-color: rgba(223, 139, 255, 0.28) !important;
   background: rgba(13, 7, 22, 0.7) !important;
}

.dashboard__bar-fill {
   background: linear-gradient(90deg, #8b35e8 0%, #d943d5 56%, #ff5fc8 82%, #45dcff 100%) !important;
   box-shadow: 0 0 12px rgba(166, 83, 255, 0.62), 0 0 24px rgba(255, 95, 200, 0.34) !important;
}

:root[data-theme='dark'] .dashboard__glass {
   background:
      radial-gradient(ellipse at 100% 0%, rgba(166, 83, 255, 0.12), transparent 46%),
      linear-gradient(135deg, rgba(24, 13, 38, 0.96), rgba(13, 7, 22, 0.97)) !important;
   border-color: rgba(223, 139, 255, 0.38) !important;
   box-shadow:
      0 0 0 1px rgba(166, 83, 255, 0.10),
      0 0 24px rgba(166, 83, 255, 0.10),
      0 18px 46px rgba(0, 0, 0, 0.32),
      inset 0 1px 0 rgba(255, 255, 255, 0.045) !important;
}

:root[data-theme='dark'] .dashboard__kpi {
   background: rgba(16, 9, 27, 0.72) !important;
}

/* !Кнопка синхронизации получает стеклянную поверхность вместо тяжёлого чёрного вида. */
.github-sync {
   color: #fffaff !important;
   background:
      radial-gradient(circle at 20% 10%, rgba(69, 220, 255, 0.12), transparent 54%),
      linear-gradient(135deg, rgba(87, 42, 120, 0.62), rgba(35, 19, 53, 0.8)) !important;
   border: 1px solid rgba(223, 139, 255, 0.68) !important;
   box-shadow: 0 0 0 1px rgba(166, 83, 255, 0.14), 0 0 16px rgba(166, 83, 255, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}

.github-sync:hover {
   color: #ffffff !important;
   background: linear-gradient(125deg, rgba(125, 50, 199, 0.86), rgba(230, 76, 168, 0.72)) !important;
   border-color: #ff5fc8 !important;
   box-shadow: 0 0 0 1px rgba(255, 95, 200, 0.24), 0 0 20px rgba(255, 95, 200, 0.24), 0 0 34px rgba(166, 83, 255, 0.16) !important;
   transform: translateY(-2px);
}

.github-sync__icon svg {
   filter: drop-shadow(0 0 4px rgba(255, 95, 200, 0.38));
}

:root[data-theme='dark'] .github-sync {
   background: linear-gradient(135deg, rgba(49, 25, 70, 0.78), rgba(22, 13, 35, 0.9)) !important;
   border-color: rgba(223, 139, 255, 0.58) !important;
}

@media (prefers-reduced-motion: reduce) {
   .life-card, .github-sync { transition: none !important; }
}

/* !Плавно растворяем декоративные волны в фоне следующей секции, чтобы низ hero не обрывался полосой. */
.hero__waves {
   bottom: -2px;
   height: clamp(190px, 32vh, 360px);
   opacity: 0.24;
   filter: drop-shadow(0 -8px 26px rgba(201, 50, 255, 0.12));
   -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 38%, rgba(0, 0, 0, 0.7) 62%, transparent 100%);
   mask-image: linear-gradient(to bottom, #000 0%, #000 38%, rgba(0, 0, 0, 0.7) 62%, transparent 100%);
}

.hero::after {
   content: '';
   position: absolute;
   z-index: 0;
   inset: auto 0 -1px;
   height: clamp(100px, 16vh, 190px);
   pointer-events: none;
   background: linear-gradient(to bottom, transparent, var(--ws-bg) 96%);
}

.hero__content { z-index: 1; }
.footer {
   border-top-color: rgba(190, 93, 255, 0.2);
   background:
      radial-gradient(ellipse at 50% 0%, rgba(166, 83, 255, 0.09), transparent 68%),
      linear-gradient(to bottom, color-mix(in srgb, var(--ws-bg) 88%, transparent), var(--ws-bg));
   box-shadow: 0 -12px 40px rgba(166, 83, 255, 0.035);
}

/* !Админ-панель: та же стеклянная неоновая система, что и остальной WorkSpace. */
.ws-admin { position: fixed; inset: 0; z-index: 10000; display: grid; place-items: center; padding: 20px; color: #fbf6ff; font-family: var(--font, Montserrat, sans-serif); }
.ws-admin__backdrop { position: absolute; inset: 0; background: rgba(5, 2, 12, .76); backdrop-filter: blur(12px); }
.ws-admin__dialog { position: relative; width: min(900px, 100%); max-height: min(92vh, 1000px); overflow: auto; border: 1px solid rgba(230, 76, 220, .62); border-radius: 24px; background: radial-gradient(ellipse at 100% 0%, rgba(166, 83, 255, .18), transparent 48%), linear-gradient(145deg, #21132f, #100a1b 78%); box-shadow: 0 0 0 1px rgba(166,83,255,.16), 0 0 42px rgba(166,83,255,.2), 0 0 80px rgba(230,76,168,.1); }
.ws-admin__header { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 22px 26px; background: rgba(20, 11, 31, .9); border-bottom: 1px solid rgba(222,177,246,.18); backdrop-filter: blur(18px); }
.ws-admin__header p { margin: 0 0 4px; color: #e6a6ff; font-size: .72rem; font-weight: 800; letter-spacing: .16em; }
.ws-admin__header h2 { margin: 0; font-size: clamp(1.2rem, 3vw, 1.65rem); }
.ws-admin__close { width: 40px; height: 40px; border: 1px solid rgba(223,139,255,.4); border-radius: 12px; background: rgba(166,83,255,.12); color: #fff; font-size: 1.6rem; cursor: pointer; }
.ws-admin__content { padding: 22px 26px 28px; }
.ws-admin__token { margin-bottom: 24px; padding: 16px; border: 1px solid rgba(223,139,255,.26); border-radius: 16px; background: rgba(166,83,255,.055); }
.ws-admin__token summary { cursor: pointer; font-weight: 700; }
.ws-admin__field { display: grid; gap: 7px; margin: 15px 0; min-width: 0; }
.ws-admin__field > span { color: #d8c5e8; font-size: .88rem; font-weight: 600; }
.ws-admin__field input, .ws-admin__field textarea, .ws-admin__field select { width: 100%; min-width: 0; border: 1px solid rgba(223,139,255,.28); border-radius: 11px; padding: 11px 12px; background: rgba(9,5,17,.78); color: #fbf6ff; font: inherit; }
.ws-admin__field input:focus, .ws-admin__field textarea:focus, .ws-admin__field select:focus { outline: 2px solid rgba(230,76,168,.52); border-color: #e64ca8; }
.ws-admin__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.ws-admin__files { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; }
.ws-admin__hint { color: #b8a8c8; font-size: .8rem; line-height: 1.55; }
.ws-admin__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.ws-admin__button { border: 1px solid rgba(223,139,255,.45); border-radius: 11px; padding: 11px 15px; color: #fff; background: linear-gradient(120deg, rgba(125,50,199,.4), rgba(230,76,168,.18)); cursor: pointer; font: inherit; font-weight: 700; box-shadow: 0 0 16px rgba(166,83,255,.08); }
.ws-admin__button:hover { border-color: #ff5fc8; box-shadow: 0 0 20px rgba(255,95,200,.2); }
.ws-admin__button:disabled { opacity: .55; cursor: wait; }
.ws-admin__button--primary { background: linear-gradient(110deg, #8b35e8, #d943d5 58%, #ff6bc8); box-shadow: 0 0 22px rgba(230,76,220,.2); }
.ws-admin__button--quiet { background: rgba(255,255,255,.035); }
.ws-admin__message { overflow-wrap: anywhere; margin-top: 16px; color: #d8c5e8; font-size: .9rem; }
.ws-admin__message[data-kind="success"] { color: #70e8bd; }
.ws-admin__message[data-kind="error"] { color: #ff9dbf; }
@media (max-width: 620px) { .ws-admin { padding: 8px; } .ws-admin__dialog { max-height: 96vh; border-radius: 16px; } .ws-admin__header, .ws-admin__content { padding: 17px; } .ws-admin__grid, .ws-admin__files { grid-template-columns: 1fr; gap: 0; } }

/* !Убираем лишнее пустое пространство между дашбордом и списком предметов. */
.hero {
   min-height: auto;
   padding-top: calc(var(--header-h) + 36px);
   padding-bottom: clamp(64px, 8vh, 88px);
}

#tasks.section {
   padding-top: clamp(48px, 6vh, 68px);
}

.hero__waves {
   height: clamp(140px, 24vh, 260px);
   opacity: 0.2;
   -webkit-mask-image: linear-gradient(to bottom, #000 0%, rgba(0, 0, 0, 0.72) 34%, rgba(0, 0, 0, 0.22) 66%, transparent 100%);
   mask-image: linear-gradient(to bottom, #000 0%, rgba(0, 0, 0, 0.72) 34%, rgba(0, 0, 0, 0.22) 66%, transparent 100%);
}

.hero::after {
   height: clamp(72px, 11vh, 128px);
   background: linear-gradient(to bottom, transparent 0%, color-mix(in srgb, var(--ws-bg) 62%, transparent) 48%, var(--ws-bg) 100%);
}

/* !Ссылка на документацию остаётся текстовой, без рамки и карточного фона. */
.project-docs__link {
   display: inline-flex;
   align-items: center;
   gap: 0.45rem;
   padding: 0;
   border: 0;
   border-radius: 0;
   background: transparent;
   box-shadow: none;
   -webkit-backdrop-filter: none;
   backdrop-filter: none;
   color: #d7a6ff;
   text-decoration: none;
   text-shadow: 0 0 12px rgba(166, 83, 255, 0.18);
}

.project-docs__link:hover {
   gap: 0.65rem;
   border: 0;
   background: transparent;
   box-shadow: none;
   color: #ff8cde;
   text-decoration: underline;
   text-shadow: 0 0 14px rgba(230, 76, 168, 0.42);
}

.project-docs__link:focus-visible {
   outline: 2px solid var(--ws-pink);
   outline-offset: 5px;
   border-radius: 2px;
}


/* !Кнопка панели публикации лабораторных: доступна без горячих клавиш. */
.admin-panel-trigger {
   display: grid;
   place-items: center;
   flex: 0 0 auto;
   width: 54px;
   height: 54px;
   padding: 0;
   color: #f8eaff;
   cursor: pointer;
   border: 1px solid rgba(230, 76, 220, .58);
   border-radius: 14px;
   background: linear-gradient(135deg, rgba(125, 50, 199, .22), rgba(230, 76, 168, .12));
   box-shadow: 0 0 18px rgba(166, 83, 255, .13), inset 0 0 12px rgba(230, 76, 168, .035);
   backdrop-filter: blur(16px);
   -webkit-backdrop-filter: blur(16px);
   transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

.admin-panel-trigger svg { width: 23px; height: 23px; }
.admin-panel-trigger:hover {
   transform: translateY(-2px);
   border-color: #ff72d4;
   background: linear-gradient(135deg, rgba(153, 57, 235, .34), rgba(230, 76, 168, .22));
   box-shadow: 0 0 16px rgba(166, 83, 255, .28), 0 0 30px rgba(230, 76, 168, .16);
}
.admin-panel-trigger:focus-visible { outline: 2px solid #ff72d4; outline-offset: 4px; }
@media (max-width: 760px) {
   .admin-panel-trigger { width: 44px; height: 44px; border-radius: 50%; }
}
@media (prefers-reduced-motion: reduce) {
   .admin-panel-trigger { transition: none; }
}


/* !Плавный переход между главным экраном и предметами без горизонтальной полосы. */
body {
   background:
      radial-gradient(ellipse at 82% 8%, rgba(173, 65, 220, 0.16) 0%, transparent 42%),
      radial-gradient(ellipse at 12% 42%, rgba(100, 48, 158, 0.15) 0%, transparent 46%),
      radial-gradient(ellipse at 78% 78%, rgba(222, 72, 190, 0.09) 0%, transparent 48%),
      linear-gradient(155deg, #21132f 0%, #29163b 42%, #321b45 72%, #251432 100%);
   background-attachment: fixed;
}

.hero {
   background: transparent;
}

#tasks.section {
   position: relative;
   isolation: isolate;
   background: transparent;
}

.hero__waves {
   opacity: 0.08;
   -webkit-mask-image: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.45) 24%, rgba(0, 0, 0, 0.2) 58%, transparent 100%);
   mask-image: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.45) 24%, rgba(0, 0, 0, 0.2) 58%, transparent 100%);
}

.hero::after {
   height: clamp(180px, 24vh, 300px);
   background: linear-gradient(
      to bottom,
      transparent 0%,
      rgba(38, 21, 53, 0.12) 24%,
      rgba(42, 23, 59, 0.18) 58%,
      rgba(46, 25, 63, 0.04) 82%,
      transparent 100%
   );
}

[data-theme='dark'] body {
   background:
      radial-gradient(ellipse at 84% 8%, rgba(128, 57, 171, 0.13) 0%, transparent 43%),
      radial-gradient(ellipse at 12% 45%, rgba(79, 42, 124, 0.12) 0%, transparent 46%),
      radial-gradient(ellipse at 76% 80%, rgba(181, 58, 153, 0.07) 0%, transparent 48%),
      linear-gradient(155deg, #100b18 0%, #171020 48%, #1d1128 76%, #120c1a 100%);
   background-attachment: fixed;
}