.cg{gap:1rem;margin:1.5rem 0;display:grid}.cg-card{border:1px solid var(--sl-color-hairline);border-radius:var(--docs-radius-sm);background:var(--sl-color-bg-nav);gap:.8rem;padding:1rem;display:grid}.cg-card h3{font-size:var(--sl-text-lg);color:var(--sl-color-white);margin:0}.cg-row{grid-template-columns:1fr 1fr;align-items:start;gap:1rem;display:grid}.cg-field{gap:.35rem;display:grid}.cg-field[hidden]{display:none}.cg label{color:var(--sl-color-text);font-weight:600}.cg .cg-check{align-items:center;gap:.4rem;font-weight:500;display:inline-flex}.cg input[type=text],.cg select,.cg textarea{box-sizing:border-box;width:100%;font:inherit;color:var(--sl-color-text);background:var(--sl-color-bg);border:1px solid var(--sl-color-gray-5);border-radius:var(--docs-radius-sm);padding:.5rem .7rem}.cg input[type=color]{border:1px solid var(--sl-color-gray-5);border-radius:var(--docs-radius-sm);background:var(--sl-color-bg);cursor:pointer;flex:none;width:3rem;height:2.4rem;padding:.15rem}.cg textarea{resize:vertical;font-family:var(--sl-font-mono);font-size:var(--sl-text-sm);line-height:1.5}.cg input:focus-visible,.cg select:focus-visible,.cg textarea:focus-visible{outline:2px solid var(--sl-color-accent);outline-offset:1px}.cg-inline{flex-wrap:wrap;align-items:center;gap:.5rem;margin:0;display:flex}.cg-inline input[type=text],.cg-inline select{flex:8rem;width:auto;min-width:0}.cg-hint{font-size:var(--sl-text-sm);color:var(--sl-color-gray-2);margin:0}.cg-hint--error{color:var(--sl-color-red-high);font-weight:600}.cg code{background:var(--sl-color-bg-inline-code);border-radius:.25rem;padding:.05rem .3rem}.cg-button{appearance:none;font:inherit;font-size:var(--sl-text-sm);color:var(--docs-btn-control-fg);background:var(--docs-btn-control-bg);box-shadow:0 1px 0 var(--docs-btn-control-border);border-radius:var(--docs-radius-sm);cursor:pointer;transition:color var(--docs-animation), background-color var(--docs-animation), box-shadow var(--docs-animation);border:0;padding:.5rem 1rem;font-weight:600}.cg-button:hover{color:var(--docs-btn-control-hover-fg);background:var(--docs-btn-control-hover-bg);box-shadow:0 1px 0 var(--docs-btn-control-hover-border)}.cg-button--primary{background:var(--docs-btn-primary-bg);box-shadow:0 1px 0 var(--docs-btn-primary-border);color:var(--docs-btn-primary-fg)}.cg-button--primary:hover{background:var(--docs-btn-primary-hover-bg);box-shadow:0 1px 0 var(--docs-btn-primary-hover-border);color:var(--docs-btn-primary-hover-fg)}.cg-summary{margin:0;font-weight:600}.cg-themes{grid-template-columns:1fr 1fr;gap:1rem;display:grid}.cg-theme{align-content:start;gap:.4rem;display:grid}.cg-theme h4{font-size:var(--sl-text-sm);text-transform:uppercase;letter-spacing:.04em;color:var(--sl-color-gray-2);margin:0 0 .2rem}.cg-role{border-radius:var(--docs-radius-sm);border:1px solid var(--sl-color-hairline);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.25rem .75rem;padding:.55rem .75rem;display:flex}.cg-role__name{align-items:center;gap:.4rem;font-weight:700;display:inline-flex}.cg-role__step{font-size:var(--sl-text-xs);background:#80808040;border-radius:.2rem;padding:0 .35rem;font-weight:600}.cg-role__hex{font-family:var(--sl-font-mono);font-size:var(--sl-text-xs);gap:.6rem;display:inline-flex}.cg-role__lc{opacity:.85}.cg-mock{border-radius:var(--docs-radius-sm);border:1px solid var(--sl-color-hairline);gap:.8rem;padding:1rem;display:grid}.cg-mock__row{flex-wrap:wrap;gap:.5rem;display:flex}.cg-btn{border-radius:var(--docs-radius-sm);font-weight:600;font-size:var(--sl-text-sm);padding:.45rem .9rem}.cg-badge{font-size:var(--sl-text-xs);border-radius:999px;padding:.1rem .6rem;font-weight:700}.cg-mock__alert{font-size:var(--sl-text-sm);border-radius:.25rem;padding:.6rem .8rem}.cg-table-wrap{overflow-x:auto}.cg-table{border-collapse:collapse;width:100%;font-size:var(--sl-text-sm);min-width:42rem}.cg-table th,.cg-table td{text-align:left;vertical-align:middle;border-bottom:1px solid var(--sl-color-hairline);white-space:nowrap;padding:.4rem .6rem}.cg-table thead th{font-size:var(--sl-text-xs);text-transform:uppercase;letter-spacing:.04em;color:var(--sl-color-gray-2)}.cg-table tbody th{color:var(--sl-color-white);font-weight:700}.cg-swatch{border:1px solid var(--sl-color-hairline);vertical-align:middle;border-radius:.25rem;width:2.6rem;height:1.6rem;display:inline-block}.cg-aa{border:1px solid var(--sl-color-hairline);border-radius:.25rem;padding:.1rem .5rem;font-weight:700;display:inline-block}.cg-mono{font-family:var(--sl-font-mono);font-size:var(--sl-text-xs)}.cg-oklch{color:var(--sl-color-gray-2)}.cg-chip{font-size:var(--sl-text-xs);border:1px solid var(--sl-color-hairline);color:var(--sl-color-gray-2);border-radius:999px;margin-left:.4rem;padding:.05rem .5rem;font-weight:600;display:inline-block}.cg-table td .cg-chip:first-child{margin-left:0}.cg-chip--ok{color:var(--sl-color-green-high);background:var(--sl-color-green-low);border-color:var(--sl-color-green)}.cg-chip--fail{color:var(--sl-color-red-high);background:var(--sl-color-red-low);border-color:var(--sl-color-red)}.cg-chip--role{color:var(--sl-color-text)}@media (width<=40rem){.cg-row,.cg-themes{grid-template-columns:1fr}}