/* ===========================================================
   홀덤월드 — 공통 디자인 토큰 (블랙 + 네온)
   화면(HTML)에서 공유하는 색·타이포·기본 컴포넌트만 정의한다.
   기능(JS)이 참조하는 id/class 이름은 절대 바꾸지 않는다.
   =========================================================== */

/* 표시용 라틴 서체는 자체 호스팅한다 (CDN 장애와 무관하게 캔버스 글꼴이 흔들리지 않도록).
   한글은 기기에 있는 서체를 쓴다 — 한글 웹폰트는 용량이 커서 모바일에서 손해다. */
@font-face{font-family:'Chakra Petch';font-style:normal;font-weight:500;font-display:swap;
  src:url('./assets/fonts/ChakraPetch-500-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Chakra Petch';font-style:normal;font-weight:500;font-display:swap;
  src:url('./assets/fonts/ChakraPetch-500-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Chakra Petch';font-style:normal;font-weight:600;font-display:swap;
  src:url('./assets/fonts/ChakraPetch-600-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Chakra Petch';font-style:normal;font-weight:600;font-display:swap;
  src:url('./assets/fonts/ChakraPetch-600-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Chakra Petch';font-style:normal;font-weight:700;font-display:swap;
  src:url('./assets/fonts/ChakraPetch-700-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Chakra Petch';font-style:normal;font-weight:700;font-display:swap;
  src:url('./assets/fonts/ChakraPetch-700-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;
  src:url('./assets/fonts/JetBrainsMono-400-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;
  src:url('./assets/fonts/JetBrainsMono-400-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:600;font-display:swap;
  src:url('./assets/fonts/JetBrainsMono-400-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:600;font-display:swap;
  src:url('./assets/fonts/JetBrainsMono-400-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:700;font-display:swap;
  src:url('./assets/fonts/JetBrainsMono-400-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:700;font-display:swap;
  src:url('./assets/fonts/JetBrainsMono-400-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}

:root{
  /* 배경 계열 */
  --void:#06080B;
  --deep:#0B0F15;
  --panel:#111721;
  --panel-2:#161E2A;
  --panel-3:#1B2431;
  --line:#232D3C;
  --line-soft:#1A2331;

  /* 글자 */
  --ink:#E7EEF7;
  --ink-2:#9AA7B8;
  --muted:#6C7A8C;

  /* 강조 — 시안은 UI/HUD, 앰버는 칩·금액 */
  --cyan:#2BF0D4;
  --cyan-2:#7BF7E6;
  --cyan-dim:#127F70;
  --cyan-deep:#0B3A34;
  --amber:#FFB020;
  --amber-2:#FFD98A;
  --amber-dim:#8A5E12;
  --red:#FF4D6A;
  --red-dim:#4A2431;
  --violet:#8B7CFF;

  /* 테이블 */
  --felt-a:#0E2A2C;
  --felt-b:#071518;
  --rail:#0C1116;
  --card-face:#F3F6F8;
  --card-ink:#11161C;
  --card-red:#D6224B;

  /* 반경 */
  --r-s:8px; --r-m:12px; --r-l:18px; --r-xl:22px;

  /* 서체 */
  --f-disp:'Chakra Petch','Pretendard','Apple SD Gothic Neo','Noto Sans KR','Malgun Gothic',sans-serif;
  --f-body:'Pretendard','Apple SD Gothic Neo','Noto Sans KR','Malgun Gothic',system-ui,sans-serif;
  --f-mono:'JetBrains Mono',ui-monospace,'SFMono-Regular',monospace;

  color-scheme:dark;
}

/* 숫자는 자릿수가 흔들리지 않게 */
.num,.cdBig,.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums;letter-spacing:-.02em}

/* 기본 버튼 — 입체 그림자 대신 테두리 + 네온 */
.btn{
  border:1px solid var(--line);border-radius:var(--r-m);background:var(--panel-2);color:var(--ink);
  font-family:var(--f-disp);font-weight:600;font-size:15px;letter-spacing:.02em;
  padding:12px 20px;cursor:pointer;transition:filter .14s,transform .1s,border-color .14s;
}
.btn:hover{filter:brightness(1.16);border-color:#2C3A4C}
.btn:active{transform:translateY(1px)}
.btn:disabled{opacity:.4;cursor:default;filter:none}
.btn.primary{background:var(--cyan);color:#04120F;border-color:transparent;box-shadow:0 0 22px rgba(43,240,212,.28)}
.btn.ghost{background:transparent;color:var(--red);border-color:var(--red-dim)}

/* 카드형 패널 */
.panel{
  background:var(--panel);border:1px solid var(--line-soft);border-radius:var(--r-xl);
  padding:20px;width:min(420px,92vw);box-shadow:0 18px 50px rgba(0,0,0,.55);
}

/* 라벨 */
label{display:block;font-family:var(--f-disp);font-size:11px;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted);margin:12px 0 6px}

/* 입력 */
input.f{
  width:100%;border:1px solid var(--line);border-radius:var(--r-s);padding:12px 14px;
  font-family:var(--f-body);font-size:16px;font-weight:500;color:var(--ink);
  background:#0A0F16;outline:none;transition:border-color .14s,box-shadow .14s;
}
input.f::placeholder{color:#4A5768}
input.f:focus{border-color:var(--cyan-dim);box-shadow:0 0 0 3px rgba(43,240,212,.1)}

:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
}

/* ===== 족보 패널 (jokbo.js) — 어두운 테마 값 =====
   jokbo.js 는 var(--jb-*, 원래값) 형태라, theme.css 를 불러오는 화면만 어둡게 바뀐다. */
:root{
  --jb-bg:rgba(11,15,21,.97);
  --jb-line:#232D3C;
  --jb-line-soft:#1A2331;
  --jb-panel-shadow:8px 0 34px rgba(0,0,0,.5);
  --jb-title:#9AA7B8;
  --jb-btn-bg:#161E2A;
  --jb-btn-shadow:none;
  --jb-item-bg:#111721;
  --jb-item-line:#1A2331;
  --jb-no-bg:#1B2431;
  --jb-no-ink:#6C7A8C;
  --jb-ink:#E7EEF7;
  --jb-muted:#6C7A8C;
  --jb-badge:rgba(43,240,212,.14);
  --jb-badge-ink:#2BF0D4;
  --jb-card-bg:#F3F6F8;
  --jb-card-line:rgba(0,0,0,.35);
  --jb-red:#D6224B;
  --jb-blk:#11161C;
  --jb-on-line:rgba(43,240,212,.55);
  --jb-on-bg:rgba(43,240,212,.07);
  --jb-on-glow:rgba(43,240,212,.16);
  --jb-on-no:#2BF0D4;
  --jb-on-no-ink:#04120F;
  --jb-open-bg:#161E2A;
  --jb-open-ink:#E7EEF7;
  --jb-back:rgba(4,6,9,.7);
}

/* ===========================================================
   라이트 모드
   게임 화면은 어두운 톤으로 고정한다(포커 테이블이라 그게 맞다).
   라이트는 관리 대시보드처럼 오래 들여다보는 화면에서만 켠다:
   <html data-theme="light"> 을 붙이면 아래 값으로 갈아탄다.
   =========================================================== */
:root[data-theme="light"]{
  color-scheme:light;

  --void:#F4F6F9;
  --deep:#EDF1F6;
  --panel:#FFFFFF;
  --panel-2:#F5F8FB;
  --panel-3:#EAEFF5;
  --line:#D8E0EA;
  --line-soft:#E6ECF3;

  --ink:#111820;
  --ink-2:#4A5768;
  --muted:#78879A;

  /* 밝은 바탕에서는 네온이 눈을 찌른다. 채도를 낮추고 어둡게 내린다. */
  --cyan:#00897B;
  --cyan-2:#00695C;
  --cyan-dim:#7FCFC4;
  --cyan-deep:#DCF3EF;
  --amber:#B26A00;
  --amber-2:#8A5200;
  --amber-dim:#E8C99A;
  --red:#C62B48;
  --red-dim:#F2C4CD;
  --violet:#5B4BCC;

  --card-face:#FFFFFF;
  --card-ink:#11161C;
  --card-red:#C6152F;

  /* 족보 패널 */
  --jb-bg:rgba(255,255,255,.98);
  --jb-line:#D8E0EA;
  --jb-line-soft:#E6ECF3;
  --jb-panel-shadow:6px 0 24px rgba(17,24,32,.08);
  --jb-title:#4A5768;
  --jb-btn-bg:#F5F8FB;
  --jb-btn-shadow:none;
  --jb-item-bg:#FFFFFF;
  --jb-item-line:#E6ECF3;
  --jb-no-bg:#EAEFF5;
  --jb-no-ink:#78879A;
  --jb-ink:#111820;
  --jb-muted:#78879A;
  --jb-badge:#DCF3EF;
  --jb-badge-ink:#00695C;
  --jb-card-bg:#FFFFFF;
  --jb-card-line:#C7D2DE;
  --jb-red:#C6152F;
  --jb-blk:#11161C;
  --jb-on-line:#00897B;
  --jb-on-bg:#EAF7F4;
  --jb-on-glow:rgba(0,137,123,.14);
  --jb-on-no:#00897B;
  --jb-on-no-ink:#FFFFFF;
  --jb-open-bg:#FFFFFF;
  --jb-open-ink:#111820;
  --jb-back:rgba(17,24,32,.35);
}

/* 라이트에서는 강조색 위 글자가 흰색이어야 읽힌다 */
:root[data-theme="light"] .btn.primary{background:var(--cyan);color:#FFFFFF;box-shadow:0 1px 2px rgba(17,24,32,.12)}
:root[data-theme="light"] .panel{box-shadow:0 2px 10px rgba(17,24,32,.06)}
:root[data-theme="light"] input.f{background:#FFFFFF}
:root[data-theme="light"] input.f::placeholder{color:#9AA7B8}