.serif-sans-card-preview{gap:6px}.serif-sans-card-rows{gap:5px;display:grid}.serif-sans-card-row{border:1px solid var(--line);background:var(--color-white);border-radius:7px;grid-template-columns:auto minmax(0,1fr) auto;align-items:baseline;gap:8px;padding:6px 8px;display:grid}.serif-sans-card-row b{color:var(--ink);font-weight:800;font-size:10px!important}.serif-sans-card-row i{color:var(--ink);font-style:normal;font-weight:700;line-height:1.2;font-size:14px!important}.serif-sans-card-row small{color:var(--muted);white-space:nowrap;font-weight:650;font-size:9px!important}.serif-sans-card-row.is-serif i{font-family:Georgia,Noto Serif SC,Songti SC,serif}.serif-sans-card-row.is-sans i{font-family:system-ui,-apple-system,PingFang SC,Noto Sans SC,sans-serif}.serif-sans-card-row.is-mono i{font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace}.serif-sans-card-preview>p{color:var(--muted);margin:0;font-weight:650;line-height:1.45;font-size:10px!important}.term-interactive-demo.serif-sans-interaction-demo{border-color:var(--line);background:var(--color-white);gap:13px}.serif-sans-demo-brief{color:var(--muted);margin:0;font-size:13px;line-height:1.55}.serif-sans-demo-brief strong{color:var(--ink)}.serif-sans-demo-picker{flex-wrap:wrap;align-items:center;gap:7px;display:flex}.serif-sans-demo-picker-label{width:100%;color:var(--muted);margin:0;font-size:12px;font-weight:700}.serif-sans-interaction-demo button:hover{border-color:var(--ink);background:var(--color-faint);color:var(--ink)}.serif-sans-interaction-demo button[aria-pressed=true]{border-color:var(--ink);background:var(--soft);color:var(--ink);font-weight:800}.serif-sans-demo-sample{border:1px solid var(--line);background:var(--color-white);border-radius:10px;gap:9px;padding:14px;display:grid}.serif-sans-demo-sample.is-recommended{border-width:2px;border-color:var(--ink)}.serif-sans-demo-sample.is-caution{border-color:var(--color-deco);background:var(--color-faint)}.serif-sans-demo-sample.is-mismatch{border-style:dashed;border-color:var(--color-deco);background:var(--color-faint)}.serif-sans-demo-sample-head{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px;display:flex}.serif-sans-demo-family-badge{background:var(--ink);color:var(--color-white);border-radius:99px;align-items:baseline;gap:4px;padding:3px 10px;font-size:12px;font-weight:800;display:inline-flex}.serif-sans-demo-family-en{opacity:.82;font-weight:650}.serif-sans-demo-trait{color:var(--muted);font-size:12px;font-weight:650}.serif-sans-demo-render{color:var(--ink);margin:0;font-size:16px;line-height:1.5}.serif-sans-demo-render.serif{font-family:Georgia,Noto Serif SC,Songti SC,serif}.serif-sans-demo-render.sans{font-family:system-ui,-apple-system,PingFang SC,Noto Sans SC,sans-serif}.serif-sans-demo-render.mono{font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace}.serif-sans-demo-stack{color:#d9e2f4;font-family:var(--font-geist-mono), ui-monospace, monospace;word-break:break-word;background:#1e2330;border-radius:7px;margin:0;padding:8px 10px;font-size:11px;line-height:1.5;display:block}.serif-sans-demo-fit{border:1px solid var(--color-deco);background:var(--color-white);color:var(--ink);border-radius:99px;justify-self:start;align-items:center;gap:6px;padding:5px 12px;font-size:12px;font-weight:800;display:inline-flex}.serif-sans-demo-fit i{font-style:normal;font-weight:900}.serif-sans-demo-sample.is-recommended .serif-sans-demo-fit{background:var(--color-rausch);border-color:var(--color-rausch);color:var(--color-white)}.serif-sans-demo-sample.is-caution .serif-sans-demo-fit{background:var(--color-white);color:var(--ink)}.serif-sans-demo-sample.is-mismatch .serif-sans-demo-fit{background:var(--color-white);color:var(--muted);border-style:dashed}.serif-sans-demo-status{border:1px solid var(--line);background:var(--color-white);color:var(--ink);border-left-width:4px;border-radius:8px;gap:3px;margin:0;padding:10px 12px;font-size:13px;line-height:1.55;display:grid}.serif-sans-demo-status strong{font-size:14px;font-weight:800}.serif-sans-demo-status span{color:var(--muted);font-size:12px;line-height:1.5}.serif-sans-demo-status.is-recommended{border-left-color:var(--ink)}.serif-sans-demo-status.is-caution{border-left-color:var(--color-deco)}.serif-sans-demo-status.is-mismatch{border-left-color:var(--color-deco);background:var(--color-faint);border-left-style:dashed}.serif-sans-examples{gap:10px;display:grid}.serif-sans-examples article{border:1px solid var(--line);background:var(--color-white);border-radius:8px;padding:12px 14px}.serif-sans-examples article.is-good{border-left:4px solid var(--ink)}.serif-sans-examples article.is-bad{border-left:4px dashed var(--color-deco);background:var(--color-faint)}.serif-sans-examples header{justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:6px;display:flex}.serif-sans-examples header strong{color:var(--ink);font-size:14px;font-weight:800}.serif-sans-examples article.is-good header strong:before{content:"✓ ";color:var(--ink)}.serif-sans-examples article.is-bad header strong:before{content:"✗ ";color:var(--muted)}.serif-sans-examples header small{color:var(--muted);font-size:11px;font-weight:700}.serif-sans-examples p{color:var(--ink);margin:0 0 6px;font-size:13px;line-height:1.55}.serif-sans-examples span{color:var(--muted);font-size:12px;font-weight:650}@media (max-width:640px){.serif-sans-card-row{grid-template-columns:1fr;gap:3px}.serif-sans-card-row small{white-space:normal}.serif-sans-demo-sample-head{flex-direction:column;align-items:flex-start}}.term-interactive-demo.serif-sans-interaction-demo[data-b1-rebuild]{color:#173538;background:#e4f0e8;border-color:#2a4b4d;box-shadow:7px 7px #9fc8bf}.term-interactive-demo.serif-sans-interaction-demo[data-b1-rebuild] .serif-sans-demo-sample{background:#fffdf8;border-color:#2a4b4d}.term-interactive-demo.serif-sans-interaction-demo[data-b1-rebuild] .serif-sans-demo-family-badge{color:#fffdf8;background:#2a4b4d}.term-interactive-demo.serif-sans-interaction-demo[data-b1-rebuild] .serif-sans-demo-stack{color:#e7fbf4;background:#183d40}.term-interactive-demo.serif-sans-interaction-demo[data-b1-rebuild] .serif-sans-demo-sample.is-recommended .serif-sans-demo-fit{color:#fff;background:#1f6f60;border-color:#1f6f60}
