.sg-specimen{font-size:3.4rem;font-weight:600;letter-spacing:-.03em;line-height:1;color:var(--gray-900);margin:0 0 var(--space-md)}.sg-ramp{margin:0;display:grid;gap:.55rem;max-width:34rem}.sg-ramp>div{display:flex;align-items:baseline;gap:var(--space-md)}.sg-ramp dt{flex:0 0 7.2rem;font-size:var(--text-xs);color:var(--gray-400);letter-spacing:.04em;font-variant-numeric:tabular-nums}.sg-ramp dd{margin:0;color:var(--gray-900);font-weight:600;white-space:nowrap;line-height:1.2}.sg-ramp dd code,.sg-swatches code,.sg-space code,.sg-form code,.rec-archive code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:var(--text-xs);color:var(--gray-400);margin-left:.5rem;font-weight:400}.sg-swatches{list-style:none;margin:0 0 var(--space-md);padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem 1.6rem;max-width:30rem}.sg-swatches li{display:flex;align-items:center;gap:.6rem;font-size:var(--text-sm)}.sg-swatches i{flex:0 0 auto;width:1.6rem;height:1.6rem;border-radius:var(--radius-sm);box-shadow:inset 0 0 0 1px var(--border)}.sg-swatches b{font-weight:600;color:var(--gray-900);font-variant-numeric:tabular-nums}.sg-highlight-demo{font-size:var(--text-lg);color:var(--gray-900);margin:var(--space-md) 0 0;max-width:22rem}.sg-space{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}.sg-space li{display:flex;align-items:center;gap:var(--space-md);font-size:var(--text-sm)}.sg-space b{flex:0 0 7.2rem;font-weight:400;color:var(--gray-400);font-size:var(--text-xs);letter-spacing:.04em}.sg-space i{height:.85rem;background:var(--accent);border-radius:1px}.sg-forms{display:flex;flex-wrap:wrap;gap:var(--space-lg);align-items:flex-start;max-width:30rem}.sg-form{padding:var(--space-md) var(--space-lg);box-shadow:inset 0 0 0 1px var(--border);font-size:var(--text-sm);color:var(--gray-900);background:var(--bg)}.sg-form b{font-weight:600}.sg-form span{display:block;font-size:var(--text-xs);color:var(--gray-400)}.sg-form--pill{padding:.35rem .9rem}.sg-form--lift{box-shadow:var(--elev-1),inset 0 0 0 1px var(--home-ring);border-radius:var(--radius)}.sg-form--lift2{box-shadow:var(--elev-2),inset 0 0 0 1px var(--home-ring);border-radius:var(--radius)}@media (max-width: 48rem){.sg-specimen{font-size:2.4rem}.sg-ramp dd{white-space:normal}.sg-swatches{grid-template-columns:1fr}}