/* Local adjustments for the retained layouts and longer v1.6 copy. */
[hidden] { display: none !important; }
.brand-mark { color: var(--accent); }
.chip figcaption { display: grid; gap: var(--space-3); }
.board { display: grid; gap: var(--space-4); }
.folder-tab { text-decoration: none; }
.sheet + .sheet { margin-top: var(--space-6); }
.sheet h3.example-heading { font-family: var(--font-display); font-size: var(--step-3); font-weight: 750; letter-spacing: -0.015em; margin: var(--space-3) 0; }
.sheet h4 { font-size: var(--step-0); margin: var(--space-6) 0 var(--space-3); }
.sheet h4.quote-name { font-size: var(--step-1); margin: 0; }
.sheet .muted { margin-top: var(--space-3); }
.lines div { flex-wrap: wrap; }
.lines dd { overflow-wrap: anywhere; }
.lines dt, .lines dd { min-width: 0; }
.quote { overflow-wrap: anywhere; }
.chip .memmap--hero { margin-block: var(--space-4); }
.catalog-list { overflow-wrap: anywhere; }
.mode a { padding: var(--space-4); text-align: center; text-decoration: none; font-weight: 750; color: var(--muted); }
.mode a + a { border-left: 1px solid var(--line-strong); }
.mode a[aria-current="true"] { color: var(--accent-ink); background: var(--accent); }
.part { text-decoration: none; }
.part[aria-current="true"] { background: var(--surface-2); border-left-color: var(--accent); }
.key { text-decoration: none; }
#result > .card { margin-bottom: var(--space-4); }
.catalog-source { margin-bottom: var(--space-5); color: var(--muted); overflow-wrap: anywhere; }
.popular-models { margin-top: var(--space-4); padding-left: var(--space-5); line-height: 1.8; overflow-wrap: anywhere; }
.document-excerpt { display: grid; gap: var(--space-3); font-size: var(--step--1); line-height: 1.6; }
.document-excerpt mark { color: var(--text); background: var(--via); box-decoration-break: clone; }
.doc .doc-foot { max-width: 100%; border-top: 1px solid var(--line); padding-top: var(--space-4); }
.document-answer { border-left: 3px solid var(--accent); padding-left: var(--space-3); margin-block: var(--space-4); display: grid; gap: var(--space-2); }
.source-reference { font-family: var(--font-data); font-size: .7rem; color: var(--muted); }
.doc figcaption { font-size: .75rem; padding-right: 90px; margin-bottom: var(--space-4); }
.doc .stamp { width: 110px; height: 110px; bottom: -18px; right: -8px; }
.quote .btn { margin-top: var(--space-4); }
.specline span { overflow-wrap: anywhere; }
.board .card-code, .verdict-name { overflow-wrap: anywhere; }
.readouts .readout { min-width: 0; }
.card-foot .actions { flex-wrap: wrap; }
@media (max-width: 640px) { .mode a { font-size: var(--step--1); } .doc figcaption { padding-right: 75px; } }
@media (max-width: 640px) {
    /* Retain table semantics and headers at the stacked breakpoint. */
    .compare thead { display: table-header-group; position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
}

/* Retained appearance, with the four preparation items arranged as two pairs. */
.benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--space-6); }
.facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); }
.facts li { display: grid; align-content: start; gap: var(--space-1); }
.facts b { font-size: var(--step-1); line-height: 1.4; }
.small-note { color: var(--muted); font-size: .75rem; line-height: 1.6; }
.fit--candidate, .fit--offload, .fit--unknown { color: var(--muted); }
.fit--candidate .led, .fit--offload .led, .fit--unknown .led { background: var(--muted); }
.sheet.sheet--config { grid-template-columns: minmax(0, 1fr); }
.configuration-quotes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); align-items: start; }
.example-package { align-self: start; padding-left: var(--space-5); border-left: 2px solid var(--line); display: grid; gap: var(--space-4); }
.example-package h4 { margin-top: 0; }
.configuration-quotes .quote-name { font-family: var(--font-display); }
.configuration-quotes--single { grid-template-columns: minmax(0, 1fr); }
.folder-tabs { overflow-y: hidden; }
.folder-tab svg { flex: none; }
@media (max-width: 640px) { .benefits, .configuration-quotes { grid-template-columns: minmax(0, 1fr); } .facts { gap: var(--space-2); } .facts li { font-size: .75rem; } }

.speed-estimate { display: grid; gap: .3rem; }
.speed-estimate b { font-family: var(--font-data); font-size: .95rem; color: var(--text); }
.speed-estimate small { color: var(--muted); font-size: .65rem; line-height: 1.5; }

.package-option, .board .package-option { position: relative; display: inline-block; max-width: 100%; margin: 0; padding: 0; border: 0; }
.package-option > summary { cursor: pointer; list-style: none; padding: .35rem 0; }
.package-option > summary::-webkit-details-marker { display: none; }
.package-option > summary:hover .addon, .package-option > summary:focus-visible .addon { color: var(--text); }
.package-panel { position: absolute; bottom: 100%; right: 0; width: 22rem; max-width: calc(100vw - 4rem); max-height: calc(50vh - 5rem); overflow: auto; z-index: 30; padding: var(--space-4); background: var(--surface); border: 1px solid var(--accent); box-shadow: 0 8px 28px #0004; color: var(--text); font-size: var(--step--1); text-align: left; line-height: 1.5; }
.package-below .package-panel { bottom: auto; top: 100%; }
.package-left .package-panel { right: auto; left: 0; }
.lines .package-panel { display: block; padding: var(--space-4); border: 1px solid var(--accent); }
.package-panel p { margin: 0 0 var(--space-3); }
.package-title { font-weight: 750; }
.package-models { list-style: none; padding: 0; margin: var(--space-3) 0; display: grid; gap: var(--space-3); }
.package-models li { display: grid; gap: .2rem; border-top: 1px solid var(--line); padding-top: var(--space-2); }
.package-models a { font-weight: 750; }
.package-models small { color: var(--muted); overflow-wrap: anywhere; }
@media (max-width: 640px) { .package-option, .board .package-option { width: 100%; } .package-panel { position: static; width: auto; max-width: 100%; max-height: none; margin-top: var(--space-2); } .lines .package-option .addon { font-size: .75rem; } }

/* Clear filter groups and a compact recommendation above the complete selection. */
.controls { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: var(--space-4); align-items: start; }
.controls .control:last-child { grid-column: 1 / -1; }
.controls .keys { display: grid; }
.controls .key { min-width: 0; padding-inline: var(--space-2); }
#use-filter { grid-template-columns: repeat(4, minmax(0, 1fr)); }
#catalog-filter { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }
#ctx-filter { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.verdict { padding: var(--space-4); margin-bottom: var(--space-4); gap: var(--space-2); }
.verdict-name, .verdict-price { font-size: var(--step-1); line-height: 1.3; }
.verdict .btn { padding: var(--space-2) var(--space-3); font-size: var(--step--1); }
.configurations-intro { display: grid; gap: var(--space-2); margin-block: var(--space-5) var(--space-4); }
.configurations-intro h3 { font-size: var(--step-1); }
.configurations-intro p, .catalog-source { font-size: var(--step--1); color: var(--muted); }
.estimate-note { margin: 0; }
.sheet--config { align-content: start; row-gap: var(--space-5); }
.configuration-intro { display: grid; gap: var(--space-3); align-content: start; }
.sheet .configuration-intro h3, .configuration-intro .quote-why { margin: 0; line-height: 1.6; }
.sheet--config .configuration-quotes { align-self: start; }
.folder .sheet[role="tabpanel"] { margin-top: 0; }
.configuration-footnote { margin-top: var(--space-5); }
.example-package { padding-block: var(--space-2); }
@media (max-width: 640px) { .example-package { padding-left: 0; padding-top: var(--space-4); border-left: 0; border-top: 2px solid var(--line); } }
@media (max-width: 760px) { .controls { grid-template-columns: minmax(0, 1fr); } #use-filter { grid-template-columns: repeat(2, minmax(0, 1fr)); } #use-filter .key:nth-child(2) { border-right: 0; } #use-filter .key:nth-child(-n+2) { border-bottom: 1px solid var(--line-strong); } }

/* Contexts above a model's declared limit stay visible but cannot be chosen. */
.key[aria-disabled="true"] { opacity: .45; cursor: not-allowed; }
.key[aria-disabled="true"]:hover { color: inherit; background: transparent; }
.key[aria-current="true"] { background: var(--text); color: var(--bg); }
.context-limited { border-left: 2px solid var(--accent); padding-left: var(--space-3); margin-bottom: var(--space-3); }

/* Privacy notice and footer links. */
.privacy-body { display: grid; gap: var(--space-3); max-width: 70ch; }
.privacy-body h2 { font-size: var(--step-1); margin-top: var(--space-4); }
.privacy h1 { font-family: var(--font-display); font-size: var(--step-3); line-height: 1.15; }
.footer-links { display: flex; flex-wrap: wrap; gap: var(--space-4); }

/* Recommended card first, one estimate legend per result, compact phone hero. */
.card--recommended { border-color: var(--accent); }
.recommended { color: var(--accent); font-weight: 750; }
.estimate-legend { max-width: 70ch; }
@media (max-width: 640px) {
    .hero .chip { display: none; }
    .hero { padding-block: var(--space-5) var(--space-4); }
    .hero .lede { font-size: var(--step-0); }
}
/* Long laptop-mode labels stay on the border line instead of wrapping over the content. */
.verdict-label { max-width: calc(100% - 2 * var(--space-4)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* A sold-out family is shown with a substitute laptop (S1.9). */
.substitute-note { border-left: 2px solid var(--accent); padding-left: var(--space-3); }
.installation-guide code { overflow-wrap: anywhere; font-size: .9em; }
.installation-guide li { margin-bottom: var(--space-3); }
.guide-paths { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--space-4); }
.guide-paths article { padding: var(--space-4); border: 1px solid var(--line); min-width: 0; }
.installation-guide pre { white-space: pre-wrap; overflow-wrap: anywhere; padding: var(--space-4); background: var(--surface); border: 1px solid var(--line); }
.installation-guide blockquote { margin: var(--space-4) 0; padding: var(--space-4); border-left: 3px solid var(--accent); background: var(--surface); }
@media (max-width: 640px) { .guide-paths { grid-template-columns: 1fr; } }
