/* =====================================================
   POKER-TOUR  -  custom.css
   -----------------------------------------------------
   ★ 이 파일의 존재 이유
   style.css 는 JPOKER 정적 템플릿에서 통째로 가져온 파일이다.
   템플릿이 갱신되면 style.css 를 통째로 덮어쓰게 되는데,
   그때 우리가 style.css 안에 직접 넣어 둔 규칙은 전부 사라진다.
   (2026-08-25 에 실제로 .ug-way / .user-guide__footnote a 규칙이 이렇게 날아갔다)
   2026-09-04 에 최종 템플릿(POKER-TOUR Template)으로 style.css 를 다시 통째로 갈았다.

   그래서 "템플릿에 없고 우리가 추가한 것"은 전부 여기에 모은다.
   style.css 는 손대지 않는다. head.php 가 style.css 다음에 이 파일을 읽는다.

   ※ 레이어 팝업은 modal.css, 정책 페이지는 policy.css, 결제는 carts.css.
     그쪽은 원래부터 우리 파일이라 거기에 그대로 두면 된다.
   ===================================================== */

/* -----------------------------------------------------
   1. 여정 흐름도 안의 포인트 획득 A/B/C 버튼
   -----------------------------------------------------
   include/journey_map.php 가 $jm_ways = TRUE 일 때 그린다.
   지금은 User Guide 에서만 쓴다.
   문구·순서는 include/point_ways.php 에서 관리한다.
   ----------------------------------------------------- */

.jm-ways {
   display: flex;
   flex-wrap: wrap;
   gap: 0.4rem;
   margin: 0.75rem 0 0;
   padding: 0;
   list-style: none;
}

.jm-way {
   display: inline-flex;
   align-items: center;
   gap: 0.45rem;
   padding: 0.42rem 0.8rem 0.42rem 0.42rem;
   border: 1px solid rgba(239, 198, 102, 0.42);
   border-radius: 999px;
   background: rgba(112, 22, 41, 0.32);
   color: #f4e3bd;
   font-family: "Inter", system-ui, sans-serif;
   font-size: 0.68rem;
   font-weight: 700;
   letter-spacing: 0.03em;
   line-height: 1;
   text-decoration: none;
   text-transform: uppercase;
   white-space: nowrap;
   transition: border-color 0.22s ease, background 0.22s ease, transform 0.22s ease;
}

.jm-way:hover,
.jm-way:focus-visible {
   border-color: rgba(255, 232, 170, 0.9);
   background: rgba(112, 22, 41, 0.55);
   transform: translateY(-1px);
}

.jm-way:focus-visible {
   outline: 2px solid #efc666;
   outline-offset: 3px;
}

.jm-way__step {
   display: grid;
   place-items: center;
   width: 1.15rem;
   height: 1.15rem;
   border-radius: 50%;
   background: linear-gradient(180deg, #f6e3ad 0%, #d8ae52 55%, #a97f26 100%);
   color: #241a06;
   font-size: 0.6rem;
   font-weight: 900;
}

/* User Guide 페이지 자체는 흰 배경이지만 흐름도(.journey-map)는
   그 안에서도 어두운 카드다. 그래서 색을 뒤집지 않고 그대로 둔다.
   (뒤집었다가 어두운 카드 위에 어두운 글씨가 되어 되돌렸다) */

@media (max-width: 40rem) {
   .jm-ways {
      flex-direction: column;
   }

   .jm-way {
      justify-content: flex-start;
   }
}

/* -----------------------------------------------------
   2. User Guide 본문 안의 링크
   -----------------------------------------------------
   템플릿에는 본문 링크가 없어서 스타일이 비어 있다.
   우리가 넣은 /partners 안내 링크 등이 기본 파란 밑줄로 나오는 걸 막는다.
   ----------------------------------------------------- */

.user-guide .user-guide__footnote a,
.user-guide .user-guide__section-note a,
.user-guide .user-guide__note a {
   color: #701629;
   font-weight: 700;
   text-decoration: none;
   border-block-end: 1px solid currentColor;
}

.user-guide .user-guide__footnote a:hover,
.user-guide .user-guide__section-note a:hover,
.user-guide .user-guide__note a:hover {
   color: #3f0d18;
}

/* -----------------------------------------------------
   3. JS 없이 로그인/가입 폼을 보냈을 때의 안내줄
   -----------------------------------------------------
   평소에는 login.js / signup.js 가 토스트로 보여 주므로 안 보인다.
   ----------------------------------------------------- */

.pt-flash {
   margin: 0;
   padding: 0.85rem 1.25rem;
   background: #701629;
   color: #f4e3bd;
   font-family: "Inter", system-ui, sans-serif;
   font-size: 0.9rem;
   text-align: center;
}

/* -----------------------------------------------------
   4. 문의 폼 허니팟 (pages/contact.php)
   -----------------------------------------------------
   display:none 은 일부 봇이 건너뛰므로 화면 밖으로 밀어 둔다.
   ----------------------------------------------------- */

.contact-hp {
   position: absolute;
   left: -10000px;
   top: auto;
   width: 1px;
   height: 1px;
   overflow: hidden;
}

.contact-form__status.is-success {
   color: #2e7d4f;
}

/* -----------------------------------------------------
   5. 홈 Tournament Schedule 3탭 (include/schedule_tabs.php + schedule.js)
   -----------------------------------------------------
   템플릿의 .schedule-placeholder / .schedule-event 는 그대로 쓰고,
   그 위의 탭 줄과 빈 상태·우승자 행만 여기서 만든다.
   색은 tokens.css 의 히어로 팔레트를 따른다.

   2026-09-05 : 드롭다운으로 바꿨다가 CK 결정으로 다시 알약 탭. 탭 이름을
   짧게(Live Events / POKER-TOUR Tournaments / Winners) 해서 한 줄에 들어간다.
   ----------------------------------------------------- */

/* 탭 줄 + 목록 상자 한 덩어리. hero-panel 의 큰 gap 은 제목과 이 덩어리
   사이에만 한 번 들어간다 */
.schedule-block {
   display: grid;
   gap: 0.75rem;
   min-width: 0;
}

.schedule-tabs {
   display: flex;
   flex-wrap: wrap;
   gap: 0.5rem;
   margin: 0;
}

.schedule-tabs__tab {
   appearance: none;
   cursor: pointer;
   padding: 0.6rem 1.1rem;
   border: 1px solid var(--color-hero-rule, rgba(255, 255, 255, 0.18));
   border-radius: 999px;
   background: transparent;
   color: var(--color-hero-ink, #f4efe6);
   font-family: var(--font-body, "Inter", system-ui, sans-serif);
   font-size: var(--text-sm, 0.85rem);
   font-weight: 700;
   letter-spacing: 0.04em;
   line-height: 1;
   text-transform: uppercase;
   white-space: nowrap;
   transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.schedule-tabs__tab:hover,
.schedule-tabs__tab:focus-visible {
   border-color: var(--color-hero-gold-soft, #efc666);
   color: var(--color-hero-gold-soft, #efc666);
}

.schedule-tabs__tab:focus-visible {
   outline: 2px solid var(--color-hero-gold-soft, #efc666);
   outline-offset: 3px;
}

.schedule-tabs__tab.is-active {
   background: var(--color-hero-gold-soft, #efc666);
   border-color: var(--color-hero-gold-soft, #efc666);
   color: #1a1206;
}

.schedule-panel[hidden] {
   display: none;
}

/* 섹션 높이를 4행으로 고정한다. .hero-panel 이 세로 가운데 정렬이라
   탭마다 행 수가 다르면 제목이 위아래로 움직였다 (2026-09-04 CK 지적).
   행 높이는 style.css .schedule-event 의 min-height 와 같은 식이다. */
.schedule-panel .schedule-tournaments {
   grid-auto-rows: minmax(clamp(5rem, 10vh, 6.5rem), auto);
   align-content: start;
   min-height: calc(4 * clamp(5rem, 10vh, 6.5rem));
}

/* 툴바 오른쪽 링크 (View all schedules / Play now / View more) */
.schedule-placeholder__more {
   color: var(--color-hero-gold-soft, #efc666);
   font: inherit;
   text-decoration: none;
   white-space: nowrap;
   border-block-end: 1px solid transparent;
   transition: border-color 0.2s ease;
}

.schedule-placeholder__more:hover,
.schedule-placeholder__more:focus-visible {
   border-block-end-color: currentColor;
}

.schedule-empty {
   margin: 0;
   padding: var(--space-lg, 1.5rem);
   color: var(--color-hero-ink, #f4efe6);
   font-family: var(--font-body, "Inter", system-ui, sans-serif);
   font-size: var(--text-base, 1rem);
   line-height: 1.5;
   opacity: 0.8;
   text-transform: none;
}

/* 온라인 일정의 시작 시각 (대회명 아래 작은 글씨) */
.schedule-event__name small {
   display: block;
   margin-top: 0.2rem;
   color: var(--color-hero-gold-soft, #efc666);
   font-family: var(--font-body, "Inter", system-ui, sans-serif);
   font-size: var(--text-xs, 0.75rem);
   letter-spacing: 0.06em;
   text-transform: uppercase;
}

.schedule-event__name a {
   color: inherit;
   text-decoration: none;
   border-block-end: 1px solid transparent;
}

.schedule-event__name a:hover {
   border-block-end-color: currentColor;
}

/* 진행 중인 온라인 대회는 왼쪽에 금색 띠 */
.schedule-event.is-running {
   box-shadow: inset 3px 0 0 var(--color-hero-gold-soft, #efc666);
}

@media (max-width: 40rem) {
   /* 좁은 화면: 세 탭이 같은 폭으로 한 줄. 긴 이름(POKER-TOUR Tournaments)은
      알약 안에서 두 줄로 접히고, 세 알약 높이는 같이 늘어난다 */
   .schedule-tabs {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 0.4rem;
   }

   .schedule-tabs__tab {
      display: flex;
      align-items: center;
      justify-content: center;
      min-height: 2.6rem;
      padding: 0.4rem 0.5rem;
      font-size: 0.7rem;
      letter-spacing: 0.02em;
      line-height: 1.15;
      text-align: center;
      white-space: normal;
   }
}

/* -----------------------------------------------------
   6. 첫 방문 안내 레이어 (include/welcome.php + welcome.js)
   -----------------------------------------------------
   크기 (CK 지정) : PC 가로 60% × 세로 40% / 모바일 가로 90% × 세로 80%
   z-index 는 nav(--z-nav 200)·iframe 팝업(120)보다 위 = 300.
   ----------------------------------------------------- */

.pt-welcome {
   position: fixed;
   inset: 0;
   z-index: 300;
   display: grid;
   place-items: center;
   padding: 1rem;
   opacity: 0;
   pointer-events: none;
   transition: opacity 0.25s ease;
}

.pt-welcome.is-open {
   opacity: 1;
   pointer-events: auto;
}

.pt-welcome__scrim {
   position: absolute;
   inset: 0;
   border: 0;
   padding: 0;
   background: rgba(8, 5, 4, 0.78);
   backdrop-filter: blur(6px);
   -webkit-backdrop-filter: blur(6px);
   cursor: default;
}

.pt-welcome__panel {
   position: relative;
   width: 60vw;
   height: 40vh;
   min-height: 320px;
   max-width: 1100px;
   display: grid;
   grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
   overflow: hidden;
   border: 1px solid rgba(239, 198, 102, 0.35);
   border-radius: 18px;
   background: #141110;
   color: var(--color-hero-ink, #f4efe6);
   box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6);
   transform: translateY(12px) scale(0.98);
   transition: transform 0.28s ease;
}

.pt-welcome.is-open .pt-welcome__panel {
   transform: none;
}

/* [×] 닫기. 아이콘(close.svg)이 검정이라 어두운 바탕에서 안 보였다
   (2026-09-05 CK 지적). 이미지 대신 CSS 로 흰 × 를 그린다 - 캐시된 SVG 나
   filter 지원과 무관하게 항상 보인다. */
.pt-welcome__close {
   position: absolute;
   top: 0.75rem;
   right: 0.75rem;
   z-index: 2;
   display: grid;
   place-items: center;
   width: 2.5rem;
   height: 2.5rem;
   padding: 0;
   border: 1px solid rgba(255, 255, 255, 0.55);
   border-radius: 50%;
   background: rgba(0, 0, 0, 0.55);
   color: #fff;
   cursor: pointer;
   transition: background 0.2s ease, border-color 0.2s ease;
}

.pt-welcome__close::before,
.pt-welcome__close::after {
   content: "";
   grid-area: 1 / 1;
   width: 1.1rem;
   height: 2px;
   border-radius: 1px;
   background: currentColor;
   transform: rotate(45deg);
}

.pt-welcome__close::after {
   transform: rotate(-45deg);
}

.pt-welcome__close img {
   display: none;
}

.pt-welcome__close:hover,
.pt-welcome__close:focus-visible {
   background: var(--color-hero-gold-soft, #efc666);
   border-color: var(--color-hero-gold-soft, #efc666);
   color: #1a1206;
   outline: none;
}

.pt-welcome__media {
   position: relative;
   min-height: 0;
   background: #2a0a12;
}

.pt-welcome__media > img:first-child {
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: center;
   display: block;
}

.pt-welcome__media::after {
   content: "";
   position: absolute;
   inset: 0;
   background: linear-gradient(90deg, rgba(20, 17, 16, 0) 60%, #141110 100%);
}

.pt-welcome__mark {
   position: absolute;
   left: 1rem;
   top: 0.9rem;   /* 왼쪽 아래는 "일주일 숨김" 체크박스 자리다 */
   width: clamp(96px, 30%, 160px);
   height: auto;
   z-index: 1;
   opacity: 0.95;
}

.pt-welcome__body {
   min-height: 0;
   overflow: auto;
   padding: clamp(1.1rem, 3vh, 2rem) clamp(1.25rem, 3vw, 2.5rem) 3.4rem;
   display: flex;
   flex-direction: column;
   justify-content: center;
   gap: 0.55rem;
}

.pt-welcome__eyebrow {
   margin: 0;
   color: var(--color-hero-gold-soft, #efc666);
   font-family: var(--font-body, "Inter", system-ui, sans-serif);
   font-size: 0.72rem;
   font-weight: 700;
   letter-spacing: 0.18em;
   text-transform: uppercase;
}

.pt-welcome__title {
   margin: 0;
   font-family: var(--font-display, "Big Shoulders Display", sans-serif);
   font-size: clamp(1.7rem, 3.2vw, 3rem);
   font-weight: 900;
   line-height: 0.98;
   letter-spacing: -0.01em;
   text-transform: uppercase;
}

.pt-welcome__lede,
.pt-welcome__promise {
   margin: 0;
   font-family: var(--font-body, "Inter", system-ui, sans-serif);
   font-size: clamp(0.8rem, 1vw, 0.95rem);
   line-height: 1.5;
   text-transform: none;
   color: var(--color-hero-ink-soft, #d9d2c4);
}

.pt-welcome__promise {
   color: var(--color-hero-ink, #f4efe6);
   font-weight: 600;
}

.pt-welcome__actions {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   gap: 0.75rem 1.25rem;
   margin-top: 0.4rem;
}

.pt-welcome__cta {
   display: inline-flex;
   align-items: center;
   padding: 0.75rem 1.4rem;
   border-radius: 999px;
   background: linear-gradient(180deg, #f6e3ad 0%, #d8ae52 55%, #a97f26 100%);
   color: #241a06;
   font-family: var(--font-body, "Inter", system-ui, sans-serif);
   font-size: 0.85rem;
   font-weight: 800;
   letter-spacing: 0.06em;
   text-transform: uppercase;
   text-decoration: none;
   white-space: nowrap;
}

.pt-welcome__alt {
   color: var(--color-hero-gold-soft, #efc666);
   font-family: var(--font-body, "Inter", system-ui, sans-serif);
   font-size: 0.8rem;
   font-weight: 700;
   text-decoration: none;
   border-block-end: 1px solid currentColor;
}

.pt-welcome__hide {
   position: absolute;
   left: 1rem;
   bottom: 0.85rem;
   z-index: 2;
   display: inline-flex;
   align-items: center;
   gap: 0.45rem;
   padding: 0.35rem 0.6rem;
   border-radius: 8px;
   background: rgba(0, 0, 0, 0.45);
   color: #e8e1d3;
   font-family: var(--font-body, "Inter", system-ui, sans-serif);
   font-size: 0.72rem;
   cursor: pointer;
   user-select: none;
}

.pt-welcome__hide input {
   width: 1rem;
   height: 1rem;
   accent-color: #d8ae52;
   cursor: pointer;
}

body.pt-welcome-open {
   overflow: hidden;
}

@media (max-width: 64rem) {
   .pt-welcome__panel {
      width: 90vw;
      height: 70vh;   /* 2026-09-05 CK: 모바일 세로 80% → 70% */
      min-height: 0;
      grid-template-columns: 1fr;
      /* 이미지 / 본문(스크롤) / 일주일 숨김 체크박스 - 체크박스는 흐름 안에 둬서
         본문 링크를 가리지 않게 한다 */
      grid-template-rows: minmax(0, 28%) minmax(0, 1fr) auto;   /* 70vh 에 맞춰 이미지 36% → 28% */
   }

   .pt-welcome__media::after {
      background: linear-gradient(180deg, rgba(20, 17, 16, 0) 55%, #141110 100%);
   }

   .pt-welcome__body {
      justify-content: flex-start;
      gap: 0.4rem;
      padding: 0.9rem 1.1rem 1rem;
   }

   .pt-welcome__title {
      font-size: clamp(1.5rem, 7vw, 2.2rem);
   }

   .pt-welcome__lede,
   .pt-welcome__promise {
      font-size: 0.86rem;
      line-height: 1.4;
   }

   .pt-welcome__actions {
      margin-top: 0.35rem;
   }

   .pt-welcome__hide {
      position: static;
      justify-self: start;
      margin: 0 0.75rem 0.75rem;
   }
}

/* -----------------------------------------------------
   7. /tournaments 전체 일정 페이지 (pages/tournaments.php)
   -----------------------------------------------------
   홈 탭의 목록 마크업(.schedule-placeholder)을 어두운 페이지에 세로로 세 번 쌓는다.
   ----------------------------------------------------- */

.pt-tournaments {
   padding: clamp(6.5rem, 12vh, 9rem) clamp(1rem, 4vw, 3rem) clamp(3rem, 8vh, 6rem);
   color: var(--color-hero-ink, #f4efe6);
   /* 사이트 본문 배경은 밝은 색(--site-bg-base)이라 히어로용 밝은 글자가 안 보였다
      (2026-09-05 CK 지적). 이 페이지는 홈 히어로와 같은 어두운 바닥을 깐다. */
   background:
      radial-gradient(60rem 30rem at 50% -10%, rgba(145, 31, 55, 0.35), transparent 70%),
      var(--color-hero-paper, #1b1816);
}

.pt-tournaments__inner {
   max-width: 1100px;
   margin: 0 auto;
   display: grid;
   gap: clamp(2rem, 5vh, 3.5rem);
}

.pt-tournaments__head h1 {
   margin: 0;
   font-family: var(--font-display, "Big Shoulders Display", sans-serif);
   font-size: clamp(2.4rem, 6vw, 4.5rem);
   font-weight: 900;
   line-height: 0.95;
   text-transform: uppercase;
}

.pt-tournaments__head p,
.pt-tournaments__section > p {
   margin: 0.6rem 0 0;
   color: var(--color-hero-ink-soft, #d9d2c4);
   font-family: var(--font-body, "Inter", system-ui, sans-serif);
   font-size: 1rem;
   line-height: 1.5;
   text-transform: none;
}

.pt-tournaments__section {
   scroll-margin-top: calc(var(--hero-nav-height, 6rem) + 1rem);
}

.pt-tournaments__section h2 {
   margin: 0 0 0.9rem;
   font-family: var(--font-display, "Big Shoulders Display", sans-serif);
   font-size: clamp(1.6rem, 3.4vw, 2.4rem);
   font-weight: 800;
   text-transform: uppercase;
   letter-spacing: 0.01em;
}

.pt-tournaments .schedule-tournaments {
   min-height: 0;
}

/* -----------------------------------------------------
   9. 전체화면 포커 로비 페이지 (/poker, pages/poker.php + lobby.js)
   -----------------------------------------------------
   2026-09-05 모바일, 2026-09-18 부터 PC 까지 — 로비는 팝업이 아니라 이 페이지로 온다
   (modal.js 가 data-pt-modal="poker" 를 가로채지 않는다). 네비·푸터 없이
   위에 얇은 바 하나 + 로비 iframe 이다. 바 구성 (PESO77 /game/play 와 같다):

        ← 로고            |            [1,234 PTS]  [⛶]  [Back]

   넓은 화면에서는 바를 조금 키운다 (--pt-lobby-bar-h 한 곳만 바꾸면 로비 높이도 따라온다).
   로비 iframe 의 기본 스타일(.pt-lobby)은 signup.css 에 있다.
   ----------------------------------------------------- */

.pt-lobby-bar {
   --pt-lobby-bar-h: 3.25rem;
   position: relative;
   z-index: 2;
   display: flex;
   align-items: center;
   gap: 0.75rem;
   height: calc(var(--pt-lobby-bar-h) + env(safe-area-inset-top, 0px));
   padding: env(safe-area-inset-top, 0px) 0.9rem 0;
   background: var(--color-nav-bg, #141413);
   border-bottom: 1px solid rgba(255, 255, 255, 0.12);
   color: var(--color-hero-ink, #f4efe6);
   font-family: var(--font-body, "Inter", system-ui, sans-serif);
}

.pt-lobby-bar__back {
   display: inline-flex;
   align-items: center;
   gap: 0.5rem;
   min-height: 2.5rem;
   color: var(--color-hero-gold-soft, #efc666);
   font-size: 1.1rem;
   font-weight: 700;
   text-decoration: none;
}

.pt-lobby-bar__back img {
   width: auto;
   height: 2.1rem;
}

/* 오른쪽 묶음 : 잔액 · 전체화면 · 뒤로가기 */
.pt-lobby-bar__right {
   margin-inline-start: auto;
   display: flex;
   align-items: center;
   gap: 0.5rem;
   min-width: 0;
}

.pt-lobby-bar__bal {
   display: inline-flex;
   align-items: baseline;
   gap: 0.28rem;
   min-height: 2rem;
   padding: 0.3rem 0.7rem;
   border: 1px solid rgba(226, 190, 104, 0.35);
   border-radius: 999px;
   background: rgba(226, 190, 104, 0.12);
   color: var(--color-hero-gold-soft, #efc666);
   font-size: 0.82rem;
   font-weight: 800;
   letter-spacing: 0.02em;
   text-decoration: none;
   white-space: nowrap;
}

.pt-lobby-bar__bal:hover {
   background: rgba(226, 190, 104, 0.22);
}

.pt-lobby-bar__bal-unit {
   font-size: 0.66rem;
   font-weight: 700;
   letter-spacing: 0.08em;
   opacity: 0.85;
}

.pt-lobby-bar__fs {
   flex: 0 0 auto;
   display: grid;
   place-items: center;
   width: 2.1rem;
   height: 2.1rem;
   padding: 0;
   border: 1px solid rgba(255, 255, 255, 0.18);
   border-radius: 0.6rem;
   background: rgba(255, 255, 255, 0.06);
   color: var(--color-hero-ink, #f4efe6);
   cursor: pointer;
   transition: background-color 0.2s, color 0.2s, border-color 0.2s;
}

.pt-lobby-bar__fs:hover {
   background: rgba(255, 255, 255, 0.14);
}

.pt-lobby-bar__fs:focus-visible,
.pt-lobby-bar__bal:focus-visible,
.pt-lobby-bar__home:focus-visible,
.pt-lobby-bar__back:focus-visible {
   outline: 2px solid var(--color-hero-gold-soft, #efc666);
   outline-offset: 2px;
}

/* 아이콘 : 평소엔 "넓히기", 전체화면 중에는 "줄이기" */
.pt-lobby-bar__fs-out {
   display: none;
}

.pt-lobby-bar__fs.is-on {
   border-color: rgba(226, 190, 104, 0.5);
   color: var(--color-hero-gold-soft, #efc666);
}

.pt-lobby-bar__fs.is-on .pt-lobby-bar__fs-in {
   display: none;
}

.pt-lobby-bar__fs.is-on .pt-lobby-bar__fs-out {
   display: block;
}

.pt-lobby-bar__home {
   flex: 0 0 auto;
   padding: 0.45rem 0.8rem;
   border-radius: 999px;
   background: var(--color-hero-gold-soft, #efc666);
   color: #1a1206;
   font-size: 0.72rem;
   font-weight: 800;
   letter-spacing: 0.06em;
   text-decoration: none;
   text-transform: uppercase;
   white-space: nowrap;
}

.pt-lobby-bar__home:hover {
   filter: brightness(1.06);
}

.pt-lobby-bar__home-short {
   display: none;
}

/* 좁은 화면 : 바가 넘치지 않게 글자를 줄인다 (버튼을 없애지는 않는다 —
   "돌아가는 버튼이 사라졌다"는 제보가 온다) */
@media (max-width: 30rem) {
   .pt-lobby-bar {
      gap: 0.5rem;
      padding-inline: 0.6rem;
   }

   .pt-lobby-bar__right {
      gap: 0.4rem;
   }

   .pt-lobby-bar__back img {
      height: 1.8rem;
   }

   .pt-lobby-bar__bal {
      padding: 0.25rem 0.55rem;
      font-size: 0.76rem;
   }

   .pt-lobby-bar__home-full {
      display: none;
   }

   .pt-lobby-bar__home-short {
      display: inline;
   }
}

/* 넓은 화면 : 1440px 에서 48px 바는 지나치게 가늘다 */
@media (min-width: 64.0625rem) {
   .pt-lobby-bar {
      --pt-lobby-bar-h: 3.5rem;
      gap: 1rem;
      padding-inline: 1.15rem;
   }

   .pt-lobby-bar__back img {
      height: 2.35rem;
   }

   .pt-lobby-bar__bal {
      min-height: 2.25rem;
      font-size: 0.9rem;
   }

   .pt-lobby-bar__fs {
      width: 2.25rem;
      height: 2.25rem;
   }

   .pt-lobby-bar__home {
      padding: 0.55rem 1rem;
      font-size: 0.76rem;
   }
}

/* 로비는 바를 뺀 나머지를 채운다 (팝업 안 .pt-embed 는 signup.css 의 100% 그대로) */
body.pt-lobby-page:not(.pt-embed) .pt-lobby {
   height: calc(100vh - 3.25rem - env(safe-area-inset-top, 0px));
}

@supports (height: 100dvh) {
   body.pt-lobby-page:not(.pt-embed) .pt-lobby {
      height: calc(100dvh - 3.25rem - env(safe-area-inset-top, 0px));
   }
}

@media (min-width: 64.0625rem) {
   body.pt-lobby-page:not(.pt-embed) .pt-lobby {
      height: calc(100vh - 3.5rem - env(safe-area-inset-top, 0px));
   }

   @supports (height: 100dvh) {
      body.pt-lobby-page:not(.pt-embed) .pt-lobby {
         height: calc(100dvh - 3.5rem - env(safe-area-inset-top, 0px));
      }
   }
}

/* -----------------------------------------------------
   10. 멤버십 갱신 안내 배너 (include/membership_banner.php)  2026-09-05
   -----------------------------------------------------
   로그인 회원의 멤버십이 banner_days 이내에 끝나거나 이미 끝났을 때
   화면 아래 오른쪽에 뜨는 작은 카드. [×] 로 닫으면 그 브라우저 세션에서는
   다시 안 뜬다 (sessionStorage). 모바일은 하단 액션바(4.4rem) 위에 전체 폭.
   ----------------------------------------------------- */

.pt-msb {
   position: fixed;
   right: 1.25rem;
   bottom: 1.25rem;
   z-index: 190;                        /* 네비(200)·팝업보다 아래, 본문보다 위 */
   display: flex;
   align-items: flex-start;
   gap: 0.85rem;
   width: min(26rem, calc(100vw - 2.5rem));
   padding: 0.95rem 1rem 0.95rem 1.1rem;
   border: 1px solid rgba(255, 255, 255, 0.12);
   border-left: 4px solid var(--color-hero-gold);
   border-radius: 0.75rem;
   background: var(--color-nav-bg);
   color: var(--color-hero-ink);
   box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
   font-family: inherit;
}

.pt-msb--expired {
   border-left-color: #c8443a;
}

.pt-msb[hidden] {
   display: none;
}

.pt-msb__body {
   flex: 1 1 auto;
   min-width: 0;
}

.pt-msb__title {
   margin: 0 0 0.25rem;
   font-size: 0.92rem;
   font-weight: 700;
   line-height: 1.35;
   text-transform: none;
}

.pt-msb__text {
   margin: 0 0 0.6rem;
   font-size: 0.82rem;
   line-height: 1.45;
   color: rgba(255, 255, 255, 0.72);
   text-transform: none;
}

.pt-msb__actions {
   display: flex;
   flex-wrap: wrap;
   gap: 0.5rem 0.9rem;
   align-items: center;
}

.pt-msb__renew {
   display: inline-block;
   padding: 0.45em 1em;
   border-radius: 999px;
   background: var(--color-hero-gold);
   color: #151515;
   font-size: 0.8rem;
   font-weight: 700;
   letter-spacing: 0.03em;
   text-decoration: none;
}

.pt-msb__renew:hover {
   filter: brightness(1.08);
}

.pt-msb__more {
   font-size: 0.78rem;
   color: rgba(255, 255, 255, 0.72);
   text-decoration: underline;
   text-underline-offset: 0.15em;
}

.pt-msb__close {
   flex: 0 0 auto;
   width: 1.75rem;
   height: 1.75rem;
   margin: -0.25rem -0.35rem 0 0;
   padding: 0;
   border: 0;
   border-radius: 50%;
   background: transparent;
   color: rgba(255, 255, 255, 0.6);
   font-size: 1.1rem;
   line-height: 1;
   cursor: pointer;
}

.pt-msb__close:hover {
   background: rgba(255, 255, 255, 0.08);
   color: #fff;
}

@media (max-width: 64rem) {           /* style.css 가 .mobile-action-bar 를 띄우는 폭과 같게 */
   .pt-msb {
      right: 0.75rem;
      left: 0.75rem;
      bottom: calc(4.4rem + env(safe-area-inset-bottom, 0px) + 0.75rem);
      width: auto;
   }
}

/* -----------------------------------------------------
   11. 출석 체크 달력 모달 (include/checkin_widget.php + checkin.js)  2026-09-09
   -----------------------------------------------------
   longtian 의 lt-dci 를 POKER-TOUR 색으로. 로그인 회원이 오늘 아직 출석하지
   않았으면 페이지가 열릴 때 자동으로 뜬다. 웰컴 레이어(.pt-welcome)보다 위.
   ----------------------------------------------------- */

.pt-dci,
.pt-dci * {
   box-sizing: border-box;
}

.pt-dci[hidden] {
   display: none !important;
}

.pt-dci {
   position: fixed;
   inset: 0;
   z-index: 2147483000;
   display: grid;
   place-items: center;
   padding: 18px;
   color: var(--color-hero-ink);
   font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
}

body.pt-dci-open {
   overflow: hidden;
}

.pt-dci__backdrop {
   position: absolute;
   inset: 0;
   border: 0;
   padding: 0;
   background: rgba(5, 5, 8, 0.78);
   backdrop-filter: blur(8px);
   -webkit-backdrop-filter: blur(8px);
   cursor: default;
}

.pt-dci__dialog {
   position: relative;
   width: min(600px, 100%);
   max-height: min(820px, calc(100vh - 36px));
   max-height: min(820px, calc(100dvh - 36px));
   overflow: auto;
   border: 1px solid rgba(239, 198, 102, 0.22);
   border-radius: 20px;
   background: #15161a;
   box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6);
   outline: none;
   animation: pt-dci-in 0.28s ease-out;
}

@keyframes pt-dci-in {
   from { opacity: 0; transform: translateY(12px) scale(0.985); }
   to   { opacity: 1; transform: translateY(0) scale(1); }
}

.pt-dci__head {
   position: relative;
   padding: 22px 26px 18px;
   background: linear-gradient(160deg, #701629 0%, #3c0d18 60%, #1b1013 100%);
   border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.pt-dci__eyebrow {
   margin: 0 0 4px;
   color: var(--color-hero-gold);
   font-size: 0.72rem;
   font-weight: 700;
   letter-spacing: 0.16em;
   text-transform: uppercase;
}

.pt-dci__title {
   margin: 0 0 6px;
   font-size: 1.45rem;
   font-weight: 800;
   line-height: 1.2;
   color: #fff;
}

.pt-dci__intro {
   margin: 0;
   max-width: 32rem;
   color: rgba(255, 255, 255, 0.78);
   font-size: 0.86rem;
   line-height: 1.5;
   text-transform: none;
}

.pt-dci__intro strong {
   color: var(--color-hero-gold);
}

.pt-dci__close {
   position: absolute;
   top: 14px;
   right: 14px;
   display: grid;
   place-items: center;
   width: 2.2rem;
   height: 2.2rem;
   border: 1px solid rgba(255, 255, 255, 0.18);
   border-radius: 50%;
   background: rgba(0, 0, 0, 0.3);
   color: #fff;
   font-size: 1.3rem;
   line-height: 1;
   cursor: pointer;
}

.pt-dci__close:disabled {
   opacity: 0.6;
   cursor: not-allowed;
   font-size: 0.85rem;
   font-weight: 700;
}

.pt-dci__body {
   padding: 16px 22px 20px;
}

.pt-dci__notice {
   margin: 0 0 12px;
   padding: 10px 14px;
   border: 1px solid rgba(70, 207, 149, 0.5);
   border-radius: 10px;
   background: rgba(70, 207, 149, 0.1);
   color: #9df0c9;
   font-size: 0.85rem;
   font-weight: 600;
   text-align: center;
   text-transform: none;
}

.pt-dci__notice.is-error {
   border-color: rgba(239, 108, 119, 0.5);
   background: rgba(239, 108, 119, 0.1);
   color: #ffb0aa;
}

.pt-dci__notice[hidden] {
   display: none;
}

.pt-dci__summary {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 1rem;
   margin-bottom: 12px;
}

.pt-dci__streak {
   display: flex;
   align-items: baseline;
   gap: 0.4rem;
}

.pt-dci__streak-num {
   font-size: 2.2rem;
   font-weight: 800;
   line-height: 1;
   color: var(--color-hero-gold);
   font-variant-numeric: tabular-nums;
}

.pt-dci__streak-label {
   color: rgba(255, 255, 255, 0.6);
   font-size: 0.78rem;
   letter-spacing: 0.06em;
   text-transform: uppercase;
}

.pt-dci__next {
   display: grid;
   gap: 0.2rem;
   text-align: right;
   color: rgba(255, 255, 255, 0.7);
   font-size: 0.78rem;
   line-height: 1.35;
}

.pt-dci__month-row {
   display: flex;
   align-items: center;
   justify-content: space-between;
   margin-bottom: 8px;
}

.pt-dci__month {
   font-size: 1rem;
   font-weight: 700;
   color: #fff;
}

.pt-dci__nav {
   display: grid;
   place-items: center;
   width: 2rem;
   height: 2rem;
   border: 1px solid rgba(255, 255, 255, 0.16);
   border-radius: 50%;
   background: transparent;
   color: #fff;
   font-size: 1.3rem;
   line-height: 1;
   cursor: pointer;
}

.pt-dci__nav:disabled {
   opacity: 0.3;
   cursor: default;
}

.pt-dci__grid {
   display: grid;
   grid-template-columns: repeat(7, 1fr);
   gap: 6px;
}

.pt-dci__wd {
   padding: 2px 0 4px;
   color: rgba(255, 255, 255, 0.5);
   font-size: 0.68rem;
   font-weight: 700;
   letter-spacing: 0.06em;
   text-align: center;
   text-transform: uppercase;
}

.pt-dci__day {
   position: relative;
   display: grid;
   place-items: center;
   min-height: 46px;
   border: 1px solid rgba(255, 255, 255, 0.06);
   border-radius: 10px;
   background: #1d1e24;
   color: rgba(255, 255, 255, 0.55);
   font-size: 0.85rem;
   font-variant-numeric: tabular-nums;
}

.pt-dci__day.is-done {
   background: rgba(47, 158, 99, 0.2);
   border-color: rgba(47, 158, 99, 0.7);
   color: #8ff0bd;
   font-weight: 800;
}

.pt-dci__day.is-missed {
   background: rgba(184, 51, 44, 0.12);
   color: rgba(255, 140, 130, 0.6);
}

.pt-dci__day.is-today {
   box-shadow: inset 0 0 0 2px var(--color-hero-gold);
   color: #fff;
   font-weight: 800;
}

.pt-dci__day.is-future {
   opacity: 0.45;
}

.pt-dci__day.is-bonus::after {
   content: "\25C6";
   position: absolute;
   top: 3px;
   right: 5px;
   color: var(--color-hero-gold);
   font-size: 0.55rem;
}

.pt-dci__foot {
   display: grid;
   grid-template-columns: minmax(0, 1fr) auto;
   align-items: center;
   gap: 12px;
   margin-top: 14px;
}

.pt-dci__legend {
   display: flex;
   flex-wrap: wrap;
   gap: 0.4rem 0.9rem;
   margin: 0;
   color: rgba(255, 255, 255, 0.6);
   font-size: 0.72rem;
   text-transform: none;
}

.pt-dci__legend-item::before {
   content: "";
   display: inline-block;
   width: 0.6rem;
   height: 0.6rem;
   margin-right: 0.35rem;
   border-radius: 3px;
   vertical-align: middle;
}

.pt-dci__legend-item--done::before   { background: rgba(47, 158, 99, 0.8); }
.pt-dci__legend-item--missed::before { background: rgba(184, 51, 44, 0.5); }
.pt-dci__legend-item--bonus::before  { content: "\25C6"; width: auto; height: auto; color: var(--color-hero-gold); font-size: 0.6rem; border-radius: 0; }

.pt-dci__claim {
   padding: 0.8rem 1.4rem;
   border: 0;
   border-radius: 999px;
   background: var(--color-hero-gold);
   color: #151515;
   font-family: inherit;
   font-size: 0.9rem;
   font-weight: 800;
   letter-spacing: 0.03em;
   cursor: pointer;
   box-shadow: 0 8px 22px rgba(239, 198, 102, 0.25);
   transition: transform 0.15s, filter 0.15s;
}

.pt-dci__claim:not(:disabled):hover {
   transform: translateY(-1px);
   filter: brightness(1.06);
}

.pt-dci__claim:disabled {
   background: #2a2b33;
   color: #8a8d99;
   box-shadow: none;
   cursor: not-allowed;
}

.pt-dci__rules {
   margin: 12px 0 0;
   color: rgba(255, 255, 255, 0.45);
   font-size: 0.72rem;
   line-height: 1.5;
   text-transform: none;
}

.pt-dci__rules a {
   color: var(--color-hero-gold);
}

@media (max-width: 560px) {
   .pt-dci { padding: 10px; }
   .pt-dci__dialog { max-height: calc(100dvh - 20px); border-radius: 16px; }
   .pt-dci__head { padding: 18px 18px 14px; }
   .pt-dci__title { margin-top: 0; font-size: 1.25rem; padding-right: 2.5rem; }
   .pt-dci__body { padding: 12px 14px 16px; }
   .pt-dci__grid { gap: 4px; }
   .pt-dci__day { min-height: 40px; border-radius: 8px; font-size: 0.78rem; }
   .pt-dci__foot { grid-template-columns: 1fr; }
   .pt-dci__claim { width: 100%; }
   .pt-dci__summary { align-items: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
   .pt-dci__dialog { animation: none; }
}

/* -----------------------------------------------------
   12. 시즌 아바타 상점 (pages/howtogetpoints.php .pt-shop)  2026-09-09
   -----------------------------------------------------
   USD 5 / 10 / 20 묶음마다 상품 3개. 사는 곳은 /carts?item=<code>.
   + 친구 초대 카드를 링크로 (.user-guide__card--link)
   ----------------------------------------------------- */

.user-guide__card--link {
   display: block;
   color: inherit;
   text-decoration: none;
   cursor: pointer;
   transition: transform 0.2s, box-shadow 0.2s;
}

.user-guide__card--link:hover {
   transform: translateY(-2px);
   box-shadow: 0 14px 30px rgba(0, 0, 0, 0.25);
}

.user-guide__card-cta {
   display: inline-block;
   margin-top: 0.6rem;
   color: #701629;
   font-size: 0.85rem;
   font-weight: 700;
   text-transform: none;
}

.pt-shop {
   display: grid;
   gap: 2rem;
   margin: 0 0 2rem;
   color: #161616;                      /* user-guide 본문은 흰 배경 */
}

.pt-shop__tier-head {
   display: flex;
   flex-wrap: wrap;
   align-items: baseline;
   justify-content: space-between;
   gap: 0.5rem 1rem;
   margin-bottom: 0.9rem;
   padding-bottom: 0.5rem;
   border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}

.pt-shop__tier-head h3 {
   margin: 0;
   font-size: 1.15rem;
   font-weight: 800;
   letter-spacing: 0.02em;
}

.pt-shop__tier-head p {
   margin: 0;
   font-size: 0.85rem;
   color: #6b6461;
   text-transform: none;
}

.pt-shop__tier-head strong {
   color: #8e1c23;
}

.pt-shop__grid {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: 1rem;
   max-width: 56rem;                    /* 카드가 너무 커지지 않게 (세로 3:4 그림) */
   margin: 0;
   padding: 0;
   list-style: none;
}

.pt-shop__item {
   display: flex;
   flex-direction: column;
   overflow: hidden;
   border: 1px solid rgba(0, 0, 0, 0.1);
   border-radius: 0.9rem;
   background: #fff;
   box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06);
   transition: transform 0.2s, box-shadow 0.2s;
}

.pt-shop__item:hover {
   transform: translateY(-3px);
   box-shadow: 0 14px 30px rgba(0, 0, 0, 0.12);
}

.pt-shop__item.is-soldout {
   opacity: 0.55;
}

/* 카드 안의 그림은 예전의 절반 크기다 (2026-09-09 CK). 원래 크기는 누르거나
   마우스를 올렸을 때 뜨는 모달(§16 .pt-avlb)이 보여 준다. 카드 폭·글자는 그대로 두고
   그림만 줄여서 목록이 짧아지고 한눈에 들어오게 했다. */
.pt-shop__figure {
   position: relative;
   width: 50%;
   margin: 0.85rem auto 0.2rem;
   aspect-ratio: 3 / 4;
   overflow: hidden;
   border-radius: 0.6rem;
   background: #111;
}

.pt-shop__figure img {
   display: block;
   width: 100%;
   height: 100%;
   object-fit: cover;
}

/* 그림 = 확대 버튼 */
.pt-shop__zoom {
   display: block;
   width: 100%;
   height: 100%;
   padding: 0;
   border: 0;
   background: none;
   cursor: zoom-in;
   -webkit-tap-highlight-color: transparent;
}

.pt-shop__zoom img {
   transition: transform 0.25s ease;
}

.pt-shop__zoom:hover img,
.pt-shop__zoom:focus-visible img {
   transform: scale(1.06);
}

.pt-shop__zoom:focus-visible {
   outline: 2px solid #701629;
   outline-offset: 2px;
}

.pt-shop__flag {
   position: absolute;
   top: 0.6rem;
   left: 0.6rem;
   padding: 0.2rem 0.55rem;
   border-radius: 999px;
   background: rgba(0, 0, 0, 0.7);
   color: #fff;
   font-size: 0.7rem;
   font-weight: 700;
   letter-spacing: 0.04em;
   text-transform: uppercase;
}

.pt-shop__body {
   display: flex;
   flex-direction: column;
   gap: 0.4rem;
   padding: 0.85rem 0.9rem 1rem;
}

.pt-shop__name {
   margin: 0;
   font-size: 0.95rem;
   font-weight: 800;
   text-transform: none;
}

.pt-shop__meta {
   margin: 0;
   font-size: 0.75rem;
   line-height: 1.4;
   color: #6b6461;
   text-transform: none;
}

.pt-shop__btn {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   margin-top: auto;
   padding: 0.6rem 0.9rem;
   border-radius: 999px;
   background: #701629;
   color: #fff;
   font-size: 0.82rem;
   font-weight: 800;
   letter-spacing: 0.03em;
   text-decoration: none;
   text-transform: none;
}

.pt-shop__btn:hover {
   background: #8e1c23;
}

.pt-shop__btn.is-off {
   background: rgba(0, 0, 0, 0.08);
   color: rgba(0, 0, 0, 0.4);
   cursor: default;
}

@media (max-width: 40rem) {
   .pt-shop__grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0.6rem;
   }

   .pt-shop__body {
      padding: 0.6rem 0.65rem 0.75rem;
   }
}

/* -----------------------------------------------------
   13. 모바일 My Account 전체 페이지 (pages/account.php, include/nav.php $nav_back)  2026-09-09
   -----------------------------------------------------
   좁은 화면(64rem 이하)에서는 modal.js 가 My Account 를 팝업 대신 /account 로 보낸다
   (포커 로비와 같은 방식). 그 페이지의 네비는 "메뉴 | 로고 | 뒤로가기":
   언어 메뉴 자리에 .hero-nav__back 을 놓는다. PC 폭에서는 아무것도 바뀌지 않는다.
   탭 드롭다운(.pt-tabdd)은 signup.css 에 있다.
   ----------------------------------------------------- */

.hero-nav__back {
   display: none;
}

@media (max-width: 64rem) {
   .hero-nav--back .hero-nav__language {
      display: none;
   }

   .hero-nav__back {
      grid-column: 3;
      grid-row: 1;
      align-self: center;
      justify-self: end;
      display: inline-flex;
      align-items: center;
      gap: 0.4rem;
      min-height: 2.75rem;
      padding: 0 0.15rem 0 0.7rem;
      color: var(--color-hero-gold-soft, #efc666);
      font-family: var(--font-body, "Inter", system-ui, sans-serif);
      font-size: 0.72rem;
      font-weight: 700;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      text-decoration: none;
      -webkit-tap-highlight-color: transparent;
   }

   .hero-nav__back-arrow {
      font-size: 1.35rem;
      line-height: 1;
      transform: translateY(-0.05rem);
   }

   .hero-nav__back:active {
      opacity: 0.7;
   }

   /* 전체 창: 하단 액션바(Account · 로비 · Get Points)를 치우고 본문을 네비 바로 밑에서 시작한다.
      body 클래스는 controllers/Account.php 가 팝업 밖일 때만 붙인다. */
   body.pt-account-full .mobile-action-bar {
      display: none;
   }

   body.pt-account-full .pt-account {
      padding-top: calc(var(--hero-mobile-nav-height, 4.75rem) + 18px);
      padding-bottom: 48px;
   }

   body.pt-account-full .pt-account__head {
      margin-bottom: 14px;
   }
}

/* -----------------------------------------------------
   14. 네비 Check-in 선물 아이콘 (include/nav.php $pt_gift_icon)  2026-09-09
   -----------------------------------------------------
   CHECK-IN 글자 왼쪽의 선물 상자. 아이콘 파일이 아니라 인라인 SVG 라 색은
   글자색(currentColor)을 그대로 따라간다 — PC 네비(금색), 모바일 서랍 모두.

   가만히 두면 7초에 한 번 상자가 흔들리고 뚜껑이 살짝 열리며 반짝인다.
   오늘 출석을 아직 안 했으면 checkin.js 가 링크에 .is-pending 을 붙여
   주기를 당기고 금색 잔광을 준다. 출석하면(:pt:checkin 이벤트) 뗀다.
   prefers-reduced-motion 이면 전부 멈추고 아이콘만 남는다.
   ----------------------------------------------------- */

.pt-gift {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   margin-inline-end: 0.4em;
   line-height: 0;
}

.pt-gift__svg {
   width: 1.55em;
   height: 1.55em;
   overflow: visible;
}

.pt-gift__box,
.pt-gift__lid,
.pt-gift__spark {
   transform-box: fill-box;
   transform-origin: center;
}

.pt-gift__lid {
   transform-origin: 50% 100%;
}

.pt-gift__box {
   animation: pt-gift-wobble 7s ease-in-out infinite;
}

.pt-gift__lid {
   animation: pt-gift-lid 7s ease-in-out infinite;
}

.pt-gift__spark {
   opacity: 0;
   animation: pt-gift-spark 7s ease-in-out infinite;
}

.pt-gift__spark--b {
   animation-delay: 0.28s;
}

/* 오늘 아직 출석 전 : 더 자주, 금색 잔광까지 */
.is-pending .pt-gift__box,
.is-pending .pt-gift__lid,
.is-pending .pt-gift__spark {
   animation-duration: 3.4s;
}

.is-pending .pt-gift__svg {
   animation: pt-gift-glow 2.2s ease-in-out infinite;
}

/* 마우스를 올리면 바로 한 번 튄다 */
.hero-nav__link--checkin:hover .pt-gift__box,
.hero-nav__mobile-checkin:hover .pt-gift__box {
   animation: pt-gift-pop 0.5s var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1));
}

.hero-nav__link--checkin:hover .pt-gift__lid,
.hero-nav__mobile-checkin:hover .pt-gift__lid {
   animation: pt-gift-lid-pop 0.5s var(--ease-out, cubic-bezier(0.22, 1, 0.36, 1));
}

@keyframes pt-gift-wobble {
   0%, 70%, 100% { transform: rotate(0) translateY(0); }
   74%           { transform: rotate(-9deg) translateY(-0.5px); }
   78%           { transform: rotate(8deg); }
   82%           { transform: rotate(-6deg); }
   86%           { transform: rotate(4deg); }
   90%           { transform: rotate(0); }
}

@keyframes pt-gift-lid {
   0%, 72%, 100% { transform: translateY(0) rotate(0); }
   77%           { transform: translateY(-2.8px) rotate(-9deg); }
   85%           { transform: translateY(-1px) rotate(4deg); }
}

@keyframes pt-gift-spark {
   0%, 66%, 100% { opacity: 0; transform: scale(0.4); }
   74%           { opacity: 1; transform: scale(1); }
   84%           { opacity: 0; transform: scale(0.5); }
}

@keyframes pt-gift-glow {
   0%, 100% { filter: drop-shadow(0 0 0 rgba(239, 198, 102, 0)); }
   50%      { filter: drop-shadow(0 0 5px rgba(239, 198, 102, 0.8)); }
}

@keyframes pt-gift-pop {
   0%   { transform: scale(1) rotate(0); }
   35%  { transform: scale(1.16) rotate(-8deg); }
   70%  { transform: scale(1.06) rotate(5deg); }
   100% { transform: scale(1) rotate(0); }
}

@keyframes pt-gift-lid-pop {
   0%   { transform: translateY(0) rotate(0); }
   40%  { transform: translateY(-2.2px) rotate(-9deg); }
   100% { transform: translateY(0) rotate(0); }
}

/* 모바일 서랍의 "Daily Check-in" — 서랍 링크는 flex space-between 이라
   아이콘+글자를 한 덩어리(.hero-nav__mobile-label)로 묶어 왼쪽에 붙인다.
   서랍 글자는 흰색이지만 선물만 금색으로 둔다. */
.hero-nav__mobile-label {
   display: inline-flex;
   align-items: center;
}

.hero-nav__mobile-checkin .pt-gift {
   color: var(--color-hero-gold-soft, #efc666);
}

/* -----------------------------------------------------
   15. 일정 행의 돋보기 (include/schedule_rows.php)  2026-09-09
   -----------------------------------------------------
   이벤트에 URL 이 등록돼 있을 때만 참가비 오른쪽에 붙는다. 제목 링크와 같은
   주소이고 새 탭으로 열린다. 링크가 있다는 걸 알리려고 고리(ring)가 천천히
   퍼지고, 손을 올리면 금색으로 차오른다. /tournaments 와 홈 일정 탭 공통.
   ----------------------------------------------------- */

.schedule-event__buyin.has-peek {
   display: flex;
   align-items: center;
   justify-content: flex-end;
   gap: 0.5rem;
}

.schedule-event__buyin-amt {
   white-space: nowrap;
}

/* 같은 목록 안에서 링크 없는 행도 오른쪽 끝을 맞춘다 (돋보기 자리만큼 비워 둔다) */
.has-peek-col .schedule-event__buyin:not(.has-peek) {
   padding-inline-end: 2.4rem;
}

.schedule-event__peek {
   position: relative;
   flex: 0 0 auto;
   display: inline-grid;
   place-items: center;
   width: 1.9rem;
   height: 1.9rem;
   border: var(--rule-hair, 1px) solid rgba(226, 190, 104, 0.45);
   border-radius: 999px;
   background: rgba(226, 190, 104, 0.1);
   color: var(--color-hero-gold-soft, #efc666);
   text-decoration: none;
   transition: background-color 200ms ease, color 200ms ease, transform 200ms ease, border-color 200ms ease;
   -webkit-tap-highlight-color: transparent;
}

.schedule-event__peek-icon {
   position: relative;
   z-index: 1;
   display: block;
}

/* 천천히 퍼지는 고리 — "여기 눌러 볼 것이 있다" */
.schedule-event__peek-ring {
   position: absolute;
   inset: -2px;
   border: var(--rule-hair, 1px) solid rgba(226, 190, 104, 0.8);
   border-radius: inherit;
   opacity: 0;
   animation: pt-peek-ring 2.8s ease-out infinite;
   pointer-events: none;
}

.schedule-event__peek:hover,
.schedule-event__peek:focus-visible {
   background: var(--color-hero-gold-soft, #efc666);
   border-color: var(--color-hero-gold-soft, #efc666);
   color: #1a1206;
   transform: scale(1.08);
   outline: none;
}

.schedule-event__peek:active {
   transform: scale(0.96);
}

@keyframes pt-peek-ring {
   0%   { opacity: 0.85; transform: scale(1); }
   70%  { opacity: 0;    transform: scale(1.45); }
   100% { opacity: 0;    transform: scale(1.45); }
}

/* 좁은 화면 : 참가비 칸이 좁으므로 조금 줄인다 */
@media (max-width: 48rem) {
   .schedule-event__buyin.has-peek {
      gap: 0.35rem;
   }

   .schedule-event__peek {
      width: 1.6rem;
      height: 1.6rem;
   }

   .schedule-event__peek-icon {
      width: 13px;
      height: 13px;
   }

   .has-peek-col .schedule-event__buyin:not(.has-peek) {
      padding-inline-end: 1.95rem;
   }
}

/* -----------------------------------------------------
   16. 아바타 확대 모달 (avatars.js + pages/howtogetpoints.php)  2026-09-09
   -----------------------------------------------------
   카드 그림은 절반 크기(§12). 누르거나 마우스를 올리면 여기서 예전 크기(≈286px,
   세로 3:4)로 원본을 보여 준다. 마우스로 올린 미리보기(is-pinned 없음)는 레이어가
   마우스를 가로채지 않아야 그림에서 벗어날 때 바로 닫힌다 — pointer-events: none.
   클릭해서 고정한 것(is-pinned)만 배경·[X]·Esc 로 닫는다.
   ----------------------------------------------------- */

.pt-avlb {
   position: fixed;
   z-index: 2147483000;
   inset: 0;
   display: grid;
   place-items: center;
   padding: 1rem;
   opacity: 0;
   transition: opacity 0.16s ease;
   pointer-events: none;                /* 미리보기 상태 */
}

/* display:grid 가 브라우저 기본 [hidden]{display:none} 을 이기므로 여기서 다시 막는다.
   (안 그러면 닫은 뒤에도 투명한 레이어가 화면을 덮고 있다) */
.pt-avlb[hidden] {
   display: none;
}

.pt-avlb.is-open {
   opacity: 1;
}

.pt-avlb.is-pinned {
   pointer-events: auto;
}

.pt-avlb__backdrop {
   position: absolute;
   inset: 0;
   display: block;
   width: 100%;
   height: 100%;
   padding: 0;
   border: 0;
   background: rgba(8, 8, 10, 0.55);
   cursor: zoom-out;
}

.pt-avlb.is-pinned .pt-avlb__backdrop {
   background: rgba(8, 8, 10, 0.78);
}

.pt-avlb__figure {
   position: relative;
   margin: 0;
   width: min(86vw, 18rem);             /* ≈ 288px = 줄이기 전 카드 그림 크기 */
   max-height: 88vh;
   transform: scale(0.97);
   transition: transform 0.16s ease;
}

.pt-avlb.is-open .pt-avlb__figure {
   transform: scale(1);
}

/* 카드 그림은 잘라서(cover) 보여 주지만 확대 보기는 그림 전체가 보여야 하므로 contain */
.pt-avlb__img {
   display: block;
   width: 100%;
   aspect-ratio: 3 / 4;
   max-height: 78vh;
   object-fit: contain;
   border-radius: 0.9rem;
   background: #111;
   box-shadow: 0 30px 80px rgba(0, 0, 0, 0.55);
}

.pt-avlb__cap {
   margin-top: 0.6rem;
   color: #f4efe6;
   font-family: var(--font-body, "Inter", system-ui, sans-serif);
   font-size: 0.85rem;
   font-weight: 700;
   letter-spacing: 0.02em;
   text-align: center;
   text-transform: none;
   text-shadow: 0 2px 10px rgba(0, 0, 0, 0.6);
}

.pt-avlb__close {
   position: absolute;
   top: -0.9rem;
   right: -0.9rem;
   display: none;
   width: 2.2rem;
   height: 2.2rem;
   border: 0;
   border-radius: 999px;
   background: #f4efe6;
   color: #161616;
   font-size: 1.4rem;
   line-height: 1;
   cursor: pointer;
}

.pt-avlb.is-pinned .pt-avlb__close {
   display: block;
}

body.pt-avlb-open {
   overflow: hidden;
}

@media (max-width: 40rem) {
   .pt-avlb__figure {
      width: min(78vw, 18rem);
   }

   .pt-avlb__close {
      top: -0.7rem;
      right: -0.7rem;
   }
}

/* -----------------------------------------------------
   17. 토크노믹스 개정 (2026-09-26, CK 지시)
       - 멤버십 등급 표   include/membership_tiers.php  (/membership #points, /howToGetPoints #membership-plans)
       - 공정성 안내      include/fair_play.php         (로그인·가입 레이어 include/auth.php)
       - 출석 모달 이번 달 PTS 줄  include/checkin_widget.php [data-dci-cap]
   style.css 의 .membership__table 을 그대로 쓰고 여기서는 달라진 칸만 덮는다.
   ----------------------------------------------------- */
.pt-tiers__anchor {
   scroll-margin-top: calc(var(--hero-nav-height, 6rem) + 1rem);
}

.pt-tiers {
   /* 안의 .membership__visually-hidden(position:absolute)이 표 밖 문서 폭을 늘리지 않게 (모바일 가로 스크롤 방지) */
   position: relative;
}

.pt-tiers__table {
   min-width: 720px;
}

/* 등급 이름 칸은 <th scope="row"> — 머리글(빨강·대문자) 스타일을 풀고 본문처럼 */
.pt-tiers__table tbody th {
   color: var(--ug-ink, #171719);
   font-size: 1rem;
   font-weight: 700;
   letter-spacing: normal;
   text-transform: none;
   white-space: nowrap;
}

/* style.css 는 2번째 칸의 strong 을 키운다(예전 표). 새 표는 3번째 칸이 포인트 */
.pt-tiers__table td:nth-child(3) strong {
   color: var(--ug-ink, #171719);
   font-size: 1.12rem;
   white-space: nowrap;
}

.pt-tiers__table td:nth-child(2) {
   white-space: nowrap;
}

.pt-tiers__per {
   color: var(--ug-muted, #6b6b6b);
   font-size: 0.78rem;
}

.pt-tiers__badge {
   display: table;
   margin-top: 0.35rem;
   padding: 0.2rem 0.45rem;
   border-radius: 0.25rem;
   color: #1a1307;
   background: var(--color-hero-gold, #e0ae4f);
   font-size: 0.64rem;
   font-weight: 700;
   letter-spacing: 0.06em;
   text-transform: uppercase;
   vertical-align: middle;
   white-space: nowrap;
}

.pt-tiers__row--vip th,
.pt-tiers__row--vip td {
   background: rgba(224, 174, 79, 0.1);
}

.pt-tiers__row--free th,
.pt-tiers__row--free td {
   color: var(--ug-muted, #6b6b6b);
}

.membership__buy--quiet {
   border: 1px solid var(--ug-red, #701629);
   color: var(--ug-red, #701629);
   background: transparent;
}

.membership__buy--quiet:hover,
.membership__buy--quiet:focus-visible {
   color: var(--ug-white, #fff);
   background: var(--ug-red, #701629);
}

.pt-tiers__table td:nth-child(5) {
   min-width: 9.5rem;
}

.pt-tiers__table .membership__buy:not(.membership__buy--quiet) {
   white-space: nowrap;
}

/* 모바일: style.css 의 3칸 고정 표 규칙(760px 이하)이 6칸 표를 짓누르므로 등급별 카드로 쌓는다.
   항목 이름은 각 td 의 data-label (include/membership_tiers.php) */
@media (max-width: 760px) {
   .pt-tiers__table {
      min-width: 0;
      table-layout: auto;
   }

   .pt-tiers__table thead {
      display: none;
   }

   .pt-tiers__table tbody,
   .pt-tiers__table tr,
   .pt-tiers__table tbody th,
   .pt-tiers__table td {
      display: block;
      width: auto;
   }

   .pt-tiers__table tr {
      padding: 1rem 1.1rem;
      border-top: 1px solid var(--ug-line, #e5e2dc);
   }

   .pt-tiers__table tbody th,
   .pt-tiers__table td {
      padding: 0;
      border: 0;
      text-align: left;
   }

   .pt-tiers__table tbody th {
      width: auto !important;   /* style.css 모바일 규칙 th:nth-child(1) { width: 22% } 해제 */
      margin-bottom: 0.45rem;
      font-size: 1.05rem;
      white-space: normal;
   }

   .pt-tiers__table td {
      display: flex;
      justify-content: space-between;
      align-items: baseline;
      gap: 1rem;
      padding: 0.28rem 0;
      text-align: right;
      white-space: normal;
   }

   .pt-tiers__table td::before {
      content: attr(data-label);
      flex: 0 0 auto;
      color: var(--ug-red, #701629);
      font-size: 0.66rem;
      font-weight: 700;
      letter-spacing: 0.1em;
      text-align: left;
      text-transform: uppercase;
   }

   .pt-tiers__table td:nth-child(5) {
      min-width: 0;
   }

   .pt-tiers__v {
      min-width: 0;
   }

   /* VIP 줄 배경은 칸이 아니라 카드(tr) 전체에 */
   .pt-tiers__table tr.pt-tiers__row--vip {
      background: rgba(224, 174, 79, 0.1);
   }

   .pt-tiers__row--vip th,
   .pt-tiers__row--vip td {
      background: transparent;
   }

   .pt-tiers__v .pt-tiers__badge {
      margin-left: auto;
   }

   .pt-tiers__table td:last-child {
      justify-content: stretch;
      padding-top: 0.75rem;
   }

   .pt-tiers__table td:last-child::before {
      content: none;
   }

   .pt-tiers__table td:last-child .membership__buy {
      justify-content: center;
      width: 100%;
   }
}

/* 한국어·힌디어 제목이 낱말 중간에서 끊기지 않게 (§16 과 같은 방식) */
html:lang(ko) .membership__note h3,
html:lang(hi) .membership__note h3,
html:lang(ko) .pt-fair,
html:lang(hi) .pt-fair {
   word-break: keep-all;
}

p.pt-tiers__note {
   margin: 0.9rem 0 0;
   color: var(--ug-muted, #6b6b6b);
   font-size: 0.85rem;
   line-height: 1.55;
   text-transform: none;
}

/* ---- 공정성 안내 (로그인·가입 레이어) ---- */
.pt-fair {
   margin: 0 0 1.2rem;
   padding: 0.85rem 0.95rem;
   border: 1px solid rgba(224, 174, 79, 0.28);
   border-radius: 0.75rem;
   background: rgba(224, 174, 79, 0.07);
   text-align: left;
}

.login-view .pt-fair {
   margin: 1.1rem 0 0;
}

.pt-fair p.pt-fair__title {
   margin: 0 0 0.55rem;
   color: var(--color-hero-gold, #e0ae4f);
   font-size: 0.68rem;
   font-weight: 700;
   letter-spacing: 0.14em;
   text-transform: uppercase;
}

.pt-fair__list {
   display: grid;
   gap: 0.55rem;
   margin: 0;
   padding: 0;
   list-style: none;
}

.pt-fair__item {
   position: relative;
   padding-left: 1.05rem;
   color: var(--auth-ink-soft, rgba(246, 242, 234, 0.6));
   font-size: 0.78rem;
   line-height: 1.45;
}

/* 금색 마름모 — 아이콘 파일 없이 CSS 로 그린다 (§4-2 규칙) */
.pt-fair__item::before {
   content: "";
   position: absolute;
   top: 0.42em;
   left: 0.1rem;
   width: 0.42rem;
   height: 0.42rem;
   background: var(--color-hero-gold, #e0ae4f);
   transform: rotate(45deg);
}

.pt-fair__head {
   display: block;
   margin-bottom: 0.1rem;
   color: var(--auth-ink, #f6f2ea);
   font-size: 0.82rem;
   font-weight: 700;
}

.pt-fair__text strong {
   color: var(--auth-ink, #f6f2ea);
}

/* ---- 출석 모달: 이번 달 받은 PTS / 상한 ---- */
.pt-dci__cap {
   color: var(--color-hero-gold, #e0ae4f);
   font-weight: 600;
}

/* -----------------------------------------------------
   18. 언어 선택기 국기 — 색 필터 해제 (2026-09-26, CK 제보: 빨강이 형광초록으로 보임)
       style.css 의 .hero-nav__language img { filter: invert(88%) … hue-rotate … } 는 원래 단색 지구본 아이콘을
       금색으로 물들이려던 규칙인데, 같은 <details> 안의 국기 <img> 까지 반전시켜 빨강 → 청록/초록이 된다.
       국기는 class="hero-nav__language-flag" (include/nav.php — PC 드롭다운·모바일 드로어 모두) 이므로
       그 클래스만 필터를 끈다. 지구본·화살표 아이콘의 금색은 그대로.
   ----------------------------------------------------- */
img.hero-nav__language-flag,
.hero-nav__language img.hero-nav__language-flag,
.hero-nav__language-menu img.hero-nav__language-flag {
   filter: none !important;
}

/* 국기 + 언어 이름을 한 줄로 (2026-09-26, CK 제보: 국기와 이름이 두 줄로 밀림)
   style.css 가 .hero-nav__language img 를 display:block 으로, 메뉴 버튼을 block 으로 두어 국기가 이름 위로 올라갔다.
   PC 드롭다운(.hero-nav__language-menu)·모바일 드로어(.hero-nav__mobile-lang-menu) 모두 가로 한 줄로 */
.hero-nav__language-menu {
   width: auto;
   min-width: 9rem;
}

.hero-nav__language-menu button,
.hero-nav__mobile-lang-menu button {
   display: flex;
   align-items: center;
   gap: 0.55rem;
   width: 100%;
   white-space: nowrap;
}

.hero-nav__language-menu img.hero-nav__language-flag,
.hero-nav__mobile-lang-menu img.hero-nav__language-flag,
.hero-nav__mobile-label img.hero-nav__language-flag {
   display: inline-block;
   flex: 0 0 1.25rem;
   width: 1.25rem;
   height: 1.25rem;
   border-radius: 50%;
   object-fit: cover;
}

/* -----------------------------------------------------
   8. 모션 최소화
   ----------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
   /* .is-pending 규칙이 더 구체적이라 여기서도 같은 구체성으로 눌러 준다 */
   .pt-gift__box,
   .pt-gift__lid,
   .pt-gift__spark,
   .pt-gift__svg,
   .is-pending .pt-gift__box,
   .is-pending .pt-gift__lid,
   .is-pending .pt-gift__spark,
   .is-pending .pt-gift__svg,
   .hero-nav__link--checkin:hover .pt-gift__box,
   .hero-nav__link--checkin:hover .pt-gift__lid,
   .hero-nav__mobile-checkin:hover .pt-gift__box,
   .hero-nav__mobile-checkin:hover .pt-gift__lid,
   .schedule-event__peek-ring {
      animation: none;
      filter: none;
   }

   /* 고리 애니메이션을 끄면 안 보이므로 은은한 테두리로 남긴다 */
   .schedule-event__peek-ring {
      opacity: 0.5;
   }

   .pt-gift__spark {
      opacity: 0.9;
   }

   .jm-way,
   .schedule-tabs__tab,
   .pt-welcome,
   .pt-welcome__panel,
   .pt-avlb,
   .pt-avlb__figure,
   .pt-shop__zoom img {
      transition: none;
   }
}
