/* ════════════════════════════════════════════════
   주식왕 — 세로형 모바일 최적화 스타일시트
   ════════════════════════════════════════════════ */
:root {
  --bg: #0b0f19;
  --card: rgba(255,255,255,0.06);
  --border: rgba(255,255,255,0.10);
  --text: rgba(255,255,255,0.92);
  --muted: rgba(255,255,255,0.48);
  --accent: #78c8ff;
  --buy: #3ddc97;
  --sell: #ff5a7a;
  --radius: 14px;
  --topbar-h: calc(122px + env(safe-area-inset-top, 0px));
  --condition-banner-h: 0px;
  --news-h: 34px;
  --nav-h: 56px;
  /* iOS safe area */
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  /* AdMob 배너 높이 — 네이티브 배너 로드 성공 시 JS가 50px으로 변경 */
  --ad-banner-height: 0px;
}

[data-theme="light"] {
  --bg:     #f5f0e8;
  --card:   rgba(255,255,255,0.85);
  --border: rgba(0,0,0,0.10);
  --text:   rgba(20,20,20,0.90);
  --muted:  rgba(20,20,20,0.48);
  --accent: #1a6fb5;
  --buy:    #1a9e6a;
  --sell:   #d63050;
}

body.has-loan-banner { --topbar-h: calc(148px + env(safe-area-inset-top, 0px)); }

*,*::before,*::after { box-sizing: border-box; margin: 0; padding: 0; }

html,body {
  height: 100%;
  overscroll-behavior: none;
}

body.has-condition-banner { --condition-banner-h: 36px; }

body {
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", "Noto Sans KR", sans-serif;
  background:
    radial-gradient(900px 600px at 20% 5%,  rgba(120,200,255,.15), transparent 55%),
    radial-gradient(700px 500px at 85% 15%, rgba(61,220,151,.10), transparent 50%),
    var(--bg);
  color: var(--text);
  overflow: hidden;
  /* 전체 높이를 fixed layout으로 채움 */
  display: flex;
  flex-direction: column;
}

[data-theme="light"] body {
  background:
    radial-gradient(900px 600px at 20% 5%,  rgba(180,220,255,.20), transparent 55%),
    radial-gradient(700px 500px at 85% 15%, rgba(100,200,160,.12), transparent 50%),
    var(--bg);
}

/* ── 상단 헤더 ─────────────────────────────────── */
.topBar {
  position: fixed;
  top: var(--ad-banner-height); left: 0; right: 0;
  height: var(--topbar-h);
  z-index: 100;
  background: rgba(11,15,25,.97);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--border);
  padding: max(env(safe-area-inset-top, 0px), 15px) 14px 5px;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

[data-theme="light"] .topBar {
  background: rgba(245,240,232,.97);
}

/* ── 라이트 테마 구조 오버라이드 ─────────────────── */
[data-theme="light"] .bottomNav {
  background: rgba(245,240,232,.98);
}
[data-theme="light"] .marketControlBar,
[data-theme="light"] .marketSearchBar {
  background: rgba(245,240,232,.97);
}
[data-theme="light"] .marketSearchInput {
  background: rgba(0,0,0,.05);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23555' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 10px center;
}
[data-theme="light"] .sheetPanel {
  background: linear-gradient(180deg, #f8f3ec 0%, #f5f0e8 100%);
}
[data-theme="light"] .sheetHandleBar {
  background: rgba(0,0,0,.15);
}
[data-theme="light"] .newsFilterBar {
  background: rgba(245,240,232,.97);
}
[data-theme="light"] .genericModalPanel {
  background: linear-gradient(180deg, #f8f3ec 0%, #f5f0e8 100%);
}
[data-theme="light"] .genericModalHeader {
  background: rgba(248,243,236,.98);
}
[data-theme="light"] .commentInputArea {
  background: rgba(248,243,236,.98);
}
[data-theme="light"] .tradeHaltMsg {
  background: rgba(255,248,230,.95);
}
[data-theme="light"] .loanStatusCard,
[data-theme="light"] .loanInfoCard {
  background: rgba(255,255,255,.85);
  border: 1px solid rgba(0,0,0,.08);
}
[data-theme="light"] .loanFormLabel {
  color: rgba(20,20,20,.55);
}
[data-theme="light"] .loanInput {
  background: rgba(255,255,255,.9);
  border-color: rgba(0,0,0,.15);
  color: rgba(20,20,20,.9);
}
[data-theme="light"] .rankingRow2Pos:not(:empty) {
  color: rgba(0,0,0,.45);
}
[data-theme="light"] .rankingRow2Name {
  color: rgba(20,20,20,.9);
}
[data-theme="light"] .rankingRow2Assets {
  color: rgba(20,20,20,.75);
}
[data-theme="light"] .webOnlyAlertMsg {
  color: rgba(20,20,20,.7);
}
[data-theme="light"] .portCashVal      { color: var(--buy); }
[data-theme="light"] .portStockVal     { color: var(--sell); }
[data-theme="light"] .portDetailLabel  { color: rgba(20,20,20,.55); }
[data-theme="light"] .portAssetDivider { background: rgba(0,0,0,.08); }
[data-theme="light"] .portNetFormula   { color: rgba(20,20,20,.45); }
[data-theme="light"] .seasonInfo       { color: #8a6010; }
/* 뉴스 티커 — 기본 (아이보리 배경) */
[data-theme="light"] .newsStrip          { background: rgba(230,225,215,.97); border-bottom-color: rgba(0,0,0,.12); }
[data-theme="light"] .newsText           { color: rgba(20,20,20,.82); }
[data-theme="light"] .newsStripHint      { color: rgba(20,20,20,.30); }
/* 카테고리별 짙은 배경 → 흰 텍스트 유지 */
[data-theme="light"] .newsStrip[data-category="MACRO"],
[data-theme="light"] .newsStrip[data-category="ALERT"],
[data-theme="light"] .newsStrip[data-grade="HIGH"]   { background: rgba(180,20,35,.90); border-bottom-color: rgba(200,50,70,.5); }
[data-theme="light"] .newsStrip[data-category="SECTOR"],
[data-theme="light"] .newsStrip[data-category="SYS"],
[data-theme="light"] .newsStrip[data-grade="MEDIUM"] { background: rgba(20,60,140,.88); border-bottom-color: rgba(100,150,255,.45); }
[data-theme="light"] .newsStrip[data-category="COMPANY"],
[data-theme="light"] .newsStrip[data-category="LIFE"],
[data-theme="light"] .newsStrip[data-category="INFO"] { background: rgba(110,80,0,.82); border-bottom-color: rgba(200,160,50,.35); }
/* 카테고리 배경이 어두우면 텍스트는 흰색으로 */
[data-theme="light"] .newsStrip[data-category="MACRO"]   .newsText,
[data-theme="light"] .newsStrip[data-category="ALERT"]   .newsText,
[data-theme="light"] .newsStrip[data-grade="HIGH"]        .newsText,
[data-theme="light"] .newsStrip[data-category="SECTOR"]  .newsText,
[data-theme="light"] .newsStrip[data-category="SYS"]     .newsText,
[data-theme="light"] .newsStrip[data-grade="MEDIUM"]      .newsText,
[data-theme="light"] .newsStrip[data-category="COMPANY"] .newsText,
[data-theme="light"] .newsStrip[data-category="LIFE"]    .newsText,
[data-theme="light"] .newsStrip[data-category="INFO"]    .newsText { color: rgba(255,255,255,.92); }
[data-theme="light"] .newsStrip[data-category="MACRO"]   .newsStripHint,
[data-theme="light"] .newsStrip[data-category="ALERT"]   .newsStripHint,
[data-theme="light"] .newsStrip[data-grade="HIGH"]        .newsStripHint,
[data-theme="light"] .newsStrip[data-category="SECTOR"]  .newsStripHint,
[data-theme="light"] .newsStrip[data-category="SYS"]     .newsStripHint,
[data-theme="light"] .newsStrip[data-grade="MEDIUM"]      .newsStripHint,
[data-theme="light"] .newsStrip[data-category="COMPANY"] .newsStripHint,
[data-theme="light"] .newsStrip[data-category="LIFE"]    .newsStripHint,
[data-theme="light"] .newsStrip[data-category="INFO"]    .newsStripHint { color: rgba(255,255,255,.40); }
/* 대공황/슈퍼호황 body 상태 */
[data-theme="light"] body.market-crash .newsStrip { background: rgba(180,20,35,.15); }
[data-theme="light"] body.market-boom  .newsStrip { background: rgba(20,140,70,.12); }
/* 방향/상태 색상 유틸 */
[data-theme="light"] .textUp   { color: var(--sell) !important; }
[data-theme="light"] .textDown { color: var(--accent) !important; }
[data-theme="light"] .textFlat { color: rgba(20,20,20,.45) !important; }
/* 거래 태그 */
[data-theme="light"] .trTag.buy  { background: rgba(26,158,106,.12); color: #1a7a45; }
[data-theme="light"] .trTag.sell { background: rgba(214,48,80,.12);  color: var(--sell); }
[data-theme="light"] .trTag.gift { background: rgba(160,120,0,.12);  color: #8a6010; }
/* 즐겨찾기/별 */
[data-theme="light"] .bookmarkBtn.active { color: #8a6010; }
[data-theme="light"] .stockRowStar       { color: #8a6010; }
/* 랭킹 배지 */
[data-theme="light"] .rankBadge.top3 { background: rgba(160,120,0,.12); color: #7a5808; }
/* 시즌/타이틀 배지 */
[data-theme="light"] .seasonEndTitle   { color: #8a6010; }
[data-theme="light"] .loginSeasonBadge { background: rgba(160,120,0,.10); border-color: rgba(160,120,0,.25); color: #8a6010; }
[data-theme="light"] .titleBadge       { color: #7a5808; background: rgba(160,120,0,.12); border-color: rgba(160,120,0,.3); }
/* 역대 주식왕 HOF 모달 */
[data-theme="light"] .hofModalCard    { background: linear-gradient(160deg, #ffffff 0%, #f8f3ec 100%); }
[data-theme="light"] .hofModalHeader  { background: linear-gradient(90deg, rgba(160,120,0,.07) 0%, transparent 100%); }
[data-theme="light"] .hofModalClose   { background: rgba(0,0,0,.06); color: rgba(20,20,20,.6); }
[data-theme="light"] .hofModalClose:hover { background: rgba(0,0,0,.10); color: rgba(20,20,20,.9); }
[data-theme="light"] .hofLoadingMsg,
[data-theme="light"] .hofEmptyMsg,
[data-theme="light"] .hofErrorMsg     { color: rgba(20,20,20,.45); }
[data-theme="light"] .hofEntrySeason  { color: var(--muted); }
[data-theme="light"] .hofEntry:first-child  { background: rgba(180,140,0,.08); border-color: rgba(180,140,0,.22); }
[data-theme="light"] .hofEntry:nth-child(2) { background: rgba(100,100,100,.08); border-color: rgba(100,100,100,.18); }
[data-theme="light"] .hofEntry:nth-child(3) { background: rgba(140,90,40,.08); border-color: rgba(140,90,40,.18); }
[data-theme="light"] .hofEntry:first-child .hofEntryAssets  { color: #b08800; }
[data-theme="light"] .hofEntry:nth-child(2) .hofEntryAssets { color: #707070; }
[data-theme="light"] .hofEntry:nth-child(3) .hofEntryAssets { color: #9a5a1a; }
/* 뉴스 빈 상태 */
[data-theme="light"] .historyEmpty    { color: rgba(20,20,20,.45); }
/* 대출 하단 안내 문구 */
[data-theme="light"] .loanNote        { color: rgba(20,20,20,.45); }
/* 상점 카드 */
[data-theme="light"] .shopCard        { border-color: rgba(0,0,0,.10); }
[data-theme="light"] .shopCardName    { color: var(--text); }
[data-theme="light"] .shopCardFooter  { border-top-color: rgba(0,0,0,.08); }
[data-theme="light"] .shopCardPrice   { color: #8a6010; }
[data-theme="light"] .shopCardBtnSec  { background: rgba(0,0,0,.05); border-color: rgba(0,0,0,.12); }
[data-theme="light"] .shopCardAdBtn   { background: rgba(160,120,0,.10); color: #8a6010; border-color: rgba(160,120,0,.25); }
[data-theme="light"] .shopBtnAd       { background: rgba(160,120,0,.10); color: #8a6010; border-color: rgba(160,120,0,.20); }
[data-theme="light"] .shopCard        { background: rgba(255,255,255,.85); }
/* 테이블/리스트 구분선 */
[data-theme="light"] .dataTable th,
[data-theme="light"] .dataTable td    { border-bottom-color: rgba(0,0,0,.07); }
[data-theme="light"] .archiveRow      { border-bottom-color: rgba(0,0,0,.07); }
[data-theme="light"] .logRow          { color: rgba(20,20,20,.75); background: rgba(0,0,0,.03); border-color: rgba(0,0,0,.07); }
[data-theme="light"] .mailFilterBar   { border-bottom-color: rgba(0,0,0,.07); }
[data-theme="light"] .mailItem + .mailItem { border-top-color: rgba(0,0,0,.07); }
/* 거래내역 합계 */
[data-theme="light"] .tr-buy .trTotal  { color: var(--buy); }
[data-theme="light"] .tr-sell .trTotal { color: var(--sell); }
[data-theme="light"] .industrySheetPanel { background: #f8f3ec; }
[data-theme="light"] .industryOptionItem:active,
[data-theme="light"] .industryOptionItem.selected { background: rgba(0,0,0,.08); }
/* 대출 경고/상태 배지 */
[data-theme="light"] .loanDeadlineWarn  { color: #8a6010; }
[data-theme="light"] .loanCountOk       { background: rgba(26,158,106,.12); color: #1a7a45; }
[data-theme="light"] .loanCountWarn     { background: rgba(160,120,0,.12);  color: #8a6010; }
[data-theme="light"] .loanCountUrgent   { background: rgba(214,48,80,.12);  color: var(--sell); }
/* 메일 마감일 */
[data-theme="light"] .mailDetailDeadline { color: #8a6010; }
/* 메일 리스트 */
[data-theme="light"] .mailItem:active           { background: rgba(0,0,0,.04); }
[data-theme="light"] .mailItemIcon              { background: rgba(0,0,0,.06); }
[data-theme="light"] .mailItem-read .mailItemSubject { color: rgba(0,0,0,.40); }
[data-theme="light"] .mailEmptyHint             { color: var(--muted); }
[data-theme="light"] .mailItemStatusBadge       { background: rgba(0,0,0,.06); color: var(--muted); }
[data-theme="light"] .mailItemStatusBadge.invested { color: #8a6010; }
[data-theme="light"] .mailItemStatusBadge.expired  { color: #d63050; }
[data-theme="light"] .mailFilterBtn:not(.active):active { background: rgba(0,0,0,.06); }
/* 메일 상세 모달 */
[data-theme="light"] .mailDetailSubject         { color: var(--text); }
[data-theme="light"] .mailDetailMeta            { color: var(--muted); }
[data-theme="light"] .mailDetailBody            { color: var(--text); background: rgba(0,0,0,.04); }
[data-theme="light"] .mailDetailPending         { color: #1a6fb5; }
[data-theme="light"] .mailActionBtn-reject      { background: rgba(0,0,0,.06); border: 1px solid rgba(0,0,0,.12); color: var(--muted); }
/* 설정 모달 */
[data-theme="light"] .settingsSection    { border-bottom-color: rgba(0,0,0,.07); }
[data-theme="light"] .settingsSectionLink { border-bottom-color: rgba(0,0,0,.07); }
[data-theme="light"] .settingsSummary    { color: rgba(20,20,20,.80); }
[data-theme="light"] .settingsSummary:hover { background: rgba(0,0,0,.04); color: var(--text); }
[data-theme="light"] .settingsSection[open] .settingsSummary { color: var(--accent); }
[data-theme="light"] .settingsSection[open] .settingsSummary::after { color: var(--accent); }
[data-theme="light"] .settingsPlayerCardLabel { color: rgba(20,20,20,.55); }
[data-theme="light"] .settingsTaxValue   { color: #8a6010; }
[data-theme="light"] .settingsLinkBtn    { background: rgba(26,111,181,.08); border-color: rgba(26,111,181,.20); color: var(--accent); }
[data-theme="light"] .settingsToggleLabel { color: var(--text); }
[data-theme="light"] .settingsToggleDesc  { color: var(--muted); }
/* 토스트 알림 */
[data-theme="light"] .tradeToast {
  background: rgba(255,255,255,.97);
  border-color: rgba(0,0,0,.12);
  box-shadow: 0 4px 20px rgba(0,0,0,.15);
}
[data-theme="light"] .tradeToast-buy   { border-color: var(--buy); }
[data-theme="light"] .tradeToast-sell  { border-color: var(--sell); }
[data-theme="light"] .tradeToast-error {
  background: rgba(255,232,234,.97);
  border-color: var(--sell);
}
[data-theme="light"] .tradeToast-success {
  background: rgba(222,245,233,.97);
  border-color: var(--buy);
  color: var(--text);
}
[data-theme="light"] .tradeToast-info {
  background: rgba(224,238,255,.97);
  border-color: var(--accent);
  color: var(--text);
}
[data-theme="light"] .toastMain   { color: var(--text); }
[data-theme="light"] .toastDetail { color: var(--muted); }
[data-theme="light"] .toastFee    { color: rgba(20,20,20,.38); }
/* 뉴스 아카이브 태그 */
[data-theme="light"] .archiveTag--high,
[data-theme="light"] .archiveTag--alert  { background: rgba(214,48,80,.12);  color: #d63050; }
[data-theme="light"] .archiveTag--medium { background: rgba(160,120,0,.12);  color: #8a6010; }
[data-theme="light"] .archiveTag--low,
[data-theme="light"] .archiveTag--info   { background: rgba(0,0,0,.06);      color: var(--muted); }
[data-theme="light"] .archiveTag--sys    { background: rgba(26,111,181,.10); color: #1a6fb5; }
/* 시즌 종료 랭킹 행 */
[data-theme="light"] .seasonEndRankRow           { background: rgba(0,0,0,.04); }
[data-theme="light"] .seasonEndRankRow.is-player { background: rgba(26,111,181,.08); border-color: rgba(26,111,181,.20); }
/* 거래소 산업군·정렬 필터 버튼 */
[data-theme="light"] .marketControlBtn { background: rgba(0,0,0,.06); color: var(--text); border-color: rgba(0,0,0,.15); }
[data-theme="light"] .marketControlBtn:active { background: rgba(26,111,181,.12); color: var(--accent); }
/* 거래소 필터 바텀시트 라벨 — 라이트 모드: 업종 고유색 무시하고 기본 텍스트 색상 사용 */
[data-theme="light"] .industryOptionLabel { color: var(--text); }
[data-theme="light"] .industryOptionItem.selected .industryOptionLabel { color: var(--accent); }
[data-theme="light"] .industryOptionItem { border-bottom: 1px solid rgba(0,0,0,.06); }
/* 결제내역 행 구분선 */
[data-theme="light"] .trRow { border-bottom-color: rgba(0,0,0,.10); }
/* 계정 탈퇴 확인 모달 */
[data-theme="light"] .deleteAccountCard       { background: #fff; border-color: rgba(214,48,80,.3); }
[data-theme="light"] .deleteAccountMsg        { color: var(--muted); }
[data-theme="light"] .deleteAccountInput      { background: rgba(0,0,0,.04); border-color: rgba(0,0,0,.15); color: var(--text); }
[data-theme="light"] .deleteAccountCancelBtn  { background: rgba(0,0,0,.06); border-color: rgba(0,0,0,.1); color: var(--muted); }
/* 대출 탭 */
[data-theme="light"] .loanMaxNote        { color: rgba(0,0,0,.35); }
[data-theme="light"] .loanDurationUnit   { color: rgba(0,0,0,.45); }
[data-theme="light"] .loanPreview        { background: rgba(26,111,181,.06); border-color: rgba(26,111,181,.12); }
[data-theme="light"] .loanApplyRateValue { color: #c05c20; }

.topRow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  min-height: 0;
}

.topLeft {
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  flex: 1;
}

.appLogo { font-size: 16px; flex-shrink: 0; }

.topNick {
  font-size: 13px;
  font-weight: 700;
  color: var(--accent);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  letter-spacing: 0.08em;
}

.topRight {
  display: flex;
  align-items: center;
  gap: 5px;
  flex-shrink: 0;
}

/* ── 헤더 우측 버튼 그룹 ────────────────────────── */
.header-status-row {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}


.header-mail-btn {
  position: relative;
  padding: 3px 7px;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  color: var(--text);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  line-height: 1.4;
  font-variant-numeric: tabular-nums;
  transition: border-color .2s, background .2s;
}
.header-mail-btn:active { background: rgba(255,255,255,.12); }
[data-theme="light"] .header-mail-btn { border-color: rgba(0,0,0,.22); background: rgba(0,0,0,.05); color: var(--text); }
.header-mail-btn.mailbtn-has-unread {
  animation: mailBtnPulse 1.8s ease-in-out infinite;
  filter: drop-shadow(0 0 6px rgba(255, 90, 122, 0.8));
}
@keyframes mailBtnPulse {
  0%, 100% { transform: scale(1); filter: drop-shadow(0 0 4px rgba(255, 90, 122, 0.6)); }
  50%       { transform: scale(1.12); filter: drop-shadow(0 0 10px rgba(255, 90, 122, 1)); }
}

/* ── 헤더 자산 영역 ──────────────────────────────── */
.assetsMainRow {
  display: flex;
  align-items: center;
  min-height: 0;
}

.assetsLeft {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
  flex: 1;
}

.assetsValRow {
  display: flex;
  align-items: baseline;
  gap: 7px;
  min-width: 0;
}

.assetsSmallBreakdown {
  font-size: 11px;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-variant-numeric: tabular-nums;
  max-width: 100%;
}

/* ── 헤더 자산 행 (구형 호환) ─────────────────────── */
.assetsRow {
  display: flex;
  align-items: baseline;
  gap: 8px;
  min-height: 0;
}

.assetsVal {
  font-size: 17px;
  font-weight: 800;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}

.profitBadge {
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
  flex-shrink: 0;
  font-variant-numeric: tabular-nums;
  padding: 1px 6px;
  border-radius: 6px;
  background: rgba(255,255,255,0.07);
}

.timerPill {
  padding: 3px 9px;
  background: rgba(120,200,255,.09);
  border: 1px solid rgba(120,200,255,.22);
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  color: var(--accent);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  min-width: 30px;
  text-align: center;
  flex-shrink: 0;
}

.statusPill {
  padding: 4px 8px;
  background: rgba(255,255,255,.04);
  border: 1px solid var(--border);
  border-radius: 999px;
  font-size: 10px;
  color: var(--muted);
  white-space: nowrap;
}

/* ── 헤더 시즌 행 ─────────────────────────────── */
.seasonRow {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 4px;
  padding: 0 2px;
  flex-direction: row;
  gap: 6px;
  min-height: 0;
}

.xpRow {
  display: none;
}

.seasonInfo {
  font-size: 11px;
  font-weight: 700;
  color: #ffd57a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-variant-numeric: tabular-nums;
  min-width: 0;
  flex: 1;
}

.xpLabel {
  font-size: 10px;
  color: var(--muted);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}

/* ── 모바일 360px 최적화 ─────────────────────────── */
@media (max-width: 390px) {
  :root { --topbar-h: calc(120px + env(safe-area-inset-top, 0px)); }
  .topBar { padding: max(env(safe-area-inset-top, 0px), 13px) 12px 4px; gap: 2px; }
  .topNick { font-size: 12px; }
  .assetsVal { font-size: 15px; }
  .profitBadge { font-size: 11px; padding: 1px 5px; }
  .assetsSmallBreakdown { font-size: 10px; }
  .header-mail-btn { font-size: 11px; padding: 2px 5px; }
}

/* ── 뉴스 티커 ─────────────────────────────────── */
.newsStrip {
  position: fixed;
  top: calc(var(--ad-banner-height) + var(--topbar-h) + var(--condition-banner-h));
  left: 0; right: 0;
  height: var(--news-h);
  z-index: 90;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 12px;
  background: #000;
  border-bottom: 2px solid #1e1e1e;
  overflow: hidden;
  transition: background .4s, border-color .4s;
}

/* 뉴스 카테고리별 티커 강조 */
/* ALERT (속보/이벤트): 빨간 배경 */
/* 1. 경제(MACRO) & 속보(ALERT): 빨간 배경 + 깜빡임 */
.newsStrip[data-category="MACRO"],
.newsStrip[data-category="ALERT"],
.newsStrip[data-grade="HIGH"] {
  background: rgba(120, 10, 20, 0.95);
  border-bottom-color: rgba(255, 60, 80, 0.6);
  animation: tickerHighPulse 1.5s ease-in-out infinite, news-flash 1.5s infinite alternate;
}

/* 2. 산업(SECTOR) & 시스템(SYS): 파란 배경 */
.newsStrip[data-category="SECTOR"],
.newsStrip[data-category="SYS"],
.newsStrip[data-grade="MEDIUM"] {
  background: rgba(10, 40, 90, 0.95);
  border-bottom-color: rgba(100, 160, 255, 0.55);
}

/* 3. 종목(COMPANY), 생활(LIFE), 일반(INFO) */
.newsStrip[data-category="COMPANY"],
.newsStrip[data-category="LIFE"],
.newsStrip[data-category="INFO"] {
  background: rgba(70, 55, 0, 0.85); /* 기존 INFO 스타일 활용 */
  border-bottom-color: rgba(255, 210, 80, 0.35);
}

/* 4. 긴급 속보 깜빡임 애니메이션 추가 */
.emergency-flash {
  animation: news-flash 1.5s infinite alternate !important;
}

@keyframes news-flash {
  from {
    border-top: 1px solid rgba(255, 77, 77, 0.3);
    border-bottom: 1px solid rgba(255, 77, 77, 0.3);
  }
  to {
    border-top: 1px solid rgba(255, 77, 77, 1);
    border-bottom: 1px solid rgba(255, 77, 77, 1);
    background: rgba(255, 10, 20, 0.4);
  }
}

@keyframes tickerHighPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255, 60, 80, 0); }
  50%       { box-shadow: 0 0 16px 2px rgba(255, 60, 80, 0.35); }
}

.newsTag {
  flex-shrink: 0;
  background: var(--sell);
  color: #fff;
  padding: 2px 7px;
  font-size: 9px;
  font-weight: 800;
  border-radius: 4px;
  letter-spacing: .06em;
}

.whalePreviewBadge {
  flex-shrink: 0;
  font-size: 14px;
  letter-spacing: 1px;
  white-space: nowrap;
}
.whalePreviewBadge.hidden { display: none; }

.newsTicker {
  flex: 1;
  min-width: 0;
  overflow: hidden;
}

.newsTrack {
  display: inline-block;
  white-space: nowrap;
  will-change: transform;
}

.newsTrack.is-animating {
  animation: scroll-ticker 20s linear infinite;
}

@keyframes scroll-ticker {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.newsText {
  display: inline-block;
  padding: 0 80px 0 0;
  font-family: 'Courier New', monospace;
  font-size: 12px;
  font-weight: 700;
  color: #00ff88;
}

/* ── 수수료 안내 ──────────────────────────────────── */
.feeNote {
  font-size: 11px;
  color: var(--muted);
  text-align: center;
  padding: 2px 0 8px;
  letter-spacing: .01em;
}
.feeNote.hidden { display: none; }

/* ── 메인 스크롤 영역 ───────────────────────────── */
.mainScroll {
  position: fixed;
  top: calc(var(--ad-banner-height) + var(--topbar-h) + var(--condition-banner-h) + var(--news-h));
  left: 0; right: 0;
  bottom: calc(var(--nav-h) + var(--safe-bottom));
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-y: contain;
}

/* 탭 패널 */
.tabPane { display: none; padding: 0 0 12px; }
.tabPane.active { display: block; }

/* ── 산업군 필터 ────────────────────────────────── */
/* ── MTS 컨트롤바 (필터 + 정렬) ─────────────────── */
.marketControlBar {
  display: flex;
  gap: 8px;
  padding: 8px 12px;
  background: rgba(11,15,25,1);
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  z-index: 10;
}

.marketControlBtn {
  flex: 1;
  padding: 7px 12px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.04);
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: all .15s;
  text-align: center;
  white-space: nowrap;
}
.marketControlBtn:active { background: rgba(120,200,255,.08); color: var(--accent); }

/* ── 거래소 검색 바 ──────────────────────────────── */
.marketSearchBar {
  padding: 6px 12px 8px;
  background: rgba(11,15,25,1);
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 45px;
  z-index: 9;
}
.marketSearchInput {
  width: 100%;
  padding: 8px 12px 8px 34px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.05);
  color: var(--text);
  font-size: 13px;
  outline: none;
  transition: border-color .15s;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,0.4)' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 10px center;
}
.marketSearchInput::placeholder { color: var(--muted); }
.marketSearchInput:focus { border-color: rgba(120,200,255,.5); }

/* ── 즐겨찾기 버튼 (바텀시트 헤더) ──────────────── */
.bookmarkBtn {
  background: transparent;
  border: none;
  color: var(--muted);
  font-size: 20px;
  cursor: pointer;
  padding: 4px 8px;
  line-height: 1;
  transition: color .15s;
}
.bookmarkBtn.active { color: #ffd57a; }

/* ── 종목 리스트 즐겨찾기 별 ─────────────────────── */
.stockRowStar { color: #ffd57a; font-size: 11px; vertical-align: middle; }

/* ── 산업군 선택 바텀시트 ────────────────────────── */
.industrySheetPanel {
  position: relative;
  z-index: 1;
  background: rgba(18,24,38,1);
  border-radius: 20px 20px 0 0;
  padding-bottom: env(safe-area-inset-bottom, 16px);
  max-height: 70vh;
  display: flex;
  flex-direction: column;
  animation: slide-up .25s ease;
}

.industryOptionList {
  overflow-y: auto;
  flex: 1;
  padding: 8px 0;
}

.industryOptionItem {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 20px;
  cursor: pointer;
  transition: background .12s;
}
.industryOptionItem:active,
.industryOptionItem.selected { background: rgba(120,200,255,.18); }

.industryOptionDot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}

.industryOptionLabel {
  flex: 1;
  font-size: 14px;
  color: var(--label-color, var(--text));
}
.industryOptionItem.selected .industryOptionLabel { font-weight: bold; }

.industryOptionCheck {
  font-size: 16px;
  color: var(--accent);
  width: 20px;
  text-align: right;
}

.industryOptionIcon {
  font-size: 16px;
  width: 24px;
  text-align: center;
  flex-shrink: 0;
}

.industryApplyBtn {
  margin: 12px 16px;
  width: calc(100% - 32px);
  padding: 14px;
  border-radius: 12px;
  font-size: 15px;
  font-weight: 700;
}

/* ── 종목 리스트 (세로 행) ─────────────────────── */
.stockList { padding: 0 12px; }

.stockRow {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 12px;
  border-bottom: 1px solid var(--border);
  cursor: pointer;
  transition: background .12s;
  border-radius: 0;
  position: relative;
}
.stockRow:first-child { border-top: 1px solid var(--border); }
.stockRow:active { background: rgba(255,255,255,.04); }
.stockRow.selected { background: rgba(120,200,255,.06); }

.stockRowLeft { flex: 1; min-width: 0; }

.stockRowName {
  font-size: 14px;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 5px;
}

.stockRowMeta {
  font-size: 11px;
  color: var(--muted);
  margin-top: 1px;
}

.stockRowChart {
  width: 60px;
  height: 32px;
  flex-shrink: 0;
}

.stockRowRight {
  text-align: right;
  flex-shrink: 0;
}

.stockRowPrice {
  font-size: 14px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  display: block;
}

.stockRowChange {
  font-size: 12px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.stockIndustryTag {
  font-size: 9px;
  font-weight: 700;
  padding: 1px 5px;
  border-radius: 6px;
  vertical-align: middle;
  background: color-mix(in srgb, var(--tag-color) 15%, transparent);
  color: var(--tag-color);
}
.stockTagColor { color: var(--tag-color); font-weight: 700; }

.delistBadge {
  font-size: 9px;
  font-weight: 700;
  padding: 1px 5px;
  border-radius: 6px;
  background: rgba(255,90,122,.18);
  color: var(--sell);
  margin-left: 4px;
}

/* ── 하단 탭 네비게이션 ─────────────────────────── */
.bottomNav {
  position: fixed;
  bottom: 0; left: 0; right: 0;
  height: calc(var(--nav-h) + var(--safe-bottom));
  padding-bottom: var(--safe-bottom);
  z-index: 100;
  display: flex;
  align-items: stretch;
  background: rgba(11,15,25,.98);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-top: 1px solid var(--border);
}

.navBtn {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  border: none;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  transition: color .15s;
  padding: 6px 2px;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

.navBtn.active { color: var(--accent); }
.navBtn:active { opacity: .7; }

.navIco { font-size: 18px; line-height: 1; }
.navLbl { font-size: 10px; font-weight: 600; }

/* ── 종목 상세 바텀 시트 ─────────────────────────── */
.sheetOverlay {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.sheetOverlay.hidden { display: none; }

.sheetBackdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.sheetPanel {
  position: relative;
  z-index: 1;
  width: 100%;
  box-sizing: border-box;
  background: linear-gradient(180deg, rgba(18,24,38,1) 0%, rgba(11,15,25,1) 100%);
  border: 1px solid var(--border);
  border-bottom: none;
  border-radius: 24px 24px 0 0;
  padding: 0 16px 16px;
  max-height: 85vh;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  transform: translateY(100%);
  transition: transform .3s cubic-bezier(.25,.8,.25,1);
}
.sheetOverlay:not(.hidden) .sheetPanel {
  transform: translateY(0);
}

.sheetHandleBar {
  width: 40px;
  height: 4px;
  background: rgba(255,255,255,.18);
  border-radius: 999px;
  margin: 12px auto 14px;
}

.sheetHeader {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 12px;
}

.sheetStockInfo {
  display: flex;
  align-items: left;
  gap: 8px;
  flex-wrap: wrap;
}

.sheetStockName {
  font-size: 17px;
  font-weight: 800;
  display: block;
  margin-bottom: 4px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
  min-width: 0;
}

.sheetPriceRow {
  display: flex;
  align-items: baseline;
  gap: 8px;
  width: 100%;
}

.sheetPrice {
  font-size: 26px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

.sheetChange {
  font-size: 15px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.sheetMeta {
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: flex-end;
  flex-shrink: 0;
}

.sheetMetaGrid { background: rgba(255,255,255,0.04); }
[data-theme="light"] .sheetMetaGrid { background: rgba(0,0,0,0.04); }
[data-theme="light"] .qtyInput { background: rgba(0,0,0,.04); }
[data-theme="light"] .btnGhost:not(:disabled):active { background: rgba(0,0,0,.08); }
.sheetMetaItem { text-align: right; }
.sheetMetaLabel { font-size: 10px; color: var(--muted); display: block; }
.sheetMetaLabelL { font-size: 10px; color: var(--muted); display: inline-block; width: 35px; }
.sheetMetaLabelR { font-size: 10px; color: var(--muted); display: inline-block; margin-right: 6px; }
.sheetDayLabel   { font-size: 11px; color: var(--muted); }
.sheetMetaVal { font-size: 13px; font-weight: 700; }

.sheetCloseBtn {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.06);
  color: var(--muted);
  font-size: 14px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  touch-action: manipulation;
}
.sheetCloseBtn:active { background: rgba(255,255,255,.12); }

.sheetChartCanvas {
  width: 100%;
  height: 160px;
  display: block;
  border-radius: 12px;
  background: rgba(255,255,255,.02);
  margin-bottom: 4px;
  cursor: zoom-in;
}

.sheetChartHint {
  font-size: 10px;
  color: rgba(255,255,255,0.25);
  text-align: right;
  padding-right: 2px;
  margin-bottom: 12px;
}
[data-theme="light"] .sheetChartHint { color: rgba(0,0,0,0.35); }

/* 트레이딩 영역 */
.sheetTradeArea { display: flex; flex-direction: column; gap: 10px; }

.qtyRow {
  display: flex;
  align-items: center;
  gap: 8px;
}

.qtyLabel {
  font-size: 12px;
  color: var(--muted);
  flex-shrink: 0;
}

.qtyInput {
  flex: 1;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.04);
  color: var(--text);
  border-radius: 10px;
  padding: 10px 12px;
  font-size: 15px;
  outline: none;
  -webkit-appearance: none;
}
.qtyInput:focus { border-color: rgba(120,200,255,.6); }

.tradeRow { display: flex; gap: 8px; }

.tradeBtn { flex: 1; padding: 14px 0; font-size: 15px; }

.fullBtn { width: 100%; padding: 12px 0; }

/* ── 공통 버튼 ───────────────────────────────────── */
.btn {
  border: 1px solid var(--border);
  background: rgba(255,255,255,.04);
  color: var(--text);
  border-radius: 12px;
  padding: 10px 14px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: background .12s, border-color .12s, transform .1s;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.btn:active { transform: scale(.97); }
.btn:disabled { opacity: .35; cursor: not-allowed; transform: none; }

.btnBuy { border-color: rgba(61,220,151,.35); color: var(--buy); }
.btnBuy:not(:disabled):active { background: rgba(61,220,151,.12); }

.btnSell { border-color: rgba(255,90,122,.35); color: var(--sell); }
.btnSell:not(:disabled):active { background: rgba(255,90,122,.12); }

.btnGhost { border-color: var(--border); color: var(--muted); }
.btnGhost:not(:disabled):active { background: rgba(255,255,255,.08); color: var(--text); }

/* ── 공통 테이블 ─────────────────────────────────── */
.tableWrap { overflow-x: auto; padding: 0 12px; }

.dataTable {
  width: 100%;
  border-collapse: collapse;
  min-width: 340px;
}

.dataTable th, .dataTable td {
  padding: 10px 8px;
  text-align: left;
  border-bottom: 1px solid rgba(255,255,255,.06);
  font-size: 12px;
}

.dataTable th {
  color: var(--muted);
  font-size: 10px;
  letter-spacing: .04em;
  white-space: nowrap;
}

.rankingRow.is-player { background: rgba(120,200,255,.06); }

/* 포트폴리오 행 클릭 가능 hover */
.dataTable tbody tr[style*="pointer"]:hover {
  background: rgba(255,255,255,.04);
}

.rankBadge {
  display: inline-flex;
  min-width: 24px;
  height: 24px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(255,255,255,.07);
  font-weight: 800;
  font-size: 11px;
}
.rankBadge.top3 { background: rgba(255,200,102,.15); color: #ffd57a; }

/* ── 총 자산 행 ──────────────────────────────────── */
.totalAssetRow {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 14px;
  margin: 8px 12px 0;
  border-radius: var(--radius);
  background: rgba(120,200,255,.06);
  border: 1px solid rgba(120,200,255,.14);
}
.totalAssetLabel { font-size: 12px; color: var(--muted); }
.totalAssetVal { font-size: 16px; font-weight: 800; font-variant-numeric: tabular-nums; }

/* ── 포트폴리오 도넛 차트 ────────────────────────── */
.portAssetBody {
  display: flex;
  align-items: center;
  padding: 12px 14px;
  gap: 12px;
}
.portAssetDetails {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.portDetailRow {
  display: flex;
  align-items: flex-start;
  gap: 3px;
  margin-bottom: 20px;
}
.portDetailRow:last-child {
  margin-bottom: 0;
}
.portDetailDot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  flex-shrink: 0;
  margin-top: 3px;
}
.portTextWrap {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.portDetailDot--cash  { background: #3ddc97; }
.portDetailDot--stock { background: #ff7a5c; }
.portDetailLabel { font-size: 12px; color: var(--muted); flex: 1; }
.portChartContainer {
  flex-shrink: 0;
  width: 120px;
  height: 120px;
}
.portChartContainer canvas {
  width: 120px;
  height: 120px;
}
.portDetailLabel,
.portCashVal,
.portStockVal {
  flex-shrink: 0;
}
.portDetailLabel {
  font-size: 13px;
  color: #a0a0a0;
}
.portCashVal, .portStockVal {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.2;
}
.portChartContainer {
  flex-shrink: 0; /* 화면이 좁아져도 차트 영역은 축소 방지 */
}

/* ── 포트폴리오 자산 분류 카드 ────────────────────── */
.portAssetCard {
  margin: 8px 12px 0;
  border-radius: var(--radius);
  background: rgba(120,200,255,.06);
  border: 1px solid rgba(120,200,255,.14);
  overflow: hidden;
}
.portAssetRow {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 14px;
}
.portAssetTotal { background: rgba(120,200,255,.08); }
.portAssetTotal .portAssetLabel { font-size: 13px; font-weight: 700; color: var(--text); }
.portAssetTotal .portAssetVal   { font-size: 17px; font-weight: 800; font-variant-numeric: tabular-nums; }
.portAssetLabel { font-size: 12px; color: var(--muted); }
.portAssetVal   { font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums; }
.portCashVal    { color: #3ddc97; }
.portStockVal   { color: #ff7a5c; }
.portAssetDivider { height: 1px; background: rgba(255,255,255,.06); margin: 0 10px; }
.portNetFormula {
  padding: 4px 14px 6px;
  font-size: 11px;
  color: rgba(255,255,255,0.4);
  font-variant-numeric: tabular-nums;
  text-align: right;
}

/* ── 랭킹 배너 ───────────────────────────────────── */
.rankBanner {
  margin: 10px 12px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(120,200,255,.07);
  border: 1px solid rgba(120,200,255,.14);
  font-size: 12px;
  line-height: 1.5;
}

/* ── 뉴스 아카이브 ───────────────────────────────── */
.newsArchiveList { padding: 0 12px 8px; }

/* ── 뉴스 필터 버튼바 ─────────────────────────────── */
.newsFilterBar {
  display: flex;
  gap: 6px;
  padding: 10px 12px 8px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 4px;
  position: sticky;
  top: 53px;
  z-index: 2;
  background: rgba(18,24,38,1);
}

.newsFilterBtn {
  padding: 5px 14px;
  border-radius: 20px;
  border: 1px solid var(--border);
  background: transparent;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
  transition: all .15s;
}
.newsFilterBtn.active {
  background: rgba(120,200,255,.14);
  border-color: rgba(120,200,255,.5);
  color: var(--accent);
}

/* ── 뉴스 아카이브 행 ─────────────────────────────── */
.archiveRow {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(255,255,255,.05);
  line-height: 1.45;
}
.archiveRow--high  { background: rgba(255,60,80,.06); border-radius: 6px; padding: 10px 6px; margin: 2px 0; }
.archiveRow--medium { background: rgba(255,210,80,.05); border-radius: 6px; padding: 10px 6px; margin: 2px 0; }

.archiveTag {
  flex-shrink: 0;
  font-size: 9px;
  font-weight: 800;
  padding: 2px 6px;
  border-radius: 4px;
  letter-spacing: .04em;
  margin-top: 1px;
}
.archiveTag--high   { background: rgba(255,60,80,.25);   color: #ff6070; }
.archiveTag--medium { background: rgba(255,210,80,.2);   color: #ffd34a; }
.archiveTag--low    { background: rgba(255,255,255,.08);  color: var(--muted); }
/* 카테고리 태그 */
.archiveTag--alert  { background: rgba(255,60,80,.25);   color: #ff6070; }
.archiveTag--sys    { background: rgba(100,160,255,.18);  color: #78c8ff; }
.archiveTag--info   { background: rgba(255,255,255,.08);  color: var(--muted); }

.archiveText { flex: 1; font-size: 12px; color: var(--text); }
.archiveTime { flex-shrink: 0; color: var(--muted); font-size: 10px; font-weight: 600; white-space: nowrap; margin-top: 1px; }

/* ── 이벤트 로그 ─────────────────────────────────── */
.logList { padding: 8px 12px; }

.logRow {
  font-size: 12px;
  color: rgba(255,255,255,.75);
  padding: 6px 8px;
  border-radius: 8px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.05);
  margin-bottom: 5px;
}

/* ── 상점 ────────────────────────────────────────── */
/* ── 상점 ──────────────────────────────────────────── */
.shopList { padding: 14px 14px 0; display: flex; flex-direction: column; gap: 12px; }
.shopModalSub { font-size: 11px; color: var(--muted); margin-top: 2px; font-weight: 400; }

.shopCard {
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
  overflow: hidden;
  transition: border-color .2s, background .2s;
}

/* 카드 상단 컬러 바 */
.shopCardBar { height: 3px; }
.shopCard--advice .shopCardBar { background: linear-gradient(90deg, #6366f1, #a78bfa); }
.shopCard--trade  .shopCardBar { background: linear-gradient(90deg, #10b981, #06b6d4); }

.shopCardBody { padding: 14px 14px 10px; }

.shopCardTop { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 12px; }

.shopCardIcon {
  width: 46px; height: 46px; border-radius: 13px;
  display: flex; align-items: center; justify-content: center;
  font-size: 22px; flex-shrink: 0;
}
.shopCard--advice .shopCardIcon { background: rgba(99,102,241,.15); }
.shopCard--trade  .shopCardIcon { background: rgba(16,185,129,.15); }

.shopCardInfo { flex: 1; min-width: 0; padding-top: 2px; }
.shopCardName { font-size: 14px; font-weight: 700; color: #fff; margin-bottom: 5px; }
.shopCardDesc { font-size: 11px; color: var(--muted); line-height: 1.5; }

.shopCardFooter {
  display: flex; align-items: center;
  padding-top: 10px; border-top: 1px solid rgba(255,255,255,.06);
}
.shopCardPrice { font-size: 16px; font-weight: 800; color: #fbbf24; letter-spacing: -.01em; }
.shopCardMeta  { font-size: 11px; color: var(--muted); text-align: right; }

.shopCardActions { padding: 8px 12px 12px; display: flex; flex-direction: row; align-items: stretch; gap: 7px; }

.shopCardBtn {
  flex: 1; padding: 9px 6px; font-size: 12px;
  font-weight: 700; border-radius: 10px; text-align: center;
  white-space: normal; word-break: keep-all;
}
.shopCardBtnPrimary {
  background: var(--accent); color: #0b1120;
  border-color: var(--accent);
}
.shopCardBtnPrimary:not(:disabled):active { background: #91d8ff; }
.shopCardBtnSec {
  background: rgba(255,255,255,.07); color: var(--text);
  border-color: rgba(255,255,255,.12);
}
.shopCardBtnSec:disabled { opacity: .35; }

.shopCardAdBtn {
  flex: 1; padding: 9px 12px; border-radius: 10px;
  background: rgba(251,191,36,.08); color: #fbbf24;
  border: 1px solid rgba(251,191,36,.2); font-size: 12px;
  font-weight: 600; cursor: pointer; text-align: center;
  transition: background .15s; letter-spacing: .01em;
  white-space: normal; word-break: keep-all;
}
.shopCardAdBtn:active { background: rgba(251,191,36,.16); }

/* ── 바텀시트 광고/자동매매 가로 배치 ──────────────── */
.sheetActionRow {
  display: flex;
  gap: 8px;
  margin-top: 10px;
}
.sheetActionBtn {
  flex: 1;
  white-space: normal;
  word-break: keep-all;
  font-size: 12px;
  padding: 9px 8px;
}

/* 인게임 광고 버튼 (구제, 힌트 등) */
.shopBtnAd { font-size: 10px; padding: 4px 8px; border-radius: 8px; background: rgba(251,191,36,.12); color: #fbbf24; border: 1px solid rgba(251,191,36,.25); cursor: pointer; white-space: nowrap; }

.itemStatus { padding: 8px 12px; font-size: 12px; color: var(--muted); min-height: 18px; }

/* ── 메일함 ──────────────────────────────────────── */
#mailboxSheet .sheetPanel { padding: 0; }

/* 헤더 뱃지 */
.mailUnreadBadge {
  position: absolute; top: -4px; right: -4px;
  min-width: 16px; height: 16px; border-radius: 8px;
  background: var(--sell); color: #fff;
  font-size: 9px; font-weight: 700; padding: 0 4px;
  display: inline-flex; align-items: center; justify-content: center;
  pointer-events: none;
}
.mailUnreadBadge.hidden { display: none; }

#mailboxSheet .genericModalHeader { padding: 18px 16px 12px; }

/* 필터 탭 바 */
.mailFilterBar {
  display: flex; gap: 6px;
  padding: 0 16px 12px;
  border-bottom: 1px solid rgba(255,255,255,.06);
  overflow-x: auto; scrollbar-width: none;
}
.mailFilterBar::-webkit-scrollbar { display: none; }
.mailFilterBtn {
  flex-shrink: 0;
  padding: 6px 18px; border-radius: 20px;
  font-size: 12px; font-weight: 600;
  border: 1px solid rgba(255,255,255,.10);
  background: transparent;
  color: var(--muted); cursor: pointer;
  transition: background .15s, color .15s, border-color .15s;
}
.mailFilterBtn.active {
  background: rgba(120,200,255,.15);
  border-color: rgba(120,200,255,.4);
  color: var(--accent);
}
.mailFilterBtn:not(.active):active { background: rgba(255,255,255,.06); color: var(--text); }

/* 메일 리스트 */
#mailList { padding: 4px 0 24px; }

.mailItem {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 12px 16px;
  cursor: pointer; transition: background .12s;
  position: relative;
}
.mailItem + .mailItem { border-top: 1px solid rgba(255,255,255,.05); }
.mailItem:active { background: rgba(255,255,255,.04); }

/* 타입 아이콘 */
.mailItemIcon {
  width: 42px; height: 42px; border-radius: 13px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 20px;
  background: rgba(255,255,255,.06);
}
.mailItem-OPERATION .mailItemIcon { background: rgba(255,200,102,.13); }
.mailItem-FINE      .mailItemIcon { background: rgba(255,90,122,.13); }
.mailItem-REWARD    .mailItemIcon { background: rgba(61,220,151,.13); }
.mailItem-NOTICE    .mailItemIcon { background: rgba(120,200,255,.13); }
.mailItem-SYSTEM    .mailItemIcon { background: rgba(255,255,255,.06); }

/* 읽은 메일: 아이콘 희미하게 */
.mailItem-read .mailItemIcon { opacity: 0.55; }

/* 컨텐츠 */
.mailItemContent { flex: 1; min-width: 0; }
.mailItemMeta {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 3px;
}
.mailItemSender { font-size: 11px; color: var(--muted); font-weight: 500; }
.mailItemDate   { font-size: 11px; color: var(--muted); flex-shrink: 0; }

.mailItemSubject {
  font-size: 13px; font-weight: 600; color: var(--text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  margin-bottom: 3px;
}
.mailItem-read .mailItemSubject { font-weight: 400; color: rgba(255,255,255,.45); }

.mailItemPreview {
  font-size: 11px; color: var(--muted);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  min-height: 15px;
}

/* 읽지 않음 도트 */
.mailItemUnreadDot {
  width: 7px; height: 7px; border-radius: 50%;
  flex-shrink: 0; margin-top: 5px;
  background: transparent;
}
.mailItem-unread .mailItemUnreadDot              { background: var(--accent); }
.mailItem-OPERATION.mailItem-unread .mailItemUnreadDot { background: #ffc866; }
.mailItem-FINE.mailItem-unread      .mailItemUnreadDot { background: #ff5a7a; }
.mailItem-REWARD.mailItem-unread    .mailItemUnreadDot { background: #3ddc97; }

/* 상태 뱃지 */
.mailItemStatusBadge {
  display: inline-flex; align-items: center;
  font-size: 10px; padding: 2px 7px; border-radius: 5px;
  white-space: nowrap; font-weight: 600;
  background: rgba(255,255,255,.08); color: var(--muted);
}
.mailItemStatusBadge.invested { background: rgba(255,200,102,.15); color: #ffc866; }
.mailItemStatusBadge.expired  { background: rgba(255,90,122,.12);  color: #ff5a7a; }

/* 만료 메일 */
.mailItem-expired { opacity: 0.55; }

/* 빈 상태 */
.mailEmpty {
  padding: 60px 20px;
  display: flex; flex-direction: column;
  align-items: center; gap: 8px;
}
.mailEmptyIcon { font-size: 52px; opacity: .25; margin-bottom: 4px; }
.mailEmptyText { font-size: 15px; color: var(--muted); font-weight: 600; }
.mailEmptyHint { font-size: 12px; color: rgba(255,255,255,.25); }

/* ── 포트폴리오 비어있음 ─────────────────────────── */
.emptyHint { text-align: center; color: var(--muted); font-size: 13px; padding: 32px 16px; }

/* ── 색상 유틸 ───────────────────────────────────── */
.textUp   { color: #ff5a7a !important; }
.textDown { color: #78c8ff !important; }
.textFlat { color: rgba(255,255,255,.55) !important; }

/* ── 로그인 화면 ─────────────────────────────────── */
.loginScreen {
  position: fixed;
  inset: 0;
  z-index: 300;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg);
  overflow: hidden;
  padding-top: var(--ad-banner-height);
}

.loginBg {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.loginBgDot {
  position: absolute;
  border-radius: 50%;
  animation: float-dot 8s ease-in-out infinite alternate;
}
.loginBgDot:nth-child(1) {
  width: 400px; height: 400px;
  background: radial-gradient(circle, rgba(120,200,255,.14), transparent 70%);
  top: -100px; left: -100px;
  animation-delay: 0s;
}
.loginBgDot:nth-child(2) {
  width: 300px; height: 300px;
  background: radial-gradient(circle, rgba(61,220,151,.1), transparent 70%);
  bottom: 0; right: -50px;
  animation-delay: -3s;
}
.loginBgDot:nth-child(3) {
  width: 200px; height: 200px;
  background: radial-gradient(circle, rgba(167,140,255,.1), transparent 70%);
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  animation-delay: -6s;
}

@keyframes float-dot {
  0%   { transform: scale(1) translate(0,0); }
  100% { transform: scale(1.15) translate(20px, -20px); }
}

.loginCard {
  position: relative;
  z-index: 1;
  width: min(400px, calc(100vw - 32px));
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 28px;
  padding: 40px 28px 32px;
  text-align: center;
  box-shadow: 0 40px 80px rgba(0,0,0,.4);
}

.loginLogo { font-size: 52px; margin-bottom: 10px; line-height: 1; }

.loginTitle {
  font-size: 32px;
  font-weight: 900;
  letter-spacing: -1px;
  margin-bottom: 8px;
  background: linear-gradient(135deg, #fff, var(--accent));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.loginSeasonBadge {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  background: rgba(255,213,122,0.10);
  border: 1px solid rgba(255,213,122,0.25);
  border-radius: 20px;
  padding: 6px 16px;
  margin-bottom: 16px;
  font-size: 13px;
  color: #ffd57a;
  font-weight: 600;
}

.loginSeasonSpinner { font-size: 14px; }

.loginLiveTicker {
  overflow: hidden;
  background: rgba(255,255,255,0.04);
  border: 1px solid var(--border);
  border-radius: 14px;
  margin-bottom: 14px;
  height: 34px;
  display: flex;
  align-items: center;
}
.loginLiveTrack {
  display: flex;
  align-items: center;
  white-space: nowrap;
  animation: loginTickerScroll 16s linear infinite;
  will-change: transform;
}
@keyframes loginTickerScroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
.loginLiveChunk {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 0 20px;
  font-size: 12px;
}
.loginLiveIcon { font-size: 13px; }
.loginLiveName { color: var(--muted); }
.loginLiveVal  { font-weight: 700; color: var(--text); }
.loginLiveUp   { color: var(--buy); }
.loginLiveDown { color: var(--sell); }
.loginLiveSep  { color: var(--border); padding: 0 4px; font-size: 10px; }

.loginSub {
  font-size: 14px;
  color: var(--muted);
  margin-bottom: 28px;
  line-height: 1.5;
}

.loginInputRow {
  display: flex;
  gap: 8px;
  margin-bottom: 8px;
}

.loginInput {
  flex: 1;
  min-width: 0;
  border: 1.5px solid var(--border);
  background: rgba(255,255,255,.05);
  color: var(--text);
  border-radius: 14px;
  padding: 14px 16px;
  font-size: 16px;
  outline: none;
  transition: border-color .15s;
}
.loginInput:focus { border-color: rgba(120,200,255,.6); }
.loginInput.inputError {
  border-color: var(--sell) !important;
  animation: inputShake .35s ease;
}
@keyframes inputShake {
  0%,100% { transform: translateX(0); }
  20%      { transform: translateX(-6px); }
  40%      { transform: translateX(6px); }
  60%      { transform: translateX(-4px); }
  80%      { transform: translateX(4px); }
}

.diceBtn {
  width: 52px;
  height: 52px;
  flex-shrink: 0;
  border: 1.5px solid var(--border);
  background: rgba(255,255,255,.04);
  border-radius: 14px;
  font-size: 22px;
  cursor: pointer;
  transition: background .12s, transform .1s;
  display: flex;
  align-items: center;
  justify-content: center;
  touch-action: manipulation;
}
.diceBtn:active { background: rgba(255,255,255,.12); transform: scale(.95) rotate(-15deg); }

.loginPasswordRow {
  max-height: 0;
  overflow: hidden;
  transition: max-height .3s ease, margin-bottom .3s ease;
  margin-bottom: 0;
}
.loginPasswordRow.visible {
  max-height: 60px;
  margin-bottom: 8px;
}
.loginPasswordRow .loginInput { width: 100%; box-sizing: border-box; }

.loginNicknameRow {
  display: flex;
  gap: 8px;
  max-height: 0;
  overflow: hidden;
  transition: max-height .3s ease, margin-bottom .3s ease;
  margin-bottom: 0;
}
.loginNicknameRow.visible {
  max-height: 60px;
  margin-bottom: 8px;
}
.loginNicknameRow .loginInput { flex: 1; }

.loginGuideMsg {
  font-size: 12px;
  color: var(--accent);
  min-height: 16px;
  margin-bottom: 6px;
  padding: 0 4px;
  transition: opacity .2s;
}

.loginBrokerSection {
  max-height: 0;
  overflow: hidden;
  transition: max-height .35s ease;
}
.loginBrokerSection.visible { max-height: 160px; }

.loginError {
  min-height: 18px;
  font-size: 12px;
  color: var(--sell);
  margin-bottom: 10px;
  text-align: left;
  padding: 0 4px;
}

.loginStartBtn {
  width: 100%;
  padding: 16px;
  font-size: 17px;
  font-weight: 800;
  border-radius: 14px;
  border: none;
  background: linear-gradient(135deg, var(--buy), #2bb87a);
  color: #000;
  cursor: pointer;
  transition: opacity .15s, transform .1s;
  touch-action: manipulation;
  letter-spacing: .02em;
}
.loginStartBtn:active { opacity: .85; transform: scale(.98); }

.loginHint { font-size: 11px; color: var(--muted); margin-top: 14px; }

/* ── 업적 오버레이 ───────────────────────────────── */
.achievementOverlay {
  position: fixed;
  inset: 0;
  pointer-events: none;
  display: grid;
  place-items: center;
  opacity: 0;
  transition: opacity .2s;
  z-index: 250;
}
.achievementOverlay.visible { opacity: 1; }

.achievementPopup {
  min-width: min(480px, calc(100vw - 32px));
  padding: 20px 24px;
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(120,200,255,.18), rgba(255,215,122,.18));
  border: 1px solid rgba(255,255,255,.18);
  box-shadow: 0 28px 60px rgba(0,0,0,.4);
  text-align: center;
  transform: translateY(-10px) scale(.95);
}
.achievementOverlay.visible .achievementPopup {
  animation: achieve-pop .55s cubic-bezier(.2,.8,.2,1) forwards;
}

.achievementBadge {
  display: inline-block;
  padding: 5px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  font-size: 11px;
  letter-spacing: .08em;
  margin-bottom: 8px;
}
.achievementTitle { font-size: 22px; font-weight: 800; margin-bottom: 6px; }
.achievementText { font-size: 13px; color: rgba(255,255,255,.85); }

.confettiLayer { position: absolute; inset: 0; overflow: hidden; }

.confettiPiece {
  position: absolute;
  top: -8vh;
  left: var(--start-x);
  width: 9px;
  height: 16px;
  border-radius: 3px;
  background: var(--piece-color);
  opacity: .9;
  animation: confetti-fall var(--duration) ease-out forwards;
}

@keyframes achieve-pop {
  0%   { transform: translateY(-10px) scale(.92); opacity: 0; }
  55%  { transform: translateY(0) scale(1.03); opacity: 1; }
  100% { transform: translateY(0) scale(1); opacity: 1; }
}

@keyframes confetti-fall {
  0%   { transform: translate3d(0,0,0) rotate(0deg); }
  100% { transform: translate3d(var(--drift),110vh,0) rotate(var(--spin)); }
}

/* ── 매수/매도 모드 선택 UI ──────────────────────── */
.tradeModeRow {
  display: flex;
  gap: 8px;
  margin-bottom: 12px;
}

.tradeModeBtn {
  flex: 1;
  padding: 12px;
  font-size: 15px;
  font-weight: 700;
  opacity: .45;
  transition: opacity .15s, background .15s;
}
.tradeModeBtn.mode-active {
  opacity: 1;
}
.btnBuy.mode-active  { background: rgba(61,220,151,.12); }
.btnSell.mode-active { background: rgba(255,90,122,.12); }

.tradeExecBtn {
  width: 100%;
  padding: 14px;
  font-size: 16px;
  font-weight: 800;
  border-radius: 14px;
}
.tradeExecBtn.hidden { display: none; }

.marketMoreBtn {
  width: 100%;
  margin: 8px 0 4px;
  padding: 12px;
  font-size: 13px;
  border-radius: 12px;
}

/* 수수료/세금 정보 그리드 */
.feeInfoGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 6px;
  background: rgba(255, 255, 255, 0.04);
  padding: 10px;
  border-radius: 8px;
  margin-bottom: 12px;
  font-size: 11px;
}

.feeItem {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--muted);
}

.feeItem strong {
  color: var(--text);
  font-family: 'Pretendard', sans-serif;
}

/* 실행 버튼 내부 강조 */
.tradeExecBtn strong {
  font-size: 1.1em;
  margin: 0 4px;
}

/* 결제내역 필터 바 */
.logFilterBar {
  display: flex;
  gap: 8px;
  padding: 12px;
  /* 💡 배경을 불투명한 메인 배경색으로 변경 */
  background: var(--bg);
  border-bottom: 1px solid var(--border);
  /* 💡 스크롤 시 상단에 고정 */
  position: sticky;
  top: 0;
  z-index: 20;
}

/* 필터 버튼 스타일 */
.logFilterBtn {
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 12px;
  background: rgba(255,255,255,0.08);
  color: var(--muted);
  border: 1px solid transparent;
  transition: all 0.2s;
}

.logFilterBtn.active {
  background: var(--accent);
  color: #000;
  font-weight: 700;
  border-color: var(--accent);
}

/* 거래 항목 스타일 */
.trRow { padding: 16px; border-bottom: 1px solid rgba(255,255,255,0.12); }
.trDate { font-size: 11px; color: var(--muted); margin-bottom: 4px; }
.trMain { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.trTag { padding: 2px 6px; border-radius: 4px; font-size: 10px; font-weight: 800; }
.trTag.buy { background: rgba(120, 255, 136, 0.1); color: #9bff88; }
.trTag.sell { background: rgba(255, 90, 122, 0.1); color: #ff5a7a; }
.trTag.gift { background: rgba(255, 213, 122, 0.1); color: #ffd57a; }
.trName { flex: 1; font-size: 14px; font-weight: 600; }
.trTotal { font-weight: 800; font-family: 'Pretendard'; }
.tr-buy .trTotal { color: #9bff88; }
.tr-sell .trTotal { color: #ff5a7a; }
.trDetail { font-size: 11px; color: var(--muted); }

/* ── 뉴스 스트립 클릭 힌트 ──────────────────────── */
.newsStripClickable { cursor: pointer; user-select: none; }
.newsStripClickable:active { opacity: .85; }

.newsStripHint {
  font-size: 10px;
  color: rgba(255,255,255,.30);
  flex-shrink: 0;
  padding-right: 4px;
  line-height: 1;
}


/* ── 공통 모달 (뉴스 히스토리 / 세금 팝업) ───────── */
.genericModal {
  position: fixed;
  inset: 0;
  z-index: 280;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
.genericModal.hidden { display: none; }

.genericModalBackdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.6);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.genericModalPanel {
  position: relative;
  z-index: 1;
  width: min(480px, 100vw);
  max-height: 75vh;
  overflow-y: auto;
  background: linear-gradient(180deg, rgba(18,24,38,1) 0%, rgba(11,15,25,1) 100%);
  border: 1px solid var(--border);
  border-bottom: none;
  border-radius: 24px 24px 0 0;
  padding: 0 0 24px;
  -webkit-overflow-scrolling: touch;
  animation: slide-up .25s ease;
}

@keyframes slide-up {
  from { transform: translateY(100%); }
  to   { transform: translateY(0); }
}

.genericModalHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 16px 12px;
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  background: rgba(18,24,38,.98);
}

.genericModalTitle {
  font-size: 16px;
  font-weight: 700;
  text-align: center;
}

/* ── 종목 토론방 ─────────────────────────────────── */
.commentRoomBtn {
  flex-shrink: 0;
  background: rgba(255,255,255,.08);
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text);
  font-size: 12px;
  padding: 4px 10px;
  cursor: pointer;
  white-space: nowrap;
}
.commentRoomBtn:active { opacity: .7; }

#commentModal .genericModalPanel {
  display: flex;
  flex-direction: column;
  max-height: 80vh;
  padding-bottom: 0;
}

.commentList {
  flex: 1;
  overflow-y: auto;
  padding: 8px 0;
  -webkit-overflow-scrolling: touch;
}

.commentEmpty {
  text-align: center;
  color: var(--muted);
  font-size: 13px;
  padding: 32px 0;
}

.commentItem {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-bottom: 1px solid rgba(255,255,255,.05);
}

.commentBadge {
  flex-shrink: 0;
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 4px;
  background: rgba(255,255,255,.1);
  color: var(--muted);
  white-space: nowrap;
}
.commentBadge.shareholder {
  background: rgba(72,199,142,.18);
  color: #48c78e;
}

.commentBody {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.commentNick {
  font-size: 11px;
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.commentText {
  font-size: 13px;
  color: var(--text);
  word-break: break-all;
}

.commentDay {
  flex-shrink: 0;
  font-size: 10px;
  color: var(--muted);
  white-space: nowrap;
}

.commentInputArea {
  display: flex;
  gap: 8px;
  padding: 10px 16px 16px;
  border-top: 1px solid var(--border);
  background: rgba(18,24,38,.98);
  position: sticky;
  bottom: 0;
}

.commentInput {
  flex: 1;
  background: rgba(255,255,255,.06);
  border: 1px solid var(--border);
  border-radius: 10px;
  color: var(--text);
  font-size: 13px;
  padding: 8px 12px;
  outline: none;
}
.commentInput:focus { border-color: rgba(255,255,255,.3); }

.commentSubmitBtn {
  flex-shrink: 0;
  padding: 8px 16px;
  font-size: 13px;
}

/* ── 세금 미납 팝업 전용 ─────────────────────────── */
#taxPopup {
  align-items: center;
}

.taxPopupPanel {
  text-align: center;
  padding: 32px 24px 28px;
  border-radius: 24px;
  max-width: 340px;
  width: calc(100vw - 40px);
  margin: 0 auto;
}

.taxPopupIcon { font-size: 48px; margin-bottom: 10px; }
.taxPopupTitle { font-size: 20px; font-weight: 800; margin-bottom: 12px; color: #ffb347; }
.taxPopupBody {
  font-size: 13px;
  color: var(--muted);
  margin-bottom: 20px;
  line-height: 1.6;
}
.taxPopupBody strong { color: var(--text); }

.taxBtnGroup {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.taxBtn {
  width: 100%;
  padding: 14px;
  font-size: 15px;
  font-weight: 700;
}

/* ── 전체 기간 차트 팝업 ────────────────────────── */
.fullHistoryPanel {
  max-height: 80vh;
}
.fullHistoryBody {
  padding: 12px 12px 24px;
}
.fullHistoryCanvas {
  width: 100%;
  height: 260px;
  display: block;
  border-radius: 12px;
  background: rgba(255,255,255,.02);
  cursor: zoom-in;
}
.fullHistoryMeta {
  margin-top: 10px;
  font-size: 11px;
  color: var(--muted);
  text-align: center;
}

/* ── 로그인 증권사 선택 ──────────────────────────── */
.loginBrokerLabel {
  font-size: 12px;
  color: var(--muted);
  font-weight: 700;
  letter-spacing: .06em;
  text-align: left;
  margin-bottom: 8px;
  margin-top: 4px;
}

.loginBrokerGroup {
  display: flex;
  gap: 8px;
  margin-bottom: 18px;
}

.loginBrokerBtn {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 12px 6px 10px;
  border: 1.5px solid var(--border);
  border-radius: 14px;
  background: rgba(255,255,255,.03);
  color: var(--muted);
  cursor: pointer;
  transition: border-color .15s, background .15s, color .15s;
  touch-action: manipulation;
}
.loginBrokerBtn.active {
  border-color: var(--accent);
  background: rgba(120,200,255,.10);
  color: var(--text);
}
.loginBrokerBtn:active { opacity: .75; }

.loginBrokerIcon { font-size: 22px; line-height: 1; }
.loginBrokerName { font-size: 12px; font-weight: 800; }
.loginBrokerDesc { font-size: 10px; color: inherit; text-align: center; line-height: 1.4; }

/* ── 증권사 탭 패널 ──────────────────────────────── */
.brokerTabWrap { padding: 12px; display: flex; flex-direction: column; gap: 10px; }

.brokerTabCurrent {
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(120,200,255,.07);
  border: 1px solid rgba(120,200,255,.18);
  font-size: 13px;
  font-weight: 700;
}

.brokerTabCurrentLabel { font-size: 11px; color: var(--muted); font-weight: 400; margin-bottom: 2px; }

.brokerCards { display: flex; flex-direction: column; gap: 8px; }

.brokerCard {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 12px;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.025);
}
.brokerCard.current {
  border-color: rgba(120,200,255,.35);
  background: rgba(120,200,255,.06);
}

.brokerCardLeft { flex: 1; min-width: 0; }
.brokerCardIcon { font-size: 24px; flex-shrink: 0; }
.brokerCardName { font-size: 14px; font-weight: 800; margin-bottom: 2px; }
.brokerCardFees { font-size: 11px; color: var(--muted); }
.brokerCardPerk { font-size: 11px; color: var(--accent); margin-top: 2px; }

.brokerCurrentBadge {
  font-size: 11px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(120,200,255,.18);
  color: var(--accent);
  flex-shrink: 0;
}

.brokerCooldownNote {
  margin-top: 8px;
  font-size: 11px;
  color: #ffb347;
  text-align: center;
  padding: 8px 12px;
  border-radius: 10px;
  background: rgba(255,179,71,.08);
  border: 1px solid rgba(255,179,71,.18);
}

/* ── 반응형: 태블릿/데스크탑에서 중앙 정렬 ──────── */
@media (min-width: 500px) {
  .topBar, .newsStrip, .mainScroll, .bottomNav, .sheetOverlay {
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    width: 480px;
  }
  .loginCard { width: 420px; }
}

/* 480px 초과 화면 보정 */
@media (min-width: 500px) {
  .sheetPanel { max-width: 480px; margin: 0 auto; }
}

/* ── 시즌 종료 모달 ─────────────────────────────── */
.seasonEndPanel {
  text-align: center;
  padding: 28px 20px 24px;
  max-height: 82vh;
  overflow-y: auto;
}

.seasonEndIcon { font-size: 48px; margin-bottom: 8px; }

.seasonEndTitle {
  font-size: 22px;
  font-weight: 800;
  color: #ffd57a;
  margin-bottom: 4px;
}

.seasonEndSub {
  font-size: 12px;
  color: var(--muted);
  margin-bottom: 12px;
}

.seasonEndRankList {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 18px;
}

.seasonEndRankRow {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 10px;
  background: rgba(255,255,255,.05);
  font-size: 13px;
}

.seasonEndRankRow.is-player {
  background: rgba(120,200,255,.12);
  border: 1px solid rgba(120,200,255,.3);
}

.seasonEndRankNum {
  font-size: 18px;
  font-weight: 900;
  color: var(--muted);
  min-width: 24px;
}

.seasonEndRankNum.top1 { color: #ffd700; }
.seasonEndRankNum.top2 { color: #c0c0c0; }
.seasonEndRankNum.top3 { color: #cd7f32; }

.seasonEndRankName { flex: 1; font-weight: 700; text-align: left; }
.seasonEndRankAssets { font-size: 12px; color: var(--muted); }

.seasonHistoryWrap {
  border-top: 1px solid var(--border);
  padding-top: 14px;
  margin-bottom: 18px;
  text-align: left;
}

.seasonHistoryTitle {
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
  margin-bottom: 8px;
}

.seasonHistoryList { display: flex; flex-direction: column; gap: 4px; }

.seasonHistoryRow {
  font-size: 11px;
  color: var(--muted);
  padding: 4px 8px;
  border-radius: 6px;
  background: rgba(255,255,255,.03);
  display: flex;
  justify-content: space-between;
}

.seasonEndNextBtn {
  width: 100%;
  padding: 14px;
  font-size: 16px;
  font-weight: 800;
}

/* ── 시장 상태 배너 (뉴스티커 상단 고정) ────────── */
.marketConditionBanner {
  position: fixed;
  top: calc(var(--ad-banner-height) + var(--topbar-h));
  /* left/right 대신 중앙 정렬로 모바일/PC 통합 */
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 16px);
  max-width: 464px;
  height: 36px;
  z-index: 95;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 12px;
  box-sizing: border-box;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  pointer-events: none;
  border-radius: 8px;
  /* 내부 글자 넘침 방지 (말줄임표) */
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/* 자식 요소(statusPill) 글자 넘침 완벽 대응 */
.marketConditionBanner * {
  max-width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/* ── 시장 상태 배너 배경색 수정 ────────────────── */
.marketConditionBanner.crash {
  background: rgba(10, 40, 90, 0.95);
  color: #fff;
}
.marketConditionBanner.boom {
  background: rgba(120, 10, 20, 0.95);
  color: #fff;
}

/* ── 거래 정지 (시장 리스트 상단 배너) ───────────── */
.marketHaltBanner {
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 700;
  text-align: center;
  border-radius: 8px;
  margin: 6px 0;
}
.marketHaltBanner.halt-market  { background: rgba(255,80,80,0.18); color: #ff5a7a; border: 1px solid rgba(255,80,80,0.35); }
.marketHaltBanner.halt-sector  { background: rgba(255,160,30,0.18); color: #ffaa30; border: 1px solid rgba(255,160,30,0.35); }
.marketHaltBanner.halt-brokerage { background: rgba(160,100,255,0.18); color: #c87fff; border: 1px solid rgba(160,100,255,0.35); }

/* ── 거래 영역 오버레이 (종목 시트 내부) ─────────── */
.sheetTradeArea {
  position: relative;
}
.tradeHaltOverlay {
  position: absolute;
  inset: 0;
  z-index: 10;
  background: rgba(11,15,25,0.88);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  backdrop-filter: blur(4px);
}
.tradeHaltOverlay.hidden { display: none; }
.tradeHaltMsg {
  padding: 14px 22px;
  background: #1a1f2e;
  border: 2px solid #ff9900;
  border-radius: 12px;
  font-size: 15px;
  font-weight: 800;
  color: #ff9900;
  text-align: center;
  line-height: 1.5;
}

/* ── 포트폴리오 상폐 경고 배지 ───────────────────── */
.delistWarnBadge {
  display: inline-block;
  padding: 1px 5px;
  font-size: 10px;
  font-weight: 700;
  border-radius: 4px;
  background: rgba(255,170,0,0.22);
  color: #ffaa00;
  border: 1px solid rgba(255,170,0,0.4);
  margin-left: 4px;
  vertical-align: middle;
}
.delistDangerBadge {
  display: inline-block;
  padding: 1px 5px;
  font-size: 10px;
  font-weight: 700;
  border-radius: 4px;
  background: rgba(255,50,80,0.22);
  color: #ff3c5a;
  border: 1px solid rgba(255,50,80,0.4);
  margin-left: 4px;
  vertical-align: middle;
  animation: pulseBadge 1.2s ease-in-out infinite;
}
@keyframes pulseBadge {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

/* ── 세금 정보 헤더 행 ───────────────────────────── */
.assetsBreakdown {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  justify-content: space-between;
  width: 100%;
}

.breakdownGroup {
  display: flex;
  gap: 5px;
  align-items: center;
}

.breakdownItem { display: flex; gap: 3px; align-items: center; }
.breakdownItem span { color: rgba(255,255,255,0.65); font-weight: 600; }
.breakdownSep { color: var(--border); }

.taxRow {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  font-size: 11px;
  color: #aab0c0;
  gap: 6px;
  min-height: 0;
}
.taxInfo { color: #aab0c0; }
.headerTaxDelinquent { color: #ff5a7a; font-weight: 700; }

/* ── 증권사 설정 버튼 ─────────────────────────────── */
.settingsBtn {
  background: rgba(255,255,255,0.06);
  border: 1px solid var(--border);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  cursor: pointer;
  padding: 3px 9px;
  border-radius: 8px;
  color: var(--accent);
  white-space: nowrap;
  transition: background 0.15s;
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 70px;
  justify-content: center;
}
.settingsBtn:hover { background: rgba(255,255,255,0.08); }

/* ── 닉네임 자간 ─────────────────────────────────── */
.topNick { letter-spacing: 0.08em; font-weight: 700; }

/* ── body 색조 (CRASH/BOOM) ──────────────────────── */
body.market-crash .topBar   { box-shadow: 0 2px 0 rgba(255,50,70,0.5); }
body.market-crash .newsStrip { background: rgba(100,10,20,0.5); }
body.market-boom  .topBar   { box-shadow: 0 2px 0 rgba(30,210,120,0.5); }
body.market-boom  .newsStrip { background: rgba(10,60,30,0.5); }

/* ── 가로 모드 경고 (선택사항) ──────────────────── */
@media (orientation: landscape) and (max-height: 500px) {
  :root { --topbar-h: 50px; --news-h: 28px; --nav-h: 44px; }
  .loginCard { padding: 20px 24px; }
  .loginLogo { font-size: 32px; }
  .loginTitle { font-size: 22px; }
}

/* 기본 유틸리티 */
.hidden {
  display: none !important;
}

/* 상태 배너 관련 추가 스타일 (선택사항: 가독성 향상) */
.statusPill {
  transition: opacity 0.3s ease;
}

/* 대공황 발생 시 상단바 및 배경 효과 */
body.market-crash .topBar {
  box-shadow: 0 4px 20px rgba(255, 90, 122, 0.2);
  border-bottom: 1px solid rgba(255, 90, 122, 0.3);
}

/* 슈퍼호황 발생 시 상단바 및 배경 효과 */
body.market-boom .topBar {
  box-shadow: 0 4px 20px rgba(61, 220, 151, 0.2);
  border-bottom: 1px solid rgba(61, 220, 151, 0.3);
}
.conditionText        { font-size: 14px; font-weight: bold; }
.conditionText--crash { color: var(--sell); }
.conditionText--boom  { color: var(--accent); }
.conditionText--halt  { color: #ffc866; }
.conditionSub         { font-size: 12px; margin-left: 6px; color: var(--muted); }

.dynamicModalOverlay {
  position: fixed; inset: 0; z-index: 9999;
  display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,.75); padding: 20px; box-sizing: border-box;
}
.dynamicModalCard {
  background: var(--card); border: 1px solid var(--border);
  border-radius: 18px; padding: 24px 20px;
  max-width: 320px; width: 100%; box-sizing: border-box;
}
.dynamicModalCardLg {
  max-width: 340px; max-height: 80vh; overflow-y: auto; text-align: left;
}

.textDanger { color: #f87171; }
.noticeBody { color: var(--muted); font-size: 13px; line-height: 1.6; white-space: pre-wrap; }
.changeNotice {
  margin-top: 10px; padding: 10px;
  background: rgba(255,200,102,0.08);
  border-radius: 8px; text-align: center;
  color: var(--muted); font-size: 12px;
}

/* 거래 내역 행 */
.trStockName { font-size: 15px; font-weight: 600; color: var(--stock-color, #fff); }
.trAmtBonus  { font-size: 16px; font-weight: bold; color: #ffc866; }
.trAmtVal    { font-size: 16px; font-weight: bold; white-space: nowrap; flex-shrink: 0; }
.trNote      { font-size: 12px; color: var(--muted); }
.trNoteLg    { font-size: 13px; color: var(--muted); }

/* 자동매도 모달 내부 */
.dmTitle       { font-size: 16px; font-weight: 700; }
.dmSubText     { font-size: 12px; color: #9ca3af; }
.dmSubTextLg   { font-size: 13px; color: #9ca3af; }
.dmLabel       { font-size: 12px; color: #9ca3af; display: block; margin-bottom: 4px; }
.dmSectionHead { font-size: 11px; color: #9ca3af; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; margin-bottom: 8px; }
.dmItemName    { font-size: 13px; font-weight: 600; color: #e5e7eb; }
.dmItemDetail  { font-size: 11px; color: #9ca3af; margin-left: 6px; }
.dmOrderRow    { display: flex; align-items: center; justify-content: space-between; padding: 8px 0; border-bottom: 1px solid var(--border); }
.dmInput       { width: 100%; padding: 10px 12px; border-radius: 10px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12); color: #e5e7eb; font-size: 14px; box-sizing: border-box; outline: none; }
.dmBtnSec      { flex: 1; padding: 12px; border-radius: 10px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12); color: #e5e7eb; font-size: 14px; cursor: pointer; }
.dmBtnClose    { width: 100%; padding: 11px; border-radius: 10px; background: rgba(255,255,255,.1); border: none; color: #e5e7eb; font-size: 14px; font-weight: 600; cursor: pointer; }
.dmBtnAccent   { flex: 1; padding: 12px; border-radius: 10px; background: rgba(120,200,255,.15); border: 1px solid rgba(120,200,255,.3); color: #78c8ff; font-size: 14px; cursor: pointer; }
.dmBtnDanger   { flex: 1; padding: 12px; border-radius: 10px; background: rgba(255,90,122,.15); border: 1px solid rgba(255,90,122,.3); color: #ff5a7a; font-size: 14px; cursor: pointer; }
.dmBtnConfirm  { width: 100%; padding: 11px; border-radius: 10px; background: #3b82f6; border: none; color: #fff; font-size: 14px; font-weight: 600; cursor: pointer; }
.dmBtnCancelSm { padding: 4px 10px; border-radius: 6px; background: rgba(239,68,68,.15); border: 1px solid rgba(239,68,68,.3); color: #f87171; font-size: 11px; cursor: pointer; }
.btnAmber      { color: #ffc866; border-color: rgba(255,200,102,0.3); }
/* 동적 모달 라이트 테마 */
[data-theme="light"] .dmSubText,
[data-theme="light"] .dmSubTextLg  { color: var(--muted); }
[data-theme="light"] .dmLabel,
[data-theme="light"] .dmSectionHead { color: rgba(20,20,20,.55); }
[data-theme="light"] .dmItemName   { color: var(--text); }
[data-theme="light"] .dmItemDetail { color: var(--muted); }
[data-theme="light"] .dmInput      { background: rgba(0,0,0,.04); border-color: rgba(0,0,0,.15); color: var(--text); }
[data-theme="light"] .dmBtnSec     { background: rgba(0,0,0,.06); border-color: rgba(0,0,0,.12); color: var(--text); }
[data-theme="light"] .dmBtnClose   { background: rgba(0,0,0,.06); color: var(--muted); }
[data-theme="light"] .dmBtnAccent  { background: rgba(26,111,181,.10); border-color: rgba(26,111,181,.25); color: #1a6fb5; }
[data-theme="light"] .dmBtnDanger  { background: rgba(214,48,80,.10); border-color: rgba(214,48,80,.25); color: #d63050; }
[data-theme="light"] .dmBtnCancelSm { background: rgba(214,48,80,.10); border-color: rgba(214,48,80,.20); color: #d63050; }
[data-theme="light"] .btnAmber     { color: #8a6010; border-color: rgba(160,120,0,.25); }
[data-theme="light"] .trAmtBonus  { color: #8a6010; }
[data-theme="light"] .adviceStock { color: #1a6fb5; }
[data-theme="light"] .adviceHint  { color: var(--text); background: rgba(26,111,181,.06); border-color: rgba(26,111,181,.15); }
[data-theme="light"] .adviceDisclaim { color: var(--muted); }

/* 전문가 분석 모달 */
.adviceEmoji   { font-size: 32px; text-align: center; margin-bottom: 12px; }
.adviceTitle   { font-size: 15px; font-weight: 700; text-align: center; margin-bottom: 8px; }
.adviceStock   { font-size: 12px; text-align: center; color: #78c8ff; margin-bottom: 10px; font-weight: 600; }
.adviceHint    { font-size: 13px; line-height: 1.6; color: #e5e7eb; background: rgba(120,200,255,.06); border-radius: 12px; padding: 12px 14px; margin-bottom: 14px; border: 1px solid rgba(120,200,255,.12); }
.adviceDisclaim { font-size: 10px; color: #6b7280; text-align: center; margin-bottom: 16px; }
.delistBadge    { font-size: 10px; background: rgba(255,90,122,0.2); color: var(--sell); padding: 2px 4px; border-radius: 4px; vertical-align: middle; }
.delistBadge--lg { font-size: 11px; padding: 3px 6px; }
/* 거래 내역 행 공통 */
.trTime    { display: flex; justify-content: space-between; align-items: center; font-size: 12px; color: #888; }
.trMeta    { display: flex; justify-content: space-between; font-size: 12px; color: #aaa; }
.trMetaLg  { display: flex; justify-content: space-between; font-size: 13px; color: #aaa; }
/* 랭킹 구분선 */
.rankDivider   { text-align: center; color: #888; padding: 8px 0; }
.rankDividerSm { text-align: center; color: #888; padding: 4px 0; font-size: 13px; }
/* 빈 상태 메시지 */
.seasonEmptyMsg { padding: 16px; color: #888; font-size: 14px; text-align: center; }
.dmEmptyMsg     { text-align: center; color: #6b7280; font-size: 13px; padding: 8px 0; }

/* 배너가 보일 때 레이아웃 간격 조정 */
body.has-condition-banner {
  --condition-banner-h: 36px;
}

#conditionBanner {
  height: var(--condition-banner-h);
  background: rgba(255, 255, 255, 0.05);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 12px;
  overflow: hidden;
  transition: all 0.3s ease;
}

.marketHaltOverlay {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(11, 15, 25, 0.6); /* 반투명 어두운 배경 */
  backdrop-filter: blur(3px);       /* 배경 흐리게 처리 */
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius);
}

.haltMsg {
  background: rgba(255, 204, 0, 0.2);
  color: #ffcc00;
  padding: 12px 20px;
  border-radius: 20px;
  font-weight: bold;
  border: 1px solid rgba(255, 204, 0, 0.4);
  animation: pulse 1.5s infinite;
}

@keyframes pulse {
  0% { transform: scale(1); opacity: 0.8; }
  50% { transform: scale(1.05); opacity: 1; }
  100% { transform: scale(1); opacity: 0.8; }
}

/* ── 거래 정지: 종목 리스트 전체 블러 강제 ──────────── */
#marketList.market-halted .stockRow {
  filter: blur(3px);
  pointer-events: none;
  user-select: none;
}

/* ── 설정 버튼 ───────────────────────────────────────── */
.settingsBtn {
  padding: 3px 8px;
  background: rgba(120,200,255,.09);
  border: 1px solid rgba(120,200,255,.22);
  border-radius: 999px;
  font-size: 13px;
  line-height: 1;
  color: var(--accent);
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  transition: background 0.15s;
}
.settingsBtn:active { background: rgba(120,200,255,.18); }

/* ── 설정 모달 아코디언 ──────────────────────────────── */
.settingsAccordion {
  display: flex;
  flex-direction: column;
  padding: 8px 0 16px;
}

.settingsSection {
  border-bottom: 1px solid rgba(255,255,255,.06);
}

.settingsSummary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 20px;
  font-size: 14px;
  font-weight: 700;
  color: #d1d5db;
  cursor: pointer;
  user-select: none;
  list-style: none;
  transition: background 0.15s, color 0.15s;
}
.settingsSummary::-webkit-details-marker { display: none; }
.settingsSummary::marker { display: none; }

.settingsSummary::after {
  content: '›';
  font-size: 20px;
  font-weight: 300;
  color: #6b7280;
  transform: rotate(90deg);
  transition: transform 0.2s ease, color 0.15s;
  flex-shrink: 0;
  line-height: 1;
}

.settingsSection[open] .settingsSummary::after {
  transform: rotate(270deg);
  color: #78c8ff;
}

.settingsSummary:hover { background: rgba(255,255,255,.04); color: #fff; }
.settingsSection[open] .settingsSummary { color: #78c8ff; }

.settingsBody {
  padding: 4px 20px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.settingsSectionLink {
  padding: 12px 20px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}

.settingsPlayerGrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  align-items: center;
}
.settingsPlayerCard {
  background: rgba(255,200,102,0.08);
  border: 1px solid rgba(255,200,102,0.2);
  border-radius: 10px;
  padding: 11px 14px;
}
.settingsPlayerCardLabel { font-size: 11px; color: #9ca3af; margin-bottom: 4px; }
.settingsTaxValue { font-size: 15px; font-weight: 700; color: #ffc866; }
.settingsBrokerBtn { font-size: 14px; font-weight: 700; white-space: normal; word-break: keep-all; height: 100%; min-height: 52px; }

.settingsLinkBtn {
  display: block;
  background: rgba(120,200,255,0.08);
  border: 1px solid rgba(120,200,255,0.2);
  border-radius: 10px;
  padding: 12px 14px;
  font-size: 13px;
  color: #78c8ff;
  text-decoration: none;
  font-weight: 600;
  transition: background 0.15s;
}
.settingsLinkBtn:active { background: rgba(120,200,255,.16); }

.settingsActionBtn { width: 100%; font-size: 13px; }

.settingsAppDownload {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(255,255,255,.06);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.settingsAppDownloadMsg {
  font-size: 12px;
  color: #9ca3af;
  margin: 0 0 2px;
  line-height: 1.5;
}
.settingsAppStoreBtn { text-align: center; }
.settingsAppStoreBtnDisabled { opacity: .4; cursor: not-allowed; pointer-events: none; color: var(--muted); }

/* ── 설정 — 토글 스위치 ─────────────────────────────── */
.settingsToggleRow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 0;
}
.settingsToggleInfo { display: flex; flex-direction: column; gap: 2px; }
.settingsToggleLabel { font-size: 14px; color: #e5e7eb; font-weight: 600; }
.settingsToggleDesc { font-size: 11px; color: #9ca3af; }

.toggleSwitch { position: relative; display: inline-block; width: 46px; height: 26px; flex-shrink: 0; }
.toggleSwitch input { opacity: 0; width: 0; height: 0; }
.toggleSlider {
  position: absolute; cursor: pointer;
  inset: 0;
  background: #374151;
  border-radius: 26px;
  transition: background .2s;
}
.toggleSlider::before {
  content: '';
  position: absolute;
  width: 20px; height: 20px;
  left: 3px; bottom: 3px;
  background: #fff;
  border-radius: 50%;
  transition: transform .2s;
}
.toggleSwitch input:checked + .toggleSlider { background: #22c55e; }
.toggleSwitch input:checked + .toggleSlider::before { transform: translateX(20px); }

/* ── 푸시 알림 동의 모달 ──────────────────────────────── */
.pushConsentBody {
  padding: 4px 20px 20px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.pushConsentMsg { font-size: 13px; color: #d1d5db; margin: 0 0 8px; line-height: 1.5; }
.pushConsentBtn { width: 100%; font-size: 14px; }

/* ── 웹 전용 앱 다운로드 안내 모달 ──────────────────── */
.webOnlyAlertPanel {
  max-width: 320px;
}
.webOnlyAlertBody {
  padding: 4px 20px 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.webOnlyAlertMsg {
  font-size: 13px;
  color: #d1d5db;
  line-height: 1.6;
  margin: 0;
  text-align: center;
}
.webOnlyStoreBtn {
  display: block;
  background: rgba(120,200,255,0.12);
  border: 1px solid rgba(120,200,255,0.3);
  border-radius: 12px;
  padding: 13px 16px;
  font-size: 14px;
  font-weight: 700;
  color: #78c8ff;
  text-decoration: none;
  text-align: center;
  transition: background 0.15s;
}
.webOnlyStoreBtn:active { background: rgba(120,200,255,.22); }
.webOnlyStoreBtnSecondary {
  background: rgba(255,255,255,0.05);
  border-color: rgba(255,255,255,0.12);
  color: #9ca3af;
  font-weight: 600;
}
.webOnlyStoreBtnDisabled {
  opacity: .35;
  cursor: not-allowed;
  pointer-events: none;
  background: rgba(255,255,255,0.04);
  border-color: rgba(255,255,255,0.08);
  color: #6b7280;
}

/* ── 계정 탈퇴 버튼 ────────────────────────────────── */
.settingsDeleteAccountBtn {
  background: rgba(220, 38, 38, 0.12);
  border: 1px solid rgba(220, 38, 38, 0.35);
  color: #f87171;
  font-weight: 700;
  width: 100%;
  padding: 10px 12px;
  border-radius: 10px;
  font-size: 13px;
  margin-top: 4px;
  cursor: pointer;
  transition: background 0.15s;
}
.settingsDeleteAccountBtn:active { background: rgba(220, 38, 38, 0.25); }

/* ── 계정 탈퇴 확인 모달 ────────────────────────────── */
.deleteAccountOverlay {
  position: fixed; inset: 0; z-index: 9999;
  display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,0.75);
}
.deleteAccountCard {
  background: #1a1a2e;
  border: 1px solid rgba(220,38,38,0.4);
  border-radius: 18px;
  padding: 24px 20px 20px;
  width: min(92vw, 360px);
  display: flex; flex-direction: column; gap: 14px;
}
.deleteAccountTitle {
  font-size: 17px; font-weight: 800; color: #f87171; text-align: center;
}
.deleteAccountMsg {
  font-size: 13px; color: #9ca3af; line-height: 1.6; text-align: center;
}
.deleteAccountInput {
  width: 100%; box-sizing: border-box;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 10px;
  color: #e5e7eb;
  font-size: 14px;
  padding: 10px 12px;
  outline: none;
}
.deleteAccountInput:focus { border-color: #f87171; }
.deleteAccountConfirmBtn {
  background: #dc2626;
  color: #fff;
  border: none;
  border-radius: 10px;
  padding: 11px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  width: 100%;
}
.deleteAccountCancelBtn {
  background: rgba(255,255,255,0.06);
  color: #9ca3af;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 10px;
  padding: 11px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  width: 100%;
}

/* ── 게임 가이드 아코디언 ───────────────────────────── */
.guideAccordion {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.guideSection {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  overflow: hidden;
}

.guideSection[open] {
  border-color: rgba(120,200,255,.2);
}

.guideSummary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 11px 14px;
  font-size: 13px;
  font-weight: 700;
  color: #d1d5db;
  cursor: pointer;
  user-select: none;
  list-style: none;
  transition: background 0.15s, color 0.15s;
}
.guideSummary::-webkit-details-marker { display: none; }
.guideSummary::marker { display: none; }

.guideSummary::after {
  content: '›';
  font-size: 18px;
  font-weight: 300;
  color: #6b7280;
  transform: rotate(90deg);
  transition: transform 0.2s ease, color 0.15s;
  flex-shrink: 0;
  line-height: 1;
}

.guideSection[open] .guideSummary::after {
  transform: rotate(270deg);
  color: #78c8ff;
}

.guideSummary:hover {
  background: rgba(255,255,255,.05);
  color: #fff;
}

.guideSection[open] .guideSummary {
  color: #78c8ff;
  border-bottom: 1px solid rgba(255,255,255,.06);
}

.guideBody {
  padding: 12px 14px;
  font-size: 13px;
  color: #d1d5db;
  line-height: 1.7;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* ── Phase 3: 시즌/대회 사이클 시스템 ────────────────────────── */

/* 랭킹 탭 섹션 구분 */
.historySection {
  margin-bottom: 16px;
}

.historySectionHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px 8px;
  border-bottom: 1px solid rgba(255,255,255,0.07);
}

.historySectionTitle {
  font-size: 13px;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: 0.3px;
}

/* 내 순위 뱃지 (랭킹탭 헤더 우측) */
.rankBadgeSmall {
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  background: rgba(0, 122, 255, 0.3);
  border: 1px solid rgba(0, 122, 255, 0.5);
  border-radius: 20px;
  padding: 3px 10px;
  white-space: nowrap;
}

/* 컴팩트 테이블 래퍼 */
.tableWrapCompact {
  padding: 0 4px 4px;
}

/* 역대 기록 리스트 */
.historyList {
  padding: 6px 10px 10px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.historyEmpty {
  text-align: center;
  color: rgba(255,255,255,0.35);
  font-size: 13px;
  padding: 24px 0;
}

/* 역대 기록 행 */
.historyRow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 10px;
  padding: 10px 12px;
  transition: background 0.15s;
}

.historyRowClickable {
  cursor: pointer;
}

.historyRowClickable:active {
  background: rgba(255,255,255,0.09);
}

.historyRowLeft {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
  flex: 1;
}

.historyRowRight {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  margin-left: 10px;
}

.historyRowSeason {
  font-size: 13px;
  font-weight: 700;
  color: #fff;
}

.historyRowWinner {
  font-size: 12px;
  color: rgba(255,255,255,0.6);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.historyRowAssets {
  font-size: 12px;
  font-weight: 700;
  color: var(--green);
}

.historyRowDate {
  font-size: 11px;
  color: rgba(255,255,255,0.35);
}

.historyRowArrow {
  font-size: 14px;
  color: rgba(255,255,255,0.3);
}

/* 마켓탭 시즌 종료 오버레이 */
.seasonEndOverlay {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(11, 15, 25, 0.85);
  backdrop-filter: blur(6px);
  z-index: 200;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border-radius: var(--radius);
}

.seasonEndOverlay.hidden {
  display: none;
}

.seasonEndOverlayIcon {
  font-size: 56px;
  line-height: 1;
  animation: pulse 1.8s infinite;
}

.seasonEndOverlayTitle {
  font-size: 22px;
  font-weight: 800;
  color: #ffd700;
  letter-spacing: 1px;
}

.seasonEndOverlayMsg {
  font-size: 13px;
  color: rgba(255,255,255,0.65);
  text-align: center;
  line-height: 1.6;
  white-space: pre-line;
}

/* 시즌 상세 바텀시트 */
.seasonDetailPanel {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  background: var(--panel);
  border-radius: 18px 18px 0 0;
  padding: 0 0 env(safe-area-inset-bottom, 0px);
  max-height: 70vh;
  overflow-y: auto;
  z-index: 10;
}

.seasonDetailBody {
  padding: 8px 14px 20px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.seasonDetailDate {
  font-size: 12px;
  color: rgba(255,255,255,0.4);
  text-align: center;
  margin-bottom: 4px;
}

.seasonDetailRow {
  display: flex;
  align-items: center;
  gap: 10px;
  background: rgba(255,255,255,0.04);
  border-radius: 8px;
  padding: 8px 10px;
}

.seasonDetailRow .rankNum {
  font-size: 15px;
  font-weight: 800;
  color: rgba(255,255,255,0.4);
  width: 26px;
  text-align: center;
  flex-shrink: 0;
}

.seasonDetailRow:nth-child(1) .rankNum { color: #ffd700; }
.seasonDetailRow:nth-child(2) .rankNum { color: #c0c0c0; }
.seasonDetailRow:nth-child(3) .rankNum { color: #cd7f32; }

.seasonDetailRow .rankName {
  flex: 1;
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.seasonDetailRow .rankAssets {
  font-size: 12px;
  font-weight: 700;
  color: var(--green);
  flex-shrink: 0;
}

.seasonEndRankProfit {
  font-size: 11px;
  color: rgba(255,255,255,0.4);
}

/* ── 랭킹 UI v2: TOP3 고정 + 주변 순위 ────────────────────────── */

.rankSectionLabel {
  font-size: 11px;
  font-weight: 700;
  color: rgba(255,255,255,0.4);
  letter-spacing: 0.8px;
  text-transform: uppercase;
  padding: 8px 14px 4px;
}

.rankTop3Section {
  margin-bottom: 4px;
}

.rankNeighborSection {
  border-top: 1px solid rgba(255,255,255,0.07);
  margin-top: 4px;
}

.rankingRow2 {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  border-radius: 8px;
  margin: 2px 8px;
  transition: background 0.15s;
}

.rankingRow2.is-player {
  background: rgba(0, 122, 255, 0.12);
  border: 1px solid rgba(0, 122, 255, 0.3);
}

.rankingRow2.player-focus {
  background: rgba(0, 122, 255, 0.18);
  border: 1px solid rgba(0, 122, 255, 0.45);
}

.rankingRow2Pos {
  font-size: 18px;
  width: 32px;
  text-align: center;
  flex-shrink: 0;
}

/* 숫자 순위는 작게 */
.rankingRow2Pos:not(:empty) {
  font-size: 13px;
  font-weight: 700;
  color: rgba(255,255,255,0.45);
}

.rankingRow2Name {
  flex: 1;
  font-size: 14px;
  font-weight: 600;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.rankingRow2.is-player .rankingRow2Name,
.rankingRow2.player-focus .rankingRow2Name {
  color: #5aabff;
}

.rankingRow2Assets {
  font-size: 13px;
  font-weight: 700;
  color: rgba(255,255,255,0.8);
  flex-shrink: 0;
}

.rankingRow2Profit {
  font-size: 12px;
  font-weight: 600;
  width: 56px;
  text-align: right;
  flex-shrink: 0;
}

/* 토스트 텍스트 줄바꿈용 래퍼 ── */
.toastTextWrap {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  line-height: 1.2;
}

/* ── 거래 토스트 알림 ─────────────────────────────────── */
.tradeToast {
  position: fixed;
  bottom: 90px;
  left: 50%;
  transform: translateX(-50%) translateY(20px);
  opacity: 0;
  transition: opacity 0.2s ease, transform 0.2s ease;
  display: flex;
  align-items: center;
  gap: 8px;
  background: #1e2535;
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 12px;
  padding: 10px 16px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.5);
  z-index: 9999;
  white-space: nowrap;
  font-size: 13px;
  pointer-events: none;
  min-width: 140px; /* 너무 짧아지지 않게 최소 너비 지정 */
  white-space: normal; /* 줄바꿈 허용 */
}
.tradeToast.toastVisible {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}
.tradeToast-buy  { border-color: rgba(90,255,160,0.4); }
.tradeToast-sell { border-color: rgba(255,90,122,0.4); }
.tradeToast-error {
  background: linear-gradient(135deg, #2a1420, #3d1020);
  border-color: rgba(255,90,122,0.6);
}
.toastIcon { font-size: 18px; }
.toastMain { font-weight: 700; color: #fff; }
.toastDetail { color: rgba(255,255,255,0.7); }
.toastFee { color: rgba(255,255,255,0.45); font-size: 11px; }

/* ── 게임 오버 팝업 ──────────────────────────────────── */
.gameOverPanel {
  text-align: center;
  padding: 32px 24px;
  max-width: 300px;
}
.gameOverIcon { font-size: 48px; margin-bottom: 12px; }
.gameOverTitle {
  font-size: 22px;
  font-weight: 800;
  color: #ff5a7a;
  margin-bottom: 8px;
}
.gameOverBody {
  font-size: 14px;
  color: rgba(255,255,255,0.7);
  line-height: 1.6;
  margin-bottom: 20px;
}
.gameOverRetryBtn {
  width: 100%;
  padding: 12px;
  font-size: 15px;
  font-weight: 700;
}

/* ── 대출 경고 배너 ──────────────────────────────────── */
.loanWarningBanner {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: #c0392b;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  padding: 6px 12px;
  letter-spacing: 0.01em;
}
.loanWarningBanner.hidden { display: none; }

/* ── 대출 탭 패널 ────────────────────────────────────── */
.loanPanel {
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.loanStatusCard, .loanInfoCard {
  background: #1a1f2e;
  border-radius: 14px;
  padding: 16px;
}
.loanStatusCard.loanActive { border: 1px solid rgba(192, 57, 43, 0.35); }
.loanFormWrap {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.loanFormLabel {
  font-size: 13px;
  font-weight: 600;
  color: rgba(255,255,255,0.5);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.loanInput {
  background: #1a1f2e;
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 10px;
  color: #fff;
  font-size: 17px;
  padding: 0 14px;
  height: 48px;
  width: 100%;
  box-sizing: border-box;
}
.loanInput:focus { outline: none; border-color: #78c8ff; box-shadow: 0 0 0 2px rgba(120,200,255,0.15); }
.loanQuickBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.loanPreview {
  background: rgba(120, 200, 255, 0.07);
  border: 1px solid rgba(120, 200, 255, 0.14);
  border-radius: 10px;
  padding: 12px 14px;
  min-height: 0;
}
.loanPreview:empty { display: none; }
.loanRepayBtn { width: 100%; }
.loanNote {
  font-size: 12px;
  color: rgba(255,255,255,0.35);
  line-height: 1.6;
}
.loanPanelLabel    { font-size: 12px; color: var(--muted); margin-bottom: 6px; letter-spacing: 0.04em; }
.loanPanelTotal    { font-size: 30px; font-weight: 900; color: var(--sell); line-height: 1; margin-bottom: 4px; }
.loanPanelTotalSub { font-size: 12px; color: var(--muted); margin-bottom: 16px; }
.loanInfoBox       { background: var(--card); border-radius: 10px; padding: 10px 12px; }
.loanInfoLabel     { font-size: 11px; color: var(--muted); margin-bottom: 4px; }
.loanInfoValue     { font-size: 14px; font-weight: 700; }
.loanDeadlineValue { font-size: 15px; font-weight: 800; }
.loanDeadlineUrgent { color: var(--sell); }
.loanDeadlineWarn  { color: #fbbf24; }
.loanCashOk        { color: var(--buy); }
.loanCashNot       { color: var(--sell); }
.loanApplyTitle     { font-size: 16px; font-weight: 800; }
.loanApplyInfoBox   { background: var(--card); border-radius: 10px; padding: 10px 14px; }
.loanApplyInfoLabel { font-size: 11px; color: var(--muted); margin-bottom: 4px; }
.loanApplyInfoValue { font-size: 14px; font-weight: 700; }
.loanApplyRateValue  { font-size: 24px; font-weight: 900; color: #ff9f7a; }
.loanApplyLimitValue { font-size: 15px; font-weight: 800; color: var(--accent); }
.loanQuickPct       { font-size: 11px; opacity: 0.5; font-weight: 400; }
.loanMaxNote        { font-size: 12px; color: rgba(255,255,255,0.3); }

/* ── 대출 기간 입력 래퍼 ──────────────────────────────── */
.loanDurationInputWrap {
  display: flex;
  align-items: center;
  gap: 8px;
}
.loanDurationInputWrap .loanInput {
  flex: 1;
}
.loanDurationUnit {
  font-size: 12px;
  color: rgba(255,255,255,0.45);
  white-space: nowrap;
  flex-shrink: 0;
}

/* ── 대출 강제 파산 오버레이 ───────────────────────────── */
.loanBankruptOverlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(0, 0, 0, 0.92);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.loanBankruptOverlay.hidden { display: none; }
.loanBankruptCard {
  background: #16101a;
  border: 1px solid #c0392b;
  border-radius: 20px;
  padding: 36px 28px 28px;
  max-width: 340px;
  width: 100%;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 12px;
  box-shadow: 0 0 40px rgba(192, 57, 43, 0.35);
}
.loanBankruptIcon {
  font-size: 52px;
  line-height: 1;
}
.loanBankruptTitle {
  font-size: 22px;
  font-weight: 900;
  color: #ff5a7a;
  letter-spacing: -0.02em;
}
.loanBankruptBody {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.75);
  line-height: 1.7;
}
.loanBankruptDetail {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.45);
  padding: 10px 0 2px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.loanBankruptDetail strong { color: #ff5a7a; }
.loanBankruptConfirmBtn {
  margin-top: 8px;
  width: 100%;
  padding: 14px;
  font-size: 15px;
  font-weight: 700;
  background: #c0392b;
  color: #fff;
  border: none;
  border-radius: 10px;
  cursor: pointer;
}
.loanBankruptConfirmBtn:hover { background: #a93226; }

/* ── 대출 횟수 배지 ─────────────────────────────────────── */
.loanCountBadge {
  font-size: 13px;
  font-weight: 700;
  padding: 2px 10px;
  border-radius: 20px;
}
.loanCountOk     { background: rgba(74, 222, 128, 0.15); color: #4ade80; }
.loanCountWarn   { background: rgba(251, 191, 36, 0.15); color: #fbbf24; }
.loanCountUrgent { background: rgba(255, 90, 122, 0.15); color: #ff5a7a; }
.loanCountExceeded {
  background: rgba(192, 57, 43, 0.15);
  border: 1px solid rgba(192, 57, 43, 0.4);
  border-radius: 10px;
  padding: 10px 12px;
  font-size: 13px;
  color: #ff5a7a;
  text-align: center;
  line-height: 1.5;
}

/* ── 역대 명예의전당 모달 ─────────────────────────────── */
.hofModalOverlay {
  position: fixed;
  inset: 0;
  z-index: 9000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
}
.hofModalOverlay.hidden { display: none; }
.hofModalBackdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.82);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.hofModalCard {
  position: relative;
  background: linear-gradient(160deg, #141b2d 0%, #0d1220 100%);
  border: 1px solid rgba(255, 200, 102, 0.25);
  border-radius: 24px;
  width: 100%;
  max-width: 360px;
  box-shadow:
    0 0 60px rgba(255, 185, 50, 0.18),
    0 20px 60px rgba(0, 0, 0, 0.6);
  overflow: hidden;
}
.hofModalHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 20px 14px;
  border-bottom: 1px solid rgba(255, 200, 102, 0.12);
  background: linear-gradient(90deg, rgba(255,185,50,0.07) 0%, transparent 100%);
}
.hofModalTitle {
  font-size: 17px;
  font-weight: 900;
  color: #ffc866;
  letter-spacing: -0.01em;
}
.hofModalClose {
  background: rgba(255,255,255,0.07);
  border: none;
  color: rgba(255,255,255,0.5);
  width: 28px;
  height: 28px;
  border-radius: 50%;
  font-size: 13px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .15s, color .15s;
}
.hofModalClose:hover { background: rgba(255,255,255,0.14); color: #fff; }
.hofModalBody {
  padding: 16px 16px 20px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.hofLoadingMsg, .hofEmptyMsg, .hofErrorMsg {
  text-align: center;
  color: rgba(255,255,255,0.45);
  font-size: 14px;
  padding: 28px 0;
}
.hofEntry {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.06);
  transition: background .15s;
}
.hofEntry:first-child  { background: rgba(255, 195, 0, 0.10); border-color: rgba(255, 195, 0, 0.22); }
.hofEntry:nth-child(2) { background: rgba(192, 192, 192, 0.08); border-color: rgba(192, 192, 192, 0.18); }
.hofEntry:nth-child(3) { background: rgba(180, 120, 60, 0.08); border-color: rgba(180, 120, 60, 0.18); }
.hofRankIcon {
  font-size: 22px;
  flex-shrink: 0;
  width: 32px;
  text-align: center;
}
.hofEntryMeta {
  flex: 1;
  min-width: 0;
}
.hofEntryName {
  font-size: 14px;
  font-weight: 700;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.hofEntrySeason {
  font-size: 11px;
  color: rgba(255,255,255,0.42);
  margin-top: 2px;
}
.hofEntryAssets {
  font-size: 14px;
  font-weight: 800;
  color: #ffc866;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.hofEntry:first-child .hofEntryAssets { color: #ffd700; }
.hofEntry:nth-child(2) .hofEntryAssets { color: #c0c0c0; }
.hofEntry:nth-child(3) .hofEntryAssets { color: #cd7f32; }

/* ── 칭호 배지 ──────────────────────────────────── */
.titleBadge {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  color: #ffd57a;
  background: rgba(255, 213, 122, 0.12);
  border: 1px solid rgba(255, 213, 122, 0.3);
  border-radius: 6px;
  padding: 2px 6px;
  margin-left: 6px;
  vertical-align: middle;
  white-space: nowrap;
  line-height: 1.4;
}

/* ── 메일 아이템 (도트 + 제목 행) ───────────────── */
.mailActionBtn {
  height: 34px;
  padding: 0 14px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  border: none;
  cursor: pointer;
  transition: opacity 0.15s;
  white-space: nowrap;
}
.mailActionBtn:active   { opacity: 0.7; }
.mailActionBtn:disabled { opacity: 0.35; cursor: not-allowed; }
.mailActionBtn-invest  { background: #238636; color: #fff; }
.mailActionBtn-reject  { background: rgba(255,255,255,0.07); color: #c9d1d9; border: 1px solid rgba(255,255,255,0.1); }
.mailActionBtn-report  { background: #ff5a7a; color: #fff; }
.mailActionBtn-ignore  { background: transparent; color: #8b949e; border: none; font-size: 12px; height: 32px; }
.mailActionBtn-pay     { background: #1a7ed4; color: #fff; }

/* ── 메일 상세 모달 ─────────────────────────────── */
.mailDetailPanel {
  max-width: 420px;
  width: calc(100% - 32px);
  max-height: 80vh;
  overflow-y: auto;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.mailDetailHeader {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.mailDetailType {
  font-size: 11px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 6px;
  background: rgba(120,200,255,0.15);
  color: #78c8ff;
  letter-spacing: 0.5px;
}
.mailDetailSubject {
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  line-height: 1.4;
}
.mailDetailMeta { font-size: 11px; color: #8b949e; }
.mailDetailBody {
  font-size: 14px;
  color: #c9d1d9;
  line-height: 1.7;
  white-space: pre-wrap;
  background: rgba(255,255,255,0.04);
  border-radius: 8px;
  padding: 14px;
}
.mailDetailDeadline { font-size: 12px; color: #fbbf24; }
.mailDetailDeadline.urgent { color: #ff5a7a; }
.mailDetailActions { display: flex; flex-direction: column; gap: 8px; margin-top: 4px; }
.mailDetailActions .mailActionBtn { width: 100%; height: 42px; font-size: 14px; }
.mailDetailPending { text-align: center; font-size: 13px; color: #78c8ff; padding: 8px 0; }


/* ── 압류 배너 (마이너스 현금) ──────────────────── */
#cashSeizedBanner {
  background: rgba(255, 90, 122, 0.15);
  border-bottom: 1px solid rgba(255, 90, 122, 0.3);
  color: #ff9faf;
  font-size: 13px;
  font-weight: 700;
  padding: 8px 16px;
  text-align: center;
  display: none;
}
#cashSeizedBanner.visible { display: block; }

/* 결제내역 필터 버튼 상태별 색상 (CSS 변수 활용) */
.logFilterBtn[data-type="BUY"].active {
  background-color: rgba(61, 220, 151, 0.15);
  color: var(--buy);
  border-color: var(--buy);
}
.logFilterBtn[data-type="SELL"].active {
  background-color: rgba(255, 90, 122, 0.15);
  color: var(--sell);
  border-color: var(--sell);
}
.logFilterBtn[data-type="GIFT"].active {
  background-color: rgba(255, 200, 102, 0.15);
  color: #ffc866;
  border-color: #ffc866;
}

.sh-asset {
  background: transparent;
  color: var(--accent);
  font-weight: bold;
}

/* 거래 토스트 추가 상태 (성공/안내) */
.tradeToast-success {
  background: rgba(35, 134, 54, 0.95);
  border: 1px solid rgba(46, 160, 67, 0.5);
  color: #ffffff;
}
.tradeToast-info {
  background: rgba(30, 80, 130, 0.97);
  border: 1px solid rgba(99, 179, 237, 0.4);
  color: #ffffff;
}

/* 보상 모달 등장 애니메이션 */
@keyframes rewardModalIn {
  from { opacity: 0; transform: scale(0.88) translateY(16px); }
  to { opacity: 1; transform: scale(1) translateY(0); }
}
@keyframes rewardGlow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(120, 200, 255, 0); }
  50% { box-shadow: 0 0 22px 6px rgba(120, 200, 255, 0.35); }
}
.rewardModalCard {
  border-color: rgba(120,200,255,.25);
  animation: rewardModalIn 0.32s cubic-bezier(0.34, 1.56, 0.64, 1),
  rewardGlow 1.2s ease 0.3s 1;
}

/* ── 서버 동기화 오버레이 ─────────────────────────────── */
.syncOverlay {
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: rgba(11, 15, 25, 0.92);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 18px;
  transition: opacity 0.4s ease;
}
.syncOverlay.hidden {
  opacity: 0;
  pointer-events: none;
}
@keyframes syncSpin {
  to { transform: rotate(360deg); }
}
.syncSpinner {
  width: 44px;
  height: 44px;
  border: 3px solid rgba(120, 200, 255, 0.2);
  border-top-color: #78c8ff;
  border-radius: 50%;
  animation: syncSpin 0.8s linear infinite;
}
.syncText {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.6);
  margin: 0;
}