/* base.css — public/index.html 에서 분리 (로드 순서가 의존 순서다) */
  * { margin: 0; padding: 0; box-sizing: border-box; }
  body {
    font-family: 'Malgun Gothic', 'Apple SD Gothic Neo', sans-serif;
    background: #1a1d23; color: #e8eaed;
    height: 100vh; display: flex; flex-direction: column;
  }
  header {
    display: flex; align-items: center; gap: 2px;
    padding: 3px 10px; background: #22262e; border-bottom: 1px solid #333a45;
    flex-wrap: wrap;
  }
  header h1 { font-size: 14px; margin-right: 10px; color: #7aa2f7; }
  .tab-btn {
    background: none; border: none; color: #9aa0a6; padding: 5px 10px;
    cursor: pointer; font-size: 13px; border-radius: 6px; font-family: inherit;
  }
  .tab-btn:hover { background: #2c313a; }
  .tab-btn.active { background: #2c313a; color: #7aa2f7; font-weight: bold; }
  main { flex: 1; display: flex; overflow: hidden; min-height: 0; }
  .tab { display: none; flex: 1; overflow: hidden; }
  .tab.active { display: flex; flex-direction: column; }
  /* 와이드 화면: 채팅 왼쪽 고정 + 오른쪽에 게임 (화면분할) */
  @media (min-width: 1100px) {
    #tab-chat { display: flex !important; flex-direction: column; flex: none; width: 420px; border-right: 1px solid #333a45; }
    .tab-btn[data-tab="chat"] { display: none; }
  }