/* =========================================================
   Ai PANTHIYA — REUSABLE COMPONENTS
   Theme: Midnight navy, cyan and magenta
   Gold, mint and coral communicate learning and status
   ========================================================= */


/* =========================================================
   SITE HEADER
   ========================================================= */

.site-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(1, 3, 20, 0.96);
    color: var(--color-text);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

.header-inner {
    display: flex;
    min-height: 76px;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-xl);
}

.site-logo {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.site-logo img {
    width: 48px;
    height: 48px;
    object-fit: contain;
}

.site-logo__text {
    display: flex;
    flex-direction: column;
    line-height: 1.05;
}

.site-logo__title {
    color: var(--color-text);
    font-size: 1rem;
    font-weight: 900;
}

.site-logo__subtitle {
    margin-top: 3px;
    color: var(--color-primary);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.main-nav {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: clamp(0.65rem, 1vw, 1.05rem);
    margin-left: auto;
}
.dictionary-tree-node__row[data-dictionary-row]{cursor:pointer}

.main-nav a {
    position: relative;
    color: var(--color-text);
    font-size: 0.82rem;
    font-weight: 700;
    transition:
        color var(--transition),
        transform var(--transition);
}

.main-nav a::after {
    position: absolute;
    right: 0;
    bottom: -10px;
    left: 0;
    height: 2px;
    border-radius: var(--radius-pill);
    background: var(--color-primary);
    content: "";
    opacity: 0;
    transform: scaleX(0.4);
    transition:
        opacity var(--transition),
        transform var(--transition);
}

.main-nav a:hover,
.main-nav a[aria-current="page"] {
    color: var(--color-primary);
}

.main-nav a:hover::after,
.main-nav a[aria-current="page"]::after {
    opacity: 1;
    transform: scaleX(1);
}

.header-actions {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
}

.mobile-menu-button {
    display: none;
    width: 46px;
    height: 46px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.04);
    color: var(--color-text);
    font-size: 1.45rem;
    line-height: 1;
}

.mobile-menu-button:hover {
    border-color: rgba(58, 173, 251, 0.4);
    color: var(--color-primary);
}


/* =========================================================
   BUTTONS
   ========================================================= */

.button {
    display: inline-flex;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    padding: 0.82rem 1.3rem;
    border: 2px solid transparent;
    border-radius: var(--radius-pill);
    font-weight: 800;
    line-height: 1;
    transition:
        transform var(--transition),
        background var(--transition),
        border-color var(--transition),
        color var(--transition),
        box-shadow var(--transition);
}

.button:hover {
    transform: translateY(-2px);
}

.button:active {
    transform: translateY(0);
}

.button--primary {
    background: var(--color-primary);
    color: var(--color-on-primary);
    box-shadow: 0 10px 30px rgba(58, 173, 251, 0.18);
}

.button--primary:hover {
    background: var(--color-primary);
    box-shadow: 0 14px 36px rgba(58, 173, 251, 0.25);
}

.button--dark {
    background: var(--color-surface-dark);
    color: var(--color-text);
}

.button--dark:hover {
    background: var(--color-surface-raised);
}

.button--outline {
    border-color: rgba(255, 255, 255, 0.55);
    background: transparent;
    color: var(--color-text);
}

.button--outline:hover {
    border-color: var(--color-primary);
    background: rgba(58, 173, 251, 0.08);
    color: var(--color-primary);
}

.button--light-outline {
    border-color: var(--color-border);
    background: transparent;
    color: var(--color-text);
}

.button--light-outline:hover {
    border-color: var(--color-primary);
    background: rgba(58, 173, 251, 0.1);
}

.button--red {
    background: var(--color-magenta);
    color: var(--color-text);
}

.button--red:hover {
    background: var(--color-magenta-hover);
}


/* =========================================================
   HERO SECTION
   ========================================================= */

.hero {
    position: relative;
    overflow: hidden;
    padding-block: 100px;
    background:
        radial-gradient(circle at 82% 20%,
            rgba(58, 173, 251, 0.2),
            transparent 30%),
        linear-gradient(135deg,
            var(--color-surface-dark) 0%,
            var(--color-surface-raised) 55%,
            var(--color-surface-dark) 100%);
    color: var(--color-text);
}

.hero::before {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(rgba(255, 255, 255, 0.015) 1px,
            transparent 1px),
        linear-gradient(90deg,
            rgba(255, 255, 255, 0.015) 1px,
            transparent 1px);
    background-size: 42px 42px;
    content: "";
    opacity: 0.45;
    pointer-events: none;
}

.hero::after {
    position: absolute;
    right: -140px;
    bottom: -210px;
    width: 520px;
    height: 520px;
    border: 1px solid rgba(58, 173, 251, 0.18);
    border-radius: 50%;
    content: "";
    pointer-events: none;
}

.hero-grid {
    position: relative;
    z-index: 2;
    display: grid;
    align-items: center;
    grid-template-columns: 1.08fr 0.92fr;
    gap: 4rem;
}

.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: var(--space-lg);
    padding: 0.56rem 0.95rem;
    border: 1px solid rgba(58, 173, 251, 0.35);
    border-radius: var(--radius-pill);
    background: rgba(58, 173, 251, 0.08);
    color: var(--color-primary);
    font-size: 0.85rem;
    font-weight: 800;
    letter-spacing: 0.01em;
}

.hero-badge::before {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--color-primary);
    content: "";
    box-shadow: 0 0 16px rgba(58, 173, 251, 0.8);
}

.hero-title {
    max-width: 850px;
    margin-bottom: var(--space-lg);
    color: var(--color-text);
    font-size: clamp(3rem, 6.5vw, 5.7rem);
    font-weight: 950;
    letter-spacing: -0.055em;
    line-height: 0.98;
}

.hero-title span {
    color: var(--color-primary);
}

.hero-sinhala-tagline {
    position: relative;
    max-width: 720px;
    margin: -0.15rem 0 var(--space-lg);
    padding-left: 18px;
    color: var(--color-primary);
    font-family:
        "Noto Sans Sinhala",
        "Iskoola Pota",
        "Segoe UI",
        sans-serif;
    font-size: clamp(1.08rem, 2vw, 1.42rem);
    font-weight: 750;
    line-height: 1.7;
    letter-spacing: 0;
}

.hero-sinhala-tagline::before {
    position: absolute;
    top: 0.42em;
    bottom: 0.42em;
    left: 0;
    width: 4px;
    border-radius: var(--radius-pill);
    background: var(--color-primary);
    content: "";
}

.hero-description {
    max-width: 690px;
    margin-bottom: var(--space-xl);
    color: var(--color-text-muted);
    font-size: clamp(1.05rem, 2vw, 1.22rem);
    line-height: 1.72;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-md);
}


/* =========================================================
   HERO PHOTO AREA
   ========================================================= */

.hero-visual {
    position: relative;
    display: flex;
    min-height: 540px;
    align-items: center;
    justify-content: center;
}

.ai-orbit {
    position: absolute;
    inset: 50% auto auto 50%;
    width: 430px;
    height: 430px;
    border: 1px solid rgba(58, 173, 251, 0.22);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    animation: orbit-pulse 6s ease-in-out infinite;
}

.ai-orbit::before,
.ai-orbit::after {
    position: absolute;
    inset: 50% auto auto 50%;
    border-radius: 50%;
    content: "";
    transform: translate(-50%, -50%);
}

.ai-orbit::before {
    width: 320px;
    height: 320px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.ai-orbit::after {
    width: 210px;
    height: 210px;
    border: 1px solid rgba(58, 173, 251, 0.12);
}

.hero-photo-card {
    position: relative;
    z-index: 3;
    width: min(100%, 430px);
    padding: 20px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 30px;
    background:
        linear-gradient(180deg,
            rgba(255, 255, 255, 0.07) 0%,
            rgba(255, 255, 255, 0.025) 100%);
    box-shadow:
        0 24px 80px rgba(0, 0, 0, 0.42),
        0 0 0 1px rgba(58, 173, 251, 0.03) inset;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.hero-photo-card::before {
    position: absolute;
    top: 24px;
    right: -12px;
    width: 72px;
    height: 72px;
    border-radius: 22px;
    background: rgba(58, 173, 251, 0.12);
    content: "";
    filter: blur(1px);
    transform: rotate(16deg);
}

.hero-photo-card::after {
    position: absolute;
    bottom: 82px;
    left: -14px;
    width: 46px;
    height: 46px;
    border: 1px solid rgba(58, 173, 251, 0.28);
    border-radius: 50%;
    content: "";
}

.hero-photo-frame {
    position: relative;
    display: flex;
    min-height: 460px;
    align-items: flex-end;
    justify-content: center;
    overflow: hidden;
    border: 1px solid rgba(58, 173, 251, 0.24);
    border-radius: 22px;
    background:
        radial-gradient(circle at 50% 18%,
            rgba(58, 173, 251, 0.15),
            transparent 42%),
        linear-gradient(180deg,
            var(--color-surface-raised) 0%,
            var(--color-surface-dark) 100%);
}

.hero-photo-frame::before {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(120deg,
            transparent 0%,
            rgba(255, 255, 255, 0.04) 45%,
            transparent 70%);
    content: "";
}

.hero-photo-frame::after {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 34%;
    background:
        linear-gradient(180deg,
            transparent,
            rgba(0, 0, 0, 0.34));
    content: "";
    pointer-events: none;
}

.hero-brand-mark {
    position: absolute;
    top: 12px;
    left: 50%;
    z-index: 1;
    display: block;
    width: min(74%, 280px);
    height: auto;
    pointer-events: none;
    transform: translateX(-50%);
    filter: drop-shadow(0 0 18px rgba(188, 14, 165, 0.34));
}

.hero-photo {
    position: relative;
    z-index: 2;
    display: block;
    width: 100%;
    max-width: 365px;
    height: auto;
    object-fit: contain;
    filter: drop-shadow(0 20px 35px rgba(0, 0, 0, 0.38));
}

.hero-photo-info {
    position: relative;
    z-index: 3;
    padding-top: 18px;
}

.hero-photo-role {
    margin-bottom: 5px;
    color: var(--color-primary);
    font-size: 0.78rem;
    font-weight: 850;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.hero-photo-name {
    margin-bottom: 6px;
    color: var(--color-text);
    font-size: 1.45rem;
    line-height: 1.2;
}

.hero-photo-tagline {
    margin: 0;
    color: var(--color-text-muted);
    font-size: 0.94rem;
    line-height: 1.5;
}

.hero-photo-badge {
    position: absolute;
    top: 42px;
    left: 2px;
    z-index: 4;
    padding: 0.58rem 0.82rem;
    border: 1px solid rgba(58, 173, 251, 0.28);
    border-radius: var(--radius-pill);
    background: rgba(1, 3, 20, 0.88);
    color: var(--color-primary);
    font-size: 0.76rem;
    font-weight: 800;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.25);
    backdrop-filter: blur(10px);
}

@keyframes orbit-pulse {

    0%,
    100% {
        opacity: 0.85;
        transform: translate(-50%, -50%) scale(1);
    }

    50% {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1.03);
    }
}


/* =========================================================
   SECTION HEADER BLOCKS
   ========================================================= */

.section-heading {
    max-width: 780px;
    margin-bottom: var(--space-2xl);
}

.section-heading--center {
    margin-inline: auto;
    text-align: center;
}

.section-label {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    margin-bottom: var(--space-sm);
    color: var(--color-primary);
    font-size: 0.82rem;
    font-weight: 850;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.section-label::before {
    width: 24px;
    height: 3px;
    border-radius: var(--radius-pill);
    background: var(--color-primary);
    content: "";
}

.section--dark .section-label {
    color: var(--color-primary);
}

.section-title {
    margin-bottom: var(--space-md);
    font-size: clamp(2rem, 4vw, 3.4rem);
    font-weight: 900;
    letter-spacing: -0.035em;
}

.section-description {
    color: var(--color-text-muted);
    font-size: 1.08rem;
    line-height: 1.75;
}

.section--dark .section-description {
    color: var(--color-text-muted);
}


/* =========================================================
   CARD GRID
   ========================================================= */

.card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-lg);
}

.card {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
    transition:
        transform var(--transition),
        box-shadow var(--transition),
        border-color var(--transition);
}

.card:hover {
    border-color: rgba(58, 173, 251, 0.48);
    transform: translateY(-5px);
    box-shadow: var(--shadow-md);
}

.card::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 4px;
    background:
        linear-gradient(90deg,
            var(--color-primary),
            var(--color-primary));
    content: "";
}

.card__media {
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: var(--color-surface-raised);
}

.card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 300ms ease;
}

.card:hover .card__media img {
    transform: scale(1.04);
}

.card__content {
    padding: var(--space-xl);
}

.card__tag {
    display: inline-flex;
    margin-bottom: var(--space-md);
    padding: 0.36rem 0.72rem;
    border-radius: var(--radius-pill);
    background: rgba(58, 173, 251, 0.16);
    color: var(--color-primary);
    font-size: 0.76rem;
    font-weight: 850;
}

.card__title {
    margin-bottom: var(--space-sm);
    font-size: 1.35rem;
    font-weight: 850;
}

.card__description {
    margin-bottom: 0;
    color: var(--color-text-muted);
    line-height: 1.7;
}

.card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-md);
    margin-top: var(--space-lg);
    padding-top: var(--space-md);
    border-top: 1px solid var(--color-border);
}

.card__link {
    color: var(--color-text);
    font-weight: 800;
}

.card__link:hover {
    color: var(--color-primary);
}

.nav-more {
    position: relative;
}

.nav-more__button {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--color-text);
    font: inherit;
    font-size: 0.82rem;
    font-weight: 700;
}

.nav-more__button:hover,
.nav-more.is-open .nav-more__button,
.nav-more.is-current .nav-more__button {
    color: var(--color-primary);
}

.nav-more__button span {
    transition: transform var(--transition);
}

.nav-more.is-open .nav-more__button span {
    transform: rotate(180deg);
}

.nav-more__menu {
    position: absolute;
    top: calc(100% + 20px);
    right: 0;
    display: none;
    width: 190px;
    padding: 0.55rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    background: rgba(1, 3, 20, 0.99);
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.35);
}

.nav-more.is-open .nav-more__menu,
.nav-more:focus-within .nav-more__menu {
    display: grid;
}

.nav-more__menu a {
    padding: 0.72rem 0.8rem;
    border-radius: 8px;
}

.nav-more__menu a:hover,
.nav-more__menu a[aria-current="page"] {
    background: rgba(255, 255, 255, 0.06);
}

.nav-more__menu a::after {
    display: none;
}


/* =========================================================
   FEATURE CARDS
   ========================================================= */

.feature-card {
    position: relative;
    min-height: 100%;
    padding: var(--space-xl);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: var(--radius-lg);
    background:
        linear-gradient(180deg,
            rgba(255, 255, 255, 0.05),
            rgba(255, 255, 255, 0.02));
}

.feature-card__icon {
    display: grid;
    width: 54px;
    height: 54px;
    margin-bottom: var(--space-lg);
    place-items: center;
    border-radius: 16px;
    background: var(--color-primary);
    color: var(--color-on-primary);
    font-size: 1.4rem;
    font-weight: 900;
}

.feature-card__title {
    margin-bottom: var(--space-sm);
    color: var(--color-text);
    font-size: 1.3rem;
}

.feature-card__text {
    margin: 0;
    color: var(--color-text-muted);
}


/* =========================================================
   STATS / TRUST ROW
   ========================================================= */

.stats-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--space-md);
}

.stat-card {
    padding: var(--space-lg);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    text-align: center;
}

.stat-card__value {
    margin-bottom: 0.3rem;
    color: var(--color-text);
    font-size: 2rem;
    font-weight: 950;
}

.stat-card__label {
    margin: 0;
    color: var(--color-text-muted);
    font-size: 0.9rem;
}


/* =========================================================
   CALLOUT / CTA
   ========================================================= */

.cta-panel {
    position: relative;
    overflow: hidden;
    padding: clamp(2rem, 5vw, 4rem);
    border-radius: var(--radius-lg);
    background:
        radial-gradient(circle at 85% 20%,
            rgba(58, 173, 251, 0.24),
            transparent 28%),
        linear-gradient(135deg,
            var(--color-surface-dark),
            var(--color-surface-raised));
    color: var(--color-text);
}

.cta-panel::after {
    position: absolute;
    right: -90px;
    bottom: -120px;
    width: 300px;
    height: 300px;
    border: 1px solid rgba(58, 173, 251, 0.2);
    border-radius: 50%;
    content: "";
}

.cta-panel__content {
    position: relative;
    z-index: 2;
    max-width: 760px;
}

.cta-panel__title {
    margin-bottom: var(--space-md);
    font-size: clamp(2rem, 4vw, 3rem);
}

.cta-panel__text {
    margin-bottom: var(--space-xl);
    color: var(--color-text-muted);
    font-size: 1.05rem;
}


/* =========================================================
   BADGES
   ========================================================= */

.badge {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem 0.7rem;
    border-radius: var(--radius-pill);
    font-size: 0.76rem;
    font-weight: 800;
}

.badge--yellow {
    background: rgba(58, 173, 251, 0.18);
    color: var(--color-primary);
}

.badge--dark {
    background: var(--color-surface-dark);
    color: var(--color-text);
}

.badge--red {
    background: rgba(188, 14, 165, 0.12);
    color: var(--color-primary);
}


/* =========================================================
   FORM CONTROLS
   ========================================================= */

.form-group {
    display: grid;
    gap: 0.5rem;
}

.form-label {
    font-weight: 800;
}

.form-control {
    width: 100%;
    min-height: 48px;
    padding: 0.85rem 1rem;
    border: 1px solid var(--color-border);
    border-radius: 12px;
    background: var(--color-surface);
    color: var(--color-text);
    transition:
        border-color var(--transition),
        box-shadow var(--transition);
}

.form-control:focus {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: 0 0 0 4px rgba(58, 173, 251, 0.14);
}

textarea.form-control {
    min-height: 150px;
    resize: vertical;
}


/* =========================================================
   SITE FOOTER
   ========================================================= */

.site-footer {
    padding-block: 64px 24px;
    background: var(--color-surface-dark);
    color: var(--color-text);
}

.footer-grid {
    display: grid;
    grid-template-columns: 1.5fr repeat(3, minmax(0, 1fr));
    gap: var(--space-2xl);
}

.site-footer .site-logo {
    margin-bottom: var(--space-lg);
}

.site-footer p {
    max-width: 380px;
    color: var(--color-text-muted);
}

.footer-title {
    margin-bottom: var(--space-md);
    color: var(--color-text);
    font-size: 1rem;
}

.footer-links {
    display: grid;
    gap: 0.72rem;
    color: var(--color-text-muted);
}

.footer-links a {
    transition:
        color var(--transition),
        transform var(--transition);
}

.footer-links a:hover {
    color: var(--color-primary);
    transform: translateX(3px);
}

.footer-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-lg);
    margin-top: var(--space-2xl);
    padding-top: var(--space-lg);
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    color: var(--color-text-muted);
    font-size: 0.9rem;
}

.footer-socials {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
}

.footer-socials a {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 50%;
    color: var(--color-text);
}

.footer-socials a:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
}


/* =========================================================
   TABLES
   ========================================================= */

.table-wrapper {
    overflow-x: auto;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
}

.data-table {
    width: 100%;
    min-width: 720px;
    border-collapse: collapse;
}

.data-table th,
.data-table td {
    padding: 1rem;
    border-bottom: 1px solid var(--color-border);
    text-align: left;
    vertical-align: top;
}

.data-table th {
    background: var(--color-surface-dark);
    color: var(--color-text);
    font-size: 0.9rem;
}

.data-table tbody tr:hover {
    background: rgba(58, 173, 251, 0.05);
}


/* =========================================================
   Ai ZERO TO HERO IN 7 DAYS — FEATURED COURSE
   ========================================================= */

.course-feature {
    position: relative;
    display: grid;
    grid-template-columns: 0.9fr 1.1fr;
    gap: clamp(2rem, 5vw, 4.5rem);
    overflow: hidden;
    padding: clamp(2rem, 5vw, 4rem);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: var(--radius-lg);
    background:
        radial-gradient(
            circle at 12% 8%,
            rgba(58, 173, 251, 0.2),
            transparent 30%
        ),
        linear-gradient(
            135deg,
            var(--color-surface-dark) 0%,
            var(--color-surface-raised) 56%,
            var(--color-surface-dark) 100%
        );
    color: var(--color-text);
    box-shadow: var(--shadow-md);
}

.course-feature::before {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            rgba(255, 255, 255, 0.015) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.015) 1px,
            transparent 1px
        );
    background-size: 38px 38px;
    content: "";
    opacity: 0.45;
    pointer-events: none;
}

.course-feature::after {
    position: absolute;
    right: -130px;
    bottom: -170px;
    width: 370px;
    height: 370px;
    border: 1px solid rgba(58, 173, 251, 0.16);
    border-radius: 50%;
    content: "";
    pointer-events: none;
}

.course-feature__content,
.course-feature__days {
    position: relative;
    z-index: 2;
}

.course-feature__content {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
}

.course-feature__content .badge--yellow {
    background: var(--color-primary);
    color: var(--color-on-primary);
}

.course-feature__title {
    margin: var(--space-md) 0 var(--space-md);
    color: var(--color-text);
    font-size: clamp(2.5rem, 5vw, 4.5rem);
    font-weight: 950;
    letter-spacing: -0.05em;
    line-height: 1;
}

.course-feature__description {
    max-width: 620px;
    margin-bottom: var(--space-xl);
    color: var(--color-text-muted);
    font-size: 1.05rem;
    line-height: 1.75;
}

.course-feature__stats {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--space-sm);
    margin-bottom: var(--space-xl);
}

.course-feature__stats > div {
    padding: 1rem 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.035);
    text-align: center;
}

.course-feature__stats strong {
    display: block;
    margin-bottom: 0.15rem;
    color: var(--color-primary);
    font-size: 1.7rem;
    font-weight: 950;
    line-height: 1;
}

.course-feature__stats span {
    color: var(--color-text-muted);
    font-size: 0.76rem;
    font-weight: 750;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.course-feature__days {
    display: grid;
    gap: var(--space-sm);
}

.course-day {
    position: relative;
    display: grid;
    grid-template-columns: 72px 1fr;
    align-items: center;
    gap: var(--space-md);
    min-height: 76px;
    padding: 1rem 1.15rem;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.045);
    transition:
        border-color var(--transition),
        background var(--transition),
        transform var(--transition);
}

.course-day:hover {
    border-color: rgba(58, 173, 251, 0.45);
    background: rgba(58, 173, 251, 0.08);
    transform: translateX(5px);
}

.course-day::after {
    position: absolute;
    top: 50%;
    right: 18px;
    width: 7px;
    height: 7px;
    border-top: 2px solid var(--color-primary);
    border-right: 2px solid var(--color-primary);
    content: "";
    opacity: 0;
    transform: translateY(-50%) rotate(45deg);
    transition: opacity var(--transition);
}

.course-day:hover::after {
    opacity: 1;
}

.course-day span {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    justify-content: center;
    padding: 0.35rem 0.55rem;
    border-radius: var(--radius-pill);
    background: var(--color-primary);
    color: var(--color-on-primary);
    font-size: 0.78rem;
    font-weight: 900;
}

.course-day h4 {
    margin: 0;
    padding-right: 18px;
    color: var(--color-text);
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.35;
}


/* =========================================================
   LEARNING PATHS PREVIEW
   ========================================================= */

.learning-path-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-lg);
}

.learning-path-card {
    position: relative;
    display: flex;
    min-height: 100%;
    flex-direction: column;
    overflow: hidden;
    padding: var(--space-xl);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
    transition:
        transform var(--transition),
        border-color var(--transition),
        box-shadow var(--transition);
}

.learning-path-card:hover {
    border-color: rgba(58, 173, 251, 0.58);
    transform: translateY(-6px);
    box-shadow: var(--shadow-md);
}

.learning-path-card::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 5px;
    background: linear-gradient(
        90deg,
        var(--color-primary),
        var(--color-primary)
    );
    content: "";
}

.learning-path-card__number {
    position: absolute;
    top: 18px;
    right: 22px;
    color: rgba(31, 31, 31, 0.08);
    font-size: 3.6rem;
    font-weight: 950;
    line-height: 1;
}

.learning-path-card__level {
    align-self: flex-start;
    margin-bottom: var(--space-lg);
    padding: 0.35rem 0.7rem;
    border-radius: var(--radius-pill);
    background: rgba(58, 173, 251, 0.16);
    color: var(--color-primary);
    font-size: 0.74rem;
    font-weight: 850;
}

.learning-path-card__title {
    max-width: 85%;
    margin-bottom: var(--space-md);
    color: var(--color-text);
    font-size: 1.45rem;
    font-weight: 900;
    line-height: 1.25;
}

.learning-path-card__description {
    margin-bottom: var(--space-lg);
    color: var(--color-text-muted);
    line-height: 1.7;
}

.learning-path-card__topics {
    display: grid;
    gap: 0.55rem;
    margin: 0 0 var(--space-xl);
    padding: 0;
    list-style: none;
}

.learning-path-card__topics li {
    position: relative;
    padding-left: 18px;
    color: var(--color-text);
    font-size: 0.92rem;
    font-weight: 700;
}

.learning-path-card__topics li::before {
    position: absolute;
    top: 0.6em;
    left: 0;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--color-primary);
    content: "";
}

.learning-path-card__link {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    margin-top: auto;
    color: var(--color-text);
    font-weight: 850;
}

.learning-path-card__link span {
    color: var(--color-primary);
    font-size: 1.2rem;
    transition: transform var(--transition);
}

.learning-path-card__link:hover {
    color: var(--color-primary);
}

.learning-path-card__link:hover span {
    transform: translateX(4px);
}

.section-actions {
    display: flex;
    justify-content: center;
    margin-top: var(--space-2xl);
}


/* =========================================================
   ALGORITHM SELECTOR HOMEPAGE PREVIEW
   ========================================================= */

.algorithm-preview-section {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(
            circle at 85% 15%,
            rgba(58, 173, 251, 0.12),
            transparent 26%
        ),
        linear-gradient(
            135deg,
            var(--color-surface-dark) 0%,
            var(--color-surface-raised) 55%,
            var(--color-surface-dark) 100%
        );
    color: var(--color-text);
}

.algorithm-preview-section::before {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            rgba(255, 255, 255, 0.015) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.015) 1px,
            transparent 1px
        );
    background-size: 40px 40px;
    content: "";
    opacity: 0.45;
    pointer-events: none;
}

.algorithm-preview-section .container {
    position: relative;
    z-index: 2;
}

.algorithm-preview-section .section-label {
    color: var(--color-primary);
}

.algorithm-preview-section .section-title {
    color: var(--color-text);
}

.algorithm-preview-section .section-description {
    color: var(--color-text-muted);
}

.algorithm-preview {
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    align-items: stretch;
    gap: clamp(2rem, 5vw, 4rem);
}

.algorithm-preview__form,
.algorithm-result-preview {
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, 0.035);
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.28);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.algorithm-preview__form {
    padding: clamp(1.5rem, 4vw, 2.5rem);
}

.algorithm-preview__step {
    display: inline-flex;
    margin-bottom: var(--space-md);
    padding: 0.4rem 0.75rem;
    border: 1px solid rgba(58, 173, 251, 0.25);
    border-radius: var(--radius-pill);
    background: rgba(58, 173, 251, 0.09);
    color: var(--color-primary);
    font-size: 0.76rem;
    font-weight: 850;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.algorithm-preview__title {
    margin-bottom: var(--space-sm);
    color: var(--color-text);
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 900;
    letter-spacing: -0.035em;
}

.algorithm-preview__description {
    margin-bottom: var(--space-xl);
    color: var(--color-text-muted);
    line-height: 1.7;
}

.selector-question {
    margin-bottom: var(--space-xl);
}

.selector-question__label {
    margin-bottom: var(--space-sm);
    color: var(--color-text);
    font-weight: 800;
}

.selector-options {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.selector-option {
    min-height: 42px;
    padding: 0.65rem 0.9rem;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: var(--radius-pill);
    background: rgba(255, 255, 255, 0.035);
    color: var(--color-text-muted);
    font-size: 0.88rem;
    font-weight: 750;
    transition:
        background var(--transition),
        border-color var(--transition),
        color var(--transition),
        transform var(--transition);
}

.selector-option:hover {
    border-color: rgba(58, 173, 251, 0.5);
    color: var(--color-primary);
    transform: translateY(-2px);
}

.selector-option.is-selected {
    border-color: var(--color-primary);
    background: var(--color-primary);
    color: var(--color-on-primary);
}

.algorithm-preview__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-md);
    padding-top: var(--space-sm);
}

.algorithm-result-preview {
    position: relative;
    overflow: hidden;
    padding: clamp(1.5rem, 4vw, 2.5rem);
    background:
        radial-gradient(
            circle at 90% 10%,
            rgba(58, 173, 251, 0.14),
            transparent 30%
        ),
        rgba(255, 255, 255, 0.035);
}

.algorithm-result-preview::after {
    position: absolute;
    right: -90px;
    bottom: -120px;
    width: 260px;
    height: 260px;
    border: 1px solid rgba(58, 173, 251, 0.16);
    border-radius: 50%;
    content: "";
    pointer-events: none;
}

.algorithm-result-preview__header,
.algorithm-result-card,
.algorithm-result-preview__notice {
    position: relative;
    z-index: 2;
}

.algorithm-result-preview__badge {
    display: inline-flex;
    margin-bottom: var(--space-md);
    padding: 0.38rem 0.72rem;
    border-radius: var(--radius-pill);
    background: rgba(58, 173, 251, 0.16);
    color: var(--color-primary);
    font-size: 0.74rem;
    font-weight: 850;
}

.algorithm-result-preview__title {
    margin-bottom: var(--space-xl);
    color: var(--color-text);
    font-size: 1.7rem;
    line-height: 1.25;
}

.algorithm-result-card {
    margin-bottom: var(--space-md);
    padding: var(--space-lg);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.04);
}

.algorithm-result-card--best {
    border-color: rgba(58, 173, 251, 0.42);
    background:
        linear-gradient(
            135deg,
            rgba(58, 173, 251, 0.12),
            rgba(255, 255, 255, 0.035)
        );
}

.algorithm-result-card__rank {
    margin-bottom: 0.35rem;
    color: var(--color-primary);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.algorithm-result-card__title {
    margin-bottom: 0.5rem;
    color: var(--color-text);
    font-size: 1.25rem;
}

.algorithm-result-card__description {
    margin-bottom: 0;
    color: var(--color-text-muted);
    font-size: 0.92rem;
    line-height: 1.65;
}

.algorithm-result-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin-top: var(--space-md);
}

.algorithm-result-card__meta span {
    padding: 0.3rem 0.55rem;
    border-radius: var(--radius-pill);
    background: rgba(255, 255, 255, 0.07);
    color: var(--color-text-muted);
    font-size: 0.7rem;
    font-weight: 750;
}

.algorithm-result-preview__notice {
    margin-top: var(--space-lg);
    padding: var(--space-md);
    border-left: 4px solid var(--color-primary);
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
    background: rgba(58, 173, 251, 0.08);
    color: var(--color-text-muted);
    font-size: 0.84rem;
    line-height: 1.6;
}


/* =========================================================
   INTERNAL PAGE HERO
   ========================================================= */

.page-hero {
  position: relative;
  overflow: hidden;
  padding-block: 52px 86px;
  background:
    radial-gradient(
      circle at 82% 18%,
      rgba(58, 173, 251, 0.18),
      transparent 28%
    ),
    linear-gradient(
      135deg,
      var(--color-surface-dark) 0%,
      var(--color-surface-raised) 58%,
      var(--color-surface-dark) 100%
    );
  color: var(--color-text);
}

.page-hero::before {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      rgba(255, 255, 255, 0.015) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(255, 255, 255, 0.015) 1px,
      transparent 1px
    );
  background-size: 42px 42px;
  content: "";
  opacity: 0.45;
  pointer-events: none;
}

.page-hero .container {
  position: relative;
  z-index: 2;
}

.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem;
  margin-bottom: 3rem;
  color: var(--color-text-muted);
  font-size: 0.86rem;
}

.breadcrumb a:hover {
  color: var(--color-primary);
}

.breadcrumb span[aria-current="page"] {
  color: var(--color-text);
}

.page-hero__grid {
  display: grid;
  align-items: center;
  grid-template-columns: 1.1fr 0.9fr;
  gap: clamp(2.5rem, 6vw, 5rem);
}

.page-hero__label {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  margin-bottom: var(--space-lg);
  color: var(--color-primary);
  font-size: 0.78rem;
  font-weight: 850;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.page-hero__label::before {
  width: 26px;
  height: 3px;
  border-radius: var(--radius-pill);
  background: var(--color-primary);
  content: "";
}

.page-hero__title {
  max-width: 850px;
  margin-bottom: var(--space-lg);
  color: var(--color-text);
  font-size: clamp(3rem, 6vw, 5.2rem);
  font-weight: 950;
  letter-spacing: -0.055em;
  line-height: 0.98;
}

.page-hero__description {
  max-width: 720px;
  margin-bottom: var(--space-xl);
  color: var(--color-text-muted);
  font-size: clamp(1.05rem, 2vw, 1.2rem);
  line-height: 1.75;
}

.page-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
}

.page-hero__visual {
  position: relative;
  display: grid;
  min-height: 390px;
  place-items: center;
}


/* =========================================================
   COURSE MAP VISUAL
   ========================================================= */

.course-map-visual {
  position: relative;
  width: min(100%, 380px);
  aspect-ratio: 1;
  border: 1px solid rgba(58, 173, 251, 0.22);
  border-radius: 50%;
}

.course-map-visual::before,
.course-map-visual::after {
  position: absolute;
  inset: 50% auto auto 50%;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 50%;
  content: "";
  transform: translate(-50%, -50%);
}

.course-map-visual::before {
  width: 74%;
  height: 74%;
}

.course-map-visual::after {
  width: 46%;
  height: 46%;
}

.course-map-visual__core {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 3;
  display: grid;
  width: 105px;
  height: 105px;
  place-items: center;
  border-radius: 30px;
  background: var(--color-primary);
  color: var(--color-on-primary);
  font-size: 2.2rem;
  font-weight: 950;
  transform: translate(-50%, -50%) rotate(-5deg);
  box-shadow: 0 0 60px rgba(58, 173, 251, 0.25);
}

.course-map-node {
  position: absolute;
  z-index: 4;
  display: grid;
  min-width: 88px;
  min-height: 42px;
  place-items: center;
  padding: 0.5rem 0.75rem;
  border: 1px solid rgba(58, 173, 251, 0.3);
  border-radius: var(--radius-pill);
  background: rgba(1, 3, 20, 0.9);
  color: var(--color-text);
  font-size: 0.78rem;
  font-weight: 800;
}

.course-map-node--one {
  top: 3%;
  left: 50%;
  transform: translateX(-50%);
}

.course-map-node--two {
  top: 50%;
  right: -5%;
  transform: translateY(-50%);
}

.course-map-node--three {
  bottom: 3%;
  left: 50%;
  transform: translateX(-50%);
}

.course-map-node--four {
  top: 50%;
  left: -5%;
  transform: translateY(-50%);
}


/* =========================================================
   COURSE CATALOGUE FEATURE
   ========================================================= */

.course-catalogue-feature {
  display: grid;
  grid-template-columns: 0.92fr 1.08fr;
  gap: clamp(2rem, 5vw, 4rem);
  overflow: hidden;
  padding: clamp(2rem, 5vw, 4rem);
  border-radius: var(--radius-lg);
  background:
    radial-gradient(
      circle at 12% 10%,
      rgba(58, 173, 251, 0.19),
      transparent 30%
    ),
    linear-gradient(
      135deg,
      var(--color-surface-dark),
      var(--color-surface-raised)
    );
  color: var(--color-text);
  box-shadow: var(--shadow-md);
}

.course-catalogue-feature__content {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  justify-content: center;
}

.course-catalogue-feature__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin-bottom: var(--space-lg);
}

.course-catalogue-feature__title {
  margin-bottom: 0.55rem;
  color: var(--color-text);
  font-size: clamp(2.8rem, 5vw, 4.6rem);
  font-weight: 950;
  letter-spacing: -0.055em;
  line-height: 1;
}

.course-catalogue-feature__subtitle {
  margin-bottom: var(--space-lg);
  color: var(--color-primary);
  font-size: 1.05rem;
  font-weight: 800;
}

.course-catalogue-feature__description {
  margin-bottom: var(--space-xl);
  color: var(--color-text-muted);
  line-height: 1.75;
}

.course-catalogue-feature__stats {
  display: grid;
  width: 100%;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.65rem;
  margin-bottom: var(--space-xl);
}

.course-catalogue-feature__stats > div {
  padding: 1rem 0.6rem;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.035);
  text-align: center;
}

.course-catalogue-feature__stats strong {
  display: block;
  color: var(--color-primary);
  font-size: 1.65rem;
  font-weight: 950;
}

.course-catalogue-feature__stats span {
  color: var(--color-text-muted);
  font-size: 0.72rem;
  font-weight: 750;
  text-transform: uppercase;
}

.course-catalogue-feature__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
}

.course-catalogue-feature__days {
  display: grid;
  gap: 0.7rem;
}

.catalogue-day {
  display: grid;
  grid-template-columns: 58px 1fr;
  align-items: center;
  gap: var(--space-md);
  min-height: 72px;
  padding: 0.9rem 1rem;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.04);
  transition:
    transform var(--transition),
    border-color var(--transition),
    background var(--transition);
}

.catalogue-day:hover {
  border-color: rgba(58, 173, 251, 0.42);
  background: rgba(58, 173, 251, 0.07);
  transform: translateX(5px);
}

.catalogue-day__number {
  color: var(--color-primary);
  font-size: 1.35rem;
  font-weight: 950;
}

.catalogue-day__label {
  margin-bottom: 0.12rem;
  color: var(--color-text-muted);
  font-size: 0.7rem;
  font-weight: 800;
  text-transform: uppercase;
}

.catalogue-day__title {
  margin: 0;
  color: var(--color-text);
  font-size: 0.95rem;
  line-height: 1.35;
}


/* =========================================================
   COURSE LIST CARDS
   ========================================================= */

.course-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-lg);
}

.course-list-card {
  display: flex;
  min-height: 100%;
  flex-direction: column;
  padding: var(--space-xl);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  box-shadow: var(--shadow-sm);
  transition:
    transform var(--transition),
    box-shadow var(--transition),
    border-color var(--transition);
}

.course-list-card:hover {
  border-color: rgba(58, 173, 251, 0.5);
  transform: translateY(-5px);
  box-shadow: var(--shadow-md);
}

.course-list-card__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  margin-bottom: var(--space-lg);
}

.course-list-card__icon {
  display: grid;
  width: 54px;
  height: 54px;
  place-items: center;
  border-radius: 16px;
  background: var(--color-surface-dark);
  color: var(--color-primary);
  font-size: 0.9rem;
  font-weight: 950;
}

.course-list-card__title {
  margin-bottom: var(--space-md);
  font-size: 1.35rem;
  font-weight: 900;
}

.course-list-card__description {
  margin-bottom: var(--space-lg);
  color: var(--color-text-muted);
  line-height: 1.7;
}

.course-list-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-top: auto;
}

.course-list-card__meta span {
  padding: 0.32rem 0.58rem;
  border-radius: var(--radius-pill);
  background: var(--color-surface-alt);
  color: var(--color-text);
  font-size: 0.72rem;
  font-weight: 750;
}


/* =========================================================
   LEARNING CYCLE
   ========================================================= */

.learning-cycle {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-lg);
}

.learning-cycle__item {
  padding: var(--space-xl);
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.035);
}

.learning-cycle__item span {
  display: inline-flex;
  margin-bottom: var(--space-md);
  color: var(--color-primary);
  font-size: 0.8rem;
  font-weight: 900;
}

.learning-cycle__item h3 {
  margin-bottom: var(--space-sm);
  color: var(--color-text);
  font-size: 1.35rem;
}

.learning-cycle__item p {
  margin: 0;
  color: var(--color-text-muted);
  line-height: 1.7;
}


/* =========================================================
   COURSE OVERVIEW PAGE
   ========================================================= */

.course-overview-hero {
  position: relative;
  overflow: hidden;
  padding-block: 48px 0;
  background:
    radial-gradient(circle at 82% 18%, rgba(58, 173, 251, 0.2), transparent 28%),
    linear-gradient(135deg, var(--color-surface-dark) 0%, var(--color-surface-raised) 58%, var(--color-surface-dark) 100%);
  color: var(--color-text);
}

.course-overview-hero::before {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(rgba(255, 255, 255, 0.015) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.015) 1px, transparent 1px);
  background-size: 42px 42px;
  content: "";
  opacity: 0.45;
  pointer-events: none;
}

.course-overview-hero .container {
  position: relative;
  z-index: 2;
}

.course-overview-hero__grid {
  display: grid;
  grid-template-columns: 1.08fr 0.92fr;
  align-items: center;
  gap: clamp(2.5rem, 6vw, 5rem);
  padding-bottom: clamp(3.5rem, 7vw, 6rem);
}

.course-overview-hero__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin-bottom: var(--space-lg);
}

.badge--course-dark {
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.06);
  color: var(--color-text-muted);
}

.course-overview-hero__title {
  max-width: 820px;
  margin-bottom: var(--space-md);
  color: var(--color-text);
  font-size: clamp(3.2rem, 6.5vw, 6.2rem);
  font-weight: 950;
  letter-spacing: -0.06em;
  line-height: 0.92;
}

.course-overview-hero__title span {
  display: block;
  color: var(--color-primary);
}

.course-overview-hero__subtitle {
  margin-bottom: var(--space-md);
  color: var(--color-text);
  font-size: clamp(1.15rem, 2.2vw, 1.45rem);
  font-weight: 800;
  line-height: 1.45;
}

.course-overview-hero__description {
  max-width: 720px;
  margin-bottom: var(--space-xl);
  color: var(--color-text-muted);
  font-size: 1.05rem;
  line-height: 1.75;
}

.course-overview-hero__actions,
.course-final-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
}

.course-overview-hero__video-note {
  max-width: 640px;
  margin-top: var(--space-md);
  color: var(--color-text-muted);
  font-size: 0.78rem;
  line-height: 1.55;
}

.course-overview-hero__visual {
  display: grid;
  min-height: 440px;
  place-items: center;
}

.seven-day-orbit {
  position: relative;
  width: min(100%, 390px);
  aspect-ratio: 1;
  border: 1px solid rgba(58, 173, 251, 0.3);
  border-radius: 50%;
  box-shadow: 0 0 90px rgba(58, 173, 251, 0.08);
}

.seven-day-orbit::before,
.seven-day-orbit::after {
  position: absolute;
  top: 50%;
  left: 50%;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 50%;
  content: "";
  transform: translate(-50%, -50%);
}

.seven-day-orbit::before {
  width: 72%;
  height: 72%;
}

.seven-day-orbit::after {
  width: 46%;
  height: 46%;
}

.seven-day-orbit__core {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 3;
  display: grid;
  width: 118px;
  height: 118px;
  place-items: center;
  border-radius: 34px;
  background: var(--color-primary);
  color: var(--color-on-primary);
  text-align: center;
  transform: translate(-50%, -50%) rotate(-5deg);
  box-shadow: 0 0 60px rgba(58, 173, 251, 0.25);
}

.seven-day-orbit__core strong,
.seven-day-orbit__core span {
  display: block;
}

.seven-day-orbit__core strong {
  align-self: end;
  font-size: 2.8rem;
  font-weight: 950;
  line-height: 0.9;
}

.seven-day-orbit__core span {
  align-self: start;
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.seven-day-node {
  position: absolute;
  z-index: 4;
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border: 1px solid rgba(58, 173, 251, 0.45);
  border-radius: 50%;
  background: var(--color-surface-raised);
  color: var(--color-primary);
  font-size: 0.76rem;
  font-weight: 900;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.28);
}

.seven-day-node--1 { top: -6%; left: 50%; transform: translateX(-50%); }
.seven-day-node--2 { top: 14%; right: 4%; }
.seven-day-node--3 { top: 56%; right: -5%; }
.seven-day-node--4 { right: 20%; bottom: -2%; }
.seven-day-node--5 { bottom: -2%; left: 20%; }
.seven-day-node--6 { top: 56%; left: -5%; }
.seven-day-node--7 { top: 14%; left: 4%; }

.course-overview-stats {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-bottom: 0;
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  background: rgba(255, 255, 255, 0.045);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.course-overview-stat {
  padding: 1.4rem 1rem;
  border-right: 1px solid rgba(255, 255, 255, 0.08);
  text-align: center;
}

.course-overview-stat:last-child {
  border-right: 0;
}

.course-overview-stat strong {
  display: block;
  margin-bottom: 0.3rem;
  color: var(--color-primary);
  font-size: 1.9rem;
  font-weight: 950;
}

.course-overview-stat span {
  color: var(--color-text-muted);
  font-size: 0.76rem;
  font-weight: 750;
  text-transform: uppercase;
}

.course-promise {
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  align-items: center;
  gap: clamp(2rem, 5vw, 4.5rem);
}

.course-promise__title {
  margin: var(--space-md) 0 var(--space-lg);
  font-size: clamp(2.2rem, 4vw, 3.8rem);
  font-weight: 950;
  letter-spacing: -0.045em;
  line-height: 1.05;
}

.course-promise__description {
  color: var(--color-text-muted);
  font-size: 1.05rem;
  line-height: 1.75;
}

.course-promise__comparison {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-lg);
}

.promise-column {
  padding: var(--space-xl);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  box-shadow: var(--shadow-sm);
}

.promise-column--positive { border-top: 5px solid var(--color-primary); }
.promise-column--warning { border-top: 5px solid var(--color-primary); }

.promise-column h3 {
  margin-bottom: var(--space-lg);
  font-size: 1.2rem;
  line-height: 1.35;
}

.promise-column ul {
  display: grid;
  gap: 0.8rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.promise-column li {
  position: relative;
  padding-left: 1.35rem;
  color: var(--color-text-muted);
  line-height: 1.55;
}

.promise-column li::before {
  position: absolute;
  top: 0.55em;
  left: 0;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--color-primary);
  content: "";
}

.promise-column--warning li::before { background: var(--color-magenta-hover); }

.audience-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-lg);
}

.audience-card {
  padding: var(--space-xl);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  box-shadow: var(--shadow-sm);
}

.audience-card__icon {
  display: inline-grid;
  width: 48px;
  height: 48px;
  margin-bottom: var(--space-lg);
  place-items: center;
  border-radius: 15px;
  background: var(--color-surface-dark);
  color: var(--color-primary);
  font-weight: 950;
}

.audience-card h3 { margin-bottom: var(--space-sm); font-size: 1.25rem; }
.audience-card p { margin: 0; color: var(--color-text-muted); line-height: 1.7; }

.course-outcomes-layout {
  display: grid;
  grid-template-columns: 0.72fr 1.28fr;
  align-items: start;
  gap: clamp(2rem, 6vw, 5rem);
}

.course-outcomes-layout__intro {
  position: sticky;
  top: 110px;
}

.course-outcomes-layout__intro .button { margin-top: var(--space-lg); }

.course-outcomes-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-md);
}

.course-outcome-item {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: var(--space-md);
  padding: var(--space-lg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
}

.course-outcome-item span {
  color: var(--color-yellow-dark, var(--color-primary));
  font-size: 0.78rem;
  font-weight: 950;
}

.course-outcome-item p { margin: 0; color: var(--color-text-muted); line-height: 1.65; }

.course-curriculum-section {
  background: linear-gradient(180deg, var(--color-surface-alt), var(--color-surface));
}

.course-day-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-lg);
}

.full-course-day {
  display: flex;
  min-height: 100%;
  flex-direction: column;
  padding: var(--space-xl);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  box-shadow: var(--shadow-sm);
  transition: transform var(--transition), border-color var(--transition), box-shadow var(--transition);
}

.full-course-day:hover {
  border-color: rgba(58, 173, 251, 0.55);
  transform: translateY(-5px);
  box-shadow: var(--shadow-md);
}

.full-course-day--active {
  border-color: rgba(58, 173, 251, 0.55);
  background: linear-gradient(145deg, rgba(58, 173, 251, 0.11), var(--color-surface) 42%);
}

.full-course-day__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  margin-bottom: var(--space-lg);
}

.full-course-day__number { color: var(--color-text); font-size: 0.82rem; font-weight: 950; text-transform: uppercase; }

.full-course-day__status {
  padding: 0.35rem 0.65rem;
  border-radius: var(--radius-pill);
  background: var(--color-primary);
  color: var(--color-on-primary);
  font-size: 0.7rem;
  font-weight: 850;
}

.full-course-day__status--soon { background: var(--color-surface-alt); color: var(--color-text-muted); }

.full-course-day__title {
  margin-bottom: var(--space-md);
  font-size: 1.55rem;
  font-weight: 900;
  line-height: 1.25;
}

.full-course-day__outcome { margin-bottom: var(--space-lg); color: var(--color-text-muted); line-height: 1.7; }

.full-course-day__topics {
  display: grid;
  gap: 0.6rem;
  margin: 0 0 var(--space-xl);
  padding: 0;
  list-style: none;
}

.full-course-day__topics li {
  position: relative;
  padding-left: 1.1rem;
  color: var(--color-text);
  font-size: 0.9rem;
  font-weight: 650;
}

.full-course-day__topics li::before {
  position: absolute;
  top: 0.58em;
  left: 0;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--color-primary);
  content: "";
}

.full-course-day__actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-md);
  margin-top: auto;
}

.course-video-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  color: var(--color-text);
  font-size: 0.84rem;
  font-weight: 800;
}

.course-video-link:hover { color: var(--color-primary); }
.course-video-link span { color: var(--color-yellow-dark, var(--color-primary)); }

.daily-format-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-lg);
}

.daily-format-card {
  padding: var(--space-xl);
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.04);
}

.daily-format-card span { display: inline-block; margin-bottom: var(--space-md); color: var(--color-primary); font-size: 0.8rem; font-weight: 950; }
.daily-format-card h3 { margin-bottom: var(--space-sm); color: var(--color-text); font-size: 1.3rem; }
.daily-format-card p { margin: 0; color: var(--color-text-muted); line-height: 1.7; }

.evidence-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-lg);
}

.evidence-card {
  display: flex;
  min-height: 100%;
  flex-direction: column;
  padding: var(--space-xl);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  box-shadow: var(--shadow-sm);
}

.evidence-card__number { margin-bottom: var(--space-lg); color: var(--color-yellow-dark, var(--color-primary)); font-size: 0.8rem; font-weight: 950; }
.evidence-card h3 { margin-bottom: var(--space-md); font-size: 1.3rem; }
.evidence-card p { margin-bottom: var(--space-lg); color: var(--color-text-muted); line-height: 1.7; }
.evidence-card strong { margin-top: auto; color: var(--color-primary); font-size: 0.85rem; }

.solution-canvas-layout {
  display: grid;
  grid-template-columns: 0.72fr 1.28fr;
  align-items: center;
  gap: clamp(2rem, 6vw, 5rem);
}

.solution-canvas-layout__intro .button { margin-top: var(--space-lg); }

.solution-canvas-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-md);
}

.solution-canvas-grid article {
  display: grid;
  grid-template-columns: 42px 1fr;
  align-items: center;
  gap: var(--space-md);
  min-height: 78px;
  padding: var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  box-shadow: var(--shadow-sm);
}

.solution-canvas-grid span { color: var(--color-yellow-dark, var(--color-primary)); font-size: 0.76rem; font-weight: 950; }
.solution-canvas-grid h3 { margin: 0; font-size: 1rem; }

.course-resource-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-lg);
}

.course-resource-card {
  display: flex;
  min-height: 100%;
  flex-direction: column;
  padding: var(--space-xl);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  box-shadow: var(--shadow-sm);
}

.course-resource-card__type {
  align-self: flex-start;
  margin-bottom: var(--space-lg);
  padding: 0.35rem 0.65rem;
  border-radius: var(--radius-pill);
  background: rgba(58, 173, 251, 0.16);
  color: var(--color-primary);
  font-size: 0.72rem;
  font-weight: 850;
}

.course-resource-card h3 { margin-bottom: var(--space-md); font-size: 1.25rem; }
.course-resource-card p { margin-bottom: var(--space-lg); color: var(--color-text-muted); line-height: 1.7; }
.course-resource-card > a { display: inline-flex; align-items: center; gap: 0.45rem; margin-top: auto; color: var(--color-text); font-weight: 850; }
.course-resource-card > a:hover { color: var(--color-primary); }
.course-resource-card > a span { color: var(--color-yellow-dark, var(--color-primary)); }

.course-boundary-section {
  padding-block: clamp(2.5rem, 5vw, 4rem);
  background: var(--color-surface-dark);
}

.course-boundary {
  display: grid;
  grid-template-columns: 76px 1fr;
  align-items: center;
  gap: var(--space-xl);
  padding: clamp(1.5rem, 4vw, 2.5rem);
  border: 1px solid rgba(58, 173, 251, 0.25);
  border-radius: var(--radius-lg);
  background: rgba(58, 173, 251, 0.07);
}

.course-boundary__icon {
  display: grid;
  width: 64px;
  height: 64px;
  place-items: center;
  border-radius: 20px;
  background: var(--color-primary);
  color: var(--color-on-primary);
  font-size: 2rem;
  font-weight: 950;
}

.course-boundary__label { display: inline-block; margin-bottom: 0.45rem; color: var(--color-primary); font-size: 0.74rem; font-weight: 900; letter-spacing: 0.06em; text-transform: uppercase; }
.course-boundary h2 { margin-bottom: var(--space-sm); color: var(--color-text); font-size: clamp(1.5rem, 3vw, 2.2rem); }
.course-boundary p { max-width: 900px; margin: 0; color: var(--color-text-muted); line-height: 1.7; }


/* =========================================================
   LEARNING PATHS CATALOGUE PAGE
   ========================================================= */

.paths-page-hero {
  background:
    radial-gradient(circle at 82% 16%, rgba(58, 173, 251, 0.2), transparent 30%),
    linear-gradient(135deg, var(--color-surface-dark) 0%, var(--color-surface-raised) 58%, var(--color-surface-dark) 100%);
}

.path-map-visual {
  position: relative;
  width: min(100%, 390px);
  aspect-ratio: 1;
  border: 1px solid rgba(58, 173, 251, 0.28);
  border-radius: 50%;
  background:
    radial-gradient(circle, rgba(58, 173, 251, 0.09), transparent 55%);
}

.path-map-visual::before,
.path-map-visual::after {
  position: absolute;
  top: 50%;
  left: 50%;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 50%;
  content: "";
  transform: translate(-50%, -50%);
}

.path-map-visual::before { width: 72%; height: 72%; }
.path-map-visual::after { width: 45%; height: 45%; }

.path-map-visual__core {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 3;
  display: grid;
  width: 122px;
  height: 122px;
  place-items: center;
  border-radius: 34px;
  background: var(--color-primary);
  color: var(--color-on-primary);
  font-size: 0.9rem;
  font-weight: 950;
  text-transform: uppercase;
  transform: translate(-50%, -50%) rotate(-5deg);
  box-shadow: 0 0 60px rgba(58, 173, 251, 0.25);
}

.path-map-node {
  position: absolute;
  z-index: 4;
  display: grid;
  min-width: 92px;
  min-height: 42px;
  place-items: center;
  padding: 0.45rem 0.7rem;
  border: 1px solid rgba(58, 173, 251, 0.4);
  border-radius: var(--radius-pill);
  background: var(--color-surface-raised);
  color: var(--color-text);
  font-size: 0.74rem;
  font-weight: 850;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
}

.path-map-node--one { top: -4%; left: 50%; transform: translateX(-50%); }
.path-map-node--two { top: 25%; right: -8%; }
.path-map-node--three { right: 7%; bottom: 5%; }
.path-map-node--four { bottom: 5%; left: 7%; }
.path-map-node--five { top: 25%; left: -8%; }

.path-foundation-card {
  position: relative;
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  align-items: center;
  gap: clamp(2rem, 6vw, 5rem);
  overflow: hidden;
  padding: clamp(2rem, 5vw, 4rem);
  border-radius: var(--radius-lg);
  background:
    radial-gradient(circle at 10% 10%, rgba(58, 173, 251, 0.2), transparent 30%),
    linear-gradient(135deg, var(--color-surface-dark), var(--color-surface-raised));
  color: var(--color-text);
  box-shadow: var(--shadow-md);
}

.path-foundation-card__content { position: relative; z-index: 2; }

.path-foundation-card__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin-bottom: var(--space-lg);
}

.path-foundation-card h2 {
  margin-bottom: var(--space-md);
  color: var(--color-text);
  font-size: clamp(2.6rem, 5vw, 4.6rem);
  font-weight: 950;
  letter-spacing: -0.055em;
  line-height: 1;
}

.path-foundation-card__subtitle {
  max-width: 680px;
  margin-bottom: var(--space-xl);
  color: var(--color-text-muted);
  font-size: 1.05rem;
  line-height: 1.75;
}

.path-foundation-card__stats {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  margin-bottom: var(--space-xl);
}

.path-foundation-card__stats span {
  padding: 0.65rem 0.8rem;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.04);
  color: var(--color-text-muted);
  font-size: 0.76rem;
  font-weight: 750;
}

.path-foundation-card__stats strong { color: var(--color-primary); font-size: 1rem; }

.path-foundation-card__route {
  position: relative;
  display: grid;
  min-height: 290px;
  place-items: center;
}

.path-foundation-card__route::before,
.path-foundation-card__route::after {
  position: absolute;
  left: 50%;
  width: 2px;
  height: 74px;
  background: linear-gradient(var(--color-primary), rgba(58, 173, 251, 0.15));
  content: "";
  transform: translateX(-50%);
}

.path-foundation-card__route::before { top: 38px; }
.path-foundation-card__route::after { bottom: 38px; transform: translateX(-50%) rotate(180deg); }

.path-foundation-card__route span,
.path-foundation-card__route strong {
  position: absolute;
  z-index: 2;
  display: grid;
  min-width: 170px;
  min-height: 58px;
  place-items: center;
  padding: 0.75rem 1rem;
  border-radius: var(--radius-pill);
  text-align: center;
}

.path-foundation-card__route span { top: 0; border: 1px solid rgba(255, 255, 255, 0.12); background: var(--color-surface-raised); color: var(--color-text-muted); font-weight: 800; }
.path-foundation-card__route strong { bottom: 0; background: var(--color-primary); color: var(--color-on-primary); }

.path-foundation-card__route i {
  width: 88px;
  height: 88px;
  border: 1px solid rgba(58, 173, 251, 0.25);
  border-radius: 50%;
  box-shadow: inset 0 0 0 20px rgba(58, 173, 251, 0.05);
}

.path-finder {
  display: grid;
  grid-template-columns: 1.25fr 0.75fr;
  align-items: start;
  gap: clamp(2rem, 5vw, 4rem);
}

.path-finder__questions {
  display: grid;
  gap: var(--space-lg);
}

.path-finder__group {
  min-width: 0;
  margin: 0;
  padding: var(--space-xl);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  box-shadow: var(--shadow-sm);
}

.path-finder__group legend {
  padding: 0 0.35rem;
  color: var(--color-text);
  font-size: 1rem;
  font-weight: 900;
}

.path-finder__options {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin-top: var(--space-sm);
}

.path-finder__options button {
  min-height: 42px;
  padding: 0.65rem 0.9rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-pill);
  background: var(--color-surface-alt);
  color: var(--color-text);
  font-size: 0.86rem;
  font-weight: 750;
  transition: background var(--transition), border-color var(--transition), color var(--transition), transform var(--transition);
}

.path-finder__options button:hover { border-color: rgba(58, 173, 251, 0.55); transform: translateY(-2px); }

.path-finder__options button.is-selected {
  border-color: var(--color-primary);
  background: var(--color-primary);
  color: var(--color-on-primary);
}

.path-finder__result {
  position: sticky;
  top: 110px;
  padding: clamp(1.5rem, 4vw, 2.5rem);
  border-radius: var(--radius-lg);
  background:
    radial-gradient(circle at 90% 10%, rgba(58, 173, 251, 0.18), transparent 32%),
    var(--color-surface-dark);
  color: var(--color-text);
  box-shadow: var(--shadow-md);
}

.path-finder__result-label {
  display: inline-block;
  margin-bottom: var(--space-md);
  color: var(--color-primary);
  font-size: 0.74rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.path-finder__result h3 { margin-bottom: var(--space-md); color: var(--color-text); font-size: clamp(2rem, 4vw, 3rem); line-height: 1.1; }
.path-finder__result p { margin-bottom: var(--space-xl); color: var(--color-text-muted); line-height: 1.7; }
.path-finder__result small { display: block; margin-top: var(--space-md); color: var(--color-text-muted); line-height: 1.5; }

.path-catalogue-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-lg);
}

.path-catalogue-card {
  display: flex;
  min-height: 100%;
  flex-direction: column;
  padding: var(--space-xl);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  box-shadow: var(--shadow-sm);
  transition: transform var(--transition), border-color var(--transition), box-shadow var(--transition);
}

.path-catalogue-card:hover { border-color: rgba(58, 173, 251, 0.55); transform: translateY(-5px); box-shadow: var(--shadow-md); }

.path-catalogue-card__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  margin-bottom: var(--space-lg);
}

.path-catalogue-card__top > span { color: rgba(31, 31, 31, 0.18); font-size: 2.5rem; font-weight: 950; line-height: 1; }
.path-catalogue-card__top em { padding: 0.35rem 0.65rem; border-radius: var(--radius-pill); background: rgba(58, 173, 251, 0.16); color: var(--color-primary); font-size: 0.7rem; font-style: normal; font-weight: 850; }
.path-catalogue-card h3 { margin-bottom: var(--space-md); font-size: 1.45rem; font-weight: 900; line-height: 1.25; }
.path-catalogue-card > p { margin-bottom: var(--space-lg); color: var(--color-text-muted); line-height: 1.7; }

.path-catalogue-card dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.6rem;
  margin: 0 0 var(--space-lg);
}

.path-catalogue-card dl div { padding: 0.75rem; border-radius: var(--radius-sm); background: var(--color-surface-alt); }
.path-catalogue-card dt { margin-bottom: 0.2rem; color: var(--color-text-muted); font-size: 0.66rem; font-weight: 800; text-transform: uppercase; }
.path-catalogue-card dd { margin: 0; color: var(--color-text); font-size: 0.8rem; font-weight: 800; }

.path-catalogue-card ul { display: flex; flex-wrap: wrap; gap: 0.45rem; margin: 0 0 var(--space-lg); padding: 0; list-style: none; }
.path-catalogue-card li { padding: 0.32rem 0.55rem; border-radius: var(--radius-pill); background: rgba(58, 173, 251, 0.13); color: var(--color-primary); font-size: 0.7rem; font-weight: 750; }
.path-catalogue-card > strong { margin-bottom: var(--space-xl); color: var(--color-primary); font-size: 0.82rem; }
.path-catalogue-card > a { display: inline-flex; align-items: center; gap: 0.5rem; margin-top: auto; color: var(--color-text); font-weight: 850; }
.path-catalogue-card > a:hover { color: var(--color-primary); }
.path-catalogue-card > a span { color: var(--color-yellow-dark, var(--color-primary)); font-size: 1.15rem; }

.path-comparison-wrapper { box-shadow: var(--shadow-sm); }
.path-comparison-table th { white-space: nowrap; }
.path-comparison-table tbody th { padding: 1rem; border-bottom: 1px solid var(--color-border); color: var(--color-text); font-size: 0.88rem; }
.path-comparison-table td { color: var(--color-text-muted); font-size: 0.86rem; }

.path-connection-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-lg);
}

.path-connection-grid a {
  display: block;
  padding: var(--space-xl);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  color: var(--color-text);
  box-shadow: var(--shadow-sm);
  transition: transform var(--transition), border-color var(--transition), box-shadow var(--transition);
}

.path-connection-grid a:hover { border-color: rgba(58, 173, 251, 0.55); transform: translateY(-5px); box-shadow: var(--shadow-md); }
.path-connection-grid span { display: inline-block; margin-bottom: var(--space-lg); color: var(--color-yellow-dark, var(--color-primary)); font-size: 0.78rem; font-weight: 950; }
.path-connection-grid h3 { margin-bottom: var(--space-sm); font-size: 1.25rem; }
.path-connection-grid p { margin: 0; color: var(--color-text-muted); line-height: 1.7; }

.path-boundary-section { padding-block: clamp(2.5rem, 5vw, 4rem); background: var(--color-surface-dark); }

.path-boundary {
  display: grid;
  grid-template-columns: 76px 1fr;
  align-items: center;
  gap: var(--space-xl);
  padding: clamp(1.5rem, 4vw, 2.5rem);
  border: 1px solid rgba(58, 173, 251, 0.25);
  border-radius: var(--radius-lg);
  background: rgba(58, 173, 251, 0.07);
}

.path-boundary__icon { display: grid; width: 64px; height: 64px; place-items: center; border-radius: 20px; background: var(--color-primary); color: var(--color-on-primary); font-size: 2rem; font-weight: 950; }
.path-boundary__label { display: inline-block; margin-bottom: 0.45rem; color: var(--color-primary); font-size: 0.74rem; font-weight: 900; letter-spacing: 0.06em; text-transform: uppercase; }
.path-boundary h2 { margin-bottom: var(--space-sm); color: var(--color-text); font-size: clamp(1.5rem, 3vw, 2.2rem); }
.path-boundary p { max-width: 940px; margin: 0; color: var(--color-text-muted); line-height: 1.7; }

.paths-final-actions { display: flex; flex-wrap: wrap; gap: var(--space-md); }


/* =========================================================
   Ai ALGORITHM SELECTOR PAGE
   ========================================================= */

.selector-page-hero {
  background:
    radial-gradient(circle at 82% 15%, rgba(58, 173, 251, 0.2), transparent 29%),
    linear-gradient(135deg, var(--color-surface-dark) 0%, var(--color-surface-raised) 58%, var(--color-surface-dark) 100%);
}

.selector-hero-visual {
  position: relative;
  display: grid;
  min-height: 370px;
  place-items: center;
}

.selector-hero-visual::before,
.selector-hero-visual::after {
  position: absolute;
  top: 50%;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--color-primary));
  content: "";
}

.selector-hero-visual::before { right: 50%; width: 135px; transform: translate(-60px, -50%); }
.selector-hero-visual::after { left: 50%; width: 135px; transform: translate(60px, -50%) rotate(180deg); }

.selector-hero-visual__engine {
  position: relative;
  z-index: 3;
  display: grid;
  width: 150px;
  height: 150px;
  place-items: center;
  border-radius: 42px;
  background: var(--color-primary);
  color: var(--color-on-primary);
  text-align: center;
  transform: rotate(-5deg);
  box-shadow: 0 0 70px rgba(58, 173, 251, 0.3);
}

.selector-hero-visual__engine strong { align-self: end; font-size: 3.2rem; line-height: 0.9; }
.selector-hero-visual__engine span { align-self: start; font-size: 0.72rem; font-weight: 900; letter-spacing: 0.06em; text-transform: uppercase; }

.selector-hero-visual__input,
.selector-hero-visual__output {
  position: absolute;
  z-index: 2;
  display: grid;
  min-width: 128px;
  min-height: 50px;
  place-items: center;
  padding: 0.6rem 0.8rem;
  border: 1px solid rgba(58, 173, 251, 0.35);
  border-radius: var(--radius-pill);
  background: var(--color-surface-raised);
  color: var(--color-text);
  font-size: 0.76rem;
  font-weight: 850;
}

.selector-hero-visual__input { left: 0; }
.selector-hero-visual__output { right: 0; }

.selector-boundary-intro { padding-block: 1.4rem; background: var(--color-surface-dark); }

.selector-boundary-intro .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-xl);
}

.selector-trust-strip { display: flex; flex-wrap: wrap; gap: 0.55rem; }
.selector-trust-strip span { padding: 0.35rem 0.65rem; border: 1px solid rgba(255,255,255,0.1); border-radius: var(--radius-pill); color: var(--color-text-muted); font-size: 0.7rem; font-weight: 750; }
.selector-boundary-intro p { max-width: 620px; margin: 0; color: var(--color-text-muted); font-size: 0.8rem; line-height: 1.55; }
.selector-boundary-intro strong { color: var(--color-primary); }

.guided-selector-section { background: linear-gradient(180deg, var(--color-surface), var(--color-surface)); }

.selector-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, 0.95fr);
  align-items: start;
  gap: var(--space-xl);
}

.guided-selector-panel {
  overflow: hidden;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  box-shadow: var(--shadow-md);
}

.guided-selector-panel__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-lg);
  padding: var(--space-xl) var(--space-xl) var(--space-lg);
}

.guided-selector-panel__header h2 { margin-top: 0.45rem; font-size: clamp(1.7rem, 3vw, 2.4rem); }

.selector-reset {
  min-height: 40px;
  padding: 0.55rem 0.8rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-pill);
  background: var(--color-surface-alt);
  color: var(--color-text);
  font-size: 0.78rem;
  font-weight: 850;
}

.selector-reset:hover { border-color: var(--color-primary); }

.selector-progress { padding: 0 var(--space-xl) var(--space-xl); }
.selector-progress__meta { display: flex; justify-content: space-between; gap: var(--space-md); margin-bottom: 0.55rem; color: var(--color-text-muted); font-size: 0.74rem; font-weight: 750; }
.selector-progress__track { height: 7px; overflow: hidden; border-radius: var(--radius-pill); background: var(--color-surface-alt); }
.selector-progress__track span { display: block; width: 12.5%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--color-primary), var(--color-primary)); transition: width var(--transition); }

.selector-selection-summary {
  margin: 0 var(--space-xl) var(--space-xl);
  padding: var(--space-lg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface-alt);
}

.selector-selection-summary__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-lg);
  margin-bottom: var(--space-md);
}

.selector-selection-summary__header span {
  color: var(--color-primary);
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.selector-selection-summary__header h3 {
  margin-top: 0.25rem;
  font-size: 1rem;
}

.selector-selection-summary__header small {
  max-width: 210px;
  color: var(--color-text-muted);
  font-size: 0.68rem;
  line-height: 1.4;
  text-align: right;
}

.selector-selection-summary__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.55rem;
}

.selector-selection-summary__grid button {
  min-width: 0;
  min-height: 64px;
  padding: 0.65rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface);
  color: var(--color-text);
  text-align: left;
  transition: border-color var(--transition), background var(--transition), transform var(--transition);
}

.selector-selection-summary__grid button:not(:disabled):hover {
  border-color: var(--color-primary);
  background: rgba(58, 173, 251, 0.08);
  transform: translateY(-2px);
}

.selector-selection-summary__grid button.is-current {
  border-color: var(--color-primary);
  box-shadow: inset 3px 0 0 var(--color-yellow);
}

.selector-selection-summary__grid button:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.selector-selection-summary__grid span,
.selector-selection-summary__grid strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
}

.selector-selection-summary__grid span {
  margin-bottom: 0.25rem;
  color: var(--color-text-muted);
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  white-space: nowrap;
}

.selector-selection-summary__grid strong {
  color: var(--color-text);
  font-size: 0.72rem;
  line-height: 1.35;
  white-space: nowrap;
}

#algorithm-selector-form { border-top: 1px solid var(--color-border); }

.selector-step { min-height: 560px; padding: var(--space-xl); }
.selector-step__eyebrow { display: inline-block; margin-bottom: 0.45rem; color: var(--color-primary); font-size: 0.72rem; font-weight: 900; letter-spacing: 0.06em; text-transform: uppercase; }
.selector-step h3 { margin-bottom: var(--space-sm); font-size: clamp(1.7rem, 3vw, 2.35rem); line-height: 1.15; }
.selector-step > p { margin-bottom: var(--space-xl); color: var(--color-text-muted); line-height: 1.65; }

.selector-choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.7rem; }
.selector-choice-grid--large { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.selector-choice-grid--compact { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.selector-choice-grid button {
  display: flex;
  min-height: 72px;
  align-items: flex-start;
  flex-direction: column;
  justify-content: center;
  padding: 0.85rem 1rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  color: var(--color-text);
  text-align: left;
  transition: transform var(--transition), border-color var(--transition), background var(--transition), box-shadow var(--transition);
}

.selector-choice-grid--compact button { min-height: 50px; align-items: center; text-align: center; font-size: 0.82rem; font-weight: 800; }
.selector-choice-grid button strong { font-size: 0.9rem; }
.selector-choice-grid button small { margin-top: 0.25rem; color: var(--color-text-muted); font-size: 0.7rem; line-height: 1.4; }
.selector-choice-grid button:hover:not(:disabled) { border-color: rgba(58, 173, 251, 0.65); transform: translateY(-2px); box-shadow: var(--shadow-sm); }
.selector-choice-grid button.is-selected { border-color: var(--color-primary); background: rgba(58, 173, 251, 0.14); box-shadow: inset 4px 0 0 var(--color-yellow); }
.selector-choice-grid button.is-disabled { opacity: 0.35; cursor: not-allowed; }

.selector-choice-limit { display: block; margin-top: var(--space-md); color: var(--color-text-muted); font-size: 0.76rem; font-weight: 750; }

.selector-navigation {
  display: flex;
  justify-content: space-between;
  gap: var(--space-md);
  padding: var(--space-lg) var(--space-xl) var(--space-xl);
  border-top: 1px solid var(--color-border);
}

.button--outline-dark { border: 1px solid var(--color-border); background: transparent; color: var(--color-text); }
.button--outline-dark:hover { border-color: var(--color-border); background: var(--color-surface-alt); }
.selector-navigation .button:disabled { opacity: 0.4; cursor: not-allowed; transform: none; }

.selector-results {
  position: sticky;
  top: 92px;
  max-height: calc(100vh - 112px);
  overflow: auto;
  border: 1px solid rgba(255,255,255,0.09);
  border-radius: var(--radius-lg);
  background:
    radial-gradient(circle at 92% 8%, rgba(58, 173, 251, 0.17), transparent 28%),
    var(--color-surface-dark);
  color: var(--color-text);
  box-shadow: 0 24px 70px rgba(0,0,0,0.25);
  scrollbar-color: rgba(58, 173, 251, 0.45) transparent;
}

.selector-results__header {
  position: sticky;
  top: 0;
  z-index: 5;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-md);
  padding: var(--space-xl);
  border-bottom: 1px solid rgba(255,255,255,0.08);
  background: rgba(1, 3, 20, 0.95);
  backdrop-filter: blur(12px);
}

.selector-results__header > div > span { color: var(--color-primary); font-size: 0.7rem; font-weight: 900; letter-spacing: 0.06em; text-transform: uppercase; }
.selector-results__header h2 { margin-top: 0.3rem; color: var(--color-text); font-size: 1.55rem; }
.selector-results__count { padding: 0.35rem 0.6rem; border-radius: var(--radius-pill); background: rgba(255,255,255,0.07); color: var(--color-text-muted); font-size: 0.68rem; font-weight: 750; white-space: nowrap; }

.selector-loading,
.selector-empty,
.selector-no-match { padding: clamp(2rem,5vw,4rem) var(--space-xl); text-align: center; }
.selector-loading { color: var(--color-text-muted); }
.selector-empty strong,
.selector-no-match strong { display: block; margin-bottom: var(--space-sm); color: var(--color-text); font-size: 1.2rem; }
.selector-empty p,
.selector-no-match p { margin: 0; color: var(--color-text-muted); line-height: 1.65; }

.selector-best { margin: var(--space-lg); padding: var(--space-xl); border: 1px solid rgba(58, 173, 251, 0.42); border-radius: var(--radius-lg); background: linear-gradient(135deg, rgba(58, 173, 251, 0.13), rgba(255,255,255,0.035)); }
.selector-best__top { display: flex; align-items: center; justify-content: space-between; gap: var(--space-md); margin-bottom: var(--space-lg); }
.selector-best__rank { color: var(--color-primary); font-size: 0.72rem; font-weight: 900; letter-spacing: 0.06em; text-transform: uppercase; }
.selector-match-score { color: var(--color-text-muted); font-size: 0.68rem; }
.selector-match-score strong { color: var(--color-primary); font-size: 1.25rem; }
.selector-best h3 { margin-bottom: var(--space-sm); color: var(--color-text); font-size: 1.8rem; }
.selector-best > p { color: var(--color-text-muted); line-height: 1.65; }

.selector-result-tags { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: var(--space-md); }
.selector-result-tags span { padding: 0.3rem 0.5rem; border-radius: var(--radius-pill); background: rgba(255,255,255,0.08); color: var(--color-text-muted); font-size: 0.66rem; font-weight: 750; text-transform: capitalize; }
.selector-match-reasons { display: grid; gap: 0.5rem; margin: var(--space-lg) 0; padding: 0; list-style: none; }
.selector-match-reasons li { position: relative; padding-left: 1.1rem; color: var(--color-text-muted); font-size: 0.82rem; }
.selector-match-reasons li::before { position: absolute; top: 0.5em; left: 0; width: 6px; height: 6px; border-radius: 50%; background: var(--color-primary); content: ""; }

.selector-result-actions { display: flex; flex-wrap: wrap; gap: 0.65rem; }
.selector-compare-button { min-height: 44px; padding: 0.65rem 0.8rem; border: 1px solid rgba(255,255,255,0.15); border-radius: var(--radius-pill); background: rgba(255,255,255,0.04); color: var(--color-text-muted); font-size: 0.74rem; font-weight: 800; }
.selector-compare-button:hover,
.selector-compare-button.is-selected { border-color: var(--color-primary); color: var(--color-primary); }

.selector-alternatives,
.selector-advanced,
.selector-guidance { padding: 0 var(--space-lg) var(--space-lg); }
.selector-result-heading { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-md); margin-bottom: var(--space-sm); }
.selector-result-heading span { color: var(--color-text); font-size: 0.86rem; font-weight: 900; }
.selector-result-heading small { color: var(--color-text-muted); font-size: 0.66rem; }

.selector-alternative-card { margin-bottom: 0.65rem; padding: var(--space-lg); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius-md); background: rgba(255,255,255,0.04); }
.selector-alternative-card > div:first-child { display: flex; justify-content: space-between; gap: var(--space-md); }
.selector-alternative-card > div:first-child span { color: var(--color-text); font-weight: 850; }
.selector-alternative-card > div:first-child strong { color: var(--color-primary); font-size: 0.75rem; }
.selector-alternative-card p { margin: 0.5rem 0 0; color: var(--color-text-muted); font-size: 0.78rem; line-height: 1.55; }
.selector-alternative-card .selector-compare-button { margin-top: var(--space-md); }
.selector-result-note { color: var(--color-text-muted); font-size: 0.8rem; }

.selector-guidance__block { margin-bottom: 0.65rem; padding: var(--space-lg); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--radius-md); background: rgba(255,255,255,0.035); }
.selector-guidance__block--warning { border-left: 4px solid var(--color-primary); }
.selector-guidance__block h3 { margin-bottom: var(--space-sm); color: var(--color-text); font-size: 0.9rem; }
.selector-guidance__block ul { display: grid; gap: 0.4rem; margin: 0; padding-left: 1.1rem; color: var(--color-text-muted); font-size: 0.76rem; line-height: 1.5; }
.selector-guidance__block p { margin: var(--space-sm) 0 0; color: var(--color-text-muted); font-size: 0.76rem; line-height: 1.5; }
.selector-metric-list { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.selector-metric-list span { padding: 0.3rem 0.5rem; border-radius: var(--radius-pill); background: rgba(58, 173, 251, 0.12); color: var(--color-primary); font-size: 0.68rem; font-weight: 750; }
.selector-validation-reminder { margin: var(--space-md) 0 0; padding: var(--space-md); border-radius: var(--radius-sm); background: rgba(58, 173, 251, 0.08); color: var(--color-text-muted); font-size: 0.76rem; line-height: 1.55; }

.selector-comparison { margin-top: var(--space-2xl); padding: clamp(1.5rem,4vw,2.5rem); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface); box-shadow: var(--shadow-sm); }
.selector-comparison__header { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-lg); margin-bottom: var(--space-xl); }
.selector-comparison__header h2 { margin-top: 0.4rem; }
.selector-comparison__header > button { padding: 0.55rem 0.75rem; border: 1px solid var(--color-border); border-radius: var(--radius-pill); background: var(--color-surface-alt); color: var(--color-text); font-size: 0.72rem; font-weight: 800; }
.selector-comparison__grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: var(--space-md); }
.selector-comparison-card { position: relative; padding: var(--space-lg); border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface-alt); }
.selector-comparison-card > button { position: absolute; top: 10px; right: 10px; display: grid; width: 30px; height: 30px; place-items: center; border: 0; border-radius: 50%; background: var(--color-surface); color: var(--color-text); font-size: 1.2rem; }
.selector-comparison-card > span { display: inline-block; margin-bottom: var(--space-sm); color: var(--color-primary); font-size: 0.68rem; font-weight: 850; text-transform: uppercase; }
.selector-comparison-card h3 { max-width: 85%; margin-bottom: var(--space-lg); font-size: 1.1rem; }
.selector-comparison-card dl { display: grid; gap: 0.5rem; margin: 0 0 var(--space-lg); }
.selector-comparison-card dl div { display: flex; justify-content: space-between; gap: 0.5rem; padding-bottom: 0.4rem; border-bottom: 1px solid var(--color-border); }
.selector-comparison-card dt { color: var(--color-text-muted); font-size: 0.68rem; }
.selector-comparison-card dd { margin: 0; color: var(--color-text); font-size: 0.68rem; font-weight: 800; text-transform: capitalize; }
.selector-comparison-card p { color: var(--color-text-muted); font-size: 0.72rem; line-height: 1.5; }

.selector-method-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: var(--space-lg); }
.selector-method-grid article { padding: var(--space-xl); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface); box-shadow: var(--shadow-sm); }
.selector-method-grid span { display: inline-block; margin-bottom: var(--space-lg); color: var(--color-primary); font-size: 0.78rem; font-weight: 950; }
.selector-method-grid h3 { margin-bottom: var(--space-sm); font-size: 1.25rem; }
.selector-method-grid p { margin: 0; color: var(--color-text-muted); line-height: 1.7; }

.selector-validation-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--space-lg); }
.selector-validation-grid article { padding: var(--space-xl); border: 1px solid rgba(255,255,255,0.09); border-radius: var(--radius-lg); background: rgba(255,255,255,0.04); }
.selector-validation-grid span { display: inline-block; margin-bottom: var(--space-md); color: var(--color-primary); font-size: 0.78rem; font-weight: 950; }
.selector-validation-grid h3 { margin-bottom: var(--space-sm); color: var(--color-text); font-size: 1.25rem; }
.selector-validation-grid p { margin: 0; color: var(--color-text-muted); line-height: 1.7; }

.selector-privacy-boundary { display: grid; grid-template-columns: 76px 1fr; align-items: center; gap: var(--space-xl); padding: clamp(1.5rem,4vw,2.5rem); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface-alt); }
.selector-privacy-boundary__icon { display: grid; width: 64px; height: 64px; place-items: center; border-radius: 20px; background: var(--color-primary); color: var(--color-on-primary); font-size: 2rem; font-weight: 950; }
.selector-privacy-boundary h2 { margin: 0.45rem 0 var(--space-sm); font-size: clamp(1.5rem,3vw,2.2rem); }
.selector-privacy-boundary p { max-width: 980px; margin: 0; color: var(--color-text-muted); line-height: 1.7; }
.selector-final-actions { display: flex; flex-wrap: wrap; gap: var(--space-md); }


/* =========================================================
   Ai ALGORITHM LIBRARY
   ========================================================= */

.algorithm-library-hero { padding-bottom: 0; background: radial-gradient(circle at 82% 15%, rgba(58, 173, 251, .2), transparent 29%), linear-gradient(135deg,var(--color-surface-dark) 0%,var(--color-surface-raised) 58%,var(--color-surface-dark) 100%); }
.library-hero-graph { position: relative; width: min(100%,390px); aspect-ratio: 1; border: 1px solid rgba(58, 173, 251, .28); border-radius: 50%; }
.library-hero-graph::before,.library-hero-graph::after { position:absolute; top:50%; left:50%; border:1px solid rgba(255,255,255,.1); border-radius:50%; content:""; transform:translate(-50%,-50%); }
.library-hero-graph::before { width:72%; height:72%; }.library-hero-graph::after { width:44%; height:44%; }
.library-hero-graph>strong { position:absolute; top:50%; left:50%; z-index:3; display:grid; width:118px; height:118px; place-items:center; border-radius:34px; background:var(--color-primary); color:var(--color-on-primary); font-size:.82rem; text-transform:uppercase; transform:translate(-50%,-50%) rotate(-5deg); box-shadow:0 0 60px rgba(58, 173, 251, .25); }
.library-hero-node { position:absolute; z-index:4; display:grid; min-width:96px; min-height:42px; place-items:center; padding:.45rem .7rem; border:1px solid rgba(58, 173, 251, .4); border-radius:var(--radius-pill); background:var(--color-surface-raised); color:var(--color-text); font-size:.72rem; font-weight:850; }
.library-hero-node--problem{top:-5%;left:50%;transform:translateX(-50%)}.library-hero-node--family{top:30%;right:-9%}.library-hero-node--metric{right:5%;bottom:3%}.library-hero-node--project{bottom:3%;left:5%}
.library-global-search { position:relative; z-index:5; padding:var(--space-xl); border:1px solid rgba(255,255,255,.09); border-bottom:0; border-radius:var(--radius-lg) var(--radius-lg) 0 0; background:rgba(255,255,255,.05); backdrop-filter:blur(12px); }
.library-global-search label { display:block; margin-bottom:.55rem; color:var(--color-primary); font-size:.72rem; font-weight:900; letter-spacing:.06em; text-transform:uppercase; }
.library-global-search>div { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:.75rem; padding:.75rem 1rem; border:1px solid rgba(255,255,255,.14); border-radius:var(--radius-md); background:rgba(0,0,0,.24); }
.library-global-search input { width:100%; border:0; outline:0; background:transparent; color:var(--color-text); font-size:1rem; }.library-global-search input::placeholder{color:var(--color-text-muted)}.library-global-search kbd{padding:.2rem .45rem;border:1px solid rgba(255,255,255,.15);border-radius:5px;color:var(--color-text-muted);font-size:.68rem}.library-global-search p{margin:.55rem 0 0;color:var(--color-text-muted);font-size:.72rem}

.library-selector-bridge { padding-block:var(--space-xl); background:var(--color-surface); }.library-selector-bridge .container{display:flex;align-items:center;justify-content:space-between;gap:var(--space-xl)}.library-selector-bridge h2{margin:.4rem 0 .35rem;font-size:clamp(1.45rem,3vw,2.1rem)}.library-selector-bridge p{margin:0;color:var(--color-text-muted)}
.library-view-controls { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.7rem; margin-bottom:var(--space-2xl); }
.library-view-controls button { display:grid; grid-template-columns:38px 1fr; grid-template-rows:auto auto; gap:.1rem .65rem; padding:1rem; border:1px solid var(--color-border); border-radius:var(--radius-md); background:var(--color-surface); color:var(--color-text); text-align:left; transition:border-color var(--transition),transform var(--transition),box-shadow var(--transition); }
.library-view-controls button:hover,.library-view-controls button.is-active { border-color:var(--color-primary); transform:translateY(-3px); box-shadow:var(--shadow-sm); }.library-view-controls button.is-active{box-shadow:inset 4px 0 0 var(--color-yellow),var(--shadow-sm)}.library-view-controls span{grid-row:1/3;align-self:center;color:var(--color-primary);font-size:.75rem;font-weight:950}.library-view-controls strong{font-size:.85rem}.library-view-controls small{color:var(--color-text-muted);font-size:.68rem}
.library-featured { margin-bottom:var(--space-2xl); padding:clamp(1.5rem,4vw,2.5rem); border:1px solid var(--color-border); border-radius:var(--radius-lg); background:var(--color-surface); box-shadow:var(--shadow-sm); }.library-featured__header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-lg);margin-bottom:var(--space-xl)}.library-featured__header h2{margin-top:.4rem}.library-featured__header>span{padding:.35rem .65rem;border-radius:var(--radius-pill);background:var(--color-surface-alt);color:var(--color-text-muted);font-size:.7rem;font-weight:750}.library-featured__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-md)}
.library-loading,.library-error{padding:var(--space-2xl);border-radius:var(--radius-lg);background:var(--color-surface);text-align:center;color:var(--color-text-muted)}.library-error strong{color:var(--color-primary)}
.library-view-panel { padding:clamp(1.5rem,4vw,2.5rem); border:1px solid var(--color-border); border-radius:var(--radius-lg); background:var(--color-surface); box-shadow:var(--shadow-sm); }.library-panel-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-xl);margin-bottom:var(--space-xl)}.library-panel-heading h2{margin:.4rem 0 .3rem;font-size:clamp(1.7rem,3vw,2.5rem)}.library-panel-heading p{margin:0;color:var(--color-text-muted)}.library-panel-heading>button,.library-panel-heading label{padding:.55rem .75rem;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-alt);color:var(--color-text);font-size:.72rem;font-weight:800}.library-panel-heading label{display:grid;gap:.35rem}.library-panel-heading select{min-width:210px;border:0;background:transparent;color:var(--color-text);font-weight:750}

.algorithm-tree-root>div { display:flex;justify-content:space-between;gap:var(--space-md);padding:var(--space-lg);border-radius:var(--radius-md);background:var(--color-surface-dark);color:var(--color-text); }.algorithm-tree-root>div span{color:var(--color-primary);font-size:.75rem}.algorithm-tree-node{margin-top:.55rem;margin-left:calc(var(--depth,0)*1rem);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface)}.algorithm-tree-node summary{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);padding:.9rem 1rem;cursor:pointer;list-style:none;font-weight:850}.algorithm-tree-node summary::-webkit-details-marker{display:none}.algorithm-tree-node summary::before{width:24px;height:24px;display:grid;place-items:center;flex:0 0 auto;border-radius:50%;background:var(--color-surface-alt);content:"+"}.algorithm-tree-node[open]>summary::before{content:"−";background:var(--color-primary)}.algorithm-tree-node summary span{flex:1}.algorithm-tree-node summary em{color:var(--color-text-muted);font-size:.68rem;font-style:normal;font-weight:700}.algorithm-tree-node__content{padding:0 .65rem .65rem 1.4rem;border-top:1px solid var(--color-border)}.algorithm-tree-node[data-tree-depth="1"]{margin-left:1rem}.algorithm-tree-node[data-tree-depth="2"]{margin-left:2rem}.algorithm-tree-node[data-tree-depth="3"]{margin-left:3rem}.algorithm-tree-leaf{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);margin-top:.5rem;padding:.75rem;border-radius:var(--radius-sm);background:var(--color-surface-alt);color:var(--color-text);font-weight:800}.algorithm-tree-leaf:hover{background:rgba(58, 173, 251, .12)}.algorithm-tree-leaf em{color:var(--color-text-muted);font-size:.65rem;font-style:normal}

.problem-browser-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.7rem}.problem-browser-grid button{display:flex;min-height:120px;align-items:flex-start;flex-direction:column;padding:var(--space-lg);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);text-align:left;transition:border-color var(--transition),transform var(--transition),box-shadow var(--transition)}.problem-browser-grid button:hover,.problem-browser-grid button.is-selected{border-color:var(--color-primary);transform:translateY(-3px);box-shadow:var(--shadow-sm)}.problem-browser-grid span{margin-bottom:auto;color:var(--color-primary);font-size:.72rem;font-weight:950}.problem-browser-grid strong{margin:.6rem 0 .25rem}.problem-browser-grid small{color:var(--color-text-muted)}.problem-browser-result{display:grid;grid-template-columns:.8fr 1.2fr;gap:var(--space-xl);margin-top:var(--space-xl);padding:var(--space-xl);border-radius:var(--radius-lg);background:var(--color-surface-alt)}.problem-browser-result__intro h3{margin:.4rem 0 var(--space-lg);font-size:2rem}.problem-browser-result__intro dl{display:grid;gap:.6rem;margin:0 0 var(--space-lg)}.problem-browser-result__intro dl div{padding:.75rem;border-radius:var(--radius-sm);background:var(--color-surface)}.problem-browser-result dt{color:var(--color-text-muted);font-size:.68rem;font-weight:800;text-transform:uppercase}.problem-browser-result dd{margin:.25rem 0 0;font-weight:800}.problem-browser-result__candidates>strong{display:block;margin-bottom:var(--space-md)}.problem-browser-result__candidates>a{display:flex;justify-content:space-between;gap:var(--space-md);margin-bottom:.5rem;padding:.75rem;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-text);font-weight:800}.problem-browser-result__candidates em{color:var(--color-text-muted);font-size:.68rem;font-style:normal;text-transform:capitalize}

.algorithm-relationship-graph{position:relative;display:grid;min-height:520px;place-items:center;overflow:hidden;border:1px solid var(--color-border);border-radius:var(--radius-lg);background:radial-gradient(circle at center,rgba(58, 173, 251, .12),transparent 45%),var(--color-surface-alt)}.relationship-graph__centre{position:relative;z-index:3;display:grid;width:180px;min-height:150px;place-items:center;padding:var(--space-lg);border-radius:42px;background:var(--color-surface-dark);color:var(--color-text);text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.2)}.relationship-graph__centre>span{color:var(--color-primary);font-size:.65rem;text-transform:uppercase}.relationship-graph__centre strong{font-size:1.15rem}.relationship-graph__centre a{color:var(--color-primary);font-size:.7rem;font-weight:800}.relationship-graph__nodes{position:absolute;inset:0}.relationship-graph__nodes>*{position:absolute;display:grid;width:145px;min-height:76px;place-items:center;padding:.65rem;border:1px solid rgba(58, 173, 251, .35);border-radius:var(--radius-md);background:var(--color-surface);color:var(--color-text);text-align:center;box-shadow:var(--shadow-sm)}.relationship-graph__nodes>*:nth-child(1){top:7%;left:50%;transform:translateX(-50%)}.relationship-graph__nodes>*:nth-child(2){top:24%;right:7%}.relationship-graph__nodes>*:nth-child(3){right:12%;bottom:10%}.relationship-graph__nodes>*:nth-child(4){bottom:10%;left:12%}.relationship-graph__nodes>*:nth-child(5){top:24%;left:7%}.relationship-graph__nodes span{color:var(--color-text-muted);font-size:.6rem;text-transform:uppercase}.relationship-graph__nodes strong{font-size:.75rem}.relationship-graph__list{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%)}.graph-accessibility-note{margin:var(--space-md) 0 0;color:var(--color-text-muted);font-size:.72rem}

.algorithm-catalogue-layout{display:grid;grid-template-columns:250px 1fr;align-items:start;gap:var(--space-xl)}.algorithm-filter-panel{position:sticky;top:100px;display:grid;gap:var(--space-md);padding:var(--space-lg);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-alt)}.algorithm-filter-panel__header{display:flex;justify-content:space-between;gap:var(--space-md)}.algorithm-filter-panel__header button{border:0;background:transparent;color:var(--color-primary);font-size:.72rem;font-weight:800}.algorithm-filter-panel label{display:grid;gap:.35rem;color:var(--color-text);font-size:.7rem;font-weight:800}.algorithm-filter-panel select{width:100%;min-height:42px;padding:.55rem;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-text)}.algorithm-catalogue-results__header{display:flex;justify-content:space-between;gap:var(--space-md);margin-bottom:var(--space-md);color:var(--color-text-muted);font-size:.72rem}.algorithm-library-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-md)}
.algorithm-library-card{display:flex;min-height:100%;flex-direction:column;padding:var(--space-lg);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);box-shadow:var(--shadow-sm);transition:border-color var(--transition),transform var(--transition),box-shadow var(--transition)}.algorithm-library-card:hover,.algorithm-library-card.is-highlighted{border-color:var(--color-primary);transform:translateY(-4px);box-shadow:var(--shadow-md)}.algorithm-library-card__top{display:flex;justify-content:space-between;gap:var(--space-md);margin-bottom:var(--space-md)}.algorithm-library-card__top span{color:var(--color-primary);font-size:.65rem;font-weight:900;text-transform:uppercase}.algorithm-library-card__top em{color:var(--color-text-muted);font-size:.65rem;font-style:normal;text-transform:capitalize}.algorithm-library-card h3{margin-bottom:.5rem;font-size:1.2rem}.algorithm-library-card>p{color:var(--color-text-muted);font-size:.82rem;line-height:1.55}.algorithm-library-card__meta{display:flex;flex-wrap:wrap;gap:.4rem;margin:var(--space-md) 0}.algorithm-library-card__meta span{padding:.25rem .45rem;border-radius:var(--radius-pill);background:var(--color-surface-alt);color:var(--color-text-muted);font-size:.62rem}.algorithm-library-card__best{margin-bottom:var(--space-md);padding:.7rem;border-left:3px solid var(--color-primary);background:rgba(58, 173, 251, .07)}.algorithm-library-card__best strong{font-size:.66rem;text-transform:uppercase}.algorithm-library-card__best p{margin:.25rem 0 0;color:var(--color-text-muted);font-size:.72rem;line-height:1.5}.algorithm-library-card__availability{align-self:flex-start;margin-top:auto;padding:.3rem .5rem;border-radius:var(--radius-pill);background:var(--color-surface-alt);color:var(--color-text-muted);font-size:.62rem;font-weight:800}.algorithm-library-card__availability.is-available{background:rgba(58, 173, 251, .16);color:var(--color-primary)}.algorithm-library-card__actions{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-top:var(--space-md)}.algorithm-library-card__actions a{color:var(--color-text);font-size:.75rem;font-weight:850}.algorithm-library-card__actions a:hover{color:var(--color-primary)}.algorithm-library-card__actions button{padding:.45rem .65rem;border:1px solid var(--color-border);border-radius:var(--radius-pill);background:var(--color-surface);color:var(--color-text);font-size:.68rem;font-weight:800}.algorithm-library-card__actions button[aria-pressed="true"]{border-color:var(--color-primary);background:rgba(58, 173, 251, .12)}.algorithm-library-card--compact{padding:var(--space-md)}.algorithm-library-card--compact .algorithm-library-card__meta{display:none}.library-no-results{padding:var(--space-2xl);text-align:center;color:var(--color-text-muted)}

.library-type-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-lg)}.library-type-grid article{padding:var(--space-xl);border:1px solid rgba(255,255,255,.09);border-radius:var(--radius-lg);background:rgba(255,255,255,.04)}.library-type-grid span{display:inline-block;margin-bottom:var(--space-md);color:var(--color-primary);font-size:.68rem;font-weight:900;text-transform:uppercase}.library-type-grid h3{margin-bottom:.5rem;color:var(--color-text)}.library-type-grid p{margin:0;color:var(--color-text-muted);line-height:1.65}.library-learning-notice{display:grid;grid-template-columns:70px 1fr;align-items:center;gap:var(--space-xl);padding:clamp(1.5rem,4vw,2.5rem);border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface-alt)}.library-learning-notice>span{display:grid;width:60px;height:60px;place-items:center;border-radius:18px;background:var(--color-primary);font-size:1.8rem;font-weight:950}.library-learning-notice h2{margin:.4rem 0 .5rem}.library-learning-notice p{margin:0;color:var(--color-text-muted);line-height:1.7}

.library-compare-bar{position:fixed;right:20px;bottom:20px;left:20px;z-index:90;display:flex;align-items:center;justify-content:space-between;gap:var(--space-lg);max-width:1180px;margin:auto;padding:.8rem 1rem;border:1px solid rgba(255,255,255,.12);border-radius:var(--radius-lg);background:rgba(1, 3, 20, .96);color:var(--color-text);box-shadow:0 18px 60px rgba(0,0,0,.35);backdrop-filter:blur(12px)}.library-compare-bar>div{display:flex;align-items:center;gap:.7rem}.library-compare-bar>div:first-child>div{display:flex;flex-wrap:wrap;gap:.35rem}.library-compare-bar span{padding:.25rem .45rem;border-radius:var(--radius-pill);background:rgba(255,255,255,.08);font-size:.65rem}.library-compare-bar button:not(.button){border:0;background:transparent;color:var(--color-text-muted);font-weight:800}.library-compare-dialog{width:min(1200px,calc(100% - 32px));max-height:90vh;padding:0;overflow:auto;border:0;border-radius:var(--radius-lg);background:var(--color-surface);box-shadow:0 28px 90px rgba(0,0,0,.4)}.library-compare-dialog::backdrop{background:rgba(1, 3, 20, .72)}.library-compare-dialog__header{position:sticky;top:0;z-index:2;display:flex;align-items:flex-start;justify-content:space-between;padding:var(--space-xl);border-bottom:1px solid var(--color-border);background:rgba(16, 28, 67, .96);backdrop-filter:blur(12px)}.library-compare-dialog__header h2{margin-top:.35rem}.library-compare-dialog__header>button{display:grid;width:40px;height:40px;place-items:center;border:0;border-radius:50%;background:var(--color-surface-alt);font-size:1.4rem}.library-compare-dialog__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-md);padding:var(--space-xl)}.library-compare-dialog__grid article{padding:var(--space-lg);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-alt)}.library-compare-dialog__grid article>span{color:var(--color-primary);font-size:.65rem;font-weight:900;text-transform:uppercase}.library-compare-dialog__grid h3{margin:.4rem 0 var(--space-lg)}.library-compare-dialog__grid dl{display:grid;gap:.45rem}.library-compare-dialog__grid dl div{display:flex;justify-content:space-between;gap:.5rem;padding-bottom:.4rem;border-bottom:1px solid var(--color-border)}.library-compare-dialog__grid dt,.library-compare-dialog__grid dd{font-size:.68rem}.library-compare-dialog__grid dd{margin:0;font-weight:800;text-transform:capitalize}.library-compare-dialog__grid p{color:var(--color-text-muted);font-size:.72rem;line-height:1.5}.library-compare-dialog__grid a{color:var(--color-primary);font-size:.75rem;font-weight:850}


/* =========================================================
   ALGORITHM DETAIL PAGES
   ========================================================= */

/* =========================================================
   COMPLETE ALGORITHM TAXONOMY LIBRARY
   ========================================================= */

/* =========================================================
   Ai DICTIONARY
   ========================================================= */

.dictionary-hero{background:radial-gradient(circle at 78% 25%,rgba(58, 173, 251, .17),transparent 27%),linear-gradient(145deg,var(--color-surface-dark),var(--color-selected));color:var(--color-text)}.dictionary-hero__grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(300px,.55fr);gap:clamp(2rem,8vw,7rem);align-items:center}.dictionary-hero .page-hero__title{color:var(--color-text)}.dictionary-hero .page-hero__description{max-width:760px;color:var(--color-text-muted)}.dictionary-hero__actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.6rem}.dictionary-hero__orbit{position:relative;display:grid;width:min(390px,90vw);aspect-ratio:1;place-items:center;margin:auto;border:1px solid rgba(58, 173, 251, .35);border-radius:50%}.dictionary-hero__orbit::before,.dictionary-hero__orbit::after{position:absolute;border:1px solid rgba(255,255,255,.1);border-radius:50%;content:""}.dictionary-hero__orbit::before{inset:15%}.dictionary-hero__orbit::after{inset:31%}.dictionary-hero__orbit>strong{z-index:1;display:grid;width:120px;aspect-ratio:1;place-items:center;border-radius:50%;background:var(--color-primary);color:var(--color-on-primary);text-align:center}.dictionary-orbit-node{position:absolute;padding:.45rem .65rem;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:var(--color-surface-raised);color:var(--color-text);font-size:.62rem;font-weight:800}.dictionary-orbit-node--1{top:3%;left:39%}.dictionary-orbit-node--2{top:25%;right:-4%}.dictionary-orbit-node--3{right:3%;bottom:20%}.dictionary-orbit-node--4{bottom:3%;left:37%}.dictionary-orbit-node--5{bottom:23%;left:-7%}.dictionary-orbit-node--6{top:24%;left:-2%}.dictionary-principle{padding-block:1.2rem;border-bottom:1px solid var(--color-border);background:var(--color-surface)}.dictionary-principle .container{display:flex;align-items:center;justify-content:center;gap:1.3rem}.dictionary-principle .container>div{display:grid;text-align:center}.dictionary-principle strong{font-size:.82rem}.dictionary-principle span{color:var(--color-text-muted);font-size:.62rem}.dictionary-principle b{color:var(--color-primary);font-size:1.5rem}.dictionary-search{max-width:920px;margin:0 auto 1.3rem;text-align:center}.dictionary-search>label{display:block;margin-bottom:.55rem;font-size:clamp(1.15rem,2vw,1.55rem);font-weight:900}.dictionary-search>div{display:flex;align-items:center;gap:.7rem;padding:.45rem .7rem;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);box-shadow:var(--shadow-sm)}.dictionary-search input{min-width:0;flex:1;padding:.65rem 0;border:0;outline:0}.dictionary-search kbd{padding:.2rem .4rem;border:1px solid var(--color-border);border-radius:5px;background:var(--color-surface-alt);font-size:.62rem}.dictionary-search>p{margin:.5rem 0;color:var(--color-text-muted);font-size:.68rem}.dictionary-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;overflow:hidden;margin-bottom:1.3rem;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-border)}.dictionary-stats div{display:grid;gap:.15rem;padding:.9rem;background:var(--color-surface);text-align:center}.dictionary-stats strong{color:var(--color-primary);font-size:1.45rem}.dictionary-stats span{color:var(--color-text-muted);font-size:.58rem;font-weight:800;text-transform:uppercase}.dictionary-filter-link{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;margin-bottom:1.3rem;padding:1rem 1.2rem;border-radius:var(--radius-md);background:var(--color-selected)}.dictionary-filter-link h2{margin:.2rem 0;font-size:1.2rem}.dictionary-filter-link p{margin:0;color:var(--color-text-muted);font-size:.72rem}.dictionary-view-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.55rem;margin-bottom:1.3rem}.dictionary-view-tabs button{display:grid;gap:.2rem;padding:.9rem;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);text-align:left}.dictionary-view-tabs button:hover,.dictionary-view-tabs button.is-active{border-color:var(--color-primary);background:var(--color-surface)}.dictionary-view-tabs strong{font-size:.76rem}.dictionary-view-tabs small{color:var(--color-text-muted);font-size:.58rem}.dictionary-loading{padding:2rem;text-align:center}.dictionary-view-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:1.5rem;margin-block:1.5rem}.dictionary-view-heading h2{margin:.25rem 0}.dictionary-view-heading p{max-width:720px;margin:0;color:var(--color-text-muted)}.dictionary-view-heading>div:last-child{display:flex;gap:.5rem}.dictionary-view-heading button{padding:.65rem .75rem;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);font-size:.65rem;font-weight:800}.dictionary-topic-jump,.dictionary-alphabet{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1rem}.dictionary-topic-jump button,.dictionary-alphabet button{padding:.55rem .7rem;border:1px solid var(--color-border);border-radius:999px;background:var(--color-surface);font-size:.62rem;font-weight:800}.dictionary-topic-jump button:hover,.dictionary-alphabet button:hover,.dictionary-alphabet button.is-selected{border-color:var(--color-primary);background:var(--color-surface)}.dictionary-tree-workspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,.42fr);gap:1.2rem;align-items:start}.dictionary-tree,.dictionary-entry-preview{padding:1.15rem;border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface);box-shadow:var(--shadow-sm)}.dictionary-tree-root{display:grid;margin-bottom:.8rem;padding:1rem;border-radius:var(--radius-md);background:var(--color-dark);color:var(--color-text)}.dictionary-tree-root span{color:var(--color-text-muted);font-size:.65rem}.dictionary-tree ul{margin:0;padding:0;list-style:none}.dictionary-tree ul ul{margin-left:1.1rem;padding-left:.9rem;border-left:1px solid var(--color-border)}.dictionary-tree-node__row{display:flex;align-items:center;gap:.35rem;margin:.22rem 0;padding:.25rem;border-radius:8px}.dictionary-tree-node__row:hover,.dictionary-tree-node__row.is-selected{background:var(--color-surface)}.dictionary-tree-node__row>button:first-child,.dictionary-tree-node__row>i{display:grid;width:26px;height:26px;flex:0 0 26px;place-items:center}.dictionary-tree-node__row>button:first-child{border:1px solid var(--color-border);border-radius:7px;background:var(--color-surface);color:var(--color-primary);font-weight:900}.dictionary-tree-node__row>i::after{display:block;width:7px;height:7px;margin:9px;border-radius:50%;background:var(--color-selected);content:""}.dictionary-tree-node__row>button:nth-child(2){display:flex;align-items:center;justify-content:space-between;gap:.6rem;min-width:0;flex:1;padding:.4rem .5rem;border:0;background:transparent;text-align:left}.dictionary-tree-node__row>button:nth-child(2) span{overflow-wrap:anywhere;font-size:.76rem;font-weight:820}.dictionary-tree-node__row small{color:var(--color-text-muted);font-size:.55rem;font-weight:750;text-transform:uppercase}.dictionary-tree-node__row em{display:grid;min-width:24px;height:21px;place-items:center;border-radius:999px;background:var(--color-surface-alt);font-size:.55rem;font-style:normal}.dictionary-entry-preview{position:sticky;top:96px;min-height:400px}.dictionary-entry-preview__empty{display:grid;min-height:350px;place-content:center;text-align:center}.dictionary-entry-preview__empty>span{color:var(--color-primary);font-size:2.2rem;font-weight:950}.dictionary-entry-preview__empty h2{margin:.5rem}.dictionary-entry-preview__empty p{color:var(--color-text-muted)}.dictionary-entry-preview__top{display:flex;align-items:center;justify-content:space-between;gap:.7rem}.dictionary-entry-preview__top em{color:var(--color-text-muted);font-size:.6rem;font-style:normal}.dictionary-entry-preview h2{margin:.75rem 0;font-size:clamp(1.7rem,3vw,2.4rem)}.dictionary-type-badge{display:inline-flex;padding:.3rem .5rem;border-radius:999px;background:var(--color-surface);color:var(--color-text-muted);font-size:.56rem;font-weight:900;letter-spacing:.04em;text-transform:uppercase}.dictionary-type-badge[data-entry-type="Algorithm"]{background:var(--color-selected);color:var(--color-primary)}.dictionary-type-badge[data-entry-type="Architecture"],.dictionary-type-badge[data-entry-type="Model"]{background:var(--color-surface);color:var(--color-lavender)}.dictionary-type-badge[data-entry-type="Tool"],.dictionary-type-badge[data-entry-type="Framework"]{background:var(--color-surface);color:var(--color-primary)}.dictionary-type-badge[data-entry-type="Metric"]{background:var(--color-surface);color:var(--color-success)}.dictionary-type-badge[data-entry-type="Hardware"]{background:var(--color-surface);color:var(--color-text)}.dictionary-type-badge[data-entry-type="Risk"]{background:var(--color-surface);color:var(--color-error)}.dictionary-type-badge[data-entry-type="Career"]{background:var(--color-surface);color:var(--color-lavender)}.dictionary-entry-definition{color:var(--color-text-muted);font-size:.84rem;line-height:1.75}.dictionary-entry-paths,.dictionary-entry-related,.dictionary-entry-resource-plan{margin:1rem 0;padding-top:1rem;border-top:1px solid var(--color-border)}.dictionary-entry-paths>strong,.dictionary-entry-related>strong,.dictionary-entry-resource-plan>strong{font-size:.72rem}.dictionary-entry-paths p{margin:.35rem 0;color:var(--color-text-muted);font-size:.62rem}.dictionary-entry-related>div{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.55rem}.dictionary-entry-related button{padding:.4rem .55rem;border:1px solid var(--color-border);border-radius:999px;background:var(--color-surface);font-size:.6rem;font-weight:750}.dictionary-entry-resource-plan p{color:var(--color-text-muted);font-size:.65rem;line-height:1.6}.dictionary-graph{display:grid;grid-template-columns:minmax(190px,.32fr) minmax(0,1fr);gap:2rem;align-items:center;min-height:540px;padding:2rem;border:1px solid var(--color-border);border-radius:var(--radius-lg);background:radial-gradient(circle at 18% 50%,rgba(58, 173, 251, .13),transparent 30%),var(--color-surface)}.dictionary-graph__centre{display:grid;gap:.5rem;padding:1.5rem;border-radius:50%;aspect-ratio:1;place-content:center;background:var(--color-dark);color:var(--color-text);text-align:center}.dictionary-graph__centre span{color:var(--color-primary);font-size:.6rem;font-weight:900;text-transform:uppercase}.dictionary-graph__centre button{border:0;background:transparent;color:var(--color-primary);font-size:.62rem;font-weight:800}.dictionary-graph__connections{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}.dictionary-graph__connections button{display:grid;gap:.25rem;padding:1rem;border:1px solid var(--color-border);border-left:3px solid var(--color-primary);border-radius:var(--radius-sm);background:var(--color-surface);text-align:left}.dictionary-graph__connections span,.dictionary-graph__connections small{color:var(--color-text-muted);font-size:.56rem}.dictionary-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem}.dictionary-card{display:flex;min-width:0;flex-direction:column;padding:1rem;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface)}.dictionary-card>div{display:flex;align-items:center;justify-content:space-between}.dictionary-card>div em{color:var(--color-text-muted);font-size:.56rem;font-style:normal}.dictionary-card h3{margin:.7rem 0 .4rem;font-size:1.05rem}.dictionary-card p{flex:1;color:var(--color-text-muted);font-size:.68rem;line-height:1.65}.dictionary-card>button,.dictionary-topic-grid article>button{align-self:flex-start;padding:0;border:0;background:transparent;color:var(--color-primary);font-size:.68rem;font-weight:850}.dictionary-no-results{grid-column:1/-1;padding:2rem;text-align:center}.dictionary-topic-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.dictionary-topic-grid article{padding:1.2rem;border:1px solid var(--color-border);border-top:3px solid var(--color-primary);border-radius:var(--radius-md);background:var(--color-surface)}.dictionary-topic-grid article>span{color:var(--color-primary);font-size:.6rem;font-weight:850;text-transform:uppercase}.dictionary-topic-grid h3{margin:.5rem 0}.dictionary-topic-grid p{color:var(--color-text-muted);font-size:.72rem}.dictionary-type-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.55rem;margin-bottom:1.2rem}.dictionary-type-grid button{display:grid;gap:.2rem;padding:.8rem;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);text-align:left}.dictionary-type-grid button:hover,.dictionary-type-grid button.is-selected{border-color:var(--color-primary);background:var(--color-surface)}.dictionary-type-grid span{color:var(--color-primary);font-size:1.1rem;font-weight:900}.dictionary-type-grid strong{font-size:.68rem}.dictionary-type-grid small{color:var(--color-text-muted);font-size:.52rem}.dictionary-boundary{display:flex;align-items:center;gap:1.2rem;max-width:900px}.dictionary-boundary>span{display:grid;width:58px;height:58px;flex:0 0 58px;place-items:center;border-radius:18px;background:var(--color-primary);color:var(--color-on-primary);font-size:1.5rem;font-weight:950}.dictionary-boundary h2{margin:.3rem 0}.dictionary-boundary p{margin:0;color:var(--color-text-muted)}

.taxonomy-hero{background:radial-gradient(circle at 82% 20%,rgba(58, 173, 251, .15),transparent 28%),linear-gradient(135deg,var(--color-surface-dark),var(--color-selected));color:var(--color-text)}.taxonomy-hero__grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(290px,.55fr);gap:clamp(2rem,7vw,6rem);align-items:center}.taxonomy-hero .page-hero__title{color:var(--color-text)}.taxonomy-hero .page-hero__description{max-width:760px;color:var(--color-text-muted)}.taxonomy-hero__actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.6rem}.taxonomy-hero__map{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem;padding:1.25rem;border:1px solid rgba(255,255,255,.13);border-radius:var(--radius-lg);background:rgba(255,255,255,.05)}.taxonomy-hero__map strong{grid-column:1/-1;padding:.8rem;border-radius:var(--radius-sm);background:var(--color-primary);color:var(--color-on-primary);text-align:center}.taxonomy-hero__map span{padding:.65rem;border-left:2px solid rgba(58, 173, 251, .55);background:rgba(255,255,255,.045);color:var(--color-text-muted);font-size:.72rem;font-weight:750}.taxonomy-overview{padding-block:1.3rem}.taxonomy-overview__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;overflow:hidden;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-border)}.taxonomy-overview__grid div{display:grid;gap:.2rem;padding:1rem;background:var(--color-surface);text-align:center}.taxonomy-overview__grid strong{color:var(--color-primary);font-size:1.55rem}.taxonomy-overview__grid span{color:var(--color-text-muted);font-size:.68rem;font-weight:750;text-transform:uppercase}.taxonomy-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--space-xl)}.taxonomy-heading>div:first-child{max-width:760px}.taxonomy-legend{display:flex;flex-wrap:wrap;gap:.8rem}.taxonomy-legend span{display:flex;align-items:center;gap:.35rem;color:var(--color-text-muted);font-size:.68rem;font-weight:750}.taxonomy-legend i{width:9px;height:9px;border-radius:50%;background:var(--color-surface-raised)}.taxonomy-legend .is-category{background:var(--color-magenta-hover)}.taxonomy-legend .is-topic{background:var(--color-selected)}.taxonomy-legend .is-ready{background:var(--color-selected)}.taxonomy-tools{margin-top:var(--space-xl);padding:1rem;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-alt)}.taxonomy-tools>label{display:block;margin-bottom:.45rem;font-size:.72rem;font-weight:850}.taxonomy-search-row{display:flex;gap:.55rem}.taxonomy-search-row input{min-width:0;flex:1;padding:.78rem 1rem;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface)}.taxonomy-search-row button,.taxonomy-jump button{padding:.7rem .85rem;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-text);font-size:.68rem;font-weight:800}.taxonomy-search-row button:hover,.taxonomy-jump button:hover{border-color:var(--color-primary);background:var(--color-surface)}.taxonomy-tools>p{margin:.55rem 0 0;color:var(--color-text-muted);font-size:.68rem}.taxonomy-jump{display:flex;flex-wrap:wrap;gap:.45rem;margin-block:1rem}.taxonomy-jump button{border-radius:999px}.taxonomy-workspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(290px,.42fr);gap:1.2rem;align-items:start}.taxonomy-tree-panel,.taxonomy-preview{border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface);box-shadow:var(--shadow-sm)}.taxonomy-tree-panel{min-width:0;padding:1.15rem}.taxonomy-root{display:flex;align-items:center;gap:.8rem;margin-bottom:1rem;padding:1rem;border-radius:var(--radius-md);background:var(--color-dark);color:var(--color-text)}.taxonomy-root__icon{display:grid;width:42px;height:42px;place-items:center;border-radius:12px;background:var(--color-primary);color:var(--color-on-primary);font-size:.82rem;font-weight:950}.taxonomy-root div{display:grid}.taxonomy-root strong{font-size:1.1rem}.taxonomy-root small{color:var(--color-text-muted)}.taxonomy-tree-list,.taxonomy-tree-list ul{margin:0;padding:0;list-style:none}.taxonomy-tree-list ul{position:relative;margin-left:1.15rem;padding-left:1rem;border-left:1px solid var(--color-border)}.taxonomy-node__row{display:flex;align-items:center;gap:.42rem;min-width:0;margin:.25rem 0;padding:.28rem .35rem;border-radius:9px}.taxonomy-node__row:hover,.taxonomy-node__row.is-selected{background:var(--color-surface)}.taxonomy-node__toggle,.taxonomy-node__endpoint{width:27px;height:27px;flex:0 0 27px}.taxonomy-node__toggle{display:grid;place-items:center;border:1px solid var(--color-border);border-radius:7px;background:var(--color-surface);color:var(--color-primary);font-size:1rem;font-weight:900}.taxonomy-node__toggle:hover{border-color:var(--color-primary)}.taxonomy-node__endpoint{position:relative}.taxonomy-node__endpoint::after{position:absolute;top:11px;left:10px;width:7px;height:7px;border-radius:50%;background:var(--color-selected);content:""}.taxonomy-node__name{display:flex;align-items:center;justify-content:space-between;gap:.8rem;min-width:0;flex:1;padding:.45rem .55rem;border:0;background:transparent;color:var(--color-text);text-align:left}.taxonomy-node__name span{overflow-wrap:anywhere;font-size:.79rem;font-weight:820}.taxonomy-node__name small{flex:0 0 auto;color:var(--color-text-muted);font-size:.56rem;font-weight:700;text-transform:uppercase}.taxonomy-node__row>em{display:grid;min-width:25px;height:22px;place-items:center;border-radius:999px;background:var(--color-surface-alt);color:var(--color-text-muted);font-size:.58rem;font-style:normal;font-weight:850}.taxonomy-node__ready{padding:.2rem .4rem;border-radius:999px;background:var(--color-surface);color:var(--color-success);font-size:.55rem;font-weight:900;text-transform:uppercase}.taxonomy-preview{position:sticky;top:96px;min-height:390px;padding:1.35rem}.taxonomy-preview__placeholder{display:grid;min-height:330px;place-content:center;text-align:center}.taxonomy-preview__placeholder>span{color:var(--color-primary);font-size:2.6rem}.taxonomy-preview__placeholder h2{margin:.5rem 0;font-size:1.35rem}.taxonomy-preview__placeholder p{color:var(--color-text-muted)}.taxonomy-preview__top{display:flex;align-items:center;justify-content:space-between;gap:.7rem}.taxonomy-preview__top>span{color:var(--color-primary);font-size:.62rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.taxonomy-preview__top em{padding:.3rem .48rem;border-radius:999px;background:var(--color-surface-alt);color:var(--color-text-muted);font-size:.55rem;font-style:normal;font-weight:800}.taxonomy-preview__top em.is-ready{background:var(--color-surface);color:var(--color-success)}.taxonomy-preview h2{margin:.7rem 0;font-size:clamp(1.6rem,3vw,2.25rem)}.taxonomy-preview>p{color:var(--color-text-muted);line-height:1.7}.taxonomy-preview__path{display:flex;flex-wrap:wrap;gap:.28rem;margin-bottom:1rem}.taxonomy-preview__path span,.taxonomy-preview__path i{color:var(--color-text-muted);font-size:.6rem;font-style:normal}.taxonomy-preview__facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;margin:1.2rem 0}.taxonomy-preview__facts div{display:grid;padding:.8rem;border-radius:var(--radius-sm);background:var(--color-surface-alt)}.taxonomy-preview__facts strong{font-size:1.3rem}.taxonomy-preview__facts span{color:var(--color-text-muted);font-size:.62rem}.taxonomy-preview__learning{margin:1.15rem 0;padding:1rem;border-left:3px solid var(--color-primary);background:var(--color-surface)}.taxonomy-preview__learning strong{font-size:.76rem}.taxonomy-preview__learning p{margin:.45rem 0 0;color:var(--color-text-muted);font-size:.7rem;line-height:1.6}.button--disabled{cursor:not-allowed;opacity:.55}.taxonomy-empty{padding:2rem;text-align:center}.taxonomy-type-guide,.taxonomy-next-stage{display:flex;align-items:center;justify-content:space-between;gap:var(--space-xl)}.taxonomy-type-guide>div:first-child{max-width:570px}.taxonomy-type-guide__items{display:flex;max-width:540px;flex-wrap:wrap;justify-content:flex-end;gap:.5rem}.taxonomy-type-guide__items span{padding:.55rem .7rem;border:1px solid rgba(255,255,255,.16);border-radius:999px;color:var(--color-text-muted);font-size:.65rem;font-weight:750}.taxonomy-next-stage>div{max-width:720px}.taxonomy-next-stage h2{margin:.4rem 0}

[data-mobile-filter]{display:none}.algorithm-detail-hero{padding-block:clamp(3.5rem,8vw,7rem);background:radial-gradient(circle at 88% 18%,rgba(58, 173, 251, .14),transparent 25%),var(--color-dark,var(--color-surface-raised));color:var(--color-text)}.algorithm-detail-hero__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.36fr);gap:clamp(2rem,6vw,5rem);align-items:end}.algorithm-detail-hero h1{max-width:850px;margin:.35rem 0 1rem;color:var(--color-text);font-size:clamp(2.7rem,7vw,5.8rem);line-height:.98}.algorithm-detail-taxonomy{margin-bottom:1.6rem;color:var(--color-text-muted);font-size:.88rem}.algorithm-detail-taxonomy span{margin-inline:.35rem;color:var(--color-primary,var(--color-primary))}.algorithm-detail-lead{max-width:720px;color:var(--color-text-muted);font-size:clamp(1.08rem,2vw,1.3rem)}.algorithm-detail-chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-block:1.2rem}.algorithm-detail-chips span{padding:.45rem .72rem;border:1px solid rgba(58, 173, 251, .28);border-radius:999px;background:rgba(58, 173, 251, .09);color:inherit;font-size:.82rem;font-weight:700}.algorithm-detail-actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.5rem}.algorithm-detail-status{padding:1.35rem;border:1px solid rgba(255,255,255,.13);border-radius:var(--radius-lg,20px);background:rgba(255,255,255,.055)}.algorithm-detail-status>span{display:inline-block;margin-bottom:1rem;color:var(--color-primary,var(--color-primary));font-weight:800}.algorithm-detail-status dl,.algorithm-detail-status dd{margin:0}.algorithm-detail-status dl>div{display:flex;justify-content:space-between;gap:1rem;padding-block:.72rem;border-top:1px solid rgba(255,255,255,.1)}.algorithm-detail-status dt{color:var(--color-text-muted)}.algorithm-detail-status dd{text-align:right;font-weight:700}.algorithm-detail-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.32fr);gap:clamp(2rem,6vw,5rem)}.algorithm-detail-content>section{padding-block:2rem;border-bottom:1px solid var(--color-border,var(--color-border))}.algorithm-detail-content>section:first-child{padding-top:0}.algorithm-detail-content h2{margin-bottom:.85rem;font-size:clamp(1.65rem,3vw,2.35rem)}.algorithm-detail-content h3{font-size:1.05rem}.algorithm-detail-do-dont{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:1.2rem}.algorithm-detail-do-dont>div,.algorithm-detail-project,.algorithm-detail-formula{padding:1.25rem;border:1px solid var(--color-border,var(--color-border));border-radius:var(--radius-md,14px);background:var(--color-surface,var(--color-surface))}.algorithm-detail-do-dont>div:first-child{border-top:3px solid var(--color-success)}.algorithm-detail-do-dont>div:last-child{border-top:3px solid var(--color-primary)}.algorithm-detail-formula{display:grid;gap:.7rem;margin-top:1.25rem;border-color:rgba(58, 173, 251, .45);background:rgba(58, 173, 251, .07)}.algorithm-detail-formula span,.algorithm-detail-project>span{color:var(--color-primary);font-size:.78rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.algorithm-detail-formula code{overflow-wrap:anywhere;font-size:1rem}.algorithm-detail-list{display:grid;gap:.6rem;padding-left:1.2rem}.algorithm-detail-project{margin-top:1.3rem;border-left:4px solid var(--color-primary,var(--color-primary))}.algorithm-detail-project p{margin:.45rem 0 0}.algorithm-detail-sidebar{display:grid;align-content:start;gap:1.2rem}.algorithm-detail-sidebar>div{padding:1.25rem;border:1px solid var(--color-border,var(--color-border));border-radius:var(--radius-lg,20px);background:var(--color-surface,var(--color-surface))}.algorithm-detail-sidebar h2{margin-bottom:.8rem;font-size:1.15rem}.algorithm-resource-link,.algorithm-related-link{display:flex;justify-content:space-between;gap:1rem;padding-block:.8rem;border-top:1px solid var(--color-border,var(--color-border));color:var(--color-text,var(--color-text));font-weight:800;text-decoration:none}.algorithm-resource-link span,.algorithm-related-link span{color:var(--color-text-muted,var(--color-text-muted));font-size:.78rem;font-weight:600}.algorithm-resource-link.is-planned{cursor:not-allowed;opacity:.62;pointer-events:none}.algorithm-related-link{align-items:flex-end;flex-direction:column;text-align:right}

/* Interactive algorithm demonstrations */
.algorithm-demo{margin:1.25rem 0;padding:1.25rem;border:1px solid var(--color-border,var(--color-border));border-radius:var(--radius-lg,20px);background:linear-gradient(180deg,var(--color-surface),var(--color-surface));box-shadow:var(--shadow-sm)}
.algorithm-demo__heading{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.algorithm-demo__heading span:first-child{color:var(--color-primary);font-size:.66rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.algorithm-demo__heading h3{margin:.28rem 0 0;font-size:1.35rem}.algorithm-demo__counter{flex:0 0 auto;padding:.28rem .52rem;border-radius:999px;background:var(--color-ash-soft,var(--color-surface));color:var(--color-text-muted,var(--color-text-muted));font-size:.66rem;font-weight:850}.algorithm-demo__goal{margin:.7rem 0 1rem;color:var(--color-text-muted,var(--color-text-muted));font-size:.84rem;line-height:1.55}.algorithm-demo__stage{overflow:hidden;border:1px solid var(--color-border);border-radius:var(--radius-md,14px);background:var(--color-surface)}.algorithm-demo__stage svg{display:block;width:100%;max-height:430px;aspect-ratio:396/308}.algorithm-demo__cell{fill:var(--color-text);stroke:var(--color-text-muted);stroke-width:1.2;transition:fill .18s ease,stroke .18s ease}.algorithm-demo__cell.is-wall{fill:var(--color-text);stroke:var(--color-text)}.algorithm-demo__cell.is-visited{fill:var(--color-text);stroke:var(--color-primary)}.algorithm-demo__cell.is-frontier{fill:var(--color-primary);stroke:var(--color-primary)}.algorithm-demo__cell.is-current{fill:var(--color-error);stroke:var(--color-error);stroke-width:2}.algorithm-demo__cell.is-path{fill:var(--color-success);stroke:var(--color-success);stroke-width:2}.algorithm-demo__cell.is-terrain:not(.is-current):not(.is-path){stroke:var(--color-primary);stroke-dasharray:3 2}.algorithm-demo__stage text{fill:var(--color-text);font-size:13px;font-weight:900;pointer-events:none}.algorithm-demo__stage .is-current+text,.algorithm-demo__stage .is-wall+text,.algorithm-demo__stage .is-path+text{fill:var(--color-text)}.algorithm-demo__legend{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:.75rem}.algorithm-demo__legend span{display:flex;align-items:center;gap:.3rem;color:var(--color-text-muted,var(--color-text-muted));font-size:.64rem;font-weight:700}.algorithm-demo__legend i{width:11px;height:11px;border:1px solid var(--color-border);border-radius:3px;background:var(--color-surface)}.algorithm-demo__legend .is-current{background:var(--color-selected)}.algorithm-demo__legend .is-frontier{background:var(--color-selected)}.algorithm-demo__legend .is-visited{background:var(--color-surface)}.algorithm-demo__legend .is-path{background:var(--color-success)}.algorithm-demo__legend .is-terrain{border:2px dashed var(--color-primary)}.algorithm-demo__message{min-height:2.8em;margin:.85rem 0;padding:.7rem .8rem;border-left:3px solid var(--color-primary,var(--color-primary));background:var(--color-surface);color:var(--color-text,var(--color-text));font-size:.78rem;line-height:1.45}.algorithm-demo__controls{display:flex;align-items:center;gap:.5rem}.algorithm-demo__controls button{min-width:64px;padding:.58rem .72rem;border:1px solid var(--color-border,var(--color-border));border-radius:9px;background:var(--color-surface);color:var(--color-text,var(--color-text));font-size:.7rem;font-weight:850}.algorithm-demo__controls button:hover,.algorithm-demo__controls button:focus-visible{border-color:var(--color-primary,var(--color-primary));background:var(--color-surface)}.algorithm-demo__controls label{display:flex;align-items:center;gap:.5rem;margin-left:auto;color:var(--color-text-muted,var(--color-text-muted));font-size:.68rem;font-weight:800}.algorithm-demo__controls input{width:95px;accent-color:var(--color-maroon,var(--color-primary))}.algorithm-demo__error{margin:0;color:var(--color-error)}.algorithm-demo--compact{margin:1rem 0;padding:1rem;border-radius:var(--radius-md,14px);box-shadow:none}.algorithm-demo--compact .algorithm-demo__heading h3{font-size:1.05rem}.algorithm-demo--compact .algorithm-demo__goal{font-size:.72rem}.algorithm-demo--compact .algorithm-demo__stage svg{max-height:270px}.algorithm-demo--compact .algorithm-demo__legend{gap:.45rem}.algorithm-demo--compact .algorithm-demo__legend span{font-size:.56rem}.algorithm-demo--compact .algorithm-demo__message{font-size:.68rem}.algorithm-demo--compact .algorithm-demo__controls button{min-width:0;padding:.5rem .58rem;font-size:.63rem}.algorithm-demo--compact .algorithm-demo__controls label{font-size:.6rem}.algorithm-demo--compact .algorithm-demo__controls input{width:64px}
.algorithm-demo__heading-actions{display:flex;align-items:center;gap:.45rem}.algorithm-demo__heading-actions button{padding:.38rem .58rem;border:1px solid var(--color-border,var(--color-border));border-radius:8px;background:var(--color-surface);color:var(--color-text,var(--color-text));font-size:.62rem;font-weight:850}.algorithm-demo__heading-actions button:hover,.algorithm-demo__heading-actions button:focus-visible{border-color:var(--color-primary,var(--color-primary));background:var(--color-surface)}.algorithm-demo__parameters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;margin-bottom:1rem}.algorithm-demo__parameters label{display:grid;gap:.4rem;padding:.65rem .75rem;border:1px solid var(--color-border,var(--color-border));border-radius:10px;background:var(--color-surface)}.algorithm-demo__parameters label>span{display:flex;justify-content:space-between;gap:.5rem;color:var(--color-text-muted,var(--color-text-muted));font-size:.66rem;font-weight:800}.algorithm-demo__parameters output{color:var(--color-maroon,var(--color-error));font-weight:950}.algorithm-demo__parameters input{width:100%;accent-color:var(--color-maroon,var(--color-primary))}.algorithm-demo__workspace{display:grid;gap:.85rem}.algorithm-demo__pseudocode{overflow:auto;padding:.85rem;border:1px solid var(--color-border);border-radius:var(--radius-md,14px);background:var(--color-surface-raised);color:var(--color-text)}.algorithm-demo__pseudocode>strong{display:block;margin-bottom:.55rem;color:var(--color-primary,var(--color-primary));font-size:.68rem;letter-spacing:.08em;text-transform:uppercase}.algorithm-demo__pseudocode ol{display:grid;gap:.18rem;margin:0;padding-left:2.15rem;counter-reset:item}.algorithm-demo__pseudocode li{padding:.28rem .45rem;border-left:3px solid transparent;border-radius:5px;color:var(--color-text-muted);font-size:.69rem;line-height:1.45;transition:background .18s ease,color .18s ease}.algorithm-demo__pseudocode li::marker{color:var(--color-text-muted)}.algorithm-demo__pseudocode li.is-active{border-left-color:var(--color-primary,var(--color-primary));background:rgba(58, 173, 251, .15);color:var(--color-text)}.algorithm-demo__pseudocode li.is-active::marker{color:var(--color-primary,var(--color-primary));font-weight:900}.algorithm-demo__pseudocode code{color:inherit;white-space:pre;font-family:Consolas,"Courier New",monospace}.algorithm-demo--compact .algorithm-demo__heading{align-items:center}.algorithm-demo--compact .algorithm-demo__heading-actions{align-items:flex-end;flex-direction:column}.algorithm-demo--compact .algorithm-demo__heading-actions button{font-size:.56rem}.algorithm-demo--compact .algorithm-demo__parameters{grid-template-columns:1fr}.algorithm-demo--compact .algorithm-demo__parameters label{padding:.5rem .6rem}.algorithm-demo--compact .algorithm-demo__pseudocode{padding:.65rem}.algorithm-demo--compact .algorithm-demo__pseudocode li{font-size:.58rem}.algorithm-demo:fullscreen,.algorithm-demo.is-fullscreen-fallback{width:100vw;height:100vh;max-width:none;margin:0;padding:clamp(1rem,3vw,2.5rem);overflow:auto;border:0;border-radius:0;background:var(--color-surface)}.algorithm-demo.is-fullscreen-fallback{position:fixed;z-index:10000;inset:0}.demo-fullscreen-open{overflow:hidden}.algorithm-demo:fullscreen .algorithm-demo__workspace,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__workspace{grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);align-items:stretch}.algorithm-demo:fullscreen .algorithm-demo__stage svg,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__stage svg{max-height:62vh}.algorithm-demo:fullscreen .algorithm-demo__pseudocode,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__pseudocode{display:flex;flex-direction:column;justify-content:center}.algorithm-demo:fullscreen .algorithm-demo__heading h3,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__heading h3{font-size:clamp(1.35rem,3vw,2rem)}

/* Logistic Regression classification visualizer */
.classifier-demo__parameters{grid-template-columns:repeat(3,minmax(0,1fr))}.classifier-demo__editbar{display:flex;align-items:center;flex-wrap:wrap;gap:.45rem;margin-bottom:.75rem}.classifier-demo__editbar>span{margin-right:.2rem;color:var(--color-text-muted,var(--color-text-muted));font-size:.66rem;font-weight:800}.classifier-demo__editbar button{padding:.45rem .62rem;border:1px solid var(--color-border,var(--color-border));border-radius:8px;background:var(--color-surface);color:var(--color-text,var(--color-text));font-size:.64rem;font-weight:850}.classifier-demo__editbar button[data-class="0"]{border-left:4px solid var(--color-error)}.classifier-demo__editbar button[data-class="1"]{border-left:4px solid var(--color-primary)}.classifier-demo__editbar button[data-preset]{margin-left:auto}.classifier-demo__editbar button:hover,.classifier-demo__editbar button.is-active{border-color:var(--color-primary,var(--color-primary));background:var(--color-selected)}.classifier-demo__stage{cursor:crosshair}.classifier-demo__plot-border{fill:transparent;stroke:var(--color-text-muted);stroke-width:1}.classifier-demo__boundary{stroke:var(--color-text);stroke-width:3;stroke-dasharray:7 4}.classifier-demo__point{cursor:pointer;stroke:var(--color-text);stroke-width:2;transition:r .15s ease,stroke-width .15s ease}.classifier-demo__point:hover,.classifier-demo__point.is-selected{r:9;stroke:var(--color-text);stroke-width:3}.classifier-demo__point.is-class-0{fill:var(--color-error)}.classifier-demo__point.is-class-1{fill:var(--color-primary)}.classifier-demo__axis{fill:var(--color-text-muted);font-size:11px;font-weight:800}.classifier-demo__hint{margin:.5rem 0;color:var(--color-text-muted,var(--color-text-muted));font-size:.64rem;line-height:1.45}.classifier-demo__metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem;margin-top:.7rem}.classifier-demo__metrics>div{display:grid;gap:.15rem;padding:.55rem .65rem;border:1px solid var(--color-border,var(--color-border));border-radius:9px;background:var(--color-surface)}.classifier-demo__metrics span{color:var(--color-text-muted,var(--color-text-muted));font-size:.58rem;font-weight:800;text-transform:uppercase}.classifier-demo__metrics strong{overflow-wrap:anywhere;font-size:.79rem}.classifier-demo__sigmoid{margin-top:.75rem;padding:.75rem;border:1px solid var(--color-border,var(--color-border));border-radius:var(--radius-md,14px);background:var(--color-surface)}.classifier-demo__sigmoid>strong{font-size:.7rem}.classifier-demo__sigmoid svg{display:block;width:100%;margin-top:.35rem}.classifier-demo__sigmoid text{fill:var(--color-text-muted);font-size:8px}.classifier-demo__sigmoid-curve{fill:none;stroke:var(--color-primary);stroke-width:3}.classifier-demo__sigmoid-threshold{stroke:var(--color-error);stroke-width:1.5;stroke-dasharray:4 3}.classifier-demo__sigmoid-point{fill:var(--color-primary,var(--color-primary));stroke:var(--color-text);stroke-width:2}.classifier-demo__sigmoid p{margin:.25rem 0 0;color:var(--color-text-muted,var(--color-text-muted));font-size:.66rem;line-height:1.4}.algorithm-demo:fullscreen .classifier-demo__workspace,.algorithm-demo.is-fullscreen-fallback .classifier-demo__workspace{grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr)}.algorithm-demo--compact .classifier-demo__parameters{grid-template-columns:1fr}.algorithm-demo--compact .classifier-demo__editbar button{padding:.38rem .48rem;font-size:.56rem}.algorithm-demo--compact .classifier-demo__editbar button[data-preset]{margin-left:0}.algorithm-demo--compact .classifier-demo__metrics{grid-template-columns:1fr 1fr}.algorithm-demo--compact .classifier-demo__hint{font-size:.56rem}.algorithm-demo--compact .classifier-demo__sigmoid p{font-size:.58rem}

/* Random Forest ensemble visualizer */
.forest-demo__parameters{grid-template-columns:repeat(4,minmax(0,1fr))}.forest-demo__parameters select{width:100%;padding:.35rem;border:1px solid var(--color-border,var(--color-border));border-radius:7px;background:var(--color-surface);color:var(--color-text,var(--color-text));font-size:.66rem}.forest-demo__editbar{display:flex;align-items:center;flex-wrap:wrap;gap:.45rem;margin-bottom:.75rem}.forest-demo__editbar>span{margin-right:.2rem;color:var(--color-text-muted,var(--color-text-muted));font-size:.66rem;font-weight:800}.forest-demo__editbar button{padding:.45rem .62rem;border:1px solid var(--color-border,var(--color-border));border-radius:8px;background:var(--color-surface);color:var(--color-text,var(--color-text));font-size:.64rem;font-weight:850}.forest-demo__editbar button[data-class="0"]{border-left:4px solid var(--color-error)}.forest-demo__editbar button[data-class="1"]{border-left:4px solid var(--color-primary)}.forest-demo__editbar button[data-preset]{margin-left:auto}.forest-demo__editbar button:hover,.forest-demo__editbar button.is-active{border-color:var(--color-primary,var(--color-primary));background:var(--color-selected)}.forest-demo__stage{cursor:crosshair}.forest-demo__region{opacity:.2}.forest-demo__region.is-class-0{fill:var(--color-error)}.forest-demo__region.is-class-1{fill:var(--color-primary)}.forest-demo__plot-border{fill:transparent;stroke:var(--color-text-muted)}.forest-demo__point{cursor:pointer;stroke:var(--color-text);stroke-width:2}.forest-demo__point.is-class-0{fill:var(--color-error)}.forest-demo__point.is-class-1{fill:var(--color-primary)}.forest-demo__point.is-selected{r:10;stroke:var(--color-text);stroke-width:3}.forest-demo__axis{fill:var(--color-text-muted);font-size:11px;font-weight:800}.forest-demo__hint{margin:.5rem 0;color:var(--color-text-muted,var(--color-text-muted));font-size:.62rem}.forest-demo__metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.35rem}.forest-demo__metrics>div{display:grid;gap:.12rem;padding:.48rem;border:1px solid var(--color-border,var(--color-border));border-radius:8px;background:var(--color-surface)}.forest-demo__metrics span{color:var(--color-text-muted,var(--color-text-muted));font-size:.52rem;font-weight:850;text-transform:uppercase}.forest-demo__metrics strong{font-size:.72rem}.forest-demo__right{display:grid;gap:.6rem}.forest-demo__votes,.forest-demo__importance{padding:.65rem;border:1px solid var(--color-border,var(--color-border));border-radius:var(--radius-md,14px);background:var(--color-surface)}.forest-demo__votes>div:first-child{display:flex;justify-content:space-between;gap:.5rem;margin-bottom:.45rem}.forest-demo__votes strong,.forest-demo__importance>strong{color:var(--color-primary);font-size:.64rem;text-transform:uppercase}.forest-demo__votes>div:first-child span{color:var(--color-text-muted,var(--color-text-muted));font-size:.58rem}.forest-demo__tree-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.3rem}.forest-demo__tree-card{display:grid;gap:.12rem;min-width:0;padding:.38rem;border:1px dashed var(--color-border);border-radius:7px;background:var(--color-surface);opacity:.55}.forest-demo__tree-card.is-active{border-style:solid;opacity:1}.forest-demo__tree-card.is-vote-0{border-left:4px solid var(--color-error)}.forest-demo__tree-card.is-vote-1{border-left:4px solid var(--color-primary)}.forest-demo__tree-card span{color:var(--color-text-muted,var(--color-text-muted));font-size:.48rem;font-weight:800;text-transform:uppercase}.forest-demo__tree-card strong{overflow:hidden;font-size:.64rem;text-overflow:ellipsis;white-space:nowrap}.forest-demo__tree-card small{overflow:hidden;color:var(--color-text-muted,var(--color-text-muted));font-size:.46rem;text-overflow:ellipsis;white-space:nowrap}.forest-demo__importance{display:grid;gap:.38rem}.forest-demo__importance>div{display:grid;grid-template-columns:20px 1fr 30px;gap:.4rem;align-items:center;font-size:.56rem}.forest-demo__importance i{height:7px;overflow:hidden;border-radius:999px;background:var(--color-surface)}.forest-demo__importance b{display:block;height:100%;border-radius:inherit;background:var(--color-primary,var(--color-primary))}.forest-demo__importance output{text-align:right;font-weight:850}.forest-demo--compact .forest-demo__parameters{grid-template-columns:1fr}.forest-demo--compact .forest-demo__editbar button{padding:.38rem .48rem;font-size:.56rem}.forest-demo--compact .forest-demo__editbar button[data-preset]{margin-left:0}.forest-demo--compact .forest-demo__metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.forest-demo--compact .forest-demo__tree-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.forest-demo--compact .forest-demo__hint{font-size:.54rem}

.forest-demo__tree-card{color:var(--color-text,var(--color-text));text-align:left}

/* Decision Tree classification visualizer */
.tree-demo__parameters{grid-template-columns:repeat(3,minmax(0,1fr))}.tree-demo__parameters select{width:100%;padding:.35rem;border:1px solid var(--color-border,var(--color-border));border-radius:7px;background:var(--color-surface);color:var(--color-text,var(--color-text));font-size:.66rem}.tree-demo__editbar{display:flex;align-items:center;flex-wrap:wrap;gap:.45rem;margin-bottom:.75rem}.tree-demo__editbar>span{margin-right:.2rem;color:var(--color-text-muted,var(--color-text-muted));font-size:.66rem;font-weight:800}.tree-demo__editbar button{padding:.45rem .62rem;border:1px solid var(--color-border,var(--color-border));border-radius:8px;background:var(--color-surface);color:var(--color-text,var(--color-text));font-size:.64rem;font-weight:850}.tree-demo__editbar button[data-class="0"]{border-left:4px solid var(--color-error)}.tree-demo__editbar button[data-class="1"]{border-left:4px solid var(--color-primary)}.tree-demo__editbar button[data-preset]{margin-left:auto}.tree-demo__editbar button:hover,.tree-demo__editbar button.is-active{border-color:var(--color-primary,var(--color-primary));background:var(--color-selected)}.tree-demo__stage{cursor:crosshair}.tree-demo__region{opacity:.18}.tree-demo__region.is-class-0{fill:var(--color-error)}.tree-demo__region.is-class-1{fill:var(--color-primary)}.tree-demo__plot-border{fill:transparent;stroke:var(--color-text-muted)}.tree-demo__candidate{stroke:var(--color-text-muted);stroke-width:1.5;stroke-dasharray:5 5}.tree-demo__split{stroke:var(--color-text);stroke-width:2}.tree-demo__split.is-current{stroke:var(--color-maroon,var(--color-error));stroke-width:4}.tree-demo__point{cursor:pointer;stroke:var(--color-text);stroke-width:2}.tree-demo__point.is-class-0{fill:var(--color-error)}.tree-demo__point.is-class-1{fill:var(--color-primary)}.tree-demo__point.is-selected{r:10;stroke:var(--color-text);stroke-width:3}.tree-demo__point.is-node-sample:not(.is-selected){stroke:var(--color-primary,var(--color-primary));stroke-width:4}.tree-demo__axis{fill:var(--color-text-muted);font-size:11px;font-weight:800}.tree-demo__hint{margin:.5rem 0;color:var(--color-text-muted,var(--color-text-muted));font-size:.62rem;line-height:1.4}.tree-demo__metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.4rem}.tree-demo__metrics>div{display:grid;gap:.12rem;padding:.5rem;border:1px solid var(--color-border,var(--color-border));border-radius:8px;background:var(--color-surface)}.tree-demo__metrics span{color:var(--color-text-muted,var(--color-text-muted));font-size:.54rem;font-weight:850;text-transform:uppercase}.tree-demo__metrics strong{font-size:.75rem}.tree-demo__right{display:grid;gap:.7rem}.tree-demo__tree{min-height:190px;padding:.65rem;border:1px solid var(--color-border,var(--color-border));border-radius:var(--radius-md,14px);background:var(--color-surface)}.tree-demo__tree>strong{display:block;margin-bottom:.3rem;color:var(--color-primary);font-size:.64rem;text-transform:uppercase}.tree-demo__tree svg{display:block;width:100%;max-height:280px}.tree-demo__edge{stroke:var(--color-text-muted);stroke-width:1.5}.tree-demo__edge.is-path{stroke:var(--color-primary,var(--color-primary));stroke-width:4}.tree-demo__edge-label{fill:var(--color-text-muted);font-size:8px}.tree-demo__tree-node{cursor:pointer}.tree-demo__tree-node rect{fill:var(--color-text);stroke:var(--color-text-muted);stroke-width:1.5}.tree-demo__tree-node text{fill:var(--color-text);font-size:9px;pointer-events:none}.tree-demo__tree-node text+text{fill:var(--color-text-muted);font-size:7px}.tree-demo__tree-node.is-leaf rect{fill:var(--color-text);stroke:var(--color-success)}.tree-demo__tree-node.is-selected rect{stroke:var(--color-maroon,var(--color-error));stroke-width:3}.tree-demo__tree-node.is-path rect{fill:var(--color-primary);stroke:var(--color-primary);stroke-width:3}.tree-demo--compact .tree-demo__parameters{grid-template-columns:1fr}.tree-demo--compact .tree-demo__editbar button{padding:.38rem .48rem;font-size:.56rem}.tree-demo--compact .tree-demo__editbar button[data-preset]{margin-left:0}.tree-demo--compact .tree-demo__metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.tree-demo--compact .tree-demo__tree{min-height:150px}.tree-demo--compact .tree-demo__hint{font-size:.54rem}

/* Viewport-fitted fullscreen visualizers */
.algorithm-demo__heading-actions button[data-demo-fullscreen]{display:grid;width:32px;height:32px;padding:0;place-items:center}.algorithm-demo__heading-actions button[data-demo-fullscreen] svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.algorithm-demo__heading-actions button[data-demo-fullscreen] .fullscreen-exit{display:none}.algorithm-demo__heading-actions button[data-demo-fullscreen][aria-pressed="true"] .fullscreen-enter{display:none}.algorithm-demo__heading-actions button[data-demo-fullscreen][aria-pressed="true"] .fullscreen-exit{display:block}.algorithm-demo:fullscreen,.algorithm-demo.is-fullscreen-fallback{box-sizing:border-box;display:flex;width:100vw;height:100vh;height:100dvh;max-height:100dvh;flex-direction:column;gap:.45rem;padding:clamp(.65rem,1.5vw,1.25rem);overflow:hidden}.algorithm-demo:fullscreen .algorithm-demo__heading,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__heading{flex:0 0 auto}.algorithm-demo:fullscreen .algorithm-demo__heading h3,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__heading h3{margin-top:.12rem;font-size:clamp(1rem,2.2vw,1.55rem)}.algorithm-demo:fullscreen .algorithm-demo__goal,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__goal{flex:0 0 auto;margin:0;font-size:clamp(.62rem,1.2vw,.78rem);line-height:1.35}.algorithm-demo:fullscreen .algorithm-demo__parameters,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__parameters{flex:0 0 auto;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem;margin:0}.algorithm-demo:fullscreen .classifier-demo__parameters,.algorithm-demo.is-fullscreen-fallback .classifier-demo__parameters{grid-template-columns:repeat(3,minmax(0,1fr))}.algorithm-demo:fullscreen .algorithm-demo__parameters label,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__parameters label{gap:.2rem;padding:.35rem .55rem}.algorithm-demo:fullscreen .algorithm-demo__workspace,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__workspace{display:grid;min-height:0;flex:1 1 auto;grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);gap:.6rem;overflow:hidden}.algorithm-demo:fullscreen .algorithm-demo__workspace>div,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__workspace>div{display:flex;min-width:0;min-height:0;flex-direction:column}.algorithm-demo:fullscreen .algorithm-demo__stage,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__stage{min-height:0;flex:1 1 auto}.algorithm-demo:fullscreen .algorithm-demo__stage svg,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__stage svg{width:100%;height:100%;max-height:none;object-fit:contain}.algorithm-demo:fullscreen .algorithm-demo__pseudocode,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__pseudocode{min-height:0;padding:.55rem;overflow:hidden}.algorithm-demo:fullscreen .algorithm-demo__pseudocode>strong,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__pseudocode>strong{margin-bottom:.25rem;font-size:.58rem}.algorithm-demo:fullscreen .algorithm-demo__pseudocode ol,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__pseudocode ol{gap:.06rem;padding-left:1.75rem}.algorithm-demo:fullscreen .algorithm-demo__pseudocode li,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__pseudocode li{padding:.16rem .3rem;font-size:clamp(.5rem,1vw,.65rem);line-height:1.25}.algorithm-demo:fullscreen .algorithm-demo__message,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__message{min-height:0;flex:0 0 auto;margin:0;padding:.42rem .6rem;font-size:.66rem;line-height:1.3}.algorithm-demo:fullscreen .algorithm-demo__controls,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__controls{flex:0 0 auto;flex-wrap:nowrap}.algorithm-demo:fullscreen .algorithm-demo__controls button,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__controls button{padding:.42rem .6rem}.algorithm-demo:fullscreen .algorithm-demo__legend,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__legend{flex:0 0 auto;margin-top:.35rem}.algorithm-demo:fullscreen .classifier-demo__editbar,.algorithm-demo.is-fullscreen-fallback .classifier-demo__editbar{flex:0 0 auto;margin:0}.algorithm-demo:fullscreen .classifier-demo__workspace,.algorithm-demo.is-fullscreen-fallback .classifier-demo__workspace{grid-template-columns:minmax(0,1.4fr) minmax(0,.6fr)}.algorithm-demo:fullscreen .classifier-demo__hint,.algorithm-demo.is-fullscreen-fallback .classifier-demo__hint{flex:0 0 auto;margin:.25rem 0;font-size:.55rem}.algorithm-demo:fullscreen .classifier-demo__metrics,.algorithm-demo.is-fullscreen-fallback .classifier-demo__metrics{flex:0 0 auto;grid-template-columns:repeat(4,minmax(0,1fr));gap:.3rem;margin-top:.2rem}.algorithm-demo:fullscreen .classifier-demo__metrics>div,.algorithm-demo.is-fullscreen-fallback .classifier-demo__metrics>div{padding:.3rem .4rem}.algorithm-demo:fullscreen .classifier-demo__metrics strong,.algorithm-demo.is-fullscreen-fallback .classifier-demo__metrics strong{font-size:.65rem}.algorithm-demo:fullscreen .classifier-demo__sigmoid,.algorithm-demo.is-fullscreen-fallback .classifier-demo__sigmoid{min-height:0;margin-top:.4rem;padding:.45rem}.algorithm-demo:fullscreen .classifier-demo__sigmoid svg,.algorithm-demo.is-fullscreen-fallback .classifier-demo__sigmoid svg{min-height:0;flex:1 1 auto}.algorithm-demo:fullscreen .classifier-demo__sigmoid p,.algorithm-demo.is-fullscreen-fallback .classifier-demo__sigmoid p{font-size:.55rem}

.algorithm-demo:fullscreen .algorithm-demo__controls label,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__controls label{width:auto;margin-left:auto}

.algorithm-demo:fullscreen .tree-demo__parameters,.algorithm-demo.is-fullscreen-fallback .tree-demo__parameters{grid-template-columns:repeat(3,minmax(0,1fr))}.algorithm-demo:fullscreen .tree-demo__editbar,.algorithm-demo.is-fullscreen-fallback .tree-demo__editbar{flex:0 0 auto;margin:0}.algorithm-demo:fullscreen .tree-demo__workspace,.algorithm-demo.is-fullscreen-fallback .tree-demo__workspace{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr)}.algorithm-demo:fullscreen .tree-demo__hint,.algorithm-demo.is-fullscreen-fallback .tree-demo__hint{flex:0 0 auto;margin:.2rem 0;font-size:.52rem}.algorithm-demo:fullscreen .tree-demo__metrics,.algorithm-demo.is-fullscreen-fallback .tree-demo__metrics{flex:0 0 auto;gap:.25rem}.algorithm-demo:fullscreen .tree-demo__metrics>div,.algorithm-demo.is-fullscreen-fallback .tree-demo__metrics>div{padding:.28rem}.algorithm-demo:fullscreen .tree-demo__right,.algorithm-demo.is-fullscreen-fallback .tree-demo__right{display:grid;min-height:0;grid-template-rows:minmax(0,1fr) minmax(0,1fr)}.algorithm-demo:fullscreen .tree-demo__tree,.algorithm-demo.is-fullscreen-fallback .tree-demo__tree{display:flex;min-height:0;flex-direction:column;padding:.45rem}.algorithm-demo:fullscreen .tree-demo__tree svg,.algorithm-demo.is-fullscreen-fallback .tree-demo__tree svg{min-height:0;height:100%;max-height:none}.algorithm-demo:fullscreen .forest-demo__parameters,.algorithm-demo.is-fullscreen-fallback .forest-demo__parameters{grid-template-columns:repeat(4,minmax(0,1fr))}.algorithm-demo:fullscreen .forest-demo__editbar,.algorithm-demo.is-fullscreen-fallback .forest-demo__editbar{flex:0 0 auto;margin:0}.algorithm-demo:fullscreen .forest-demo__workspace,.algorithm-demo.is-fullscreen-fallback .forest-demo__workspace{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr)}.algorithm-demo:fullscreen .forest-demo__hint,.algorithm-demo.is-fullscreen-fallback .forest-demo__hint{flex:0 0 auto;margin:.2rem 0;font-size:.52rem}.algorithm-demo:fullscreen .forest-demo__metrics,.algorithm-demo.is-fullscreen-fallback .forest-demo__metrics{flex:0 0 auto;gap:.22rem}.algorithm-demo:fullscreen .forest-demo__metrics>div,.algorithm-demo.is-fullscreen-fallback .forest-demo__metrics>div{padding:.25rem}.algorithm-demo:fullscreen .forest-demo__right,.algorithm-demo.is-fullscreen-fallback .forest-demo__right{display:flex;min-height:0;gap:.35rem}.algorithm-demo:fullscreen .forest-demo__votes,.algorithm-demo.is-fullscreen-fallback .forest-demo__votes{min-height:0;flex:1 1 auto;padding:.4rem}.algorithm-demo:fullscreen .forest-demo__tree-grid,.algorithm-demo.is-fullscreen-fallback .forest-demo__tree-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:.2rem}.algorithm-demo:fullscreen .forest-demo__tree-card,.algorithm-demo.is-fullscreen-fallback .forest-demo__tree-card{padding:.22rem}.algorithm-demo:fullscreen .forest-demo__importance,.algorithm-demo.is-fullscreen-fallback .forest-demo__importance{flex:0 0 auto;padding:.35rem}.algorithm-demo:fullscreen .forest-demo__right>.algorithm-demo__pseudocode,.algorithm-demo.is-fullscreen-fallback .forest-demo__right>.algorithm-demo__pseudocode{flex:0 0 auto}

/* Keep every forest vote visible in fullscreen, including narrow phone layouts. */
.algorithm-demo:fullscreen .forest-demo__right,.algorithm-demo.is-fullscreen-fallback .forest-demo__right{display:grid;grid-template-rows:minmax(128px,.85fr) auto minmax(0,1.15fr);overflow:hidden}.algorithm-demo:fullscreen .forest-demo__votes,.algorithm-demo.is-fullscreen-fallback .forest-demo__votes{overflow:hidden}.algorithm-demo:fullscreen .forest-demo__votes>div:first-child,.algorithm-demo.is-fullscreen-fallback .forest-demo__votes>div:first-child{margin-bottom:.2rem}.algorithm-demo:fullscreen .forest-demo__tree-card,.algorithm-demo.is-fullscreen-fallback .forest-demo__tree-card{min-height:0;padding:.1rem .16rem;gap:0;line-height:1.05;appearance:none}.algorithm-demo:fullscreen .forest-demo__tree-card span,.algorithm-demo.is-fullscreen-fallback .forest-demo__tree-card span{font-size:.4rem}.algorithm-demo:fullscreen .forest-demo__tree-card strong,.algorithm-demo.is-fullscreen-fallback .forest-demo__tree-card strong{font-size:.5rem}.algorithm-demo:fullscreen .forest-demo__tree-card small,.algorithm-demo.is-fullscreen-fallback .forest-demo__tree-card small{font-size:.38rem}

@media (max-height:700px){.algorithm-demo:fullscreen,.algorithm-demo.is-fullscreen-fallback{gap:.3rem;padding:.45rem .65rem}.algorithm-demo:fullscreen .algorithm-demo__goal,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__goal{font-size:.58rem}.algorithm-demo:fullscreen .algorithm-demo__parameters label,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__parameters label{padding:.22rem .4rem}.algorithm-demo:fullscreen .algorithm-demo__parameters label>span,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__parameters label>span{font-size:.56rem}.algorithm-demo:fullscreen .classifier-demo__editbar button,.algorithm-demo.is-fullscreen-fallback .classifier-demo__editbar button,.algorithm-demo:fullscreen .tree-demo__editbar button,.algorithm-demo.is-fullscreen-fallback .tree-demo__editbar button{padding:.3rem .45rem}.algorithm-demo:fullscreen .algorithm-demo__message,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__message{padding:.28rem .5rem}.algorithm-demo:fullscreen .algorithm-demo__controls button,.algorithm-demo.is-fullscreen-fallback .algorithm-demo__controls button{padding:.32rem .5rem}}

/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}