/* The welcome has its own visual scope; existing model/settings screens stay unchanged. */
html:not(.cv-desktop-mode) #welcomeOverlay.cv-welcome-cinematic {
  display: none !important;
}
html:not(.cv-desktop-mode) body.welcome-open #welcomeOverlay.cv-welcome-cinematic:not(.hidden) {
  --cv-welcome-top: max(28px, env(safe-area-inset-top, 0px));
  display: block !important;
  position: fixed !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  scrollbar-gutter: auto !important;
  background: #080806 !important;
  color: #f8f6ef;
  transform: none !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  -webkit-overflow-scrolling: touch;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
html:not(.cv-desktop-mode) body.welcome-open.cv-telegram-expanded #welcomeOverlay.cv-welcome-cinematic {
  --cv-welcome-top: calc(var(--cv-fullscreen-safe-top, 104px) + 12px);
}
@supports (height: 100dvh) {
  html:not(.cv-desktop-mode) body.welcome-open #welcomeOverlay.cv-welcome-cinematic:not(.hidden) { height: 100dvh !important; }
}
#welcomeOverlay.cv-welcome-cinematic * { box-sizing: border-box; }
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-shell {
  width: min(100%, 520px);
  min-height: 100vh;
  min-height: 100svh;
  justify-content: center;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  background: #080806;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-hero {
  position: relative;
  isolation: isolate;
  flex: 1 0 auto;
  min-height: 390px;
  min-height: max(calc(var(--cv-welcome-top, 28px) + 240px), min(680px, calc(100svh - 316px - env(safe-area-inset-bottom, 0px))));
  max-height: 760px;
  overflow: hidden;
  background: #201c12;
}
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 38%;
  z-index: -2;
}
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(90deg, rgb(0 0 0 / .28), transparent 80%), linear-gradient(0deg, #080806, transparent 24%, transparent 76%, rgb(0 0 0 / .2));
}
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-brand {
  position: absolute;
  top: var(--cv-welcome-top, 28px);
  left: 8%;
  display: flex;
  align-items: center;
  gap: 11px;
  color: #faf9f6;
  text-shadow: 0 1px 10px #0008;
}
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-logo {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border: 1px solid #f6d890;
  border-radius: 14px;
  background: linear-gradient(115deg, #f6d87e, #c79842);
  color: #0c0b07;
  font-size: 17px;
  font-weight: 800;
  text-shadow: none;
  letter-spacing: -.8px;
}
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-brand b { display: block; font-size: 21px; line-height: 1.15; letter-spacing: -.7px; font-weight: 750; }
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-brand small { display: block; margin-top: 3px; color: #cbc9c2; font-size: 11px; line-height: 1.2; font-weight: 500; }
#welcomeOverlay.cv-welcome-cinematic #cvWelcomeTitle {
  position: absolute;
  left: 8%;
  right: 5%;
  top: max(calc(var(--cv-welcome-top, 28px) + 72px), 47%);
  margin: 0 !important;
  max-width: none !important;
  padding: 0;
  color: #fffdf7;
  font-size: clamp(30px, 8.8vw, 44px) !important;
  font-weight: 800;
  line-height: 1.07 !important;
  letter-spacing: -.045em !important;
  text-align: left;
  text-shadow: 0 2px 22px #0007;
}
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-title span { color: #fbe5a1; }
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-marquee {
  flex: 0 0 auto;
  width: 100%;
  border-block: 1px solid rgb(220 180 86 / .09);
  background: linear-gradient(90deg, #080806, #14120b 50%, #080806);
  overflow: hidden;
}
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-marquee-toggle {
  display: block;
  width: 100%;
  min-height: 46px;
  border: 0;
  border-radius: 0;
  padding: 0;
  margin: 0;
  overflow: hidden;
  background: transparent;
  color: #e8d8ab;
  text-align: left;
  cursor: pointer;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent);
}
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-track {
  display: flex;
  width: max-content;
  animation: cv-welcome-models-loop var(--cv-marquee-duration, 40s) linear infinite;
  animation-play-state: paused;
}
#welcomeOverlay.cv-welcome-cinematic[data-marquee-running="true"] .cv-cinematic-track { animation-play-state: running; }
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-models { display: flex; align-items: center; flex: 0 0 auto; }
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-models > span {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  white-space: nowrap;
  font: 500 14px/46px Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: -.2px;
}
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-models > span::after {
  content: "";
  width: 3px;
  height: 3px;
  margin-inline: 17px;
  transform: rotate(45deg);
  background: #b49a5e;
}
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-footer { flex: 0 0 auto; padding: 20px max(5.5%, env(safe-area-inset-right, 0px)) max(24px, env(safe-area-inset-bottom, 0px)) max(5.5%, env(safe-area-inset-left, 0px)); }
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-actions { display: grid; gap: 11px; }
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-entry {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) 22px;
  align-items: center;
  gap: 19px;
  width: 100%;
  min-height: 82px;
  padding: 15px 19px;
  margin: 0;
  border: 1px solid #8e7948;
  border-radius: 13px;
  background: linear-gradient(130deg, #292316 0%, #15130e 65%, #0e0e0a);
  box-shadow: inset 0 1px 0 rgb(255 237 170 / .08);
  color: #f2d58e;
  font-family: inherit;
  text-align: left;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: border-color 160ms ease, background-color 160ms ease;
}
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-entry:first-child { border-color: #d0b477; }
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-entry:active { background: #302818; border-color: #f7db93; }
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-entry-icon { display: block; width: 32px; height: 32px; }
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-arrow { display: block; width: 22px; height: 22px; }
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-entry-copy { min-width: 0; }
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-entry-copy b { display: block; font-size: 22px; line-height: 1.15; font-weight: 750; letter-spacing: -.65px; color: #faf8f2; }
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-entry-copy small { display: block; font-size: 12px; line-height: 1.45; margin-top: 5px; color: #bdbab2; font-weight: 400; }
#welcomeOverlay.cv-welcome-cinematic button:focus-visible { outline: 2px solid #f6d891; outline-offset: -4px; }
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-bonus {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  margin: 26px 0 0;
  padding: 0;
  border: 0;
  background: none;
  color: #bdbab2;
  font: 400 12px/1.4 Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-bonus[hidden] { display: none; }
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-bonus span { color: inherit; font: inherit; }
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-bonus svg { width: 23px; height: 23px; color: #e8cb79; }
#welcomeOverlay.cv-welcome-cinematic .cv-cinematic-bonus b { color: #efd487; font-size: 14px; margin-right: 3px; font-weight: 600; }
@keyframes cv-welcome-models-loop { to { transform: translateX(calc(-1 * var(--cv-marquee-distance, 0px))); } }
@media (max-width: 360px) {
  #welcomeOverlay.cv-welcome-cinematic .cv-cinematic-entry { padding: 14px; gap: 13px; grid-template-columns: 29px minmax(0, 1fr) 18px; min-height: 76px; }
  #welcomeOverlay.cv-welcome-cinematic .cv-cinematic-entry-copy b { font-size: 20px; }
  #welcomeOverlay.cv-welcome-cinematic .cv-cinematic-entry-copy small { font-size: 11px; }
}
@media (max-height: 700px) and (max-width: 600px) {
  #welcomeOverlay.cv-welcome-cinematic .cv-cinematic-hero { flex-grow: 0; min-height: max(290px, calc(var(--cv-welcome-top, 28px) + 204px)); }
  #welcomeOverlay.cv-welcome-cinematic #cvWelcomeTitle { font-size: clamp(28px, 8.8vw, 36px) !important; }
  #welcomeOverlay.cv-welcome-cinematic .cv-cinematic-footer { padding-top: 14px; }
  #welcomeOverlay.cv-welcome-cinematic .cv-cinematic-entry { min-height: 70px; padding-block: 11px; }
  #welcomeOverlay.cv-welcome-cinematic .cv-cinematic-bonus { margin-top: 16px; }
}
@media (orientation: landscape) and (max-height: 540px) {
  #welcomeOverlay.cv-welcome-cinematic .cv-cinematic-hero { flex-grow: 0; min-height: max(340px, calc(var(--cv-welcome-top, 28px) + 230px)); }
}
@media (prefers-reduced-motion: reduce) {
  #welcomeOverlay.cv-welcome-cinematic .cv-cinematic-track { animation: none; }
  #welcomeOverlay.cv-welcome-cinematic .cv-cinematic-models[aria-hidden="true"] { display: none; }
  #welcomeOverlay.cv-welcome-cinematic .cv-cinematic-marquee-toggle { overflow-x: auto; }
  #welcomeOverlay.cv-welcome-cinematic .cv-cinematic-entry { transition: none; }
}
