.editorial-section{background:#eef4ef;border-top:1px solid var(--line)}
.editorial-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}
.editorial-card{min-width:0;background:white;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.editorial-card a{display:flex;flex-direction:column;height:100%}
.editorial-card a:focus-visible{outline-offset:-4px}
.editorial-card a:hover{text-decoration:none}
.editorial-card a:hover h3{text-decoration:underline;text-decoration-color:var(--teal);text-underline-offset:.2em}
.editorial-card img{width:100%;height:auto;aspect-ratio:800/380;display:block;background:#e7f0ea}
.editorial-card-copy{padding:17px;display:flex;flex-direction:column;align-items:flex-start;flex:1}
.editorial-card h3{font:700 clamp(18px,2vw,23px)/1.25 var(--display);margin-top:8px}
.editorial-card-summary{font-size:14px;color:var(--muted);margin:8px 0 13px}
.editorial-meta{display:flex;gap:7px;flex-wrap:wrap;color:var(--teal-dark);font-size:12px;font-weight:700}
.editorial-meta span{padding:3px 9px;border:1px solid #d4e1d8;border-radius:99px;background:#f4f8f3}
.editorial-card .editorial-meta{margin-top:auto}
.editorial-page{padding-block:42px 64px}
.editorial-heading{max-width:955px;margin:0 auto 32px}
.editorial-heading h1{font-size:clamp(33px,5.35vw,65px);overflow-wrap:anywhere;margin-top:11px}
.editorial-lead{max-width:735px;font-size:clamp(16px,1.9vw,21px);color:var(--muted);margin:15px 0}
.editorial-reading{display:grid;grid-template-columns:minmax(0,195px) minmax(0,734px);gap:26px;justify-content:center}
.editorial-toc nav{position:sticky;top:18px;max-height:calc(100vh - 36px);overflow:auto;border:1px solid var(--line);border-radius:10px;padding:15px;background:white;display:block}
.editorial-toc ol{padding-left:19px;margin:8px 0 0}
.editorial-toc li+li{margin-top:5px}
.editorial-content{min-width:0}
.editorial-content :is(figure,pre){margin:0}
.editorial-content figure img{width:100%;height:auto;display:block;border-radius:12px;border:1px solid var(--line)}
.editorial-content figcaption{color:var(--muted);font-size:14px;line-height:1.5;margin:7px 0 20px}
.editorial-content h2{font-size:clamp(23px,3vw,33px);letter-spacing:-.024em;line-height:1.18;margin:27px 0 10px;scroll-margin-top:14px}
.editorial-content :is(p,ul,ol){margin:0 0 11px}
.editorial-content a{color:var(--teal-dark);text-decoration:underline;text-underline-offset:.18em}
.editorial-content :is(ul,ol){padding-left:25px}
.editorial-content :is(ul,ol) li+li{margin-top:6px}
.editorial-content code{font-family:var(--mono);font-size:.92em;overflow-wrap:anywhere}
.editorial-content :not(pre)>code{color:#0a4d47;background:#eef5ef;border-radius:3px;padding:1px 3px}
.editorial-content pre{background:#102139;color:#edf4ff;border-radius:8px;padding:13px 15px;overflow:auto;max-width:100%;font:13px/1.6 var(--mono)}
.editorial-content pre code{font:inherit;overflow-wrap:normal}
.editorial-code{border:1px solid #d2e0d6;border-radius:9px;overflow:hidden;margin:15px 0;background:#eff6f1}
.editorial-code>div{display:flex;justify-content:space-between;gap:9px;padding:8px 13px;font-size:13px;font-weight:700;flex-wrap:wrap}
.editorial-code pre{border-radius:0}
.editorial-content .table-scroll{overflow:auto;margin:13px 0}
.editorial-content table{border-collapse:collapse;width:100%;font-size:14px;background:white}
.editorial-content :is(th,td){text-align:left;padding:7px 9px;border:1px solid var(--line)}
.editorial-content th{background:#eef5ef}
.editorial-related{margin-top:27px;padding:1px 17px 10px;border-radius:10px;background:#edf5ef}
.editorial-related h2{margin-top:15px}
@media(max-width:1000px){.editorial-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:740px){.editorial-reading{grid-template-columns:minmax(0,1fr);gap:15px}.editorial-toc nav{position:static}.editorial-page{padding-block:28px 40px}}
@media(max-width:410px){.editorial-grid{grid-template-columns:minmax(0,1fr)}}
.editorial-filters{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 8px}
.editorial-filters button{border:1px solid #bfd4c8;border-radius:999px;padding:6px 12px;background:white;color:var(--teal-dark);font-size:13px;font-weight:700}
.editorial-filters button:hover{border-color:var(--teal)}
.editorial-filters button[aria-pressed=true]{background:var(--teal-dark);border-color:var(--teal-dark);color:white}
.editorial-meta .editorial-kind{background:#e4f1e9;border-color:#c9ded2}
.editorial-card[data-article-kind=research] .editorial-kind{background:#e9eff9;border-color:#d0ddf0;color:#18385b}
.editorial-card[data-article-kind=reasoning] .editorial-kind{background:#f8efe0;border-color:#ecdabd;color:#65441a}

.editorial-card-cover{display:grid;place-items:center;aspect-ratio:800/380;background:#dcece4;color:var(--teal-dark);font:700 48px/1 var(--display)}
.editorial-reading--plain{grid-template-columns:minmax(0,734px)}

.editorial-page{--article-accent:#235975;--article-tint:#e8f3f8;--article-line:#bdd8e4}
.editorial-page.theme-testing{--article-accent:#694277;--article-tint:#f3ebf6;--article-line:#dac4e1}
.editorial-page.theme-android{--article-accent:#28634d;--article-tint:#e8f4ed;--article-line:#c2decd}
.editorial-page.theme-algorithms{--article-accent:#77511e;--article-tint:#fbf1df;--article-line:#e9d4ad}
.editorial-page.theme-design{--article-accent:#43567e;--article-tint:#edf0fa;--article-line:#cbd4ec}
.editorial-heading{padding:clamp(18px,4vw,35px);border:1px solid var(--article-line);border-left:5px solid var(--article-accent);border-radius:12px;background:linear-gradient(120deg,var(--article-tint),white)}
.editorial-heading .eyebrow,.editorial-content h2,.editorial-note .eyebrow{color:var(--article-accent)}
.editorial-discussion-link{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:14px;color:var(--article-accent);font-size:13px;font-weight:700}
.editorial-discussion-link [data-article-rating]{background:white;border:1px solid var(--article-line);border-radius:99px;padding:3px 8px}
.editorial-content figure{padding:10px 10px 0;background:var(--article-tint);border:1px solid var(--article-line);border-radius:14px}
.editorial-content figure img{border:0;border-radius:8px}
.editorial-content figcaption{margin:8px 4px 10px}
.editorial-content>p,.editorial-content>ul,.editorial-content>ol{line-height:1.75}
.editorial-note{scroll-margin-top:18px;margin:23px 0;padding:14px 17px;border-radius:9px;border:1px solid var(--article-line);background:var(--article-tint)}
.editorial-note strong{display:block;margin:3px 0;color:var(--article-accent);font-size:19px}
.editorial-note p{margin:0}
.editorial-toc nav{border-color:var(--article-line);background:#fdfefd}
.editorial-code>div{background:var(--article-tint)}

/* Reading notes remain legible next to code on small screens. */
.editorial-code .editorial-runtime{padding:12px 15px;margin:0;line-height:1.65;font-size:14px;color:var(--text,#172e3e);background:#fafcfb;border-bottom:1px solid var(--article-line)}
.editorial-code .editorial-runtime strong{color:var(--article-accent)}
.editorial-code .editorial-runtime code{font-size:.92em}
.editorial-content .editorial-figure-open{display:inline-block;white-space:nowrap;margin-left:.35em;font-weight:700}
.editorial-content .table-scroll{max-width:100%;overscroll-behavior-inline:contain}
.editorial-content .table-scroll:focus-visible{outline:2px solid var(--article-accent);outline-offset:3px}
@media(max-width:540px){.editorial-content .table-scroll table{min-width:480px}.editorial-content pre{font-size:12px}.editorial-heading h1{line-height:1.16}.editorial-content figure{padding:5px 5px 0}}