.preliminary-results { margin-block: 12px 65px; }
.results-intro { display: flex; align-items: baseline; justify-content: space-between; gap: 32px; margin-block: 22px 28px; }
.results-intro > p:first-child { font-size: 27px; line-height: 1.3; margin: 0; max-width: 360px; letter-spacing: -.025em; }
.results-intro > p:last-child { max-width: 470px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.results-board { columns: 3; column-gap: 22px; }
.result-card { display: inline-block; vertical-align: top; width: 100%; margin: 0 0 22px; break-inside: avoid; border: 1px solid var(--line); border-radius: 15px; overflow: hidden; background: var(--paper); box-shadow: 0 3px 10px #00000005; }
.result-body { padding: 24px; }
.result-bottom { padding-top: 17px; }
.result-card h3 { font-size: 27px; letter-spacing: -.035em; line-height: 1.13; margin: 16px 0; text-wrap: pretty; }
.result-card p { font-size: 16px; line-height: 1.65; margin-block: 14px; }
.result-card .result-kicker { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; margin: 0; font: 9px/1.6 ui-monospace, monospace; text-transform: uppercase; letter-spacing: .035em; color: var(--muted); }
.result-tag { padding: 3px 7px; border: 1px solid var(--line); border-radius: 20px; font-size: 8px; }
.result-card .result-number { color: var(--accent); font-size: 76px; line-height: 1; letter-spacing: -.07em; margin-block: 26px 22px; font-variant-numeric: tabular-nums; }
.result-number > span { display: block; font: 11px/1.6 ui-monospace, monospace; letter-spacing: 0; color: var(--muted); margin-top: 8px; }
.result-number > .result-percent { display: inline; color: inherit; font: inherit; font-size: 35px; }
.result-image { display: block; background: #fff; text-decoration: none; }
.result-image img { display: block; width: 100%; height: auto; }
.result-image > span { display: block; font: 9px/1.6 ui-monospace, monospace; padding: 10px 16px; color: #626c65; background: #f1f2ec; }
.result-image:hover > span { color: #b74727; text-decoration: underline; }
.result-image:focus-visible { outline-offset: -4px; }
.result-image-hero img { padding: 28px 12px 18px; }
.result-pair { display: grid; grid-template-columns: 1fr 1fr; border-block: 1px solid var(--line); padding-block: 15px; gap: 12px; margin-block: 22px; }
.result-pair strong { display: block; font-size: 26px; font-weight: normal; line-height: 1.2; font-variant-numeric: tabular-nums; }
.result-pair span { display: block; font: 10px/1.6 ui-monospace, monospace; color: var(--muted); margin-top: 6px; }
.result-card details { border-top: 1px solid var(--line); padding-top: 14px; margin-top: 22px; }
.result-card summary { font: 11px/1.6 ui-monospace, monospace; cursor: pointer; }
.result-card details p, .result-card .result-small { font-size: 12px; line-height: 1.65; color: var(--muted); }
.result-card .text-link { display: inline-block; margin-top: 20px; font-size: 10px; }
.result-controls { margin-top: 22px; }
.result-controls[hidden], .result-toggle[hidden] { display: none; }
.result-controls label { display: flex; justify-content: space-between; gap: 10px; font: 11px/1.6 ui-monospace, monospace; }
.result-controls input { width: 100%; min-height: 30px; accent-color: var(--accent); margin: 8px 0 0; }
.result-card :is(input, button, summary):focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
.result-rule { font: 46px/1.3 ui-monospace, monospace; letter-spacing: -.07em; margin-block: 25px 10px; color: var(--accent); overflow-wrap: anywhere; }
.result-rule span { color: var(--muted); }
.result-card .result-formula { font: 15px/1.6 ui-monospace, monospace; }
.result-card .result-model { font-size: 13px; color: var(--accent); }
.result-entry { background: var(--panel); }
.result-entry .result-rule { min-height: 60px; }
.result-diagram { display: block; width: 100%; margin-block: 24px; color: var(--muted); }
.result-diagram text { fill: currentColor; font: 13px ui-monospace, monospace; }
.result-diagram rect { fill: var(--ink); }
.result-diagram .result-diagram-area { fill: var(--paper); }
.result-toggle { background: var(--panel); border: 1px solid var(--line); border-radius: 20px; padding: 9px 12px; font: 10px/1.5 ui-monospace, monospace; color: var(--ink); cursor: pointer; margin-block: 8px; }
.result-bar-row { display: grid; grid-template-columns: 80px 1fr 40px; align-items: center; gap: 8px; margin-block: 15px; font: 10px/1.4 ui-monospace, monospace; }
.result-bar-row > div { height: 9px; background: var(--panel); border-radius: 8px; overflow: hidden; }
.result-bar-row i { display: block; height: 100%; background: var(--muted); border-radius: 8px; }
.result-bar-row i[data-occupation=ant] { background: var(--accent); }
.result-bar-row output { text-align: right; font-variant-numeric: tabular-nums; }
.results-source { display: flex; justify-content: space-between; gap: 25px; color: var(--muted); font: 11px/1.7 ui-monospace, monospace; margin-top: 10px; }
@media (max-width: 1000px) { .results-board { columns: 2; } }
@media (max-width: 640px) { .results-board { columns: 1; } .results-intro, .results-source { display: block; } .results-intro > p:last-child { margin-top: 14px; } .results-source span { display: block; margin-top: 12px; } .result-body { padding: 24px; } .result-card h3 { font-size: 29px; } }
@media print { .results-board { columns: 2; } .result-controls, .result-toggle { display: none; } .result-card { box-shadow: none; } .result-card details > * { display: block; } }