body{line-height:var(--ds-leading-body);font-size:var(--ds-text-body)}.lab{max-width:90rem;padding:var(--ds-space-edge);gap:var(--ds-space-7);margin:0 auto;display:grid}.lab-head{gap:var(--ds-space-5);flex-wrap:wrap;justify-content:space-between;align-items:flex-end;display:flex}.lab-head .meta{color:var(--ds-color-muted);font-size:var(--ds-text-hint)}.lab-nav{gap:var(--ds-space-2);flex-wrap:wrap;display:flex}.lab-nav a,.seg button{color:var(--ds-color-muted);padding:var(--ds-space-2) var(--ds-space-4);border:var(--ds-effect-border);border-radius:var(--ds-radius-pill);font-size:var(--ds-text-hint);cursor:pointer;background:0 0;font-family:inherit;text-decoration:none}.lab-nav a:hover,.seg button:hover{color:var(--ds-color-text);background:var(--ds-color-hover)}.seg{gap:var(--ds-space-1);display:inline-flex}.seg button[aria-pressed=true]{color:var(--ds-color-text);background:var(--ds-color-on)}section.block{gap:var(--ds-space-5);scroll-margin-top:var(--ds-space-5);display:grid}h2.sec{font-size:var(--ds-text-name);letter-spacing:var(--ds-tracking-name);padding-top:var(--ds-space-5);border-top:var(--ds-effect-border);margin:0}h3{font-size:var(--ds-text-readout);font-weight:var(--ds-weight-medium);color:var(--ds-color-text);margin:0}p.note{color:var(--ds-color-muted);font-size:var(--ds-text-hint);max-width:60rem;margin:0}.grid{gap:var(--ds-space-4);grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));display:grid}.card{border:var(--ds-effect-border);border-radius:var(--ds-radius-lg);padding:var(--ds-space-4);gap:var(--ds-space-2);background:var(--ds-color-glass);align-content:start;display:grid}.swatch{border-radius:var(--ds-radius-sm);border:var(--ds-effect-border);place-items:center;height:5rem;display:grid}.swatch.tall{height:7rem}.swatch svg{width:3.5rem;height:3.5rem;overflow:visible}.card .name{font-weight:var(--ds-weight-bold)}.card .var,.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:var(--ds-text-kicker);color:var(--ds-color-muted);word-break:break-all}.card .meaning{color:var(--ds-color-text-body);font-size:var(--ds-text-hint)}.tag{font-size:var(--ds-text-kicker);padding:0 var(--ds-space-2);border-radius:var(--ds-radius-pill);border:var(--ds-effect-border);color:var(--ds-color-muted);width:-moz-fit-content;width:fit-content;display:inline-block}.tag.proposed{color:var(--ds-color-accent);border-color:var(--ds-color-accent)}.ratio.pass{color:var(--ds-color-text)}.ratio.fail{color:var(--ds-color-heat);font-weight:var(--ds-weight-bold)}table{border-collapse:collapse;width:100%;font-size:var(--ds-text-hint)}th,td{text-align:left;padding:var(--ds-space-2) var(--ds-space-3);border-bottom:var(--ds-effect-border);vertical-align:top}th{color:var(--ds-color-muted);font-weight:var(--ds-weight-medium)}td.n,th.n{text-align:right}.tablewrap{overflow-x:auto}.cvd{gap:var(--ds-space-2);font-size:var(--ds-text-hint);color:var(--ds-color-muted);grid-template-columns:auto repeat(5,minmax(4rem,1fr));align-items:center;display:grid}.cvd .chip{border-radius:var(--ds-radius-sm);border:var(--ds-effect-border);height:2.5rem}.type-row{gap:var(--ds-space-4);padding:var(--ds-space-3) 0;border-bottom:var(--ds-effect-border);grid-template-columns:11rem 1fr;align-items:baseline;display:grid}.type-row .mono{word-break:normal}.type-row .sample{overflow-wrap:anywhere}.bars{gap:var(--ds-space-2);display:grid}.bar{align-items:center;gap:var(--ds-space-3);display:flex}.bar i{background:var(--ds-color-text);border-radius:2px;height:.75rem;display:block}.radii{gap:var(--ds-space-4);flex-wrap:wrap;display:flex}.radii div{border:var(--ds-effect-border);background:var(--ds-color-glass);width:7rem;height:5rem;font-size:var(--ds-text-kicker);color:var(--ds-color-muted);place-items:center;display:grid}.stripes{background:repeating-linear-gradient(135deg, transparent 0 1.25rem, var(--ds-color-line) 1.25rem 1.375rem);border-radius:var(--ds-radius-lg);padding:var(--ds-space-5);border:var(--ds-effect-border)}.glassdemo{padding:var(--ds-space-4) var(--ds-space-5);width:-moz-fit-content;width:fit-content}.ease{border:var(--ds-effect-border);border-radius:var(--ds-radius-pill);height:3rem;position:relative}.ease i{background:var(--ds-color-accent);width:2rem;height:2rem;transition:left var(--ds-motion-spotlight) var(--ds-motion-ease-standard);border-radius:50%;position:absolute;top:.5rem;left:.5rem}.ease.go i{left:calc(100% - 2.5rem)}.states{gap:var(--ds-space-6);display:grid}.row{gap:var(--ds-space-3);display:grid}.cells{gap:var(--ds-space-4);flex-wrap:wrap;align-items:flex-start;display:flex}.cell{gap:var(--ds-space-2);padding:var(--ds-space-4);border-radius:var(--ds-radius-lg);border:var(--ds-effect-border);background:repeating-linear-gradient(135deg, transparent 0 1.25rem, var(--ds-color-line) 1.25rem 1.375rem);justify-items:start;min-width:0;max-width:100%;display:grid}.cell>.cap{font-size:var(--ds-text-kicker);color:var(--ds-color-muted);text-transform:uppercase;letter-spacing:var(--ds-tracking-caps)}.cell .stack,.focus-demo{gap:var(--ds-space-4);flex-wrap:wrap;align-items:center;display:flex}.focus-demo button,.focus-demo a{color:var(--ds-color-text);padding:var(--ds-space-3) var(--ds-space-5);border:var(--ds-effect-border);border-radius:var(--ds-radius-pill);background:var(--ds-color-glass);font:inherit;font-size:var(--ds-text-hint);text-decoration:none}.focus-demo .forced{outline:var(--ds-size-focus-width) solid var(--ds-color-focus);outline-offset:var(--ds-size-focus-offset)}.shell{aspect-ratio:16/9;border:var(--ds-effect-border);border-radius:var(--ds-radius-lg);background:radial-gradient(ellipse 70% 60% at 55% 45%, var(--ds-color-line), transparent 70%), var(--ds-color-bg);min-height:34rem;position:relative;overflow:hidden;container-type:inline-size}.shell .placeholder{color:var(--ds-color-faint);font-size:var(--ds-text-hint);letter-spacing:var(--ds-tracking-caps);text-transform:uppercase;pointer-events:none;place-items:center;display:grid;position:absolute;inset:0}.shell .tl{top:var(--ds-space-edge);left:var(--ds-space-edge);gap:var(--ds-space-3);justify-items:start;display:grid;position:absolute}.shell .tr{top:var(--ds-space-edge);right:var(--ds-space-edge);position:absolute}.shell .bottom{left:var(--ds-space-edge);right:var(--ds-space-edge);bottom:var(--ds-space-edge);gap:var(--ds-space-5);grid-template-columns:auto 1fr;align-items:end;display:grid;position:absolute}.shell .bottom ds-playback-dock{justify-self:end}@container (width>=1500px){.shell .bottom{grid-template-columns:1fr auto 1fr}.shell .bottom ds-playback-dock{grid-column:2;justify-self:center}}.shell ds-step-marker{position:absolute;transform:translate(-50%,-50%)}
