.demo{display:flex;flex-direction:column;gap:14px;padding:18px;border:1px solid hsl(var(--code-line));border-radius:10px;background:hsl(var(--code-bg));font-family:var(--font-mono);font-size:12px;color:#9fafc6}.demo--fill{flex:1;gap:12px}.demo-field{display:flex;flex-direction:column;gap:6px;min-width:0}.demo-label{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#7087a9}.demo-input,.demo-area{width:100%;border:0;border-radius:0;background:transparent;font:inherit;font-size:13px;color:#f1f5f9}.demo-input{padding:4px 0;border-bottom:1px solid hsl(213 30% 22%);transition:border-color var(--duration-fast) ease-out}.demo-input--md{padding-bottom:8px;font-size:14px}.demo-input--lg{font-size:20px}.demo-area{flex:1;min-height:170px;padding:0;resize:none;line-height:1.7}.demo-input:focus,.demo-area:focus{outline:none}.demo-input:focus{border-bottom-color:hsl(var(--blue))}.demo-area:focus-visible{outline:1px solid hsl(var(--blue) / .6);outline-offset:6px}.demo-status{color:#4da6ff}.demo-status.is-warn{color:#f9941f}.demo-rule{padding-top:12px;border-top:1px solid hsl(213 30% 18%)}.demo-row{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}.demo-btn{padding:4px 10px;border:1px solid hsl(213 30% 26%);border-radius:6px;background:transparent;font:inherit;font-size:11px;color:#e2ebf3;cursor:pointer}.demo-btn:hover:not(:disabled){border-color:#e2ebf3}.demo-btn:disabled{opacity:.4;cursor:default}.demo-pair{display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px;margin-top:-2px}.demo-pair span:first-child{color:#607a9f}.demo-pair span:last-child{color:#dbe6f0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.demo-halves{display:grid;grid-template-columns:1fr 1fr;gap:16px}.demo-thirds{display:grid;grid-template-columns:repeat(3,1fr)}.demo-thirds--boxed{gap:8px}.demo-stat{display:flex;flex-direction:column;gap:6px;min-width:0;padding:12px;border:1px solid hsl(213 30% 18%);border-radius:8px}.demo-stat__value{font-size:20px;color:#f1f5f9;overflow:hidden;text-overflow:ellipsis}.demo-stat__value--accent{color:#4da6ff}.demo-bar{height:6px;border-radius:999px;background:#202d3c;overflow:hidden}.demo-bar span{display:block;height:100%;background:hsl(var(--blue));transition:width var(--duration-base) ease-out}.demo-serp{display:flex;flex-direction:column;gap:3px;padding:12px 14px;border-radius:8px;background:#fff;font-family:var(--font-sans)}.demo-serp__url{font-size:11px;color:#5b6b80}.demo-serp__title{font-size:16px;color:#2260c3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.demo-serp__desc{font-size:12px;line-height:1.45;color:#47566b;overflow-wrap:anywhere}.demo-split{flex:1;display:grid;grid-template-columns:minmax(0,1fr) 120px;gap:16px}.demo-preview{display:flex;align-self:start;aspect-ratio:1;padding:14px;border-radius:8px;background:#fff}.demo-preview img{width:100%;height:100%;object-fit:contain}.stats[data-astro-cid-qkptn22r]{display:grid;grid-template-columns:repeat(3,1fr);margin:0;border-top:1px solid hsl(var(--strong))}.stats[data-astro-cid-qkptn22r] div[data-astro-cid-qkptn22r]{display:flex;flex-direction:column-reverse;gap:4px;padding-top:14px}.stats[data-astro-cid-qkptn22r] dd[data-astro-cid-qkptn22r]{margin:0;font-size:26px;font-weight:600;letter-spacing:-.03em}.stats[data-astro-cid-qkptn22r] dt[data-astro-cid-qkptn22r]{font-size:12px;color:hsl(var(--mute))}.list[data-astro-cid-qkptn22r]{background:hsl(var(--bg2));border-top:1px solid hsl(var(--line));padding-block:clamp(40px,5vw,64px) clamp(80px,10vw,140px)}.list__bar[data-astro-cid-qkptn22r]{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;margin-bottom:28px}.list__hint[data-astro-cid-qkptn22r]{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:hsl(var(--mute))}.filters[data-astro-cid-qkptn22r]{display:flex;flex-wrap:wrap;gap:8px}.filters[data-astro-cid-qkptn22r] button[data-astro-cid-qkptn22r]{display:flex;align-items:center;gap:8px;height:36px;padding:0 16px;border:1px solid hsl(var(--line));border-radius:var(--radius-pill);background:hsl(var(--bg));font:inherit;font-size:13px;font-weight:500;color:hsl(var(--ink));cursor:pointer;transition:background-color var(--duration-fast) ease-out,border-color var(--duration-fast) ease-out,color var(--duration-fast) ease-out}.filters[data-astro-cid-qkptn22r] button[data-astro-cid-qkptn22r]:hover{border-color:hsl(var(--ink))}.filters[data-astro-cid-qkptn22r] button[data-astro-cid-qkptn22r][aria-pressed=true]{border-color:hsl(var(--ink));background:hsl(var(--ink));color:hsl(var(--bg))}.filters[data-astro-cid-qkptn22r] button[data-astro-cid-qkptn22r] span[data-astro-cid-qkptn22r]{font-size:11px;opacity:.6}.cards[data-astro-cid-qkptn22r]{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,520px),1fr));gap:20px}.tcard[data-astro-cid-qkptn22r]{display:flex;flex-direction:column;min-width:0;overflow:hidden;border:1px solid hsl(var(--line));border-radius:var(--radius);background:hsl(var(--bg));transition:transform .4s ease-out,box-shadow .4s ease-out}.tcard[data-astro-cid-qkptn22r]:hover{transform:translateY(-4px);box-shadow:var(--shadow-elegant)}.tcard[data-astro-cid-qkptn22r][hidden]{display:none}.tcard__meta[data-astro-cid-qkptn22r]{display:flex;justify-content:space-between;align-items:center;padding:24px 28px 0;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:hsl(var(--mute))}.tcard__free[data-astro-cid-qkptn22r]{padding:3px 10px;border:1px solid hsl(var(--line));border-radius:var(--radius-pill);color:hsl(var(--ink))}.tcard__head[data-astro-cid-qkptn22r]{display:flex;flex-direction:column;gap:8px;padding:20px 28px 0}.tcard__head[data-astro-cid-qkptn22r] h2[data-astro-cid-qkptn22r]{margin:0;font-size:clamp(26px,2.4vw,34px);line-height:1.15;letter-spacing:-.035em;font-weight:600}.tcard__head[data-astro-cid-qkptn22r] p[data-astro-cid-qkptn22r]{margin:0;font-size:15px;line-height:1.55;color:hsl(var(--body))}.tcard__demo[data-astro-cid-qkptn22r]{flex:1;display:flex;flex-direction:column;min-width:0;margin:24px 28px 0}.tcard__foot[data-astro-cid-qkptn22r]{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 28px 24px;font-size:13px;color:hsl(var(--mute))}.tcard__foot[data-astro-cid-qkptn22r] a[data-astro-cid-qkptn22r]{display:flex;gap:8px;font-size:14px;font-weight:500;color:hsl(var(--link))}.tcard__foot[data-astro-cid-qkptn22r] a[data-astro-cid-qkptn22r]:hover{color:hsl(var(--ink))}.bigger[data-astro-cid-qkptn22r]{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px;margin-top:20px;padding:28px;border:1px dashed hsl(var(--line));border-radius:var(--radius)}.bigger[data-astro-cid-qkptn22r]>div[data-astro-cid-qkptn22r]:first-child{display:flex;flex-direction:column;gap:6px}.bigger__actions[data-astro-cid-qkptn22r]{display:flex;flex-wrap:wrap;gap:10px}.bigger[data-astro-cid-qkptn22r] strong[data-astro-cid-qkptn22r]{font-size:18px;font-weight:600;letter-spacing:-.02em}.bigger[data-astro-cid-qkptn22r]>div[data-astro-cid-qkptn22r]:first-child span[data-astro-cid-qkptn22r]{font-size:15px;color:hsl(var(--body))}@media(max-width:480px){.tcard__meta[data-astro-cid-qkptn22r],.tcard__head[data-astro-cid-qkptn22r],.tcard__foot[data-astro-cid-qkptn22r]{padding-inline:20px}.tcard__demo[data-astro-cid-qkptn22r]{margin-inline:20px}}