/* =========================================================
   api.css — 퍼블리싱에 없던 것만 (서버가 회원 사이트 <head> 에 붙여요)
   퍼블리싱 css(tokens · components · layout · pages)는 고치지 않아요.
   ========================================================= */

/* 홈 게임 줄 (.rail · 라이브 카지노 · 인기 슬롯): 스크롤 바 숨김 (결정 슬라이드-1) — 넘기기는 자동 · ‹ › · 손가락 밀기 그대로 */
.rail { scrollbar-width: none; -ms-overflow-style: none; }
.rail::-webkit-scrollbar { display: none; }
/* 사이드 메뉴 (PC .side · 휴대폰 메뉴 .drawer-panel): 스크롤 바 숨김 (결정 슬라이드-3) — 휠 · 손가락으로 내리기는 그대로 */
.side, .drawer-panel { scrollbar-width: none; -ms-overflow-style: none; }
.side::-webkit-scrollbar, .drawer-panel::-webkit-scrollbar { display: none; }

/* 게임 카드 즐겨찾기 별 (결정 게임사-8): 카드 오른쪽 위 · 마우스를 올리면 보이고 · 담은 게임은 늘 노란 별
   휴대폰(마우스 없음)에서는 늘 보여요. 별은 api.js 가 카드마다 붙여요. */
.ws-game-fav { position: absolute; top: 6px; right: 6px; z-index: 4; width: 28px; height: 28px; padding: 0; border: 0; border-radius: 50%; display: grid; place-items: center; background: rgba(6, 8, 30, .55); color: var(--ink, #f3f4ff); cursor: pointer; opacity: 0; transition: opacity .18s, transform .12s, color .12s; }
.ws-game-fav svg { width: 16px; height: 16px; display: block; }
.ws-game-fav svg path { fill: none; stroke: currentColor; stroke-width: 2; stroke-linejoin: round; }
.ws-game:hover .ws-game-fav, .ws-game:focus-visible .ws-game-fav, .ws-game-fav:focus-visible, .ws-game-fav[aria-pressed="true"] { opacity: 1; }
.ws-game-fav[aria-pressed="true"] { color: var(--yellow-400, #ffcc1a); }
.ws-game-fav[aria-pressed="true"] svg path { fill: currentColor; }
.ws-game-fav:hover { color: var(--yellow-400, #ffcc1a); }
.ws-game-fav:active { transform: scale(.88); }
.ws-game-fav.is-busy { pointer-events: none; opacity: .6; }
@media (hover: none) { .ws-game-fav { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .ws-game-fav { transition: none; } }

/* 휴면 안내 팝업 (#modal-dormant · 결정 휴면-4): '완료 안내' 팝업과 같은 모양 — 체크 대신 느낌표 · 산호색 */
#modal-dormant { z-index: 76; }
.done-mark.is-warn { color: var(--coral-500, #ff6b6b); background: color-mix(in srgb, var(--coral-500, #ff6b6b) 16%, transparent); box-shadow: 0 0 0 8px color-mix(in srgb, var(--coral-500, #ff6b6b) 7%, transparent); }
.done-eyebrow.is-warn { color: var(--coral-500, #ff6b6b); }

/* 회원 목록 쪽 나누기 (결정 쪽-1 ~ 6): 퍼블리싱 .pager 그대로 — 한 쪽뿐이면 숨김 · 목록과 붙지 않게 */
nav.pager[data-pg][hidden] { display: none; }
nav.pager[data-pg^="points-"], nav.pager[data-pg="notes"] { margin-top: 12px; }

/* 게임 화면 · 휴대폰 (결정 게임화면-1 ~ 4) — 퍼블리싱 .gm-* 는 그대로, 높이 계산만 바꿔요
   - 퍼블리싱은 calc(100vh - 112px): 아이폰 Safari 의 100vh 는 '주소창 · 아래 바가 숨었을 때' 높이라서
     바가 보이는 동안 게임이 화면보다 길어져 아래가 잘리고, 바깥 페이지가 밀리면 위는 머리 줄 밑으로 숨어요.
   - 그래서: 페이지 = 실제로 보이는 높이(100dvh · 옛 브라우저는 api.js 가 innerHeight)로 고정하고 스크롤 없음,
     머리 줄 아래 남은 칸을 게임이 꽉 채워요. 노치(안전 영역)는 비우고, 손가락은 전부 게임으로 가요.
   - html.gm-fill = 꽉 채우기(머리 · 잔액 줄 숨김) — 아이폰 ⛶ · 가로 화면 처음. 왼쪽 위 .gm-unfill 로 되돌려요 (api.js) */
.gm-unfill { display: none; }
@media (max-width: 1023px) {
  .game-body { display: flex; flex-direction: column; height: 100vh; height: 100dvh; min-height: 0; overflow: hidden; overscroll-behavior: none; }
  .game-body .gm-hd { position: relative; flex: 0 0 auto; padding-top: max(8px, env(safe-area-inset-top, 0px)); padding-left: max(12px, env(safe-area-inset-left, 0px)); padding-right: max(12px, env(safe-area-inset-right, 0px)); }
  .game-body .gm-stage { position: relative; flex: 1 1 auto; min-height: 0; height: auto; padding: 0; background: #000; overflow: hidden; }
  .game-body .gm-frame, .game-body .gm-empty { position: absolute; top: 0; left: env(safe-area-inset-left, 0px); width: calc(100% - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px)); height: calc(100% - env(safe-area-inset-bottom, 0px)); }
  .game-body .gm-empty { border: 0; }
  @supports (height: 100dvh) { .game-body .modal-box { max-height: 92dvh; } }
  html.gm-fill .game-body .gm-hd { display: none; }
  html.gm-fill .gm-unfill { position: fixed; z-index: 60; top: calc(env(safe-area-inset-top, 0px) + 8px); left: calc(env(safe-area-inset-left, 0px) + 8px); width: 36px; height: 36px; padding: 0; display: grid; place-items: center; border-radius: 10px; border: 1px solid rgba(255, 255, 255, .22); background: rgba(6, 8, 30, .55); color: var(--ink, #f3f4ff); opacity: .8; cursor: pointer; -webkit-tap-highlight-color: transparent; }
  html.gm-fill .gm-unfill:active { opacity: 1; transform: scale(.92); }
  .gm-unfill svg { width: 18px; height: 18px; display: block; }
}
/* 가로 화면: 퍼블리싱은 머리 줄을 숨겨요 → 꽉 채우기가 아닐 때(되돌리기를 누른 뒤)는 한 줄로 보여요 */
@media (max-width: 1023px) and (orientation: landscape) {
  html:not(.gm-fill) .game-body .gm-hd { display: flex; flex-wrap: nowrap; height: 56px; padding-top: 0; padding-bottom: 0; }
  html:not(.gm-fill) .game-body .gm-actions { order: 2; flex: 0 0 auto; }
  html:not(.gm-fill) .game-body .gm-full { order: 3; }
  .game-body .gm-frame, .game-body .gm-empty { height: calc(100% - env(safe-area-inset-bottom, 0px)); }
}