/* Editorial pages share the existing Dayflint palette and self-hosted fonts. */
html{scroll-padding-top:2rem}
body{overflow-wrap:break-word}
a:focus-visible,summary:focus-visible,input:focus-visible,.table-scroll:focus-visible{outline:3px solid var(--link);outline-offset:5px}
.skip-link{position:absolute;left:1rem;top:-6rem;z-index:10;background:var(--card);padding:.8rem 1rem}
.skip-link:focus{top:1rem}
.guide-top{max-width:76rem;margin:auto;padding:1.5rem clamp(1rem,4vw,3rem);display:flex;align-items:center;justify-content:space-between;gap:1rem;border-bottom:1px solid var(--line)}
.guide-brand{display:flex;align-items:center;gap:.6rem;min-height:44px;color:var(--ink);text-decoration:none;font:1.35rem Fraunces,Georgia,serif}
.guide-top>a:last-child{font-size:.95rem;padding:.5rem 0}
main.guide-layout{max-width:76rem;display:grid;grid-template-columns:minmax(0,46rem) minmax(11rem,15rem);gap:clamp(2rem,5vw,5rem);padding:3rem clamp(1rem,4vw,3rem) 4rem}
.guide-layout article{min-width:0}
.article-header{display:block;margin-bottom:2.5rem}
.guide-kicker{font-size:.9rem;color:var(--link);margin:0 0 1rem}
.article-header h1{font-size:clamp(2.35rem,4.3vw,3.65rem);line-height:1.13;max-width:20ch}
.article-header .updated{margin:1rem 0 1.75rem}
.article-intro{font-size:1.2rem;line-height:1.65;color:var(--ink);border-left:3px solid var(--link);padding-left:1.25rem}
.article-body h2,.article-faq h2{font:400 1.7rem/1.25 Fraunces,Georgia,serif;margin:2.75rem 0 1rem}
.article-body h3{font-size:1.15rem;margin:2rem 0 .75rem}
.article-body p{margin:1rem 0}
.article-body ul{padding-left:1.4rem}
.article-body li{margin:.5rem 0}
.article-body blockquote{margin:1.75rem 0;padding:.1rem 1.25rem;border-left:3px solid var(--line)}
.table-scroll{overflow-x:auto;margin:1.5rem 0 2rem;border:1px solid var(--line);border-radius:.75rem;background:var(--card)}
table{border-collapse:collapse;text-align:left;width:100%;min-width:39rem;font-size:.95rem;line-height:1.5}
th,td{padding:1rem;vertical-align:top}
th{font-weight:600;color:var(--ink);border-bottom:2px solid var(--line)}
td{color:var(--muted);border-bottom:1px solid var(--line)}
tbody tr:last-child td{border-bottom:0}
th:first-child{width:24%}
.article-body pre{background:var(--card);border:1px solid var(--line);padding:1.25rem;border-radius:.75rem;white-space:pre-wrap;overflow-wrap:anywhere}
.article-body code{font:inherit;line-height:1.7}
.article-body ul:has(.check-item){list-style:none;padding-left:0}
.check-item label{display:flex;align-items:flex-start;gap:.75rem;cursor:pointer;min-height:44px;padding:.45rem 0}
.check-item input{flex:none;width:1.15rem;height:1.15rem;margin:.25rem 0 0;accent-color:var(--link)}
.check-item input:checked+span{text-decoration:line-through;text-decoration-thickness:1px}
.guide-outline{padding-top:.5rem;font-size:.9rem}
.guide-outline>div{position:sticky;top:2rem}
.guide-outline p{color:var(--ink);font-weight:600;margin:0 0 .75rem}
.guide-outline ul{list-style:none;padding-left:0;margin:.5rem 0 1rem}
.guide-outline ul ul{padding-left:.8rem}
.guide-outline a{display:block;padding:.4rem 0;text-decoration:none;color:var(--muted);line-height:1.4}
.guide-outline a:hover{text-decoration:underline;color:var(--link)}
.article-faq{border-top:1px solid var(--line);margin-top:3rem}
.article-faq details{border-bottom:1px solid var(--line);padding:.9rem 0}
.article-faq summary{cursor:pointer;min-height:44px;padding:.5rem 0;color:var(--ink);font-weight:600}
.article-faq details p{margin:.75rem 0}
.guide-footer{max-width:70rem;margin:0 auto;padding:1.5rem 1rem 2rem;border-top:1px solid var(--line);font-size:.95rem}
.guide-footer>nav{border:0;padding:0;margin:1rem 0;gap:.5rem 1.5rem}
.guide-footer>p{font-size:.85rem}
main.guides-index{max-width:50rem;padding:3.5rem 1rem 6rem}
.guide-list{list-style:none;padding:0;margin:2.5rem 0}
.guide-list li{padding:1.5rem 0;border-top:1px solid var(--line)}
.guide-list h2{font:400 1.5rem/1.3 Fraunces,Georgia,serif;margin:0 0 .5rem}
.guide-list p{margin:.5rem 0}
@media(max-width:900px){main.guide-layout{display:block;max-width:48rem}.guide-outline{display:none}}
@media(max-width:480px){.guide-top{padding-top:1rem;padding-bottom:1rem}main.guide-layout{padding-top:2rem}.article-header h1{font-size:2.25rem}.article-intro{font-size:1.1rem}.article-body h2,.article-faq h2{font-size:1.5rem}}