:root {
    --void-black: #000000;
    --text-primary: #e4e2e1;
}

* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
}

body {
    background-color: var(--void-black);
    color: var(--text-primary);
    overflow-x: hidden;
    position: relative;
}

::selection {
    background: rgba(0, 245, 255, 0.35);
    color: #ffffff;
}

.ambient-glow {
    position: fixed;
    width: 100vw;
    height: 100vh;
    pointer-events: none;
    z-index: -1;
    background: radial-gradient(circle at 20% 30%, rgba(0, 245, 255, 0.03) 0%, transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(57, 255, 20, 0.02) 0%, transparent 50%);
}

.svg-line {
    position: absolute;
    pointer-events: none;
    z-index: 0;
}

.line-cyan {
    stroke: #00f5ff;
    stroke-width: 1;
    filter: drop-shadow(0 0 4px rgba(0, 245, 255, 0.5));
    fill: none;
}

.line-green {
    stroke: #39ff14;
    stroke-width: 1;
    filter: drop-shadow(0 0 4px rgba(57, 255, 20, 0.5));
    fill: none;
}

.glow-node {
    fill: #000;
    stroke: #00f5ff;
    stroke-width: 2;
    filter: drop-shadow(0 0 6px rgba(0, 245, 255, 0.8));
}

.glow-node-green {
    stroke: #39ff14;
}

.icon-filled {
    font-variation-settings: "FILL" 1;
}

.stitch-anim-fade-in {
    opacity: 1;
}

.glowing-line {
    background: linear-gradient(90deg, transparent, rgba(0, 245, 255, 0.5), transparent);
    height: 1px;
    width: 100%;
}

.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.no-scrollbar::-webkit-scrollbar {
    display: none;
}

[data-page="neurodivergence"] .kinetic-line {
    position: absolute;
    background: linear-gradient(90deg, transparent, currentColor, transparent);
    opacity: 0.5;
}

[data-page="neurodivergence"] .kinetic-line.horizontal {
    height: 1px;
    width: 100%;
}

[data-page="neurodivergence"] .kinetic-line.vertical {
    width: 1px;
    height: 100%;
}

.user-menu > summary {
    list-style: none;
}

.user-menu > summary::-webkit-details-marker {
    display: none;
}

.text-glow-cyan {
    text-shadow: 0 0 12px rgba(0, 245, 255, 0.6);
}

.text-glow-green {
    text-shadow: 0 0 12px rgba(57, 255, 20, 0.6);
}

.reveal-item {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 480ms ease, transform 480ms ease;
}

.reveal-item.is-visible {
    opacity: 1;
    transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
    .reveal-item {
        transition: none;
        opacity: 1;
        transform: none;
    }
}

@media (max-width: 1023px) {
    .about-connectors {
        display: none;
    }
}

[data-page="articles"] .node {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    position: absolute;
    z-index: 1;
}

[data-page="articles"] .glowing-border-hover:hover {
    border-color: rgba(255, 255, 255, 0.3);
    box-shadow: inset 0 0 20px rgba(255, 255, 255, 0.05), 0 0 20px rgba(255, 255, 255, 0.05);
}

@keyframes drift {
    0% {
        transform: translate(0, 0) scale(1);
        opacity: 0.3;
    }

    50% {
        transform: translate(3%, 5%) scale(1.05);
        opacity: 0.5;
    }

    100% {
        transform: translate(0, 0) scale(1);
        opacity: 0.3;
    }
}

[data-page="articles"] .bg-drifting-cyan {
    animation: drift 15s ease-in-out infinite alternate;
}

[data-page="articles"] .bg-drifting-green {
    animation: drift 18s ease-in-out infinite alternate-reverse;
}

[data-page="articles"] .bg-drifting-pink {
    animation: drift 20s ease-in-out infinite alternate;
}

[data-page="strategies"] .glow-line {
    box-shadow: 0 0 10px rgba(0, 245, 255, 0.5);
}

[data-page="strategies"] [data-strategies-sidebar] {
    isolation: isolate;
}

[data-page="strategies"] [data-strategies-active-line] {
    position: absolute;
}

[data-page="strategies"] .strategies-rail-segment {
    position: absolute;
    left: 0;
    width: 1px;
    background-color: #00f5ff;
    box-shadow: 0 0 10px rgba(0, 245, 255, 0.5);
    border-radius: 999px;
}

[data-page="strategies"] [data-strategy-item] {
    position: relative;
    z-index: 2;
}

[data-page="strategies"] [data-strategy-item-icon] {
    position: relative;
    z-index: 3;
    background-color: rgba(10, 10, 10, 0.95);
    border-color: rgba(255, 255, 255, 0.1);
    transition: border-color 180ms ease, background-color 180ms ease;
}

[data-page="strategies"] [data-strategy-item-label] {
    color: #8c9292;
    transition: color 180ms ease;
}

[data-page="strategies"] [data-strategy-item-glyph] {
    color: #8c9292;
    transition: color 180ms ease;
}

[data-page="strategies"] [data-strategy-item][data-active="true"] [data-strategy-item-icon] {
    border-color: rgba(0, 245, 255, 0.9);
    background-color: rgba(0, 245, 255, 0.1);
}

[data-page="strategies"] [data-strategy-item][data-active="true"] [data-strategy-item-label],
[data-page="strategies"] [data-strategy-item][data-active="true"] [data-strategy-item-glyph] {
    color: #00f5ff;
}

[data-page="strategies"] [data-strategy-item][data-active="false"]:hover [data-strategy-item-icon] {
    border-color: #8c9292;
}

[data-page="strategies"] [data-strategy-item][data-active="false"]:hover [data-strategy-item-label],
[data-page="strategies"] [data-strategy-item][data-active="false"]:hover [data-strategy-item-glyph] {
    color: #ffffff;
}

[data-page="strategies"] .strategies-faq-summary {
    list-style: none;
}

[data-page="strategies"] .strategies-faq-summary::-webkit-details-marker {
    display: none;
}

[data-page="strategies"] .strategies-faq-item .material-symbols-outlined {
    transition: transform 180ms ease;
}

[data-page="strategies"] .strategies-faq-item[open] .material-symbols-outlined {
    transform: rotate(180deg);
}