/* Creatures & Heroes V25 — welcome bonus and refined character-sheet proportions. */

.cah-welcome-open {
  overflow: hidden;
}

.cah-welcome-runes-backdrop {
  position: fixed;
  z-index: 1100;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 22px;
  background: rgba(1, 3, 3, .88);
  -webkit-backdrop-filter: blur(9px);
  backdrop-filter: blur(9px);
  animation: cahWelcomeBackdrop .22s ease both;
}

.cah-welcome-runes {
  position: relative;
  isolation: isolate;
  width: min(900px, 100%);
  min-height: 500px;
  overflow: hidden;
  color: #fff3d7;
  border: 1px solid rgba(234, 192, 85, .9);
  border-radius: 22px;
  background:
    linear-gradient(90deg, rgba(2, 5, 4, .96) 0%, rgba(3, 7, 6, .83) 38%, rgba(5, 5, 4, .17) 72%),
    linear-gradient(0deg, rgba(1, 3, 3, .68), transparent 58%),
    url("/rune-store/welcome-battle-v25.webp") center / cover no-repeat;
  box-shadow: 0 36px 110px rgba(0, 0, 0, .82), inset 0 0 0 7px rgba(255, 224, 142, .04);
  animation: cahWelcomeWindow .3s cubic-bezier(.2, .8, .2, 1) both;
}

.cah-welcome-runes::before {
  content: "";
  position: absolute;
  inset: 11px;
  pointer-events: none;
  border: 1px solid rgba(225, 180, 68, .34);
  border-radius: 14px;
}

.cah-welcome-runes__content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  width: min(470px, 62%);
  min-height: 500px;
  padding: clamp(42px, 6vw, 70px);
}

.cah-welcome-runes__eyebrow {
  margin: 0 0 13px;
  color: #f0c85f;
  font: 850 10px/1.2 Inter, Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: .18em;
}

.cah-welcome-runes__gift {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
  padding: 8px 12px;
  color: #1a0e04;
  border: 1px solid #f2d27b;
  border-radius: 999px;
  background: linear-gradient(120deg, #c99935, #f0d586);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .35);
}

.cah-welcome-runes__gift span {
  font-size: 15px;
}

.cah-welcome-runes__gift strong {
  font: 900 20px/1 Inter, Arial, sans-serif;
}

.cah-welcome-runes__gift small {
  font: 850 10px/1 Inter, Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.cah-welcome-runes h2 {
  max-width: 430px;
  margin: 0;
  color: #fff3d5;
  font: 800 clamp(32px, 5vw, 52px)/1.02 Georgia, serif;
  text-shadow: 0 3px 18px rgba(0, 0, 0, .9);
}

.cah-welcome-runes__copy {
  max-width: 420px;
  margin: 17px 0 23px;
  color: #e8deca;
  font: 650 15px/1.55 Inter, Arial, sans-serif;
  text-shadow: 0 2px 12px #000;
}

.cah-welcome-runes button {
  min-height: 44px;
  padding: 12px 18px;
  cursor: pointer;
  color: #160c05;
  border: 1px solid #f2d27b;
  border-radius: 7px;
  background: linear-gradient(120deg, #c99935, #f0d586);
  font: 850 11px/1 Inter, Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: .07em;
}

.cah-welcome-runes button:hover,
.cah-welcome-runes button:focus-visible {
  filter: brightness(1.12);
  transform: translateY(-1px);
}

/* The two spell writing areas on sheet 3 are three times deeper. */
.sheet-layout-3 > :nth-child(2) .sheet-box-body > .codex-field:nth-child(2) textarea {
  min-height: 195px;
}

.sheet-layout-3 > :nth-child(2) .sheet-box-body > .codex-field:nth-child(3) textarea {
  min-height: 295px;
}

@keyframes cahWelcomeBackdrop {
  from { opacity: 0; }
}

@keyframes cahWelcomeWindow {
  from { opacity: 0; transform: translateY(18px) scale(.975); }
}

@media (max-width: 660px) {
  .cah-welcome-runes {
    min-height: 560px;
    background-position: 62% center;
  }

  .cah-welcome-runes__content {
    justify-content: flex-end;
    width: 100%;
    min-height: 560px;
    padding: 50px 28px 35px;
    background: linear-gradient(0deg, rgba(2, 5, 4, .98) 0%, rgba(2, 5, 4, .82) 49%, rgba(2, 5, 4, .12) 82%);
  }
}

@media print {
  /* Give the final row enough room so both lower boxes are fully visible. */
  .cah-print-page[data-page-number="1"] > .sheet-layout-1 {
    grid-template-rows: auto auto auto 430px !important;
  }

  /* Use the remaining height on sheet 2 for the complete character history. */
  .cah-print-page[data-page-number="2"] > .sheet-layout-2 {
    grid-template-rows: 292px 214px 290px 390px !important;
  }

  .cah-welcome-runes-backdrop {
    display: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cah-welcome-runes-backdrop,
  .cah-welcome-runes {
    animation: none;
  }
}
