/* 밝은 화면 모드 (html[data-theme=light]) — 설정 '화면 모드: 자동·밤·낮'(i18n.js applyTheme, localStorage nk_theme).
   1) :root 토큰을 낮 색으로 바꾸고 2) style.css·css/*.css 에 하드코딩된 어두운 색 규칙을 여기서만 덮어쓴다(원본 파일은 건드리지 않음).
   본문 대비: text 16:1 · text-2 11:1 · muted 6.4:1 · muted-2 5.3:1 · gold(글자·버튼 바탕) 5.4:1 · coral 5.1:1 (배경 #f6f3ec 기준, 모두 4.5:1 이상) */
html[data-theme="light"] {
  color-scheme: light;
  --bg: #f6f3ec;
  --canvas: #ece7dc;
  --panel: #ffffff;
  --panel-2: #f0ebe0;
  --line: #d6cdbb;
  --line-soft: #e4ddcf;
  --text: #1a1712;
  --text-2: #3a352b;
  --muted: #5f584a;
  --muted-2: #6b6455;
  --gold: #7d5f0f;
  --gold-hi: #6e520b;
  --gold-lo: #5c440a;
  --gold-tint: rgba(125,95,15,.10);
  --gold-edge: rgba(125,95,15,.42);
  --coral: #c22a3e;
  --on-coral: #ffffff;
  --lime: #17703a;
  --cyan: #7d5f0f;
  --pink: #c22a3e;
  --shadow-float: 0 10px 26px rgba(60,45,15,.16);
  --shadow-map: 0 24px 50px rgba(60,45,15,.2);
  --shadow-gold: 0 10px 24px rgba(125,95,15,.22);
}
html[data-theme="light"] body { background-image: radial-gradient(900px 360px at 50% -160px, rgba(212,175,55,.16), transparent 70%); }

/* 상단바 · 탭바 · 토스트 */
html[data-theme="light"] .topbar { background: rgba(246,243,236,.9); }
html[data-theme="light"] #tabbar { background: rgba(246,243,236,.97); }
html[data-theme="light"] .toast { background: rgba(255,255,255,.97); color: var(--text); }
html[data-theme="light"] .lang-pick { background: var(--panel); color: var(--text); border-color: var(--line); }

/* 사진 없는 자리(빗금) */
html[data-theme="light"] .thumb,
html[data-theme="light"] .cm-photos a,
html[data-theme="light"] .me-row-ic,
html[data-theme="light"] .dm-place-ph { background: repeating-linear-gradient(135deg, #ebe4d4 0 8px, #e3dbc9 8px 16px); }
html[data-theme="light"] .onboard-photo,
html[data-theme="light"] .dt-photo,
html[data-theme="light"] .ev-poster,
html[data-theme="light"] .dj-ph,
html[data-theme="light"] .dm-ph,
html[data-theme="light"] .crew-card-cover,
html[data-theme="light"] .crew-cover { background: repeating-linear-gradient(135deg, #ebe4d4 0 10px, #e2d9c6 10px 20px); }
html[data-theme="light"] .onboard-photo::after { background: linear-gradient(180deg, rgba(246,243,236,.2) 0, rgba(246,243,236,.5) 35%, #f6f3ec 70%); }
html[data-theme="light"] .dt-hero::after { background: linear-gradient(180deg, rgba(246,243,236,.35), transparent 35%, transparent 50%, #f6f3ec); }
html[data-theme="light"] .crew-card-cover::after { background: linear-gradient(180deg, transparent 30%, rgba(255,255,255,.92)); }
html[data-theme="light"] .crew-cover::after { background: linear-gradient(180deg, rgba(246,243,236,.4), rgba(246,243,236,.2)); }
html[data-theme="light"] .hm-side::before { background: linear-gradient(180deg, var(--bg) 30%, rgba(246,243,236,0)); }

/* 지도 위 떠 있는 컨트롤 (지도 타일은 그대로) */
html[data-theme="light"] .hm-q,
html[data-theme="light"] .hm-filter,
html[data-theme="light"] .hm-chips .chip { background: rgba(255,255,255,.95); color: var(--text); }
html[data-theme="light"] .hm-chips .chip.on { background: var(--text); color: var(--bg); }
html[data-theme="light"] .hm-live,
html[data-theme="light"] .hm-ctl,
html[data-theme="light"] .hm-legend,
html[data-theme="light"] .pm-label,
html[data-theme="light"] .dt-ic,
html[data-theme="light"] .dj-back,
html[data-theme="light"] .crew-ic { background: rgba(255,255,255,.92); color: var(--text); }
html[data-theme="light"] .leaflet-control-attribution { background: rgba(255,255,255,.8); color: var(--muted); }
html[data-theme="light"] .leaflet-control-attribution a { color: var(--gold); }
/* 점: 흰 테두리 + 얇은 어두운 바깥선 → 밝은·어두운 타일 모두에서 구분 */
html[data-theme="light"] .pm-dot { border-color: #fff; box-shadow: 0 0 0 1px rgba(26,23,18,.55); }
html[data-theme="light"] .pm-dot.full { box-shadow: 0 0 0 1px rgba(26,23,18,.55), 0 0 12px rgba(194,42,62,.6); }
html[data-theme="light"] .pm-dot.ok { box-shadow: 0 0 0 1px rgba(26,23,18,.55), 0 0 10px rgba(125,95,15,.45); }
html[data-theme="light"] .pm-dot.calm { background: #8a8270; }
html[data-theme="light"] .pm-cluster { background: rgba(125,95,15,.94); color: #fff; border-color: #fff; box-shadow: 0 0 0 1px rgba(26,23,18,.45), 0 0 0 7px rgba(125,95,15,.18); }

/* 그 밖의 하드코딩 색 */
html[data-theme="light"] .me-quick .chip { background: rgba(255,255,255,.8); }
html[data-theme="light"] .sf-ok { color: #fff; }
html[data-theme="light"] .sh-ic { color: var(--text); }
html[data-theme="light"] .mode-switch button.on,
html[data-theme="light"] .modeask-btns button:hover { color: #fff; }
html[data-theme="light"] .btn.primary:hover,
html[data-theme="light"] .btn.primary { color: #fff; }
html[data-theme="light"] .pmc-msg.mine .pm-mask,
html[data-theme="light"] .dm-msg.mine .pm-mask { background: rgba(255,255,255,.22); color: rgba(255,255,255,.85); }
html[data-theme="light"] ::selection { background: rgba(125,95,15,.22); }

/* 언어 고르기(상단바, i18n.js 가 넣음) — 두 모드 공통 */
.lang-pick { flex: none; width: auto; height: 32px; margin: 0 0 0 10px; padding: 0 26px 0 10px; border-radius: 10px; font-size: 12px; font-weight: 600; background-color: var(--panel); color: var(--text-2); border: 1px solid var(--line); cursor: pointer; min-width: 116px; max-width: 132px; }
@media (max-width: 720px) { .lang-pick { order: 2; margin-left: auto; height: 30px; padding: 0 22px 0 8px; } }

/* 지도 바탕(타일이 뜨기 전) · 배지 · 패널 안 어두운 바탕 */
/* 낮 타일(.day)일 때만 밝게. 밤 시간대 어두운 타일이면 바탕도 어두운 그대로 둔다(타일 로딩 중 번쩍임 방지) */
html[data-theme="light"] .cmap.day,
html[data-theme="light"] .leaflet-container.day { background: #e8e4dc !important; }
html[data-theme="light"] .badge.NEWBIE,
html[data-theme="light"] .badge.cancelled { background: #ebe5d8; color: var(--muted); }
html[data-theme="light"] .stat,
html[data-theme="light"] .tonight a,
html[data-theme="light"] .tn-stats div { background: rgba(125,95,15,.06); }
html[data-theme="light"] a.card:hover,
html[data-theme="light"] .grid > a.card:hover { box-shadow: 0 12px 28px rgba(60,45,15,.14); }
html[data-theme="light"] .list { box-shadow: 0 8px 22px rgba(60,45,15,.08); }
html[data-theme="light"] dialog { box-shadow: 0 24px 60px rgba(60,45,15,.25); }
html[data-theme="light"] .hm-q,
html[data-theme="light"] .hm-filter { box-shadow: 0 8px 22px rgba(60,45,15,.16); }
html[data-theme="light"] .hero { background: radial-gradient(600px 240px at 50% 0, rgba(212,175,55,.2), transparent 70%), var(--panel); }

/* 커뮤니티·나·소셜 화면의 고정 테두리(#24221c, #1a1814)와 버튼 바탕 */
html[data-theme="light"] .cm-board, html[data-theme="light"] .cm-table, html[data-theme="light"] .me-stats > div + div, html[data-theme="light"] .me-tabs,
html[data-theme="light"] .me-settings, html[data-theme="light"] .me-ticket, html[data-theme="light"] .rk-podium, html[data-theme="light"] .dm-safe,
html[data-theme="light"] .dm-prow, html[data-theme="light"] .dmw, html[data-theme="light"] .crews-note, html[data-theme="light"] .crew-tabs { border-color: var(--line); }
html[data-theme="light"] .cm-row, html[data-theme="light"] .cm-tr, html[data-theme="light"] .wl-log, html[data-theme="light"] .rk-row, html[data-theme="light"] .crew-req,
html[data-theme="light"] .crew-write, html[data-theme="light"] .crew-post, html[data-theme="light"] .crew-member, html[data-theme="light"] .crew-medal { border-color: var(--line-soft); }
html[data-theme="light"] .me-tk-cut::before { box-shadow: inset 0 -1px 0 var(--line); }
html[data-theme="light"] .me-tk-cut::after { box-shadow: inset 0 1px 0 var(--line); }
html[data-theme="light"] .ev-seg > a.on,
html[data-theme="light"] .dm-seg > button.on { background: var(--panel-2); color: var(--text); }
html[data-theme="light"] .pmc-rep i { background: var(--line); }
html[data-theme="light"] .cm-av { background: #e6dccb; color: var(--text-2); }
html[data-theme="light"] .cm-av.vip { background: #efe2bf; color: var(--gold); }
html[data-theme="light"] .pm-avi { color: #f3efe4; }   /* 아바타 바탕은 social.js 의 어두운 색 그대로라 글자를 밝게 */
html[data-theme="light"] .me-avatar { background: radial-gradient(circle at 35% 30%, #fff8e6, #efe4cc 70%); color: var(--gold); }
html[data-theme="light"] .me-bar { background: #e4ddcf; }
html[data-theme="light"] .me-bar.on-foil { background: rgba(60,45,15,.14); }
html[data-theme="light"] .wl-card { background: radial-gradient(300px 160px at 100% 0, rgba(255,255,255,.7), transparent 70%), linear-gradient(135deg, #fbf3dc, #eadcb6 60%); box-shadow: 0 18px 40px rgba(60,45,15,.18); }
html[data-theme="light"] .rk-pod.p2 .rk-col { background: linear-gradient(180deg, #d6cdbb, transparent); }
html[data-theme="light"] .rk-pod.p3 .rk-col { background: linear-gradient(180deg, #e2d9c6, transparent); }
html[data-theme="light"] #dock.dock-mini { background: rgba(255,255,255,.97); }
/* 좁은 폰(≤400px): 언어 선택을 줄여서 로그인·가입 버튼이 두 줄로 밀리지 않게 */
@media (max-width: 370px) { .lang-pick { max-width: 96px; padding: 0 18px 0 7px; font-size: 11px; background-position: right 4px center; } #auth-area { flex-wrap: nowrap; } #auth-area .btn { padding-inline: 10px; } }