.term-card .component-variant-card-preview{background:var(--color-white);border-color:var(--color-deco);color:var(--ink)}.component-variant-card-preview>p{color:var(--muted)}.component-variant-card-preview>p strong{color:var(--ink)}.component-variant-card-compare{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;display:grid}.component-variant-card-side{gap:4px;margin:0;padding:0;display:grid}.component-variant-card-side figcaption{color:var(--muted);font-size:8px;font-weight:800}.component-variant-card-stage{border:1px solid var(--color-deco);background:var(--color-faint);border-radius:6px;align-content:start;gap:4px;min-height:64px;padding:8px;display:grid}.component-variant-card-axis{background:var(--color-white);border:1px solid var(--color-deco);height:14px;color:var(--ink);border-radius:3px;justify-content:center;align-items:center;padding:0 5px;font-size:7px;font-style:normal;font-weight:800;display:flex}.component-variant-card-axis.is-off{color:#a83a44;background:#fbecee;border-color:#e6c4c7}.component-variant-card-mini{color:#fff;background:var(--ink);border-radius:4px;justify-content:center;align-items:center;min-height:18px;padding:3px 5px;font-size:8px;font-weight:800;line-height:1;display:flex}.component-variant-card-mini.is-primary{background:var(--color-rausch)}.component-variant-card-mini.is-secondary{border:1px solid var(--color-deco);background:var(--color-white);color:var(--ink)}.component-variant-card-mini.is-danger{background:#a83a44}.component-variant-card-mini.is-blue1{background:#6f86d6}.component-variant-card-mini.is-blue2{background:#8aa0e4}.component-variant-card-mini.is-blue3{background:#566bb8}.component-variant-card-side strong{font-size:9px;font-weight:800}.component-variant-card-side.is-good strong{color:#2f7a4a}.component-variant-card-side.is-good strong:before{content:"✓ "}.component-variant-card-side.is-bad strong{color:#a83a44}.component-variant-card-side.is-bad strong:before{content:"✗ "}.term-interactive-demo.component-variant-demo{border-color:var(--color-deco);background:var(--color-white);gap:14px}.component-variant-demo-brief{color:var(--muted);margin:0;font-size:13px;line-height:1.55}.component-variant-axes{border:1px dashed var(--color-deco);background:var(--color-faint);border-radius:8px;flex-wrap:wrap;gap:6px 12px;padding:8px 10px;display:flex}.component-variant-axes span{color:var(--muted);font-size:12px;line-height:1.4}.component-variant-axes b{color:var(--ink);margin-right:4px;font-weight:800}.component-variant-stage{border:1px solid var(--color-deco);background:var(--color-faint);border-radius:10px;justify-items:center;gap:10px;padding:20px 16px 16px;display:grid;position:relative}.component-variant-stage-label{color:var(--muted);font-size:11px;font-weight:700;position:absolute;top:8px;left:12px}.component-variant-object{justify-content:center;align-items:center;gap:10px;min-height:44px;display:flex}.component-variant-button{background:var(--ink);color:var(--color-white);font:inherit;cursor:pointer;border:1px solid #0000;border-radius:8px;justify-content:center;align-items:center;gap:6px;font-weight:700;transition:background .15s,border-color .15s,color .15s;display:inline-flex}.component-variant-button.is-md{padding:9px 18px;font-size:14px}.component-variant-button.is-sm{padding:6px 12px;font-size:12px}.component-variant-button.is-primary{background:var(--color-rausch);color:var(--color-white)}.component-variant-button.is-primary:hover,.component-variant-button.is-primary.is-hovered{background:var(--color-rausch-600)}.component-variant-button.is-secondary{background:var(--color-white);border-color:var(--color-deco);color:var(--ink)}.component-variant-button.is-secondary:hover,.component-variant-button.is-secondary.is-hovered{background:var(--color-faint);border-color:var(--ink)}.component-variant-button.is-danger{color:var(--color-white);background:#a83a44}.component-variant-button.is-danger:hover,.component-variant-button.is-danger.is-hovered{background:#8a2f38}.component-variant-button.is-disabled,.component-variant-button:disabled{background:var(--color-deco);color:var(--muted);cursor:not-allowed;opacity:.85}.component-variant-button.is-loading{background:var(--ink);color:var(--color-white);cursor:progress}.component-variant-button:focus-visible{outline:2px solid var(--ink);outline-offset:3px}.component-variant-spinner{border:2px solid color-mix(in srgb, var(--color-white) 35%, transparent);border-top-color:var(--color-white);border-radius:50%;width:11px;height:11px;animation:.8s linear infinite component-variant-spin}@keyframes component-variant-spin{to{transform:rotate(360deg)}}.component-variant-adhoc-candidate{color:#a83a44;background:repeating-linear-gradient(45deg,#fbecee 0 6px,#fff 6px 12px);border:1px dashed #c9a8ab;border-radius:8px;justify-content:center;align-items:center;padding:9px 14px;font-size:13px;font-weight:700;display:inline-flex}.component-variant-props-tag{border:1px solid var(--color-deco);background:var(--color-white);color:var(--muted);font-family:var(--font-geist-mono), ui-monospace, monospace;border-radius:999px;margin:0;padding:4px 9px;font-size:12px}.component-variant-props-tag b{color:var(--ink);font-weight:800}.component-variant-stamp{border-radius:999px;justify-content:center;align-items:center;padding:5px 12px;font-size:12px;font-weight:800;display:inline-flex}.component-variant-stamp.is-pass{color:#2f7a4a;background:#e3f3e9;border:1px solid #b9dcc4}.component-variant-stamp.is-fail{color:#a83a44;background:#fbecee;border:1px solid #e6c4c7}.component-variant-controls{flex-direction:column;gap:8px;display:flex}.component-variant-control-group{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.component-variant-control-legend{color:var(--muted);min-width:32px;font-size:12px;font-weight:800}.component-variant-demo button{color:var(--ink);background:var(--color-white);border-color:var(--color-deco)}.component-variant-demo button:hover{border-color:var(--ink);background:var(--color-faint);color:var(--ink)}.component-variant-demo button[aria-pressed=true]{border-color:var(--ink);background:var(--color-faint);color:var(--ink);font-weight:800}.component-variant-demo button:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.component-variant-actions{flex-wrap:wrap;gap:7px;display:flex}.component-variant-verify{font-weight:700;background:var(--ink)!important;border-color:var(--ink)!important;color:var(--color-white)!important}.component-variant-verify:hover{color:var(--color-white)!important;background:#2a2a32!important;border-color:#2a2a32!important}.component-variant-adhoc-trigger{color:#8a2f38!important;background:var(--color-white)!important;border-style:dashed!important;border-color:#cdbfc1!important}.component-variant-adhoc-trigger:hover,.component-variant-adhoc-trigger[aria-pressed=true]{color:#a83a44!important;background:#fbecee!important;border-color:#a83a44!important}.component-variant-reset{color:var(--muted)!important}.component-variant-verdict{border:1px solid var(--color-deco);background:var(--color-faint);border-radius:8px;gap:3px;margin:0;padding:10px 12px;font-size:13px;line-height:1.55;display:grid}.component-variant-verdict strong{color:var(--ink);font-weight:800}.component-variant-verdict.is-pass{background:#eaf6ee;border-color:#b9dcc4}.component-variant-verdict.is-pass strong{color:#2f7a4a}.component-variant-verdict.is-fail{background:#fbecee;border-color:#e6c4c7}.component-variant-verdict.is-fail strong{color:#a83a44}.component-variant-verdict span{color:var(--muted)}.component-variant-examples{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.component-variant-examples article{border:1px solid var(--color-deco);background:var(--color-faint);border-radius:9px;align-content:start;gap:5px;padding:14px;display:grid}.component-variant-examples article header{justify-content:space-between;align-items:center;gap:6px;display:flex}.component-variant-examples article strong{color:var(--ink);font-size:13px;font-weight:800}.component-variant-examples article.is-good strong:before{content:"✓ ";color:#2f7a4a}.component-variant-examples article.is-bad strong:before{content:"✗ ";color:#a83a44}.component-variant-examples article small{color:var(--muted);font-size:11px;font-weight:800}.component-variant-examples article p{color:var(--ink);margin:0;font-size:13px;line-height:1.6}.component-variant-examples article span{color:var(--muted);font-size:12px;font-weight:650}.component-variant-howto{color:var(--ink);gap:8px;margin:8px 0 0;padding:0 0 0 18px;font-size:13px;line-height:1.6;display:grid}.component-variant-howto li{color:var(--muted)}.component-variant-howto li b{color:var(--ink);font-weight:800}@media (max-width:780px){.component-variant-examples{grid-template-columns:1fr}.component-variant-axes{gap:5px 8px}.component-variant-actions{flex-direction:column;align-items:stretch}.component-variant-actions button{width:100%}}@media (prefers-reduced-motion:reduce){.component-variant-spinner{animation:none}.component-variant-button{transition:none}}@media (max-width:780px){.component-variant-card-compare{gap:4px}.component-variant-card-mini{min-height:16px;padding:2px 4px;font-size:7px}.component-variant-card-axis{height:12px;font-size:6px}}.term-card .term-preview.component-variant-card-preview{background:var(--color-white);border-color:var(--color-deco);color:var(--ink)}
