.guides-index{padding-block:var(--space-9) var(--space-10)}.guides-index .lead{max-width:760px}.guide-topic{margin-top:var(--space-8)}.guide-topic h2{font-size:var(--text-xl);margin-bottom:var(--space-4)}.article-tool-grid,.guide-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:var(--space-4)}.article-tool,.guide-card{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-5);background:var(--color-surface);border:2px solid var(--color-edge);border-radius:var(--radius-l);box-shadow:var(--shadow-s);color:var(--color-ink);text-decoration:none;transition:transform .15s ease,box-shadow .15s ease}.guide-card strong{font-family:var(--font-display);font-size:var(--text-l);line-height:1.25}.article-tool span,.guide-card span{color:var(--color-muted);line-height:1.55}.guide-card small{margin-top:auto;color:var(--color-muted);font-size:var(--text-xs)}.article-tool:hover,.guide-card:hover{transform:translate(-2px,-2px);box-shadow:var(--shadow-m)}.article-tool:focus-visible,.guide-card:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}.guide-article .breadcrumb{display:flex;align-items:center;gap:6px;font-size:var(--text-s)}.guide-article h1{margin-bottom:var(--space-3)}.guide-byline{font-size:var(--text-s)}.guide-toc{margin:var(--space-5) 0;padding:var(--space-4) var(--space-5);background:var(--color-sunken);border-radius:var(--radius-l)}.guide-toc ol{margin-top:var(--space-2);list-style:decimal}.guide-toc li{line-height:1.6}.prose.guide-article code{font-family:var(--font-mono);font-size:.92em;background:var(--color-sunken);padding:1px 5px;border-radius:var(--radius-s);overflow-wrap:anywhere}.article-tip{display:flex;gap:var(--space-3);align-items:flex-start;margin:var(--space-5) 0;padding:var(--space-4);background:var(--color-accent-soft);border-left:4px solid var(--color-accent);border-radius:var(--radius-m)}.article-tip svg{flex:none;margin-top:4px;color:var(--color-accent)}.prose .article-tip p{color:var(--color-ink);margin:0}.article-table{margin:var(--space-5) 0;overflow-x:auto;border:1px solid var(--color-line);border-radius:var(--radius-m)}.article-table:focus-visible{outline:3px solid var(--color-focus);outline-offset:2px}.article-table table{width:100%;border-collapse:collapse;font-size:var(--text-s)}.article-table caption{text-align:left;padding:var(--space-3) var(--space-4) 0;font-weight:700;color:var(--color-ink)}.article-table td,.article-table th{padding:var(--space-3) var(--space-4);text-align:left;vertical-align:top;border-bottom:1px solid var(--color-line);line-height:1.5}.article-table thead th{color:var(--color-ink);background:var(--color-sunken)}.article-table tbody th{color:var(--color-ink);font-weight:700}.article-table td{color:var(--color-muted)}.article-table tr:last-child>*{border-bottom:0}.article-tools{margin-top:var(--space-8)}.prose .article-tool{text-decoration:none}.prose .article-tool strong{color:var(--color-accent)}.guide-more li,.guide-sources li{margin-bottom:var(--space-1)}.guide-method{margin-top:var(--space-7);padding-top:var(--space-4);border-top:1px solid var(--color-line);font-size:var(--text-s)}.compression-demo{margin:var(--space-5) 0;padding:var(--space-5);background:var(--color-surface);border:2px solid var(--color-edge);border-radius:var(--radius-l);box-shadow:var(--shadow-s)}.prose .compression-demo h3{margin-top:0}.demo-controls{display:flex;flex-wrap:wrap;gap:var(--space-3) var(--space-5);align-items:center;margin-bottom:var(--space-4)}.demo-controls fieldset{border:0;padding:0;margin:0}.demo-controls legend{font-size:var(--text-s);font-weight:700;margin-bottom:var(--space-2)}.demo-qualities{display:flex;flex-wrap:wrap;gap:6px}.demo-qualities label{position:relative;min-width:52px;min-height:40px;display:inline-flex;align-items:center;justify-content:center;padding:0 10px;border:2px solid var(--color-line-strong);border-radius:var(--radius-pill);cursor:pointer;font-weight:700;font-variant-numeric:tabular-nums;transition:background-color .15s ease,border-color .15s ease}.demo-qualities input{position:absolute;opacity:0;inset:0;cursor:pointer}.demo-qualities label.is-active{background:var(--color-accent);border-color:var(--color-accent);color:var(--color-on-accent)}.demo-qualities label:has(input:focus-visible){outline:3px solid var(--color-focus);outline-offset:2px}.demo-toggle{display:inline-flex;gap:8px;align-items:center;min-height:40px;font-size:var(--text-s)}.demo-file{position:relative;overflow:hidden}.demo-file input{position:absolute;inset:0;opacity:0;cursor:pointer}.demo-file:has(input:focus-visible){outline:3px solid var(--color-focus);outline-offset:2px}.demo-view{overflow:hidden;border-radius:var(--radius-m);background:var(--color-sunken);aspect-ratio:8/5;display:flex;align-items:center;justify-content:center}.demo-view img{width:100%;height:100%;object-fit:contain;transition:transform .25s ease}.demo-view.is-zoomed img{transform:scale(3);transform-origin:62% 78%;image-rendering:pixelated}.demo-placeholder{width:100%;height:100%;background:linear-gradient(90deg,var(--color-sunken),var(--color-line),var(--color-sunken));background-size:200% 100%;animation:demo-shimmer 1.2s linear infinite}@keyframes demo-shimmer{to{background-position:-200% 0}}.demo-sizes,.prose .demo-status{margin-top:var(--space-3);font-size:var(--text-s)}.demo-sizes{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}.demo-sizes caption{text-align:left;font-weight:700;padding-bottom:var(--space-2)}.demo-sizes td,.demo-sizes th{padding:6px var(--space-2);text-align:left;border-bottom:1px solid var(--color-line);white-space:nowrap}.demo-sizes td:last-child{width:55%}.demo-sizes tr.is-active td,.demo-sizes tr.is-active th{background:var(--color-accent-soft)}.demo-bar{display:block;height:10px;min-width:2px;border-radius:var(--radius-pill);background:var(--color-accent);transition:width .3s ease}.prose .demo-note{font-size:var(--text-xs);margin-top:var(--space-3)}@media (prefers-reduced-motion:reduce){.article-tool,.demo-bar,.demo-qualities label,.demo-view img,.guide-card{transition:none}.article-tool:hover,.guide-card:hover{transform:none}.demo-placeholder{animation:none}}.contact-form{display:grid;gap:var(--space-4);margin:var(--space-6) 0;padding:var(--space-5);background:var(--color-surface);border:2px solid var(--color-edge);border-radius:var(--radius-l);box-shadow:var(--shadow-s)}.contact-form .form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:var(--space-4)}.contact-form .optional{font-weight:400;color:var(--color-muted)}.contact-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.contact-done{display:flex;gap:var(--space-3);align-items:flex-start;margin:var(--space-6) 0;padding:var(--space-5);background:var(--color-success-soft);border:2px solid var(--color-success);border-radius:var(--radius-l);animation:contact-done .25s ease-out}.contact-done svg{flex:none;color:var(--color-success)}.prose .contact-done p{color:var(--color-ink);margin:var(--space-1) 0 var(--space-3)}.contact-done:focus{outline:none}.contact-done:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}@keyframes contact-done{0%{opacity:0;transform:scale(.98)}}.help-page kbd{font-family:var(--font-mono);font-size:.85em;padding:1px 6px;border:solid var(--color-line-strong);border-width:1px 1px 2px;border-radius:var(--radius-s);background:var(--color-surface);color:var(--color-ink)}.help-page section{margin-top:var(--space-2)}.changelog{list-style:none;padding:0;margin-top:var(--space-6);border-left:3px solid var(--color-line)}.changelog>li{position:relative;padding:0 0 var(--space-7) var(--space-6)}.changelog>li:before{content:"";position:absolute;left:-9px;top:6px;width:15px;height:15px;border-radius:50%;background:var(--color-accent);border:3px solid var(--color-bg)}.changelog-version{display:inline-block;margin-left:var(--space-2);padding:1px 8px;border-radius:999px;background:var(--color-surface-2,var(--color-line));font:600 var(--text-xs)/1.5 var(--font-mono)}.changelog time{font-size:var(--text-s);font-weight:700;color:var(--color-accent-strong)}.prose .changelog h2{margin-top:var(--space-1)}@media (prefers-reduced-motion:reduce){.contact-done{animation:none}}.home-guides{padding-block:var(--space-8) var(--space-9)}.home-guides-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:var(--space-3);margin-bottom:var(--space-5)}.home-guides h2{font-size:var(--text-2xl,28px);margin:0}.changelog ul,.contact-page ul,.guide-article ul,.guide-more ul,.guide-sources ul{list-style:disc}.changelog ul li,.contact-page ul li,.guide-article ul li{margin-bottom:var(--space-1)}.prose a.article-tool:not(.btn):not(.button){text-decoration:none;font-weight:400;color:var(--color-ink)}.prose a.article-tool:not(.btn):not(.button) strong{color:var(--color-accent);text-decoration:underline;text-underline-offset:3px}.home-guides .guide-cards{grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr))}