:root {
  --ohlala-ivory: #F8F4EE;
  --ohlala-navy: #1F3F73;
  --ohlala-gold: #C7925A;
  --ohlala-gold-hover: #B37A47;
  --ohlala-charcoal: #2E2E2E;
}
html.ohlala-cs-exact-html,
.ohlala-cs-exact-body {
  margin: 0;
  padding: 0;
  min-height: 100%;
  width: 100%;
  overflow-x: hidden;
  background: var(--ohlala-ivory);
}
.ohlala-cs-exact-body * { box-sizing: border-box; }
.ohlala-cs-exact-page {
  margin: 0;
  min-height: 100vh;
  background: var(--ohlala-ivory);
}
.ohlala-cs-exact-stage {
  position: relative;
  width: 100vw;
  max-width: none;
  margin: 0;
  line-height: 0;
  background: var(--ohlala-ivory);
}
.ohlala-cs-exact-art {
  display: block;
  width: 100vw;
  max-width: none;
  height: auto;
  user-select: none;
}
.ohlala-cs-exact-form {
  position: absolute;
  inset: 0;
  margin: 0;
  padding: 0;
  pointer-events: none;
}
.ohlala-cs-exact-email,
.ohlala-cs-exact-button {
  position: absolute;
  pointer-events: auto;
  border-radius: 4px;
}
.ohlala-cs-exact-email {
  left: 5.08%;
  top: 81.82%;
  width: 23.05%;
  height: 3.18%;
  border: 0;
  background: transparent;
  padding: 0 1.7%;
  color: var(--ohlala-charcoal);
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(12px, 1.45vw, 16px);
  line-height: 1.1;
  outline: none;
}
.ohlala-cs-exact-email::placeholder { color: transparent; }
.ohlala-cs-exact-email:focus {
  outline: 2px solid rgba(199,146,90,.55);
  outline-offset: 2px;
  background: rgba(255,255,255,.34);
}
.ohlala-cs-exact-button {
  left: 29.55%;
  top: 81.82%;
  width: 13.75%;
  height: 3.18%;
  border: 0;
  background: transparent;
  cursor: pointer;
  outline: none;
  padding: 0;
}
.ohlala-cs-exact-button span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}
.ohlala-cs-exact-button:hover,
.ohlala-cs-exact-button:focus {
  outline: 2px solid rgba(255,255,255,.9);
  outline-offset: -3px;
  background: rgba(179,122,71,.18);
}
.ohlala-cs-exact-hp { display: none !important; }
.ohlala-cs-exact-message {
  position: absolute;
  left: 5.08%;
  top: 85.35%;
  width: 38%;
  min-height: 26px;
  padding: 7px 10px;
  line-height: 1.25;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(12px, 1.5vw, 17px);
  border: 1px solid currentColor;
  border-radius: 4px;
  background: rgba(255,255,255,.82);
  z-index: 3;
}
.ohlala-cs-exact-message.success { color: #335f3a; }
.ohlala-cs-exact-message.error { color: #8a362c; }
.ohlala-cs-exact-socials {
  position: absolute;
  inset: 0;
  pointer-events: none;
  line-height: 0;
}
.ohlala-cs-exact-social {
  position: absolute;
  pointer-events: auto;
  width: 4.25%;
  height: 2.85%;
  min-width: 30px;
  min-height: 30px;
  border-radius: 50%;
  text-decoration: none;
  background: transparent;
  outline: none;
}
.ohlala-cs-exact-social.instagram { left: 77.95%; top: 96.62%; }
.ohlala-cs-exact-social.facebook { left: 83.80%; top: 96.62%; }
.ohlala-cs-exact-social.email { left: 89.65%; top: 96.62%; }
.ohlala-cs-exact-social:hover,
.ohlala-cs-exact-social:focus {
  box-shadow: 0 0 0 3px rgba(199,146,90,.75), 0 0 0 6px rgba(255,255,255,.8);
}
.ohlala-cs-exact-page .screen-reader-text {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.admin-bar .ohlala-cs-exact-page { min-height: calc(100vh - 32px); }
@media (max-width: 782px) {
  .admin-bar .ohlala-cs-exact-page { min-height: calc(100vh - 46px); }
}
@media (max-width: 520px) {
  .ohlala-cs-exact-email { font-size: 11px; padding-left: 1.2%; padding-right: 1.2%; }
  .ohlala-cs-exact-message { top: 85.2%; width: 46%; font-size: 11px; }
  .ohlala-cs-exact-social { min-width: 24px; min-height: 24px; }
}

/* Desktop/laptop: keep one-inch beige margins on the artwork.
   Tablet and mobile stay full-width/full-screen. */
@media (min-width: 1025px) {
  html.ohlala-cs-exact-html,
  .ohlala-cs-exact-body,
  .ohlala-cs-exact-page {
    background: var(--ohlala-ivory) !important;
  }
  .ohlala-cs-exact-stage {
    width: calc(100vw - 2in);
    max-width: calc(100vw - 2in);
    margin-left: 1in;
    margin-right: 1in;
  }
  .ohlala-cs-exact-art {
    width: 100%;
    max-width: 100%;
  }
}