/* Khmer build overrides — loaded after main.css.
 *
 * The Khmer face is registered under each of the original family names with a
 * Khmer unicode-range, so every existing rule keeps its Pinup/Roboto look for
 * Latin digits and falls through to Noto Sans Khmer for Khmer codepoints. No
 * per-element font-family rewriting needed.
 */
@font-face { font-family: Pinup-Black;    src: url(fonts/khmer/NotoSansKhmer-kh.woff2) format('woff2'); font-weight: 100 900; font-display: swap; unicode-range: U+1780-17FF, U+19E0-19FF, U+200C-200D, U+25CC; }
@font-face { font-family: Pinup-Bold;     src: url(fonts/khmer/NotoSansKhmer-kh.woff2) format('woff2'); font-weight: 100 900; font-display: swap; unicode-range: U+1780-17FF, U+19E0-19FF, U+200C-200D, U+25CC; }
@font-face { font-family: Pinup-Medium;   src: url(fonts/khmer/NotoSansKhmer-kh.woff2) format('woff2'); font-weight: 100 900; font-display: swap; unicode-range: U+1780-17FF, U+19E0-19FF, U+200C-200D, U+25CC; }
@font-face { font-family: Pinup-Regular;  src: url(fonts/khmer/NotoSansKhmer-kh.woff2) format('woff2'); font-weight: 100 900; font-display: swap; unicode-range: U+1780-17FF, U+19E0-19FF, U+200C-200D, U+25CC; }
@font-face { font-family: Roboto;         src: url(fonts/khmer/NotoSansKhmer-kh.woff2) format('woff2'); font-weight: 100 900; font-display: swap; unicode-range: U+1780-17FF, U+19E0-19FF, U+200C-200D, U+25CC; }
@font-face { font-family: Roboto-Bold;    src: url(fonts/khmer/NotoSansKhmer-kh.woff2) format('woff2'); font-weight: 100 900; font-display: swap; unicode-range: U+1780-17FF, U+19E0-19FF, U+200C-200D, U+25CC; }
@font-face { font-family: Roboto-Regular; src: url(fonts/khmer/NotoSansKhmer-kh.woff2) format('woff2'); font-weight: 100 900; font-display: swap; unicode-range: U+1780-17FF, U+19E0-19FF, U+200C-200D, U+25CC; }

/* Khmer stacks glyphs above and below the baseline; the original 'normal'
   line-height clips the subscript consonants. */
.title-block__first, .title-block__second,
.comp-title__bonus, .comp-title__text,
.lights-content__subtitle, .lights-content__value { line-height: 1.5; }

.title-block__first { padding: 1.4vh 2vh; }

/* ---- single spin ------------------------------------------------------- */
/* 2153deg = 5 full turns + 353deg. A +353deg rotation brings the segment that
   sat at +7deg under the pointer, i.e. the top wedge (USD 99), landing slightly
   off-centre the way the original animation did. */
@keyframes newSpinOnce {
  0%   { -webkit-transform: rotate(0deg);      transform: rotate(0deg); }
  50%  { -webkit-transform: rotate(2153deg);   transform: rotate(2153deg); }
  75%  { -webkit-transform: rotate(2161deg);   transform: rotate(2161deg); }
  to   { -webkit-transform: rotate(2153deg);   transform: rotate(2153deg); }
}
@keyframes wonShake {
  0%   { -webkit-transform: rotate(2153deg);   transform: rotate(2153deg); }
  50%  { -webkit-transform: rotate(2161deg);   transform: rotate(2161deg); }
  to   { -webkit-transform: rotate(2153deg);   transform: rotate(2153deg); }
}
.spin-once .wheel__spinner-img { -webkit-animation: newSpinOnce 4s ease-in-out forwards; animation: newSpinOnce 4s ease-in-out forwards; }
.stage-won .wheel__spinner-img { -webkit-animation: wonShake 2s ease-in-out infinite; animation: wonShake 2s ease-in-out infinite; }
.spin-once .wheel__spinner-center,
.stage-won .wheel__spinner-center { -webkit-animation: none; animation: none; cursor: default; }
.spin-once .run-circle, .stage-won .run-circle { cursor: default; }

/* Only the prize badge is awarded now. On desktop it keeps the original
   right-of-the-wheel slot — forcing it to centre puts it on top of the wheel,
   because main.css positions it with `right: 50%` plus a translate. Narrow
   screens have no room beside the wheel, so it drops underneath instead. */
@media (max-width: 767px) {
  .wheel__achievements-bet {
    right: auto;
    left: 50%;
    top: 100%;
    bottom: auto;
    margin-top: 3vw;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
  }
}

/* ---- claim block replaces the registration form ------------------------ */
.claim { padding: 0 0 12px; text-align: center; }
.claim__note {
  margin: 0 0 20px;
  font-family: Roboto-Regular, sans-serif;
  font-size: 15px;
  line-height: 1.7;
  color: hsla(0, 0%, 100%, .82);
}
.claim__btn {
  display: block;
  width: 100%;
  box-sizing: border-box;
  padding: 17px 20px;
  border: 0;
  border-radius: 4px;
  background: #f5321f;
  box-shadow: 0 8px 24px rgba(245, 50, 31, .35);
  color: #fff;
  font-family: Pinup-Bold, sans-serif;
  font-size: 19px;
  line-height: 1.5;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: background .2s ease, transform .2s ease;
}
.claim__btn:hover  { background: #ff4a35; }
.claim__btn:active { transform: scale(.98); }
.claim__terms {
  margin: 16px 0 0;
  font-family: Roboto-Regular, sans-serif;
  font-size: 12px;
  line-height: 1.7;
  color: hsla(0, 0%, 100%, .5);
}

/* The Pin-Up wordmark is gone from the header; keep the remaining logo from
   sliding under the viewport edge on small screens. */
.header { justify-content: flex-start; }
.header__logo-two { margin: 0; }