@font-face {
  font-family: ShelftopiaV2Poppins;
  src: url("../assets/fonts/Poppins-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: ShelftopiaV2Poppins;
  src: url("../assets/fonts/Poppins-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

:where(html.shelftopia-v2) .dashboard {
  position: relative;
  color: #fff;
  padding-block-start: 5rem;
  /* Only the viewport's lateral crop is intentional. Vertical artwork remains
     free to overlap the copy and the preceding scene. */
  overflow-x: clip;
  overflow-y: visible;
  scroll-margin-block-start: 6rem;
}
:where(html.shelftopia-v2) .dashboard__copy { position: relative; z-index: 2; display: grid; justify-items: center; padding-inline: 1rem; text-align: center; }
:where(html.shelftopia-v2) .dashboard__title {
  margin: 0;
  font-family: "ShelftopiaV2LookingGlass", serif;
  font-weight: 400;
  font-size: 3.75rem;
  line-height: .9;
  letter-spacing: .025em;
  background: linear-gradient(100deg, #ea59af, #7043d7);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
}
:where(html.shelftopia-v2) .dashboard__subhead { margin: 1.875rem 0 0; font-size: 2rem; line-height: 1; font-weight: 600; }
:where(html.shelftopia-v2) .dashboard__signals { list-style: none; margin: 3.875rem 0 0; padding: 0; font-size: 1.25rem; line-height: 1.5; font-weight: 400; }

/* Coordinates come from the original SVG, with the top center of the main door
   as the origin. One scale controls the artwork, preserving the side crops. */
:where(html.shelftopia-v2) .portal-scene { --art-unit: .9px; position: relative; margin-block-start: 2.75rem; block-size: calc(694.6 * var(--art-unit)); }
:where(html.shelftopia-v2) .portal-scene__art { position: absolute; left: calc(50% + var(--x) * var(--art-unit)); top: calc(var(--y) * var(--art-unit)); width: calc(var(--w) * var(--art-unit)); max-width: none; pointer-events: none; }
:where(html.shelftopia-v2) .portal-scene__door-center { z-index: 1; }
:where(html.shelftopia-v2) .portal-scene__invitation { position: absolute; z-index: 3; top: 7.25rem; left: 50%; transform: translateX(-50%); width: 43.75rem; max-width: calc(100% - 2rem); display: grid; align-items: center; }
:where(html.shelftopia-v2) .portal-scene__cloud, :where(html.shelftopia-v2) .portal-scene__message { grid-area: 1 / 1; }
:where(html.shelftopia-v2) .portal-scene__cloud { width: 100%; }
:where(html.shelftopia-v2) .portal-scene__message { position: relative; transform: translateY(.375rem); padding: 1.5rem 3rem; text-align: center; color: #000; }
:where(html.shelftopia-v2) .portal-scene__message h3 { margin: 0 0 .9375rem; color: #6b46cf; font-size: 1.25rem; line-height: 1.2; font-weight: 800; }
:where(html.shelftopia-v2) .portal-scene__message p { margin: 0; font-size: 1rem; line-height: 1.5; font-weight: 500; }

@media (max-width: 64rem) {
  :where(html.shelftopia-v2) .dashboard__signals { font-size: 1rem; }
  :where(html.shelftopia-v2) .portal-scene { --art-unit: .88px; margin-block-start: 4rem; }
  :where(html.shelftopia-v2) .portal-scene__invitation { width: 32.625rem; top: 7.5rem; }
  :where(html.shelftopia-v2) .portal-scene__message { padding-inline: 2rem; }
  :where(html.shelftopia-v2) .portal-scene__message h3 { font-size: 1.125rem; }
  :where(html.shelftopia-v2) .portal-scene__message p { font-size: .875rem; line-height: 1.2; }
}
@media (max-width: 47rem) {
  :where(html.shelftopia-v2) .dashboard__title { font-size: clamp(1.75rem, 6.5vw, 3.5rem); line-height: 1.08; letter-spacing: 0; }
  :where(html.shelftopia-v2) .dashboard__subhead { font-size: clamp(1.125rem, 3.7vw, 2rem); line-height: 1.25; }
}
@media (max-width: 37.5rem) {
  :where(html.shelftopia-v2) .dashboard { padding-block-start: 3rem; }
  :where(html.shelftopia-v2) .dashboard__signals { margin-block-start: 2.5rem; font-size: .875rem; }
  :where(html.shelftopia-v2) .portal-scene { --art-unit: .78px; margin-block-start: 3rem; }
  :where(html.shelftopia-v2) .portal-scene__invitation { top: 6.5rem; max-width: calc(100% - 1rem); }
  :where(html.shelftopia-v2) .portal-scene__cloud { min-height: 11rem; object-fit: fill; }
  :where(html.shelftopia-v2) .portal-scene__message { padding: 1.5rem 2.5rem; }
  :where(html.shelftopia-v2) .portal-scene__message h3 { font-size: 1rem; margin-block-end: .75rem; }
  :where(html.shelftopia-v2) .portal-scene__message p { font-size: .75rem; line-height: 1.4; }
  :where(html.shelftopia-v2) .invitation-break { display: none; }
}
