.experiment-article {
    --article-blue: #39c9ef;
    --article-amber: #ffba4d;
    --article-violet: #b377ef;
}

.article-hero {
    max-width: 1060px;
    padding-top: clamp(84px, 11vw, 150px);
    padding-bottom: 56px;
}

.article-back {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 72px;
    color: var(--muted);
    font-family: var(--mono);
    font-size: 0.72rem;
    letter-spacing: 0.04em;
    text-decoration: none;
}

.article-back:hover { color: var(--mint); }

.article-kicker {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 24px;
    color: #aabed8;
    font-family: var(--mono);
    font-size: 0.72rem;
    letter-spacing: 0.13em;
}

.article-kicker span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--article-blue);
    box-shadow: 0 0 18px rgba(57, 201, 239, 0.7);
}

.article-hero h1 {
    max-width: 1080px;
    margin: 0;
    font-size: clamp(3.8rem, 8.2vw, 7.2rem);
    line-height: 0.91;
    letter-spacing: -0.068em;
}

.article-deck {
    max-width: 820px;
    margin: 42px 0 0;
    color: #c3cfca;
    font-size: clamp(1.18rem, 2.3vw, 1.65rem);
    line-height: 1.55;
}

.latest-finding-teaser {
    max-width: 980px;
    margin-top: 30px;
    padding: 18px 20px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    border: 1px solid rgba(179, 119, 239, 0.3);
    border-radius: 17px;
    color: var(--paper);
    background:
        radial-gradient(circle at 92% 10%, rgba(179, 119, 239, 0.16), transparent 14rem),
        rgba(179, 119, 239, 0.045);
    text-decoration: none;
}

.latest-finding-teaser > span {
    color: var(--article-violet);
    font-family: var(--mono);
    font-size: 0.6rem;
    letter-spacing: 0.09em;
    white-space: nowrap;
}

.latest-finding-teaser > strong {
    font-size: 0.92rem;
    font-weight: 500;
    line-height: 1.5;
}

.latest-finding-teaser > i {
    color: var(--article-violet);
    font-style: normal;
    font-size: 1.1rem;
}

.latest-finding-teaser:hover {
    border-color: rgba(179, 119, 239, 0.58);
    background-color: rgba(179, 119, 239, 0.075);
}

.article-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 42px;
}

.article-meta span {
    padding: 10px 14px;
    border: 1px solid var(--line);
    border-radius: 999px;
    color: var(--muted);
    font-family: var(--mono);
    font-size: 0.68rem;
}

.article-meta strong { color: var(--paper); }

.article-repository-hero {
    max-width: 860px;
    margin: 32px 0 0;
    padding: 20px 22px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    border: 1px solid rgba(57, 201, 239, 0.3);
    border-radius: 18px;
    color: var(--paper);
    background:
        radial-gradient(circle at 90% 15%, rgba(179, 119, 239, 0.17), transparent 15rem),
        linear-gradient(115deg, rgba(57, 201, 239, 0.12), rgba(14, 22, 29, 0.86));
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.2), inset 0 1px rgba(255, 255, 255, 0.025);
    text-decoration: none;
    transition: border-color 180ms ease, background 180ms ease, transform 180ms ease;
}

.article-repository-mark,
.article-repository-arrow {
    display: grid;
    place-items: center;
    border-radius: 50%;
    font-family: var(--mono);
}

.article-repository-mark {
    width: 48px;
    height: 48px;
    border: 1px solid rgba(57, 201, 239, 0.34);
    color: var(--article-blue);
    background: rgba(57, 201, 239, 0.08);
    font-size: 0.72rem;
    font-weight: 500;
}

.article-repository-copy { display: grid; gap: 4px; }
.article-repository-copy small {
    color: var(--article-blue);
    font-family: var(--mono);
    font-size: 0.58rem;
    letter-spacing: 0.12em;
}
.article-repository-copy strong {
    font-size: clamp(1rem, 1.8vw, 1.2rem);
    line-height: 1.35;
}
.article-repository-copy > span {
    color: #9caca7;
    font-size: 0.76rem;
    line-height: 1.55;
}

.article-repository-arrow {
    width: 42px;
    height: 42px;
    color: #07131a;
    background: var(--article-blue);
    font-size: 1rem;
    transition: transform 180ms ease;
}

.article-repository-hero:hover {
    border-color: rgba(57, 201, 239, 0.62);
    background:
        radial-gradient(circle at 90% 15%, rgba(179, 119, 239, 0.22), transparent 15rem),
        linear-gradient(115deg, rgba(57, 201, 239, 0.17), rgba(14, 22, 29, 0.88));
    transform: translateY(-2px);
}
.article-repository-hero:hover .article-repository-arrow { transform: translate(2px, -2px); }

.problem-statement {
    max-width: 1320px;
    padding-block: 72px 94px;
}

.problem-intro {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
    align-items: end;
    gap: clamp(42px, 8vw, 110px);
}

.problem-intro h2 {
    max-width: 820px;
    margin: 0;
    font-size: clamp(2.6rem, 6vw, 5.6rem);
    line-height: 0.96;
    letter-spacing: -0.065em;
}

.problem-intro > div:last-child p {
    margin: 0;
    color: #aebcb7;
    font-size: 1rem;
    line-height: 1.75;
}

.problem-intro > div:last-child p + p { margin-top: 18px; }

.sequence-problem {
    margin-top: 44px;
    padding: clamp(20px, 3.5vw, 30px);
    display: grid;
    grid-template-columns: minmax(300px, 0.8fr) minmax(0, 1.2fr);
    align-items: center;
    gap: clamp(28px, 5vw, 66px);
    border: 1px solid rgba(57, 201, 239, 0.22);
    border-radius: 20px;
    background:
        radial-gradient(circle at 5% 50%, rgba(57, 201, 239, 0.09), transparent 18rem),
        rgba(14, 22, 29, 0.54);
}

.sequence-example {
    display: flex;
    align-items: center;
    gap: clamp(7px, 1.1vw, 13px);
    font-family: var(--mono);
}

.sequence-example span,
.sequence-example strong {
    width: clamp(31px, 4vw, 42px);
    height: clamp(31px, 4vw, 42px);
    display: grid;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 50%;
    font-size: 0.68rem;
}

.sequence-example strong {
    border-color: rgba(179, 119, 239, 0.42);
    color: #d7b8f4;
    background: rgba(179, 119, 239, 0.07);
}

.sequence-example i { color: var(--article-blue); font-style: normal; }

.sequence-problem p {
    margin: 0;
    color: var(--muted);
    font-size: 0.88rem;
    line-height: 1.72;
}

.sequence-problem p strong { color: var(--paper); font-weight: 500; }

.problem-grid {
    margin-top: 50px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.problem-grid article {
    min-height: 250px;
    padding: 22px;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--line);
    border-radius: 19px;
    background:
        radial-gradient(circle at 85% 8%, rgba(57, 201, 239, 0.065), transparent 10rem),
        rgba(14, 22, 29, 0.52);
}

.problem-grid span,
.problem-question span {
    color: var(--article-blue);
    font-family: var(--mono);
    font-size: 0.58rem;
    letter-spacing: 0.09em;
}

.problem-grid h3 {
    margin: auto 0 14px;
    font-size: 1.14rem;
    line-height: 1.28;
    letter-spacing: -0.035em;
}

.problem-grid p {
    margin: 0;
    color: var(--muted);
    font-size: 0.78rem;
    line-height: 1.65;
}

.problem-question {
    margin: 22px 0 0;
    padding: 20px 22px;
    display: flex;
    align-items: center;
    gap: 22px;
    border-left: 2px solid var(--article-violet);
    color: var(--paper);
    background: linear-gradient(90deg, rgba(179, 119, 239, 0.075), transparent 72%);
    font-size: clamp(1rem, 2vw, 1.28rem);
    line-height: 1.5;
}

.problem-question span { color: var(--article-violet); white-space: nowrap; }

.result-figure {
    overflow: hidden;
    margin-top: 26px;
    margin-bottom: 30px;
    border: 1px solid rgba(114, 217, 231, 0.2);
    border-radius: 28px;
    background: #071526;
    box-shadow: 0 40px 100px rgba(0, 0, 0, 0.32), 0 0 70px rgba(57, 201, 239, 0.04);
}

.result-figure img {
    width: 100%;
    height: auto;
    display: block;
}

.result-figure figcaption {
    padding: 14px 20px;
    border-top: 1px solid rgba(114, 217, 231, 0.12);
    color: #8ea3bb;
    font-family: var(--mono);
    font-size: 0.67rem;
    line-height: 1.5;
}

.article-story {
    max-width: 1040px;
    padding-block: 44px 72px;
}

.article-section {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 34px;
    padding: 88px 0;
    border-bottom: 1px solid var(--line);
}

.article-section-label {
    padding-top: 4px;
    color: var(--dim);
    font-family: var(--mono);
    font-size: 0.72rem;
}

.article-copy { max-width: 740px; }
.article-copy-wide { max-width: none; }

.article-copy h2,
.article-repository h2 {
    max-width: 820px;
    margin: 0 0 30px;
    font-size: clamp(2.3rem, 5.5vw, 4.6rem);
    line-height: 0.98;
    letter-spacing: -0.055em;
}

.article-copy > p:not(.section-index),
.article-repository p:not(.section-index) {
    margin: 0 0 22px;
    color: #aebcb7;
    font-size: 1.04rem;
    line-height: 1.85;
}

.article-copy > p.article-lead {
    color: #d8e1dd;
    font-size: clamp(1.2rem, 2.2vw, 1.48rem);
    line-height: 1.65;
}

.method-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 42px;
}

.method-card {
    min-height: 310px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: rgba(14, 22, 29, 0.76);
}

.method-direct { --method-color: var(--article-amber); }
.method-vote { --method-color: var(--article-blue); }
.method-swarm { --method-color: var(--article-violet); }

.method-number {
    color: var(--method-color);
    font-family: var(--mono);
    font-size: 0.78rem;
}

.method-card h3 {
    margin: auto 0 15px;
    font-size: 1.45rem;
    letter-spacing: -0.035em;
}

.method-card p {
    margin: 0;
    color: var(--muted);
    font-size: 0.88rem;
    line-height: 1.65;
}

.swarm-flow {
    margin-top: 12px;
    padding: 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border: 1px solid rgba(179, 119, 239, 0.25);
    border-radius: 18px;
    background: rgba(179, 119, 239, 0.045);
}

.swarm-flow span {
    color: var(--muted);
    font-family: var(--mono);
    font-size: 0.68rem;
    text-align: center;
}

.swarm-flow strong { color: var(--paper); font-size: 0.92rem; }
.swarm-flow i { color: var(--article-violet); font-style: normal; }

.result-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: rgba(14, 22, 29, 0.74);
}

.result-table {
    width: 100%;
    border-collapse: collapse;
    font-variant-numeric: tabular-nums;
}

.result-table caption {
    padding: 17px 20px;
    color: var(--muted);
    font-family: var(--mono);
    font-size: 0.65rem;
    text-align: left;
}

.result-table th,
.result-table td {
    padding: 22px 20px;
    border-top: 1px solid var(--line);
    text-align: left;
}

.result-table thead th {
    color: var(--dim);
    font-family: var(--mono);
    font-size: 0.68rem;
    font-weight: 500;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.result-table tbody th { color: var(--muted); font-weight: 500; }
.result-table tbody td { font-size: clamp(1.3rem, 2.7vw, 2rem); font-weight: 700; }
.result-table .result-strong { color: var(--article-violet); }
.result-table .result-best { color: var(--article-blue); background: rgba(57, 201, 239, 0.055); }

.finding-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 12px;
}

.finding-grid article {
    min-height: 248px;
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: 20px;
}

.finding-grid span {
    color: var(--cyan);
    font-family: var(--mono);
    font-size: 0.6rem;
    letter-spacing: 0.08em;
}

.finding-grid h3 {
    margin: 54px 0 14px;
    font-size: 1.12rem;
    line-height: 1.25;
}

.finding-grid p {
    margin: 0;
    color: var(--muted);
    font-size: 0.82rem;
    line-height: 1.6;
}

.article-copy blockquote {
    margin: 46px 0;
    padding: 30px 0 30px 28px;
    border-left: 2px solid var(--article-blue);
}

.article-copy blockquote p {
    margin: 0;
    color: var(--paper);
    font-size: clamp(1.45rem, 3.3vw, 2.25rem);
    line-height: 1.35;
    letter-spacing: -0.035em;
}

.limits-list {
    margin: 34px 0;
    padding: 0;
    display: grid;
    list-style: none;
}

.limits-list li {
    padding: 18px 0 18px 28px;
    border-top: 1px solid var(--line);
    color: #aebcb7;
    line-height: 1.7;
}

.limits-list li::before {
    content: "—";
    width: 28px;
    margin-left: -28px;
    display: inline-block;
    color: var(--article-amber);
}

.article-repository {
    margin-bottom: 18px;
    padding: clamp(30px, 5vw, 58px);
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 48px;
    border: 1px solid rgba(57, 201, 239, 0.2);
    border-radius: 28px;
    background:
        radial-gradient(circle at 90% 20%, rgba(179, 119, 239, 0.12), transparent 22rem),
        linear-gradient(125deg, rgba(57, 201, 239, 0.07), rgba(14, 22, 29, 0.78));
}

.article-repository h2 { font-size: clamp(2.2rem, 4.8vw, 4rem); }
.article-repository p:not(.section-index) { max-width: 690px; margin-bottom: 0; }
.article-repository .button { white-space: nowrap; }

.article-next {
    padding: 28px 2px 100px;
    display: flex;
    justify-content: space-between;
    gap: 30px;
    color: var(--muted);
    font-size: 0.88rem;
}

.article-next p { margin: 0; }
.article-next .text-link { color: var(--paper); white-space: nowrap; }

/* Research-program map and page-native data visuals */
.program-map {
    max-width: 1320px;
    padding-block: 58px 92px;
}

.program-map-heading {
    max-width: 800px;
    margin-bottom: 34px;
}

.program-map-heading h2 {
    margin: 0 0 18px;
    font-size: clamp(2.4rem, 5vw, 4.8rem);
    line-height: 0.98;
    letter-spacing: -0.06em;
}

.program-map-heading > p:last-child {
    max-width: 680px;
    margin: 0;
    color: var(--muted);
    font-size: 1rem;
    line-height: 1.7;
}

.program-arc {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
}

.program-step {
    min-height: 286px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(57, 201, 239, 0.16);
    border-radius: 20px;
    background:
        radial-gradient(circle at 80% 5%, rgba(57, 201, 239, 0.07), transparent 10rem),
        rgba(14, 22, 29, 0.7);
}

.program-step-prologue { border-color: rgba(255, 186, 77, 0.22); }
.program-step-next {
    border-style: dashed;
    border-color: rgba(179, 119, 239, 0.34);
    background: rgba(179, 119, 239, 0.035);
}
.program-step-breakthrough {
    border-color: rgba(179, 119, 239, 0.48);
    background:
        radial-gradient(circle at 80% 5%, rgba(179, 119, 239, 0.15), transparent 10rem),
        rgba(179, 119, 239, 0.055);
}
.program-step-breakthrough .program-number {
    border-color: rgba(179, 119, 239, 0.48);
    color: #d7b8f4;
}

.program-number {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(57, 201, 239, 0.22);
    border-radius: 50%;
    color: var(--article-blue);
    font-family: var(--mono);
    font-size: 0.68rem;
}

.program-step small {
    margin-top: 22px;
    color: var(--dim);
    font-family: var(--mono);
    font-size: 0.54rem;
    letter-spacing: 0.1em;
}

.program-step h3 {
    margin: 10px 0 12px;
    font-size: 1.08rem;
    line-height: 1.25;
    letter-spacing: -0.03em;
}

.program-step p {
    margin: 0;
    color: var(--muted);
    font-size: 0.75rem;
    line-height: 1.62;
}

.program-step > strong {
    margin-top: auto;
    padding-top: 22px;
    color: var(--paper);
    font-family: var(--mono);
    font-size: 0.66rem;
    font-weight: 500;
}

.visual-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
}

.visual-header > div { display: grid; gap: 6px; }
.visual-header small,
.override-copy small {
    color: var(--article-blue);
    font-family: var(--mono);
    font-size: 0.58rem;
    letter-spacing: 0.1em;
}
.visual-header strong,
.override-copy strong { font-size: 1.1rem; }
.visual-header > span {
    color: var(--dim);
    font-family: var(--mono);
    font-size: 0.62rem;
}

.prompt-failure-visual,
.split-chart,
.ruleweave-visual,
.rank-chart,
.override-visual,
.decider-mechanism,
.adaptive-loop {
    margin: 42px 0 30px;
    border: 1px solid var(--line);
    border-radius: 24px;
    background:
        radial-gradient(circle at 90% 5%, rgba(57, 201, 239, 0.055), transparent 18rem),
        rgba(14, 22, 29, 0.66);
}

.prompt-failure-visual { padding: clamp(22px, 4vw, 36px); }
.vertical-bars {
    height: 290px;
    margin-top: 32px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 180px));
    justify-content: center;
    align-items: end;
    gap: clamp(36px, 8vw, 90px);
    border-bottom: 1px solid var(--line);
}

.vertical-bar-item {
    height: 100%;
    display: grid;
    grid-template-rows: auto 1fr auto;
    align-items: end;
    gap: 10px;
    text-align: center;
}
.bar-value { font-size: 1.55rem; font-weight: 700; }
.vertical-bar-track {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: flex-end;
}
.vertical-bar-track i {
    width: 100%;
    height: var(--bar-height);
    min-height: 4px;
    display: block;
    border-radius: 14px 14px 0 0;
}
.bar-baseline { background: linear-gradient(180deg, #39c9ef, rgba(57, 201, 239, 0.55)); }
.bar-evolved { background: linear-gradient(180deg, #b377ef, rgba(179, 119, 239, 0.5)); }
.vertical-bar-item > strong { min-height: 42px; font-size: 0.78rem; }
.visual-footnote {
    margin: 18px 0 0;
    color: var(--dim);
    font-family: var(--mono);
    font-size: 0.61rem;
    line-height: 1.55;
}

.split-chart {
    padding: 12px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.chart-panel {
    padding: 22px;
    border: 1px solid rgba(255, 255, 255, 0.045);
    border-radius: 18px;
    background: rgba(5, 10, 14, 0.22);
}
.chart-panel-highlight { border-color: rgba(57, 201, 239, 0.23); }
.chart-panel-title {
    margin-bottom: 24px;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}
.chart-panel-title strong { font-size: 1rem; }
.chart-panel-title span {
    color: var(--dim);
    font-family: var(--mono);
    font-size: 0.58rem;
}

.bar-row,
.rank-row {
    display: grid;
    grid-template-columns: 88px minmax(0, 1fr) 58px;
    align-items: center;
    gap: 12px;
}
.bar-row + .bar-row { margin-top: 15px; }
.bar-row > span,
.rank-row > span { color: var(--muted); font-family: var(--mono); font-size: 0.62rem; }
.bar-row > strong,
.rank-row > strong { font-size: 0.72rem; font-variant-numeric: tabular-nums; text-align: right; }
.meter {
    height: 9px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.06);
}
.meter i {
    width: var(--bar-width);
    height: 100%;
    display: block;
    border-radius: inherit;
}
.fill-direct { background: var(--article-amber); }
.fill-vote { background: var(--article-blue); }
.fill-swarm { background: var(--article-violet); }
.fill-tournament { background: linear-gradient(90deg, var(--article-blue), #9aeed3); }

.split-chart-dense .chart-panel { padding: 20px; }
.split-chart-dense .bar-row { grid-template-columns: 94px minmax(0, 1fr) 52px; gap: 9px; }
.split-chart-dense .bar-row + .bar-row { margin-top: 12px; }

.efficiency-callout {
    margin: -16px 12px 32px;
    padding: 22px 24px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 26px;
    border: 1px solid rgba(57, 201, 239, 0.2);
    border-radius: 18px;
    background: linear-gradient(110deg, rgba(57, 201, 239, 0.09), rgba(179, 119, 239, 0.05));
}
.efficiency-callout > div { display: grid; gap: 2px; }
.efficiency-callout small { color: var(--article-blue); font-family: var(--mono); font-size: 0.56rem; }
.efficiency-callout > div strong { font-size: 2.1rem; letter-spacing: -0.05em; }
.efficiency-callout p { margin: 0; color: var(--muted); font-size: 0.84rem; line-height: 1.65; }
.efficiency-callout p strong { color: var(--paper); }

.experiment-source-link {
    margin-top: 28px;
    padding: 15px 17px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    border: 1px solid rgba(57, 201, 239, 0.18);
    border-radius: 14px;
    color: var(--article-blue);
    background: rgba(57, 201, 239, 0.035);
    font-family: var(--mono);
    font-size: 0.68rem;
    line-height: 1.5;
    text-decoration: none;
}
.experiment-source-link:hover { border-color: rgba(57, 201, 239, 0.45); color: var(--paper); }

.ruleweave-visual { padding: clamp(22px, 4vw, 34px); }
.ruleweave-path {
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1fr;
    align-items: center;
    gap: 16px;
}
.ruleweave-path > span {
    min-height: 96px;
    padding: 18px;
    display: grid;
    align-content: center;
    gap: 7px;
    border: 1px solid var(--line);
    border-radius: 17px;
    background: rgba(5, 10, 14, 0.25);
}
.ruleweave-path small,
.evolution-pipeline small,
.decider-mechanism small,
.adaptive-loop small {
    color: var(--dim);
    font-family: var(--mono);
    font-size: 0.55rem;
    letter-spacing: 0.09em;
}
.ruleweave-path strong { font-size: 1rem; }
.ruleweave-path > i,
.evolution-pipeline > i,
.adaptive-loop > i { color: var(--article-blue); font-style: normal; }

.rule-family-grid {
    margin-top: 18px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 7px;
}
.rule-family-grid span,
.decision-systems span {
    padding: 10px 12px;
    border: 1px solid rgba(179, 119, 239, 0.16);
    border-radius: 10px;
    color: #b8c4bf;
    background: rgba(179, 119, 239, 0.035);
    font-family: var(--mono);
    font-size: 0.58rem;
    text-align: center;
}
.benchmark-strip {
    margin-top: 18px;
    padding-top: 18px;
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 9px;
    border-top: 1px solid var(--line);
    color: var(--muted);
    font-family: var(--mono);
    font-size: 0.6rem;
}
.benchmark-strip strong { color: var(--paper); font-size: 1rem; }
.benchmark-strip i { width: 3px; height: 3px; border-radius: 50%; background: var(--dim); }

.evolution-pipeline {
    margin: 42px 0 26px;
    display: grid;
    grid-template-columns: repeat(7, auto);
    align-items: center;
    gap: 10px;
}
.evolution-pipeline > div,
.adaptive-loop > div {
    min-height: 118px;
    padding: 18px;
    display: grid;
    align-content: center;
    gap: 6px;
    border: 1px solid var(--line);
    border-radius: 17px;
    background: rgba(14, 22, 29, 0.65);
}
.evolution-pipeline strong,
.adaptive-loop strong { font-size: 0.92rem; }
.evolution-pipeline span,
.adaptive-loop span { color: var(--muted); font-size: 0.66rem; }

.rank-chart { padding: 24px; }
.rank-row {
    grid-template-columns: 180px minmax(0, 1fr) 58px;
    min-height: 42px;
}
.rank-row + .rank-row { border-top: 1px solid rgba(255, 255, 255, 0.04); }
.rank-row b { margin-right: 9px; color: var(--dim); font-weight: 500; }
.rank-row-best > span,
.rank-row-best > strong { color: var(--paper); }

.override-visual {
    padding: 24px;
    display: grid;
    grid-template-columns: minmax(180px, 0.75fr) minmax(0, 1.4fr);
    align-items: center;
    gap: 28px;
}
.override-copy { display: grid; gap: 7px; }
.override-strip {
    min-height: 48px;
    display: flex;
    overflow: hidden;
    border-radius: 12px;
}
.override-strip span {
    flex: var(--segment);
    display: grid;
    place-items: center;
    font-family: var(--mono);
    font-size: 0.6rem;
}
.override-help { color: #bdf4d6; background: rgba(65, 201, 137, 0.22); }
.override-harm { color: #ffd1bb; background: rgba(255, 126, 82, 0.2); }
.override-neutral { color: #c4cfcb; background: rgba(255, 255, 255, 0.075); }

.decision-systems {
    margin-top: 36px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}
.decision-systems .decision-selected {
    border-color: rgba(57, 201, 239, 0.4);
    color: var(--paper);
    background: rgba(57, 201, 239, 0.09);
}
.evolution-pipeline-large { margin-top: 16px; }

.decider-mechanism {
    padding: clamp(22px, 4vw, 32px);
    display: grid;
    grid-template-columns: 1fr auto 1.2fr auto 1fr;
    align-items: center;
    gap: 14px;
}
.decider-mechanism > div {
    min-height: 94px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 6px;
    border: 1px solid var(--line);
    border-radius: 16px;
    text-align: center;
}
.decider-mechanism .gate-node { border-color: rgba(57, 201, 239, 0.34); background: rgba(57, 201, 239, 0.06); }
.decider-mechanism > i { color: var(--article-blue); font-style: normal; }
.decider-mechanism > p {
    grid-column: 1 / -1;
    margin: 4px 0 0;
    display: flex;
    justify-content: center;
    gap: 8px;
}
.decider-mechanism > p span {
    padding: 6px 9px;
    border: 1px solid var(--line);
    border-radius: 999px;
    color: var(--muted);
    font-family: var(--mono);
    font-size: 0.58rem;
}

.visible-holdout-flow,
.fresh-gate-progress,
.experiment-five-ledger {
    margin: 42px 0 30px;
}

.visible-holdout-flow {
    padding: 12px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: stretch;
    gap: 8px;
    border: 1px solid var(--line);
    border-radius: 24px;
    background:
        radial-gradient(circle at 88% 5%, rgba(179, 119, 239, 0.09), transparent 18rem),
        rgba(14, 22, 29, 0.66);
}

.visible-holdout-flow > div {
    min-height: 132px;
    padding: 15px;
    display: grid;
    align-content: center;
    gap: 7px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: rgba(5, 10, 14, 0.24);
}

.visible-holdout-flow > i {
    align-self: center;
    color: var(--article-blue);
    font-style: normal;
}

.visible-holdout-flow small,
.experiment-five-ledger small {
    color: var(--dim);
    font-family: var(--mono);
    font-size: 0.52rem;
    letter-spacing: 0.08em;
}

.visible-holdout-flow strong { font-size: 0.86rem; line-height: 1.3; }
.visible-holdout-flow span { color: var(--muted); font-size: 0.62rem; line-height: 1.45; }
.visible-holdout-flow .holdout-node { border-color: rgba(179, 119, 239, 0.34); }
.visible-holdout-flow .verification-node {
    border-color: rgba(57, 201, 239, 0.42);
    background: rgba(57, 201, 239, 0.065);
}

.fresh-gate-progress {
    padding: clamp(22px, 4vw, 34px);
    border: 1px solid var(--line);
    border-radius: 24px;
    background:
        radial-gradient(circle at 90% 5%, rgba(57, 201, 239, 0.07), transparent 18rem),
        rgba(14, 22, 29, 0.66);
}

.gate-progress-grid {
    margin-top: 30px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
}

.gate-progress-grid article {
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: rgba(5, 10, 14, 0.22);
}

.gate-progress-grid article > header {
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    font-family: var(--mono);
}

.gate-progress-grid header span { color: var(--article-blue); font-size: 0.6rem; letter-spacing: 0.09em; }
.gate-progress-grid header b { color: var(--dim); font-size: 0.55rem; font-weight: 500; }
.gate-progress-grid .gate-progress-winner {
    border-color: rgba(179, 119, 239, 0.44);
    background: rgba(179, 119, 239, 0.055);
}
.gate-progress-winner header span,
.gate-progress-winner header b { color: #d7b8f4; }

.gate-bar {
    min-height: 32px;
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) 44px;
    align-items: center;
    gap: 7px;
    color: var(--muted);
    font-family: var(--mono);
    font-size: 0.54rem;
}
.gate-bar + .gate-bar { margin-top: 5px; }
.gate-bar .meter { height: 7px; }
.gate-bar strong { color: var(--paper); font-size: 0.58rem; text-align: right; }

.experiment-five-ledger {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.experiment-five-ledger > div {
    min-height: 142px;
    padding: 18px;
    display: flex;
    flex-direction: column;
    border-top: 2px solid rgba(179, 119, 239, 0.5);
    background: linear-gradient(180deg, rgba(179, 119, 239, 0.07), transparent);
}

.experiment-five-ledger strong {
    margin: auto 0 5px;
    font-size: 1.55rem;
    letter-spacing: -0.04em;
}
.experiment-five-ledger span { color: var(--muted); font-size: 0.68rem; }

.evidence-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 36px;
}
.evidence-grid article {
    min-height: 260px;
    padding: 22px;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--line);
    border-radius: 19px;
    background: rgba(14, 22, 29, 0.55);
}
.evidence-grid span {
    font-family: var(--mono);
    font-size: 0.56rem;
    letter-spacing: 0.08em;
}
.evidence-strong span { color: var(--article-blue); }
.evidence-mixed span { color: var(--article-violet); }
.evidence-open span { color: var(--article-amber); }
.evidence-grid h3 {
    margin: auto 0 13px;
    font-size: 1.08rem;
    line-height: 1.28;
}
.evidence-grid p { margin: 0; color: var(--muted); font-size: 0.78rem; line-height: 1.62; }

.rigor-ladder {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
    margin: 36px 0;
}
.rigor-ladder div {
    min-height: 190px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    border-top: 2px solid rgba(57, 201, 239, 0.45);
    background: linear-gradient(180deg, rgba(57, 201, 239, 0.055), transparent);
}
.rigor-ladder span { color: var(--article-blue); font-family: var(--mono); font-size: 0.64rem; }
.rigor-ladder strong { margin: auto 0 10px; font-size: 0.98rem; }
.rigor-ladder p { margin: 0; color: var(--muted); font-size: 0.72rem; line-height: 1.55; }
.research-principles { margin-top: 30px; }

.adaptive-loop {
    padding: 12px;
    display: grid;
    grid-template-columns: repeat(7, auto);
    align-items: center;
    gap: 10px;
}
.adaptive-loop .adaptive-final {
    border-color: rgba(179, 119, 239, 0.4);
    border-style: dashed;
    background: rgba(179, 119, 239, 0.05);
}

.article-repository-expanded { align-items: start; }
.repository-links {
    margin-top: 28px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}
.repository-links a {
    padding: 12px 14px;
    border: 1px solid rgba(57, 201, 239, 0.14);
    border-radius: 11px;
    color: #aebcb7;
    font-family: var(--mono);
    font-size: 0.62rem;
    text-decoration: none;
}
.repository-links a:hover { border-color: rgba(57, 201, 239, 0.38); color: var(--paper); }
.repository-links span { margin-right: 8px; color: var(--article-blue); }

@media (max-width: 800px) {
    .article-back { margin-bottom: 54px; }
    .article-hero h1 { font-size: clamp(3.5rem, 13vw, 5.7rem); }
    .problem-intro { grid-template-columns: 1fr; align-items: start; }
    .sequence-problem { grid-template-columns: 1fr; }
    .problem-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .article-section { grid-template-columns: 44px minmax(0, 1fr); gap: 18px; }
    .method-grid,
    .finding-grid { grid-template-columns: 1fr; }
    .method-card { min-height: 230px; }
    .finding-grid article { min-height: 210px; }
    .article-repository { grid-template-columns: 1fr; align-items: start; }
    .article-repository .button { justify-self: start; }
    .program-arc { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .split-chart { grid-template-columns: 1fr; }
    .evolution-pipeline,
    .adaptive-loop { grid-template-columns: 1fr auto 1fr; }
    .evolution-pipeline > i:nth-of-type(2),
    .adaptive-loop > i:nth-of-type(2) { display: none; }
    .evolution-pipeline > div:nth-of-type(3),
    .adaptive-loop > div:nth-of-type(3) { grid-column: 1; }
    .decision-systems { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .evidence-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .rigor-ladder { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .visible-holdout-flow { grid-template-columns: 1fr; }
    .visible-holdout-flow > i { transform: rotate(90deg); text-align: center; }
    .gate-progress-grid { grid-template-columns: 1fr; }
    .experiment-five-ledger { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
    .article-hero { padding-top: 58px; }
    .article-hero h1 { font-size: clamp(3rem, 15vw, 4.4rem); }
    .article-deck { margin-top: 30px; font-size: 1.04rem; }
    .latest-finding-teaser {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 10px 14px;
    }
    .latest-finding-teaser > span { grid-column: 1 / -1; white-space: normal; }
    .latest-finding-teaser > strong { font-size: 0.84rem; }
    .article-meta { display: grid; grid-template-columns: 1fr; }
    .article-repository-hero {
        padding: 18px;
        grid-template-columns: auto minmax(0, 1fr);
        gap: 14px;
    }
    .article-repository-mark { width: 42px; height: 42px; }
    .article-repository-arrow { display: none; }
    .article-repository-copy > span { font-size: 0.72rem; }
    .result-figure { width: calc(100% - 18px); border-radius: 18px; }
    .result-figure img { width: 142%; max-width: none; transform: translateX(-15%); }
    .article-section { display: block; padding: 62px 0; }
    .article-section-label { margin-bottom: 28px; }
    .article-copy h2 { font-size: clamp(2.25rem, 12vw, 3.45rem); }
    .article-copy > p:not(.section-index) { font-size: 0.98rem; line-height: 1.75; }
    .swarm-flow { display: grid; grid-template-columns: 1fr; }
    .swarm-flow i { transform: rotate(90deg); text-align: center; }
    .result-table th,
    .result-table td { padding: 17px 13px; }
    .result-table tbody td { font-size: 1.15rem; }
    .article-repository { border-radius: 20px; }
    .article-repository .button { width: 100%; white-space: normal; }
    .article-next { padding-bottom: 112px; align-items: flex-start; flex-direction: column; }
    .program-map { padding-block: 36px 66px; }
    .problem-statement { padding-block: 48px 66px; }
    .problem-grid { grid-template-columns: 1fr; }
    .problem-grid article { min-height: 218px; }
    .sequence-example { flex-wrap: wrap; }
    .problem-question { align-items: flex-start; flex-direction: column; gap: 9px; }
    .problem-question span { white-space: normal; }
    .program-arc { grid-template-columns: 1fr; }
    .program-step { min-height: 236px; }
    .visual-header { display: grid; }
    .vertical-bars { height: 240px; gap: 28px; }
    .chart-panel { padding: 18px 14px; }
    .chart-panel-title { display: grid; }
    .bar-row { grid-template-columns: 72px minmax(0, 1fr) 50px; gap: 8px; }
    .split-chart-dense .bar-row { grid-template-columns: 78px minmax(0, 1fr) 48px; }
    .efficiency-callout { margin-inline: 0; grid-template-columns: 1fr; gap: 12px; }
    .ruleweave-path { grid-template-columns: 1fr; }
    .ruleweave-path > i { transform: rotate(90deg); text-align: center; }
    .rule-family-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .benchmark-strip { flex-wrap: wrap; justify-content: flex-start; }
    .evolution-pipeline,
    .adaptive-loop { grid-template-columns: 1fr; }
    .evolution-pipeline > i,
    .adaptive-loop > i { display: block !important; transform: rotate(90deg); text-align: center; }
    .evolution-pipeline > div:nth-of-type(3),
    .adaptive-loop > div:nth-of-type(3) { grid-column: auto; }
    .rank-chart { padding: 18px 14px; }
    .rank-row { grid-template-columns: minmax(0, 1fr) 52px; padding-block: 12px; }
    .rank-row .meter { grid-column: 1 / -1; grid-row: 2; }
    .override-visual { grid-template-columns: 1fr; }
    .decision-systems { grid-template-columns: 1fr; }
    .decider-mechanism { grid-template-columns: 1fr; }
    .decider-mechanism > i { transform: rotate(90deg); text-align: center; }
    .evidence-grid,
    .rigor-ladder,
    .repository-links { grid-template-columns: 1fr; }
    .evidence-grid article { min-height: 220px; }
    .experiment-five-ledger { grid-template-columns: 1fr; }
    .experiment-five-ledger > div { min-height: 118px; }
    .gate-progress-grid article { padding: 15px; }
}

@media (prefers-reduced-motion: reduce) {
    .experiment-article *,
    .experiment-article *::before,
    .experiment-article *::after { scroll-behavior: auto !important; }
}