@font-face {
  font-family: "Exo 2";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/exo-2-v20/exo-2-v20-latin-700.woff2") format("woff2");
}

@font-face {
  font-family: "Exo 2";
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/exo-2-v20/exo-2-v20-latin-700italic.woff2") format("woff2");
}

@font-face {
  font-family: "PT Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/pt-sans-v17/pt-sans-v17-latin-regular.woff2") format("woff2");
}

@font-face {
  font-family: "PT Sans";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/pt-sans-v17/pt-sans-v17-latin-700.woff2") format("woff2");
}

/* The approved prototypes are mounted inside the game's existing modal shell.
   Only the shell contract is adapted here; prototype layout rules stay intact. */
.rds-root[data-upi-screen="party"],
.rds-root[data-upi-screen="pc"],
.rds-root[data-upi-screen="shop"] {
  --rds-popup-width: 1180px;
  --rds-popup-height: 900px;
  padding: clamp(14px, 3vw, 42px);
}

@media (max-width: 860px) {
  .rds-root[data-upi-screen="shop"] {
    padding: 4px;
  }
}

@media (max-width: 600px) {
  .rds-root[data-upi-screen="shop"] {
    padding: 0;
  }
}

.rds-root[data-upi-screen="party"] .rds-shell,
.rds-root[data-upi-screen="pc"] .rds-shell {
  width: min(var(--rds-popup-width), 100%);
  height: min(var(--rds-popup-height), 100%);
  grid-template-rows: minmax(0, 1fr);
  border-color: #3d7897;
  border-radius: 14px;
  background: #041725;
}

.rds-root[data-upi-screen="party"] .rds-shell {
  aspect-ratio: auto;
}

.rds-root[data-upi-screen="pc"] .rds-shell {
  aspect-ratio: auto;
}

.rds-root[data-upi-screen="party"] .rds-header,
.rds-root[data-upi-screen="pc"] .rds-header,
.rds-root[data-upi-screen="party"] .rds-toolbar,
.rds-root[data-upi-screen="pc"] .rds-toolbar {
  display: none;
}

.rds-root[data-upi-screen="party"] .rds-layout,
.rds-root[data-upi-screen="pc"] .rds-layout,
.rds-root[data-upi-screen="party"] .rds-main,
.rds-root[data-upi-screen="pc"] .rds-main,
.rds-root[data-upi-screen="party"] .rds-content,
.rds-root[data-upi-screen="pc"] .rds-content {
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
}

.rds-root[data-upi-screen="party"] .rds-main,
.rds-root[data-upi-screen="pc"] .rds-main {
  display: block;
}

.rds-root[data-upi-screen="party"] .rds-content,
.rds-root[data-upi-screen="pc"] .rds-content {
  padding: 0;
  overflow: hidden;
  background: #041725;
}

.rds-root[data-upi-screen="party"] .panorama-screen {
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
}

.rds-root[data-upi-screen="pc"] .pc-screen {
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
}

.rds-root[data-upi-screen="party"] .panorama-wallet img,
.rds-root[data-upi-screen="pc"] .pc-wallet img,
.rds-root[data-upi-screen="party"] .panorama-settings img,
.rds-root[data-upi-screen="pc"] .pc-icon-button img {
  object-fit: contain;
}

.rds-root[data-upi-screen="party"] .panorama-settings > span,
.rds-root[data-upi-screen="pc"] .pc-icon-button > span {
  color: #d4e8f2;
  font: 400 30px/1 "Segoe UI", sans-serif;
}

.rds-root[data-upi-screen="party"] .panorama-wallet__coin,
.rds-root[data-upi-screen="party"] .panorama-wallet__gem {
  width: 1.75cqw;
  height: 1.75cqw;
}

.rds-root[data-upi-screen="party"] .panorama-settings img {
  width: 2.05cqw;
  height: 2.05cqw;
}

.rds-root[data-upi-screen="party"] .panorama-button img {
  width: 2.35cqw;
  height: 2.35cqw;
}

.rds-root[data-upi-screen="party"] .panorama-button--secondary img {
  width: 1.8cqw;
  height: 1.8cqw;
}

.rds-root[data-upi-screen="pc"] .pc-icon-button img {
  width: 28px;
  height: 28px;
}

.rds-root[data-upi-screen="pc"] .pc-inline-icon {
  width: 20px;
  height: 20px;
  object-fit: contain;
}

.rds-root[data-upi-screen="pc"] .pc-search > .pc-inline-icon {
  width: 18px;
  height: 18px;
}

.rds-root[data-upi-screen="pc"] .pc-slot > .pc-inline-icon {
  width: 26px;
  height: 26px;
}

.rds-root[data-upi-screen="pc"] .pc-locked-divider > .pc-inline-icon {
  width: 24px;
  height: 24px;
}

.rds-root[data-upi-screen="pc"] .pc-transfer-large .pc-inline-icon {
  width: 28px;
  height: 28px;
}

.rds-root[data-upi-screen="party"] .panorama-button:disabled,
.rds-root[data-upi-screen="pc"] button:disabled {
  cursor: not-allowed;
  opacity: .48;
}

@media (max-width: 1180px), (max-height: 760px) {
  .rds-root[data-upi-screen="pc"] .pc-screen--grid {
    grid-template-rows: 64px minmax(0, 1fr) 132px;
    gap: 7px;
    padding: 10px 14px 12px;
  }
  .rds-root[data-upi-screen="pc"] .pc-screen--grid .pc-header {
    margin: -10px -14px 0;
    padding: 7px 18px;
  }
  .rds-root[data-upi-screen="pc"] .pc-grid-main {
    grid-template-columns: 330px minmax(0, 1fr);
    gap: 12px;
  }
  .rds-root[data-upi-screen="pc"] .pc-grid-footer {
    grid-template-columns: minmax(0, 1fr) 220px;
  }
}