/* ───── 겨울 스킨 (첫눈 이벤트) ─────
   html[data-skin="winter"]일 때만 작동하는 덧입히기 파일. 할로윈 스킨과 같은 구조이고 둘은 동시에 켜지지 않는다.
   바꾸는 것은 색(토큰)과 CSS로만 그린 눈 내림 연출뿐이다(그림 파일을 늘리지 않는다). */
html[data-skin="winter"] {
  --bg: #E9EEF4;
  --panel: #F6F9FC;
  --panel2: #E9EEF4;
  --text: #1F2A3A;
  --muted: #5B6B80;
  --line: #C3CEDB;
  --head: #1F2A3A;
  --gold: #3F5D84;
  --accent: #4A6688;
  --on-accent: #FFFFFF;
  --soft: #DCE5F0;
  --focus: #4A6688;
  --tag-bg: #E1E8F1; --tag-fg: #1F2A3A;
  --choice-bg: #E9EEF4; --banner-bg: #EFF3F8;
  --nif-gold: #4F6E96;
}
html[data-skin="winter"][data-theme="dark"] {
  --bg: #161C26;
  --panel: #1E2633;
  --panel2: #232C3B;
  --text: #E6ECF3;
  --muted: #9AA9BD;
  --line: #3A475B;
  --head: #E6ECF3;
  --gold: #AFC2DB;
  --accent: #8FA8C9;
  --on-accent: #161C26;
  --soft: #2A3546;
  --focus: #8FA8C9;
  --tag-bg: #2A3546; --tag-fg: #E6ECF3;
  --choice-bg: #232C3B; --banner-bg: #243044;
  --nif-gold: #9DB3CF;
}
html[data-skin="winter"] body { background: var(--bg); }
html[data-skin="winter"] body::before { background: var(--bg); }
html[data-skin="winter"] .card { background-image: none; background-color: var(--panel); border-color: var(--line); }

/* 눈 내림은 이제 app.js의 #snowfx 캔버스가 맡는다(style.css). */

/* ───── 고성 스킨(skin.css)이 따로 정해 둔 색까지 은청색으로 ───── */
html[data-skin="winter"] {
  --wood: #2B3A52; --wood2: #202C40; --brass: #9DB3CF; --seal: #4F6E96;
  --veil: rgba(246, 249, 252, .0); --stone-veil: rgba(0, 0, 0, 0);
  --story: #4A6688; --event: #3D5870; --banner-bad-bg: #F3DDE0;
  --warn: #7A5A2A; --bad: #8A3340; --good: #3F6B52;
  --toast-bg: #1F2A3Aee;
  --shadow: 0 1px 0 rgba(255, 255, 255, .5) inset, 0 3px 10px rgba(31, 42, 58, .22);
}
html[data-skin="winter"][data-theme="dark"] {
  --wood: #1B2432; --wood2: #131A25; --brass: #8FA8C9; --seal: #5E7EA8;
  --veil: rgba(30, 38, 51, 0); --story: #8FA8C9; --event: #A2B8C3; --banner-bad-bg: #35232A;
  --warn: #D2B982; --bad: #E19AA3; --good: #9CC0AD;
  --toast-bg: #000d;
  --shadow: 0 1px 0 rgba(255, 255, 255, .04) inset, 0 4px 14px rgba(0, 0, 0, .5);
}
/* 상단 바·탭: 목재+황동 → 짙은 청색+은빛 */
html[data-skin="winter"] .topbar, html[data-skin="winter"] .tabs {
  --text: #E6ECF3; --muted: #B4C2D4; --line: #44556E; --gold: #C9D6E8; --head: #E6ECF3;
  --accent: #C9D6E8; --on-accent: #161C26;
  border-color: #131A26; border-bottom-color: var(--brass);
}
html[data-skin="winter"] .topbar .chip.gal { color: #DCE6F3; border-color: #7F95B3; }
html[data-skin="winter"] .topbar .chip { border-color: #44556E; }
html[data-skin="winter"] .topbar .pill b { color: #F2F6FB; }
html[data-skin="winter"] .tabs button.active { color: #F2F6FB; }
html[data-skin="winter"] .guidelink, html[data-skin="winter"] .topbar a { color: #C9D6E8; }
html[data-skin="winter"] .nifchip { color: #DCE6F3; border-color: #7F95B3; }
/* 지도: 목재 액자 → 은빛 액자, 장소 이름표도 얼음빛 */
html[data-skin="winter"] .mapframe { border-image: none; border: clamp(5px, 1vw, 10px) solid #9DB3CF; border-radius: 6px; background: #5F7390; filter: drop-shadow(0 6px 10px rgba(31, 42, 58, .4)); }
html[data-skin="winter"] .tm-chip { background: rgba(240, 246, 252, .96); color: #1F2A3A; border-color: #4A6688; }
html[data-skin="winter"] .tm-chip .tm-n2 { color: #4A6688; }
html[data-skin="winter"] .tm-chip:hover { background: #FFFFFF; }
html[data-skin="winter"] .tm-chip.on { border-color: #4F6E96; box-shadow: 0 0 0 2px #9DB3CF, 0 2px 6px rgba(31, 42, 58, .4); }
html[data-skin="winter"] .tm-more { color: #1F2A3A; background: rgba(240, 246, 252, .94); border-color: #4A6688; }
/* 메모·멘션·주사위처럼 황금빛으로 정해 둔 곳 */
html[data-skin="winter"] .giftnote { color: #4A6688; }
html[data-skin="winter"] .gn-text { border-left-color: #8FA8C9; background: #8FA8C922; }
html[data-skin="winter"] .msg .tx.dicemsg { background: #8FA8C922; border-color: #8FA8C9; }
html[data-skin="winter"] .mention.me { background: #8FA8C966; }
html[data-skin="winter"] .celebcard { border-color: #8FA8C9; }


html[data-skin="winter"] .chip.gal { color: var(--gold); border-color: var(--accent); }
html[data-skin="winter"] .topbar .chip.gal { color: #DCE6F3; border-color: #7F95B3; }

html[data-skin="winter"] { --ball-gold: #4F6E96; }
html[data-skin="winter"][data-theme="dark"] { --ball-gold: #AFC2DB; }
html[data-skin="winter"] .ballhero h3 { color: var(--ball-gold); }
html[data-skin="winter"] .ballhero .ballsmall { color: var(--ball-sub); }