@font-face {
  font-family: 'Allura';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/allura.ttf) format('truetype');
}
@font-face {
  font-family: 'Caveat';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/caveat.ttf) format('truetype');
}
@font-face {
  font-family: 'Dancing Script';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/dancing.ttf) format('truetype');
}
@font-face {
  font-family: 'Satisfy';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/satisfy.ttf) format('truetype');
}

html[data-brand-font=allura]{--brand-font:Allura;--brand-size:36px;--brand-spacing:0px;--brand-weight:400}
html[data-brand-font=satisfy]{--brand-font:Satisfy;--brand-size:29px;--brand-spacing:0px;--brand-weight:400}
html[data-brand-font=dancing]{--brand-font:'Dancing Script';--brand-size:33px;--brand-spacing:0px;--brand-weight:500}
html[data-brand-font=caveat]{--brand-font:Caveat;--brand-size:35px;--brand-spacing:0px;--brand-weight:500}
.brand strong{font-family:var(--brand-font,Georgia);font-size:var(--brand-size,27px);letter-spacing:var(--brand-spacing,-1px);font-weight:var(--brand-weight,700);font-style:normal;line-height:1.15}
html[data-brand-font=original] .brand strong,html:not([data-brand-font]) .brand strong{font-style:italic}
@media(max-width:600px){.brand strong{font-size:calc(var(--brand-size,27px)*.8)}}
.font-lab{max-width:1200px;margin:auto;padding:55px 5%}.font-lab h1{font-size:clamp(38px,5vw,62px);max-width:850px}.font-lab>p{max-width:680px;margin:22px 0}.font-options{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin:35px 0}.font-option{padding:30px;border:1px solid var(--line);border-radius:8px;background:var(--white);color:var(--ink);text-align:left;cursor:pointer;width:100%}.font-option[aria-pressed=true]{outline:3px solid var(--teal);outline-offset:3px}.font-option:hover{background:var(--panel)}.font-option .brand{margin:30px 0;pointer-events:none}.font-option .brand img{width:64px;height:64px}.font-option .brand strong{font-size:45px}.font-option .option-title{font-size:13px;letter-spacing:1px}.font-option p{font-size:13px}.font-option .choice{font-size:12px;display:block;margin-top:20px;color:var(--teal)}.lab-actions{display:flex;gap:15px;flex-wrap:wrap;margin:25px 0}.lab-current{padding:25px;background:var(--panel);position:sticky;top:0;z-index:5;border-radius:5px}.lab-current strong{color:var(--teal)}.font-note{font-size:13px}.font-links{display:flex;gap:20px;flex-wrap:wrap;font-size:12px;margin-top:40px}.font-links a{text-decoration:underline}
@media(max-width:600px){.font-options{grid-template-columns:1fr}.font-option{padding:25px}.font-option .brand strong{font-size:43px}.font-lab{padding-top:35px}.lab-current{font-size:13px;padding:18px}}