@font-face {
  font-family: "UnifontExMono";
  src: url("fonts/UnifontExMono.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "DungGeunMo";
  src: url("fonts/DungGeunMo.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Alagard";
  src: url("fonts/alagard.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
body {
  font-family: "UnifontExMono", sans-serif;
  -webkit-font-smoothing: auto;
}
code, pre, kbd, samp { font-family: "DungGeunMo", monospace; }
.brand small, .eyebrow, .side-note, .art-caption span:first-child,
.seal, .enter-note, footer > span:last-child {
  font-family: "DungGeunMo", monospace;
  font-weight: 400;
  -webkit-font-smoothing: auto;
}
h1, h2, .brand {
  font-family: "Alagard", "UnifontExMono", sans-serif;
  font-weight: 400;
}
.hanja, .seal { font-family: "UnifontExMono", sans-serif; }
.brand-mark { font-family: "DungGeunMo", monospace; }
.brand {font-size: 29px; letter-spacing: 1px;}
.brand small {font-size: 12px; letter-spacing: 1px; margin-top: 7px;}
.header-note {font-size: 14px; letter-spacing: 1px;}
.motion-toggle {font-size: 14px; letter-spacing: 0;}
.eyebrow {font-size: 12px; letter-spacing: 2px;}
h1 {font-size: clamp(36px, 4.5vw, 62px); letter-spacing: 1px; line-height: 1.2;}
.subtitle {font-size: 16px; letter-spacing: 1px;}
.side-note {font-size: 12px;}
.art-caption span:first-child {font-size: 16px; letter-spacing: 2px;}
.art-caption span:last-child {font-size: 12px; letter-spacing: 1px;}
.welcome > p:first-child {font-size: 16px; line-height: 1.7; letter-spacing: 0;}
.welcome [lang="ko"] {font-size: 14px;}
.enter-button {font-size: 18px; letter-spacing: 1px;}
.enter-note {font-size: 11px; letter-spacing: 1px;}
footer {font-size: 12px; letter-spacing: 0;}
footer > span:last-child {font-size: 11px; letter-spacing: 1px;}
h2 {font-size: 34px;}
.dialog-inner > p:not(.eyebrow) {font-size: 16px; line-height: 1.65;}
.dialog-inner .enter-button {font-size: 16px;}
@media(max-width:700px) {
  .brand {font-size: 24px;}
  .brand small {font-size: 10px; letter-spacing: 0;}
  .motion-toggle {font-size: 12px; padding-left: 6px;}
  .eyebrow {font-size: 10px; letter-spacing: 1px;}
  h1 {font-size: clamp(34px, 8vw, 46px); line-height: 1.1; max-width: 490px; margin: 23px auto 16px;}
  h1 span {display: block;}
  .subtitle {font-size: 13px; letter-spacing: 0;}
  .art-caption span:first-child {font-size: 14px;}
  footer > span:last-child {font-size: 10px; letter-spacing: 0;}
  h2 {font-size: 28px;}
  .dialog-inner > p:not(.eyebrow) {font-size: 14px;}
}