/* Guides (/guides and /guides/*): article layout on top of the site and workspace stylesheets. */
@media screen{
.guide{max-width:820px}
.guide .eyebrow a{color:inherit;text-decoration:none}
.guide .eyebrow a:hover{text-decoration:underline}
.guide .meta{font-size:14px!important;color:var(--muted);margin:-4px 0 8px;padding-bottom:18px;border-bottom:1px solid var(--line2)}
.guide h2{font-size:24px;letter-spacing:-.4px;margin:40px 0 10px}
.guide h3{font-size:17px;margin:24px 0 4px}
.guide li{font-size:16px;line-height:1.75;color:var(--ink2);margin:6px 0}
.guide .tbl{overflow-x:auto;margin:20px 0;-webkit-overflow-scrolling:touch}
.guide .tbl table{margin:0;min-width:520px}
.guide table caption{text-align:left;font:500 12px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding-bottom:8px}
.guide th{font-weight:600;color:var(--ink)}
.guide table.score td{font-size:14.5px}
.guide table.score tr.total th,.guide table.score tr.total td{background:var(--wash);font-weight:600}
.guide td.g-pass{color:#1f6542}.guide td.g-fail{color:#a33a24}.guide td.g-unknown{color:#8a5a00}
.guide code{font-size:13px;word-break:break-word}
.guide pre code{border:0;background:none;padding:0}
.guide figure.shot{margin:28px 0;padding:14px;background:var(--wash);border:1px solid var(--line);border-radius:12px}
.guide figure.shot img{display:block;max-width:100%;height:auto;margin:0 auto;border:1px solid var(--line);border-radius:8px;background:#fff}
.guide figure.side img{max-width:360px;width:100%}
.guide figcaption{font-size:14px;line-height:1.55;color:var(--muted);margin-top:10px}
.guide .dl{font-size:15px!important}
.guide .sources{padding-left:20px}.guide .sources li{font-size:15px}
.guide-list{list-style:none;padding:0;margin:16px 0;border-top:1px solid var(--line)}
.guide-list li{display:flex;flex-direction:column;gap:2px;padding:12px 0;border-bottom:1px solid var(--line);margin:0!important}
.guide-list li>a{font-weight:600;font-size:16px;text-decoration-color:var(--orange-line);text-underline-offset:3px}
.guide-list span{font-size:14px;color:var(--muted)}
.guide-list.big li>a{font-size:19px}
.lower .guide-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px;border-top:0;margin:0}
.lower .guide-list li{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px 44px 18px 18px;box-shadow:0 1px 2px rgba(17,27,38,.04);transition:border-color .15s,box-shadow .15s}
.lower .guide-list li:hover{border-color:#b9c4cf;box-shadow:0 4px 14px rgba(17,27,38,.08)}
.lower .guide-list li>a{color:var(--ink);text-decoration:none;font-size:16px}
.lower .guide-list li>a::after{content:"→";position:absolute;right:18px;top:17px;color:var(--orange-dk);font-weight:600}
.lower .guide-list li>a::before{content:"";position:absolute;inset:0;border-radius:12px}
.lower .guide-list span{line-height:1.55}
}
@media screen and (max-width:640px){.guide h2{font-size:21px}.guide figure.shot{padding:8px;margin:20px -4px}}