/* Owner text-size settings change lettering, while images and spacing keep their proportions. */
:root { --site-type-scale: var(--site-type-phone, 1); }
@media screen and (min-width: 761px) and (max-width: 1100px) {
  :root { --site-type-scale: var(--site-type-tablet, 1); }
}
@media screen and (min-width: 1101px) {
  :root { --site-type-scale: var(--site-type-desktop, 1); }
}

/* Allow longer lines to wrap when the selected screen's text has been enlarged. */
@media screen and (max-width: 760px) {
  html[data-type-phone-enlarged="true"] #main :is(.button, .text-link) { white-space: normal; overflow-wrap: anywhere; }
  html[data-type-phone-enlarged="true"] :is(h1,h2,h3,.brand>span,.brand small) { overflow-wrap: anywhere; }
}
@media screen and (min-width: 761px) and (max-width: 1100px) {
  html[data-type-tablet-enlarged="true"] #main :is(.button, .text-link) { white-space: normal; overflow-wrap: anywhere; }
  html[data-type-tablet-enlarged="true"] :is(h1,h2,h3,.brand>span,.brand small) { overflow-wrap: anywhere; }
}
@media screen and (min-width: 1101px) {
  html[data-type-desktop-enlarged="true"] #main :is(.button, .text-link) { white-space: normal; overflow-wrap: anywhere; }
  html[data-type-desktop-enlarged="true"] :is(h1,h2,h3,.brand>span,.brand small) { overflow-wrap: anywhere; }
}

/* The expanded desktop menu needs more room when its text grows. */
@media screen and (min-width: 1421px) and (max-width: 1800px) {
  html[data-type-desktop-enlarged="true"] .site-header .menu-toggle { display: flex; align-items: center; background: transparent; }
  html[data-type-desktop-enlarged="true"] .site-header nav { display: none; position: absolute; top: 100%; left: 0; right: 0; padding: 20px 35px 28px; background: #1d1c1f; border-bottom: 1px solid #806744; box-shadow: 0 14px 24px #0003; max-height: calc(100dvh - 116px); overflow: auto; }
  html[data-type-desktop-enlarged="true"] .site-header nav.is-open { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 0 20px; }
  html[data-type-desktop-enlarged="true"] .site-header nav > a { white-space: normal; min-height: 48px; padding: 16px 10px; }
  html[data-type-desktop-enlarged="true"] .site-header nav > :is(.nav-watch,.nav-give) { margin-top: 15px; }
}
@media print { :root { --site-type-scale: 1; } }
