:root{
  --ground:#E9E9E6;
  --surface:#FFFFFF;
  --sunken:#DEDEDB;
  --ink:#141518;
  --muted:#5E6268;
  --rule:#C9CBCF;
  --edge:#7C7E82;
  --draw:#7C7E82;
  --aspect-harmonious:#2C5A4C;
  --aspect-tense:#8C3B36;
  --aspect-neutral:#6A5C3E;
  --aspect-minor:#5D5A73;
  --chord-alpha:0.72;
  --danger-edge:#D43F5F; --danger-fill:#ECD1D3; --danger-mark:#B31945;
  --caution-edge:#A6692F; --caution-fill:#E8D3C5; --caution-mark:#874E14;
  --affirm-edge:#318744; --affirm-fill:#CADCCB; --affirm-mark:#086B2A;
  --strong-edge:#141518; --strong-fill:#141518; --strong-mark:#FFFFFF;
  --plain-edge:#7C7E82; --plain-fill:#FFFFFF; --plain-mark:#141518;
  --quiet-edge:#C9CBCF; --quiet-fill:#E9E9E6; --quiet-mark:#5E6268;

  --font-serif:'PT Serif', Georgia, 'Times New Roman', serif;
  --font-mono:'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --t-micro:11px; --t-micro-lh:1.25; --t-micro-ls:0;
  --t-caption:13px; --t-caption-lh:1.6; --t-caption-ls:0;
  --t-body:16px; --t-body-lh:1.6; --t-body-ls:0;
  --t-lead:19px; --t-lead-lh:1.4; --t-lead-ls:0;
  --t-title:23px; --t-title-lh:1.25; --t-title-ls:-.005em;
  --t-display:33px; --t-display-lh:1.12; --t-display-ls:-.015em;
  --t-hero:40px; --t-hero-lh:1.02; --t-hero-ls:-.01em;
  --s-0:2px;
  --s-1:4px;
  --s-2:8px;
  --s-3:12px;
  --s-4:16px;
  --s-5:20px;
  --s-6:24px;
  --s-7:32px;
  --s-8:40px;
  --s-9:56px;
  --s-10:72px;
  --r-none:0;
  --r-sm:3px;
  --r-md:8px;
  --m-fast:120ms;
  --m-base:200ms;
  --m-slow:320ms;
  --m-ease:cubic-bezier(.2,0,0,1);
  --tap-min:44px;
  --role-edge:var(--plain-edge);--role-fill:var(--plain-fill);--role-mark:var(--plain-mark);
}

@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --ground:#0F1113;
  --surface:#1C1F23;
  --sunken:#0A0C0D;
  --ink:#EDEEF0;
  --muted:#93979E;
  --rule:#2B2E33;
  --edge:#66696E;
  --draw:#66696E;
  --aspect-harmonious:#86BC9C;
  --aspect-tense:#E09287;
  --aspect-neutral:#BFAE7E;
  --aspect-minor:#ABA6C2;
  --chord-alpha:0.55;
  --danger-edge:#D43F5F; --danger-fill:#3B2729; --danger-mark:#F9627D;
  --caution-edge:#A6692F; --caution-fill:#37291E; --caution-mark:#C68549;
  --affirm-edge:#318744; --affirm-fill:#222F23; --affirm-mark:#53A761;
  --strong-edge:#EDEEF0; --strong-fill:#EDEEF0; --strong-mark:#1C1F23;
  --plain-edge:#66696E; --plain-fill:#1C1F23; --plain-mark:#EDEEF0;
  --quiet-edge:#2B2E33; --quiet-fill:#0F1113; --quiet-mark:#93979E;
}}

:root[data-theme="dark"]{
  --ground:#0F1113;
  --surface:#1C1F23;
  --sunken:#0A0C0D;
  --ink:#EDEEF0;
  --muted:#93979E;
  --rule:#2B2E33;
  --edge:#66696E;
  --draw:#66696E;
  --aspect-harmonious:#86BC9C;
  --aspect-tense:#E09287;
  --aspect-neutral:#BFAE7E;
  --aspect-minor:#ABA6C2;
  --chord-alpha:0.55;
  --danger-edge:#D43F5F; --danger-fill:#3B2729; --danger-mark:#F9627D;
  --caution-edge:#A6692F; --caution-fill:#37291E; --caution-mark:#C68549;
  --affirm-edge:#318744; --affirm-fill:#222F23; --affirm-mark:#53A761;
  --strong-edge:#EDEEF0; --strong-fill:#EDEEF0; --strong-mark:#1C1F23;
  --plain-edge:#66696E; --plain-fill:#1C1F23; --plain-mark:#EDEEF0;
  --quiet-edge:#2B2E33; --quiet-fill:#0F1113; --quiet-mark:#93979E;
}

.night{
  --ground:#0F1113;
  --surface:#1C1F23;
  --sunken:#0A0C0D;
  --ink:#EDEEF0;
  --muted:#93979E;
  --rule:#2B2E33;
  --edge:#66696E;
  --draw:#66696E;
  --aspect-harmonious:#86BC9C;
  --aspect-tense:#E09287;
  --aspect-neutral:#BFAE7E;
  --aspect-minor:#ABA6C2;
  --chord-alpha:0.55;
  --danger-edge:#D43F5F; --danger-fill:#3B2729; --danger-mark:#F9627D;
  --caution-edge:#A6692F; --caution-fill:#37291E; --caution-mark:#C68549;
  --affirm-edge:#318744; --affirm-fill:#222F23; --affirm-mark:#53A761;
  --strong-edge:#EDEEF0; --strong-fill:#EDEEF0; --strong-mark:#1C1F23;
  --plain-edge:#66696E; --plain-fill:#1C1F23; --plain-mark:#EDEEF0;
  --quiet-edge:#2B2E33; --quiet-fill:#0F1113; --quiet-mark:#93979E;
  background:var(--ground); color:var(--ink);
}

html,body{background:var(--ground);color:var(--ink)}
body{font-family:var(--font-serif);font-size:var(--t-body);
  line-height:var(--t-body-lh);-webkit-font-smoothing:antialiased;margin:0}

.t-micro{font-size:var(--t-micro);line-height:var(--t-micro-lh);letter-spacing:var(--t-micro-ls);}
.t-caption{font-size:var(--t-caption);line-height:var(--t-caption-lh);letter-spacing:var(--t-caption-ls);}
.t-body{font-size:var(--t-body);line-height:var(--t-body-lh);letter-spacing:var(--t-body-ls);}
.t-lead{font-size:var(--t-lead);line-height:var(--t-lead-lh);letter-spacing:var(--t-lead-ls);}
.t-title{font-size:var(--t-title);line-height:var(--t-title-lh);letter-spacing:var(--t-title-ls);}
.t-display{font-size:var(--t-display);line-height:var(--t-display-lh);letter-spacing:var(--t-display-ls);}
.t-hero{font-size:var(--t-hero);line-height:var(--t-hero-lh);letter-spacing:var(--t-hero-ls);}

.label{font-family:var(--font-mono);letter-spacing:.10em;text-transform:uppercase;}
.figure{font-family:var(--font-mono);letter-spacing:.04em;font-variant-numeric:tabular-nums;white-space:nowrap;}

.measure{max-width:66ch}

button,a,[role=button],input,select,summary{min-height:var(--tap-min)}
button,input,select,textarea{font:inherit;letter-spacing:inherit}
h1,h2,h3,h4,h5,h6,b,strong,th{font-weight:400}
i,em,cite,dfn,var,address{font-style:normal}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}

.surface{background:var(--surface)}
.sunken{background:var(--sunken)}
.rule{border:0;border-top:1px solid var(--rule)}

.aspect-harmonious{color:var(--aspect-harmonious)}
.aspect-tense{color:var(--aspect-tense)}
.aspect-neutral{color:var(--aspect-neutral)}
.aspect-minor{color:var(--aspect-minor)}

.danger{--role-edge:var(--danger-edge);--role-fill:var(--danger-fill);--role-mark:var(--danger-mark);}
.caution{--role-edge:var(--caution-edge);--role-fill:var(--caution-fill);--role-mark:var(--caution-mark);}
.affirm{--role-edge:var(--affirm-edge);--role-fill:var(--affirm-fill);--role-mark:var(--affirm-mark);}
.strong{--role-edge:var(--strong-edge);--role-fill:var(--strong-fill);--role-mark:var(--strong-mark);}
.plain{--role-edge:var(--plain-edge);--role-fill:var(--plain-fill);--role-mark:var(--plain-mark);}
.quiet{--role-edge:var(--quiet-edge);--role-fill:var(--quiet-fill);--role-mark:var(--quiet-mark);}
.mark{color:var(--role-mark)}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}