@font-face {
  font-family: "NanumBrush";
  src: url("/fonts/NanumBrushScript-Regular.woff2") format("woff2");
  font-display: swap;
}

:root[data-theme="light"] {
  --bg: #f4ead2;
  --bg-deep: #e6d6b5;
  --panel: rgba(255, 252, 244, .92);
  --panel-2: #eee0c3;
  --panel-3: #e2cfaa;
  --line: rgba(66, 42, 26, .17);
  --line-2: rgba(66, 42, 26, .28);
  --text: #281d17;
  --text-2: #5f5045;
  --text-3: #75675b;
  --accent: #235c4d;
  --accent-ink: #fff;
  --accent-soft: rgba(35, 92, 77, .13);
  --danger: #9e352e;
  --shadow-1: 0 10px 26px -20px rgba(54, 34, 20, .7);
  --shadow-2: 0 22px 48px -30px rgba(54, 34, 20, .7);
}

body {
  background-color: var(--bg);
  background-image:
    repeating-linear-gradient(3deg, rgba(74, 50, 29, .022) 0 1px, transparent 1px 5px),
    repeating-linear-gradient(93deg, rgba(255, 255, 255, .14) 0 1px, transparent 1px 8px),
    radial-gradient(circle at 18% 8%, rgba(255, 255, 255, .64), transparent 36%);
}

body::before { display: none; }
#habitat, #habFx { display: none !important; }
.topbar { border-bottom: 5px solid transparent; border-image: linear-gradient(90deg, #9e352e 0 22%, #d19a38 22% 39%, #235c4d 39% 61%, #d19a38 61% 78%, #9e352e 78%) 1; }
.brand { color: var(--text); }
.brand::before { content: "훈민정음"; margin-right: 8px; color: var(--danger); font: 26px/1 "NanumBrush", cursive; }
.om-b-h, .om-head h1 { font-family: "NanumBrush", var(--font); font-weight: 400; color: #3c261b; }
.om-b-h { font-size: clamp(48px, 6vw, 72px); }
.om-opponent { margin: 0 0 10px; color: var(--danger); font-size: 16px; font-weight: 800; }
.om-hero::before, :root[data-theme="light"] .om-hero::before { background: radial-gradient(circle, rgba(218, 179, 95, .22), transparent 68%); box-shadow: none; }
.om-hero.no-cv .om-hero-img { filter: drop-shadow(0 22px 18px rgba(60, 38, 22, .18)); }
.om-hero.no-cv .om-hero-img img { display: block; width: 100%; height: 100%; object-fit: contain; }
.btn, .card, .pcard, .om-sheet-in { border-radius: 16px; }
.board-wrap canvas#board { box-shadow: 0 20px 45px rgba(79, 49, 20, .24), 0 5px 12px rgba(79, 49, 20, .16); }

.ava { overflow: visible; }
.king-avatar { display: block; width: 52px; height: 52px; }
.king-avatar img { display: block; width: 100%; height: 100%; object-fit: contain; }
.king-speech { position: absolute; left: 68px; top: 8px; z-index: 2; max-width: 190px; padding: 7px 10px; border: 1px solid var(--line-2); border-radius: 12px; color: var(--text); background: #fffaf0; font-size: 11px; font-weight: 750; line-height: 1.35; box-shadow: var(--shadow-1); }
.king-speech::before { content: ""; position: absolute; left: -6px; top: 13px; width: 9px; height: 9px; border-left: 1px solid var(--line-2); border-bottom: 1px solid var(--line-2); background: #fffaf0; transform: rotate(45deg); }
.weight-700 { font-weight: 700; }
.text-12 { font-size: 12px; }
.no-margin { margin: 0; }
.rooms-head { padding-bottom: 12px; }
.rooms-filter { min-width: 260px; }
.move-number-switch { min-height: 30px; gap: 8px; color: var(--text-2); font-size: 12px; }
.min-w-0 { min-width: 0; }
.icon-14 { width: 14px !important; height: 14px !important; vertical-align: -2px; }
.icon-13 { width: 13px !important; height: 13px !important; }
.icon-18 { width: 18px !important; height: 18px !important; }
.accent-text { color: var(--accent); }
.row-center-gap { display: flex; align-items: center; gap: 8px; }
.text-15 { font-size: 15px; }
.text-12-5 { font-size: 12.5px; }
.icon-btn-52 { width: 52px; height: 52px; }
.no-pad-top { padding-top: 0; }
.copy-link { cursor: pointer; }
.banner-pad { padding-right: 14px; }
.moves-empty { grid-column: 1 / -1; padding: 8px 6px; }
.stone-12 { width: 12px; height: 12px; }
.stats-scroll { overflow: auto; }
.stats-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.stats-table th { padding: 4px 6px; color: var(--text-3); font-weight: 650; text-align: right; white-space: nowrap; }
.stats-table th:first-child { text-align: left; }
.stats-table tr { border-top: 1px solid var(--line); }
.stats-table td { padding: 4px 6px; text-align: right; white-space: nowrap; }
.stats-table td:first-child { font-weight: 700; text-align: left; }

@media (max-width: 767px) {
  .brand::before { display: none; }
  .om-hero.no-cv .om-hero-img { width: min(270px, 76%); }
  .king-avatar { width: 42px; height: 42px; }
  .king-speech { left: 57px; top: 5px; max-width: 150px; padding: 5px 8px; font-size: 10px; }
}

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

/* 판정 보정(클로드): 세종대왕을 크게, 말풍선은 이름 위로, 폰 제목은 붓글씨 */
.king-avatar { width: 72px; height: 72px; margin-top: -18px; }
.king-speech { left: 74px; top: -22px; max-width: 220px; font-size: 12.5px; font-weight: 700; box-shadow: 0 2px 8px rgba(32,28,24,.14); }
.brand small { font: 400 26px/1 "NanumBrush", var(--font); color: #3c261b; margin-left: 6px; }
@media (max-width: 767px) {
  .king-avatar { width: 64px; height: 64px; margin-top: -16px; }
  .king-speech { left: 66px; top: -20px; max-width: 200px; padding: 5px 9px; font-size: 11.5px; }
  .brand { font-size: 12px; font-weight: 700; display: flex; align-items: baseline; gap: 4px; }
  .brand small { display: inline; font-size: 25px; }
}
/* 말풍선은 카드 아래 빈 자리로, 아바타 칸 배경 제거 */
#oppCard .ava { background: none !important; border-color: transparent !important; box-shadow: none !important; }
.king-speech { top: auto; bottom: -34px; left: 70px; }
.king-speech::before { left: 14px; top: -6px; transform: rotate(135deg); }
@media (max-width: 767px) { .king-speech { top: auto; bottom: -34px; left: 62px; } }