/*
 * G1 홈 보스 타일·빠른 참여 시트(PRD-038, 정본 screens/G1-홈.html·QJ1~QJ3·QJLogin1).
 * 마크업·값은 정본 그대로, 색만 board-tokens.css 변수. 홈 전용이라 board.css와 분리했다.
 */
.board-home-title { margin-top: 20px; font-family: 'Black Han Sans', sans-serif; font-size: 24px; line-height: 1.25; }
.board-home-sub { font-size: 13px; color: var(--board-text-dim); margin-top: 6px; }
.board-home-title--live { margin-top: 20px; font-size: 24px; }
.board-home-title--sub { margin-top: 28px; font-family: 'Gothic A1', sans-serif; font-size: 14px; font-weight: 800; color: var(--board-footer-text); line-height: normal; }
.board-home-sub--live { font-size: 12px; color: var(--board-text-faint); margin-top: 4px; }
/* 홈 "내 방" 카드(T0C 4-1 "홈 카드", TICKET-572 0-2 재구성) — 보스 이름이 제목, 오른쪽 위 인원,
   한마디, 칩 줄(상태만, "모집 중"은 숨김). 보스 그림은 카드 배경 모드(오른쪽 끝 150, 아래로 30 걸침,
   왼쪽 페이드) — 진행 중은 글로우(board.css `.pt-glow`), 예약은 글로우 없음+알+출발 시각 오버레이. */
/* min-height 없음(TICKET-574 1-2·1-3) — 정본 p2-MainLive·p2-MainReserved(canon-2026-10-08-canvas) 실측:
   카드 높이는 내용(제목+한마디+칩)만큼만 차지한다. 이전 `min-height:132px`는 정본에 없는 값이라 카드가
   불필요하게 커지고, 그 안에서 보스 그림(`bottom:-30`)이 상대적으로 작게 보이는 원인이었다. */
.board-active-card {
  margin-top: 12px; position: relative; overflow: hidden; background: var(--board-card-bg);
  border: 2px solid var(--board-accent); border-radius: var(--board-card-radius);
  padding: 16px 16px 16px 18px; display: flex; align-items: center; gap: 14px; box-sizing: border-box;
  text-decoration: none; box-shadow: 0 6px 16px var(--board-card-shadow-soft);
}
body.board-body a.board-active-card, body.board-body a.board-active-card:hover { color: var(--board-text); }
.board-active-card__bg { position: absolute; inset: 0; pointer-events: none; z-index: 0; }
.board-active-card__bgimg {
  position: absolute; right: 0; bottom: -30px; width: var(--board-card-bg-size-home); height: var(--board-card-bg-size-home);
  object-fit: contain; object-position: center; box-sizing: border-box;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 45%);
  mask-image: linear-gradient(to right, transparent 0%, #000 45%);
}
.board-active-card__bgimg[hidden] { display: none; }
.board-active-card__depart-overlay {
  position: absolute; right: 0; bottom: -30px; width: var(--board-card-bg-size-home); height: var(--board-card-bg-size-home);
  display: flex; align-items: flex-end; justify-content: center; padding-bottom: 40px; box-sizing: border-box; z-index: 2;
}
.board-active-card__depart-overlay[hidden] { display: none; }
.board-active-card__depart-overlay > span {
  display: flex; flex-direction: column; align-items: center; line-height: 1;
  font-family: var(--board-font-mono); font-weight: 700; color: var(--board-text); white-space: nowrap;
  text-shadow: 0 1px 3px var(--board-scrim), 0 0 10px var(--board-scrim);
}
.board-active-card__depart-ap { font-size: 11px; margin-bottom: 3px; letter-spacing: .5px; }
.board-active-card__depart-clock { font-size: 24px; letter-spacing: -1px; }
.board-active-card__info {
  position: relative; z-index: 1; display: flex; flex-direction: column; gap: 6px; flex: 1; min-width: 0;
  text-shadow: 0 1px 2px var(--board-scrim), 0 0 8px var(--board-scrim);
} /* 정본 p2-MainLive info 블록 text-shadow(TICKET-575) — 보스 그림 위 인원수 배지 등 글자 가독성, 값은 board.css `.board-post-card__boss-col`과 같은 토큰 치환 */
.board-active-card__title-row { display: flex; align-items: center; gap: 6px; }
.board-active-card__boss-name { font-family: var(--board-font-display); font-size: 24px; line-height: 1.15; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.board-active-card .board-chip { font-size: 12px; }  /* 정본 p2-MainLive 칩 12px(공통 칩 11px보다 큼) */
.board-active-card__num { margin-left: auto; flex-shrink: 0; font-family: var(--board-font-mono); font-weight: 700; font-size: 22px; line-height: 1; letter-spacing: -1px; color: var(--board-time); }
.board-active-card__cap { color: var(--board-time); opacity: .7; font-size: 13px; margin-left: 4px; }
.board-active-card__oneliner { font-size: 13px; color: var(--board-text-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.board-active-card__chips:empty { display: none; }
/* 내 예약 레이드(p2-MainReserved) — 글로우 없는 카드(진행 중 카드와 같은 마크업, 테두리 1px). */
.board-reserved-head { margin-top: 20px; display: flex; align-items: baseline; justify-content: space-between; }
/* 진행 중 글로우 카드 아래(p2-MainLiveReserved margin-top:22px) — 예약만 있을 때(p2-MainReserved)는 20px */
.board-reserved-head--after-live { margin-top: 22px; }
.board-reserved-head__title { font-size: 13px; font-weight: 800; color: var(--board-text-dim); }
.board-reserved-head__hint { font-size: 12px; color: var(--board-text-faint); }
.board-active-card--reserved { margin-top: 8px; background: var(--board-reserved-bg); border: 1px solid var(--board-reserved-border); box-shadow: 0 6px 16px var(--board-card-shadow-soft); }
.board-home-title--after-reserved { margin-top: 26px; }
.board-tiles--locked { opacity: .35; pointer-events: none; filter: grayscale(.6); }
.board-btn-locked, .board-btn-locked:disabled { background: var(--board-btn-secondary-bg); color: var(--board-footer-text); cursor: default; }
/* 정본 p2-MainLive 비활성 [레이드 만들기]는 배경·글자색만 바뀌고 투명도는 없다 — 공통 `.btn[aria-disabled]`의 opacity .55를 이 버튼만 끈다(TICKET-566) */
.btn.board-btn-locked[aria-disabled="true"] { opacity: 1; }
.board-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 16px; }
.board-tiles[hidden], .board-tiles-empty[hidden] { display: none; }
.board-tiles-empty { font-size: 14px; color: var(--board-text-dim); margin-top: 24px; }
.board-tile {
  appearance: none; -webkit-appearance: none; cursor: pointer; font: inherit; color: inherit;
  background: var(--board-card-bg); border: 1px solid var(--board-surface-border); border-radius: 16px;
  padding: 12px 6px 10px; display: flex; flex-direction: column; align-items: center; gap: 6px;
  text-align: center; flex-shrink: 0; box-sizing: border-box; min-width: 0;
}
/* 눌린 타일 강조(정본 QJLogin1) — 누르는 순간(:active)과 로그인 이동·시트가 열려 있는 동안(.is-picked) */
.board-tile:active, .board-tile.is-picked { border: 2px solid var(--board-accent); box-shadow: 0 0 0 4px var(--board-accent-ring); padding: 11px 5px 9px; }
.board-tile__name { font-size: 14px; font-weight: 800; word-break: keep-all; }

/* ── 빠른 참여 확인 시트(QJ1~QJ3) — 바깥 틀(스크림·시트·손잡이)은 공용 `.board-sheet*`
   (board.css, `board_bottom_sheet` 매크로, T0C 4-3, TICKET-572 0-2) — 여기는 제목 줄 아래부터만. ── */
.board-qj-sheet__head { display: flex; align-items: baseline; justify-content: space-between; }
.board-qj-sheet__title { font-family: 'Black Han Sans', sans-serif; font-size: 22px; }
.board-qj-sheet__close { appearance: none; background: none; border: 0; padding: 0; font: inherit; font-size: 13px; color: var(--board-text-faint); cursor: pointer; }
.board-qj-sheet__sub { font-size: 13px; color: var(--board-text-dim); word-break: keep-all; }
.board-qj-room {
  background: var(--board-card-bg); border: 1px solid var(--board-surface-border); border-radius: 16px;
  padding: 14px; display: flex; align-items: center; gap: 12px;
  position: relative; overflow: hidden;
}
/* 보스 그림(카드 배경 모드, TICKET-574 1-5) — 정본 p2-QJ1: 오른쪽 아래 118·왼쪽 페이드(다른 카드 배경 모드와 같은 규칙). */
.board-qj-room__bgimg {
  position: absolute; right: 0; bottom: -26px; width: var(--board-card-bg-size-qj); height: var(--board-card-bg-size-qj);
  object-fit: contain; object-position: center; pointer-events: none; z-index: 0;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 45%);
  mask-image: linear-gradient(to right, transparent 0%, #000 45%);
}
.board-qj-room__bgimg[hidden] { display: none; }
.board-qj-room__info { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 0; }
.board-qj-room__row1 { display: flex; align-items: center; gap: 4px; }
.board-qj-room__title { font-size: 19px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.board-qj-room__left { font-size: 14px; font-weight: 800; color: var(--board-time); white-space: nowrap; margin-left: auto; }
.board-qj-room__tagline { font-size: 14px; color: var(--board-text-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.board-qj-room__host { display: flex; align-items: center; gap: 4px; font-size: 13px; color: var(--board-text-dim); min-width: 0; }
.board-qj-room__chip { font-size: 11px; font-weight: 800; color: var(--board-rule); background: var(--board-rule-bg); border-radius: 6px; padding: 3px 7px; white-space: nowrap; }
.board-qj-room__chip[hidden] { display: none; }
.board-qj-join {
  height: 52px; border: none; border-radius: 16px; background: var(--board-accent); color: var(--board-accent-ink);
  font-family: 'Gothic A1', sans-serif; font-weight: 800; font-size: 15px; cursor: pointer;
}
.board-qj-join:disabled { background: var(--board-btn-secondary-bg); color: var(--board-footer-text); cursor: not-allowed; }
.board-qj-check {
  display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 14px;
  background: var(--board-surface); border: 1px solid var(--board-surface-border); cursor: pointer;
}
.board-qj-check--on { border-color: var(--board-rule); }
.board-qj-check__input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.board-qj-check__box {
  width: 22px; height: 22px; border-radius: 6px; border: 2px solid var(--board-footer-text); flex-shrink: 0; box-sizing: border-box;
  display: inline-flex; align-items: center; justify-content: center; color: transparent;
}
.board-qj-check--on .board-qj-check__box { background: var(--board-rule); border-color: var(--board-rule); color: var(--board-rule-bg); }
.board-qj-check__input:focus-visible + .board-qj-check__box { outline: 2px solid var(--board-link); outline-offset: 2px; }
.board-qj-check__text { display: flex; flex-direction: column; gap: 3px; }
.board-qj-check__label { font-size: 14px; font-weight: 800; }
.board-qj-check__desc { font-size: 12px; line-height: 1.5; color: var(--board-text-dim); word-break: keep-all; }
/* 홈 "내 방" 카드 나라 칩(A4, 10-08 버그 수정) — 보스 줄 안 작은 지구본 */
.board-active-card__globe { display: inline-flex; align-items: center; margin-left: 4px; flex-shrink: 0; }
.board-active-card__globe[hidden] { display: none; }