/* Font studies are opt-in through the preview URL. */
html[data-type="invitation"] { --mono: 'Times New Roman', Times, serif; }
html[data-type="invitation"] body { font-family: 'Times New Roman', Times, serif; }
html[data-type="invitation"] h2 { font-family: 'Times New Roman', Times, serif; font-size: clamp(38px, 4.4vw, 68px); text-transform: uppercase; letter-spacing: -.025em; line-height: 1.02; }
html[data-type="invitation"] .brand { font-family: 'Times New Roman', Times, serif; font-size: 20px; text-transform: uppercase; letter-spacing: -.025em; }
html[data-type="invitation"] .links a { font-family: 'Times New Roman', Times, serif; font-size: 16px; }
html[data-type="invitation"] summary { font-family: 'Times New Roman', Times, serif; font-size: 19px; }
html[data-type="invitation"] .invite-heading,
html[data-type="invitation"] .section-label,
html[data-type="invitation"] .tag { font-size: 13px; text-transform: uppercase; letter-spacing: .025em; }
html[data-type="invitation"] .navigation-meta { font-size: 15px; }
html[data-type="invitation"] .invite-when,
html[data-type="invitation"] .invite-where { text-transform: uppercase; }
html[data-type="invitation"] .coming h2 { font-size: clamp(36px, 3.7vw, 56px); }

html[data-type="editorial"] body { font-family: Baskerville, 'Palatino Linotype', 'Book Antiqua', Palatino, Georgia, serif; }
html[data-type="editorial"] h2 { font-family: Baskerville, 'Palatino Linotype', 'Book Antiqua', Palatino, Georgia, serif; font-style: italic; font-size: clamp(48px, 5.3vw, 84px); font-weight: 400; letter-spacing: -.035em; line-height: 1.02; }
html[data-type="editorial"] .brand { font-size: 27px; letter-spacing: -.035em; }
html[data-type="editorial"] .coming h2 { font-size: clamp(40px, 4vw, 62px); }
html[data-type="editorial"] .invite-when,
html[data-type="editorial"] .invite-where { font-size: 15px; }

html[data-type-preview="true"] body { padding-bottom: 170px; }
.type-preview { position: fixed; z-index: 20; left: calc(var(--rail) + var(--gutter)); right: var(--gutter); bottom: 16px; max-width: 1100px; padding: 14px 16px 12px; border: 1px solid var(--ink); background: #fff; color: var(--ink); box-shadow: 0 4px 24px #0000000d; font: 12px/1.35 Arial, Helvetica, sans-serif; }
.type-preview-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 8px; }
.type-preview-heading > span { color: var(--muted); }
.type-preview-heading > a { display: inline-flex; align-items: center; min-height: 30px; gap: 12px; }
.type-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.type-option { display: flex; flex-direction: column; justify-content: center; gap: 5px; min-height: 64px; padding: 10px; border: 1px solid var(--rule); text-decoration: none; }
.type-option small { font: 10px/1.3 Arial, Helvetica, sans-serif; color: var(--muted); }
.type-option[aria-current="true"] { border-color: var(--blue); color: var(--blue); background: #2010fa05; }
.type-option[data-type-option="invitation"] > span { font: 15px/1.2 'Times New Roman', Times, serif; }
.type-option[data-type-option="editorial"] > span { font: italic 16px/1.2 Baskerville, 'Palatino Linotype', Palatino, Georgia, serif; }
.type-option[data-type-option="gallery"] > span { font: 13px/1.2 Arial, Helvetica, sans-serif; }

@media (max-width: 850px) {
  .type-preview { left: 16px; right: 16px; }
  html[data-type="invitation"] h2 { font-size: clamp(38px, 7.2vw, 58px); }
  html[data-type="editorial"] h2 { font-size: clamp(46px, 8vw, 68px); }
  html[data-type="editorial"] .coming h2 { font-size: clamp(40px, 6vw, 54px); }
}

@media (max-width: 600px) {
  html[data-type="invitation"] .invite-heading { font-size: 11px; }
  html[data-type="invitation"] .section-label { font-size: 12px; }
  html[data-type="invitation"] .brand { font-size: 21px; }
  html[data-type="editorial"] .brand { font-size: 25px; }
  .type-preview { left: 10px; right: 10px; bottom: 10px; padding: 10px; }
  .type-options { gap: 5px; }
  .type-option { min-height: 78px; padding: 8px; }
  .type-option[data-type-option] > span { font-size: 13px; }
  .type-option small { font-size: 9px; }
}

@media print {
  .type-preview { display: none !important; }
  html[data-type-preview="true"] body { padding-bottom: 0; }
}
