/* Semantic components and shared theme tokens. No brand/color names in classes. */
:root { --ui-bg:var(--surface,#070a0c); --ui-panel:#2c2119; --ui-panel-raised:#382b20; --ui-line:#49382a; --ui-text:var(--text,#f9ebd1); --ui-muted:#c5a58c; --ui-accent:var(--accent,#e3b467); --ui-accent-contrast:#271e17; --ui-selected:linear-gradient(180deg,#d8a85c,#be9652); --ui-success:#49c7ef; --ui-danger:#edc989; }
[hidden] { display:none !important; }
a[role=button] { cursor:pointer; user-select:none; }
a[role=button][aria-disabled=true] { cursor:default; opacity:.5; }
a:focus-visible,summary:focus-visible,[tabindex="0"]:focus-visible { outline:2px solid var(--ui-accent); outline-offset:3px; }
.site-header:has(.site-game-nav) { position:relative; background:var(--ui-bg); height:auto; }
.site-header:has(.site-game-nav) > .site-header__inner { display:flex; align-items:center; max-width:1660px; width:auto; height:auto; min-height:84px; margin:auto; padding:0 18px; gap:30px; }
.site-header:has(.site-game-nav) .site-brand { width:120px; flex:0 0 120px; }
.site-header:has(.site-game-nav) .site-brand img { width:100%; height:auto; }
.site-header:has(.site-game-nav) .site-nav { flex:1; min-width:0; margin:0; border:0; background:transparent; }
.site-header:has(.site-game-nav) .site-nav__list { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:0; padding:0; width:100%; }
.site-header:has(.site-game-nav) .site-nav__link { font-size:14px; min-height:62px; padding:12px 4px; gap:5px; }
.site-game-nav__submenu { z-index:20; max-height:min(520px,calc(100dvh - 200px)); overflow-y:auto; }
.account-bar { border-bottom:1px solid var(--ui-line); background:#1b1510; color:var(--ui-text); font:700 12px/1.5 'Noto Sans KR','Malgun Gothic',sans-serif; }
.account-bar__inner { max-width:1660px; margin:auto; padding:8px 18px; min-height:46px; }
.account-bar .site-header__actions { display:flex; width:auto; margin:0; justify-content:flex-end; gap:10px; }
.account-bar .action-link { min-height:32px; padding:5px 18px; font-size:12px; }
.account-bar__member { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:8px 12px; }
.account-bar__rank { color:var(--ui-accent); font:700 27px Georgia,serif; }
.account-bar__member a:hover { color:var(--ui-accent); }
.account-bar__balance { display:inline-flex; align-items:center; gap:4px; border:1px solid #66482e; border-radius:20px; padding:4px 10px; color:#d8a85c; }
.account-bar__action { display:inline-flex; align-items:center; justify-content:center; min-height:30px; padding:5px 12px; border:1px solid #66482e; border-radius:18px; background:var(--ui-panel-raised); }
.account-bar__action[data-account-logout] { color:var(--ui-accent); }
.account-bar__refresh { font-size:16px; }
.account-bar__member small { width:100%; text-align:right; color:var(--ui-muted); font-weight:400; }
.account-preview { display:block; margin-top:12px; padding:10px; text-align:center; border:1px solid var(--ui-line); border-radius:5px; font-size:13px; color:var(--ui-accent); }
.account-preview__note { color:var(--ui-muted); font-size:11px; margin:7px 0; line-height:1.5; }
.ui-control { display:inline-flex; justify-content:center; align-items:center; min-height:32px; padding:6px 14px; border:1px solid var(--ui-line); border-radius:3px; background:var(--ui-panel); color:var(--ui-text); font:700 12px/1.4 'Noto Sans KR','Malgun Gothic',sans-serif; text-decoration:none; }
.ui-control:hover { border-color:var(--ui-accent); }
.ui-dialog { width:430px; max-width:calc(100% - 32px); border:1px solid #66482e; border-radius:10px; background:var(--ui-panel); color:var(--ui-text); padding:26px; margin:auto; font:14px/1.7 'Noto Sans KR','Malgun Gothic',sans-serif; }
.ui-dialog::backdrop { background:#070a0cb8; }
.ui-dialog h2 { margin-top:0; font-size:18px; color:var(--ui-accent); }
.ui-dialog__actions { display:flex; gap:10px; justify-content:flex-end; }
.content-archive { margin-top:36px; min-width:0; }
.content-archive > summary { padding:13px 16px; background:var(--ui-panel); border:1px solid var(--ui-line); color:var(--ui-muted); font-size:13px; cursor:pointer; }
.content-archive[open] > summary { margin-bottom:18px; }
.content-layout__main { min-width:0; }
.game-board,.result-board,.history-board { color:var(--ui-text); font:13px/1.45 'Noto Sans KR','Malgun Gothic',sans-serif; }
.game-board__tabs { display:flex; gap:28px; border-bottom:1px solid var(--ui-line); margin-bottom:14px; }
.game-board__tabs a { padding:15px 2px; color:var(--ui-muted); }
.game-board__tabs .is-active { border-bottom:2px solid var(--ui-accent); color:var(--ui-text); }
.game-board__categories { display:grid; grid-template-columns:repeat(9,minmax(0,1fr)); gap:16px; padding:12px; background:#1b1510; border:1px solid var(--ui-line); border-radius:12px; }
.game-board__category { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; min-height:88px; padding:10px 5px; background:var(--ui-panel); border:1px solid var(--ui-line); border-radius:10px; font-size:14px; font-weight:700; text-align:center; }
.game-board__category.is-active { border-color:var(--ui-accent); box-shadow:0 0 12px #ff3d6a24; color:var(--ui-accent); }
.game-board__count { position:absolute; right:7px; top:5px; padding:0 5px; background:#584333; border-radius:14px; font-size:11px; color:var(--ui-text); }
.game-board__icon { font-size:30px; line-height:36px; }
.game-board__tools { display:flex; justify-content:flex-end; gap:8px; margin:12px 0 6px; }
.game-board__league-filter { display:flex; flex-wrap:wrap; gap:8px; padding:12px; border:1px solid var(--ui-line); margin-bottom:10px; }
.game-board__league-filter label { display:flex; gap:5px; align-items:center; }
.game-board__bonuses { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; margin-bottom:22px; }
.game-board__bonuses > div { display:flex; justify-content:space-between; align-items:center; padding:8px 12px; border:1px solid #66482e; border-radius:7px; background:var(--ui-panel); color:var(--ui-accent); }
.game-board__bonuses strong { display:grid; place-items:center; width:34px; height:34px; border:1px solid #66482e; border-radius:50%; background:var(--ui-bg); color:var(--ui-text); }
.sports-page .game-board__events.event-panel { max-height:none; overflow:visible; border:0; background:transparent; padding:0; }
.sports-page .game-board__group.event-group { border:0; margin:0 0 28px; padding:0; background:transparent; }
.game-board__league { margin:0; padding:10px 14px; border-block:1px solid var(--ui-line); font-size:13px; font-weight:500; }
.sports-page .game-row.match-card { display:grid; grid-template-columns:22px 122px 100px minmax(0,1fr) 66px minmax(0,1fr) 72px; align-items:center; gap:6px; margin:0; padding:9px 6px; border:0; border-bottom:1px solid var(--ui-line); border-radius:0; background:transparent; }
.game-row time { font-size:12px; white-space:nowrap; }
.game-row__favorite { color:var(--ui-muted); text-align:center; font-size:20px; }
.game-row__favorite[aria-pressed=true] { color:var(--ui-accent); }
.game-row__market { color:var(--ui-accent); font-size:12px; }
.sports-page .game-row .game-row__odd { display:flex; justify-content:space-between; align-items:center; gap:8px; min-width:0; min-height:37px; padding:8px 10px; border:1px solid #5b4535; border-radius:7px; background:var(--ui-panel); color:var(--ui-text); font-size:12px; }
.game-row__odd span { overflow-wrap:anywhere; }
.sports-page .game-row .game-row__odd.is-selected { border-color:var(--ui-accent); background:#ff3d6a15; color:var(--ui-accent); box-shadow:inset 0 0 0 1px var(--ui-accent); }
.game-row__middle,.game-row__more { display:grid; place-items:center; min-height:37px; padding:6px; border:1px solid #5b4535; border-radius:6px; background:var(--ui-panel); font-size:12px; text-align:center; }
.game-row__more { min-height:34px; }
.record-board__heading { position:relative; display:flex; justify-content:center; align-items:center; gap:16px; min-height:42px; padding:10px 14px; border-bottom:1px solid #66482e; border-radius:9px 9px 0 0; background:var(--ui-panel); margin-bottom:10px; }
.record-board__heading h1 { font-size:17px; margin:0; }
.record-board__date { position:absolute; right:12px; display:flex; align-items:center; gap:10px; color:#deb876; font-weight:700; font-size:16px; }
.record-board__date a { padding:2px; min-height:24px; background:none; border:0; color:inherit; }
.result-board__tabs { display:grid; grid-template-columns:repeat(9,minmax(0,1fr)); gap:3px; margin-bottom:10px; }
.result-board__tab { padding:11px 4px; min-height:38px; text-align:center; border:1px solid #66482e; border-radius:5px; background:var(--ui-panel); font-size:12px; font-weight:700; }
.result-board__tab.is-active { background:var(--ui-selected); border-color:#d8a85c; color:#fff; }
.record-board__scroll { width:100%; min-width:0; overflow-x:auto; overscroll-behavior-x:contain; }
.result-board__table { min-width:810px; }
.result-board__labels,.result-row { display:grid; grid-template-columns:105px minmax(170px,1fr) 108px minmax(170px,1fr) 76px 62px; gap:3px; }
.result-board__labels { padding:10px 2px; background:var(--ui-panel-raised); text-align:center; font-size:12px; font-weight:700; }
.sports-page .result-board__group.event-group { margin:0 0 34px; padding:0; border:0; background:transparent; }
.result-board__group h2 { margin:4px 0 2px; border:1px solid var(--ui-line); background:var(--ui-panel); padding:8px; font-size:14px; }
.sports-page .result-row.match-card { margin:3px 0; padding:0; background:none; border:0; border-radius:0; }
.result-row > * { display:flex; align-items:center; justify-content:center; min-height:36px; padding:8px; border-radius:3px; background:var(--ui-panel); font-size:12px; white-space:nowrap; }
.sports-page .result-row .result-row__team { display:flex; justify-content:space-between; min-width:0; border:0; border-radius:3px; font-weight:700; }
.result-row__team strong { color:#d8a85c; }
.result-row__market { gap:10px; }
.result-row__market small { font-size:10px; color:#d8a85c; }
.result-row .is-selected { background:var(--ui-selected); color:#fff; }
.result-row .is-selected strong { color:#fff; }
.record-board__empty,.game-board__empty { text-align:center; padding:38px 12px; color:var(--ui-muted); border:1px solid var(--ui-line); }
.history-board .record-board__heading { justify-content:space-between; }
.history-board__search { display:flex; align-items:center; gap:7px; }
.history-board__search label { display:flex; align-items:center; gap:5px; font-size:11px; }
.history-board__search input { width:132px; color:var(--ui-text); color-scheme:dark; padding:5px; border:1px solid #5b4535; background:var(--ui-panel-raised); }
.history-board__table { min-width:940px; }
.history-board__labels,.history-row { display:grid; grid-template-columns:75px 145px minmax(210px,1fr) 70px minmax(210px,1fr) 55px 55px; gap:3px; }
.history-board__labels { padding:10px 6px; border-bottom:1px solid #5b4535; background:var(--ui-panel-raised); text-align:center; color:var(--ui-muted); }
.sports-page .history-ticket.event-group { margin:0 0 16px; padding:0; border:0; background:transparent; }
.history-ticket h2 { padding:7px; margin:10px 0 5px; font-size:12px; background:var(--ui-panel-raised); color:var(--ui-accent); }
.history-ticket h2 time { color:var(--ui-muted); margin-right:5px; font-size:10px; font-weight:400; }
.history-ticket h2 time span { color:var(--ui-accent); }
.sports-page .history-row.match-card { margin:3px 0; padding:0 6px; border:0; background:transparent; border-radius:0; }
.history-row > * { min-width:0; display:flex; align-items:center; font-size:11px; }
.history-row time { color:var(--ui-muted); font-size:9px; }
.sports-page .history-row .history-row__team { display:flex; justify-content:space-between; gap:8px; padding:6px; min-height:31px; border:1px solid #5b4535; border-radius:0; background:linear-gradient(var(--ui-panel-raised),var(--ui-panel)); font-size:11px; }
.history-row__team strong { color:var(--ui-success); }
.history-row .history-row__middle { justify-content:center; background:var(--ui-panel); color:var(--ui-accent); }
.sports-page .history-row .is-selected { background:var(--ui-selected); color:#fff; }
.history-row .is-selected strong { color:#fff; }
.history-row > :nth-last-child(-n+2) { justify-content:center; font-size:10px; }
.is-won { color:var(--ui-success); }.is-lost { color:var(--ui-danger); }
.history-ticket__summary { display:flex; justify-content:space-between; gap:12px; padding:10px 7px; background:var(--ui-panel-raised); border-block:1px solid var(--ui-line); margin-top:6px; color:var(--ui-muted); font-size:10px; }
.history-ticket__summary strong { color:var(--ui-accent); }
.history-ticket__summary strong.is-lost { color:var(--ui-danger); }.history-ticket__summary strong.is-won { color:var(--ui-success); }
.history-ticket__actions,.history-board__actions { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:6px; padding-top:6px; }
.history-ticket__actions a { min-height:25px; padding:3px 10px; font-size:10px; }
.history-ticket__actions [data-history-delete] { border-color:#95805c; }
.history-board [data-history-status] { margin:12px 0; color:var(--ui-muted); font-size:12px; }
@media(max-width:1300px) {
 .site-header:has(.site-game-nav) > .site-header__inner { gap:18px; }
 .site-header:has(.site-game-nav) .site-brand { width:100px; flex-basis:100px; }
 .site-header:has(.site-game-nav) .site-nav__link { font-size:12px; gap:4px; }
 .game-board__categories { gap:8px; }.game-board__category { font-size:12px; }
 .sports-page .game-row.match-card { grid-template-columns:20px 100px 74px minmax(0,1fr) 46px minmax(0,1fr) 58px; gap:4px; }
 .game-row time,.game-row__market { font-size:10px; }
}
@media(max-width:1000px) {
 .site-header:has(.site-game-nav) > .site-header__inner { flex-direction:column; align-items:stretch; gap:0; padding-top:8px; }
 .site-header:has(.site-game-nav) .site-brand { align-self:center; flex-basis:auto; width:90px; }
 .site-header:has(.site-game-nav) .site-nav__list { grid-template-columns:repeat(6,minmax(0,1fr)); }
 .site-header:has(.site-game-nav) .site-nav__link { min-height:44px; }
 .site-game-nav__item:nth-child(6n) .site-game-nav__submenu { right:0; left:auto; transform:none; }
 .game-board__categories { grid-template-columns:repeat(5,minmax(0,1fr)); }
 .record-board__heading { justify-content:space-between; flex-wrap:wrap; }
 .record-board__date { position:static; margin-left:auto; }
 .result-board__tabs { grid-template-columns:repeat(5,minmax(0,1fr)); }
}
@media(max-width:760px) {
 .account-bar__inner { padding:8px 12px; }
 .account-bar__member { justify-content:flex-start; gap:8px; font-size:11px; }
 .account-bar__member small { text-align:left; }
 .site-header:has(.site-game-nav) > .site-header__inner { padding:8px 10px 0; }
 .site-header:has(.site-game-nav) .site-nav__list { grid-template-columns:repeat(4,minmax(0,1fr)); }
 .site-header:has(.site-game-nav) .site-nav__link { min-height:43px; font-size:12px; }
 .site-game-nav__submenu { width:170px; max-height:calc(100dvh - 240px); }
 .site-game-nav__item:nth-child(4n) .site-game-nav__submenu { right:0; left:auto; transform:none; }
 .site-game-nav__item:nth-child(4n+1) .site-game-nav__submenu { left:0; right:auto; transform:none; }
 .game-board__tabs { gap:24px; }
 .game-board__categories { grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; padding:8px; }
 .game-board__category { min-height:75px; }
 .game-board__icon { font-size:26px; line-height:29px; }
 .game-board__bonuses > div { padding:6px; font-size:10px; }.game-board__bonuses strong { width:27px; height:27px; font-size:10px; }
 .sports-page .game-row.match-card { grid-template-columns:22px minmax(0,1fr) 44px minmax(0,1fr); gap:5px; padding:9px 4px; }
 .game-row__favorite { grid-column:1; grid-row:1; }
 .game-row time { grid-column:2; grid-row:1; font-size:10px; }
 .game-row__market { grid-column:3 / 5; grid-row:1; text-align:right; }
 .sports-page .game-row .game-row__odd { font-size:10px; gap:4px; padding:6px; min-height:38px; }
 /* 홈/원정 위치는 클래스로 정한다. 태그 순서(nth-of-type)는 즐겨찾기 버튼이 없는 더보기 줄에서 어긋난다. */
 .game-row__odd--home { grid-column:1 / 3; grid-row:2; }
 .game-row__middle { grid-column:3; grid-row:2; font-size:10px; }
 .game-row__odd--away { grid-column:4; grid-row:2; }
 .game-row__more { grid-column:4; grid-row:3; font-size:10px; min-height:28px; }
 .game-row > span:last-child:empty { display:none; }
 .game-board__group { margin-bottom:20px; }
 .result-board__tabs { grid-template-columns:repeat(3,minmax(0,1fr)); }
 .result-board__tab { font-size:11px; padding:10px 3px; }
 .record-board__heading h1 { font-size:16px; }.record-board__date { font-size:13px; gap:5px; }
 .history-board__search { width:100%; flex-wrap:wrap; gap:5px; }
 .history-board__search label { flex:1; min-width:0; font-size:0; }
 .history-board__search input { width:100%; font-size:11px; min-width:0; }
 .history-board__search .ui-control { font-size:11px; padding:6px 10px; }
 .history-board__actions { justify-content:flex-start; }
 .history-board__actions a { padding:6px 10px; font-size:11px; }
}
.game-icon { display:inline-block; width:34px; height:34px; vertical-align:middle; flex-shrink:0; }
.game-board__league .game-icon,.result-board__group h2 .game-icon { width:18px; height:18px; margin-right:5px; }
.history-row .game-icon { width:17px; height:17px; margin-right:4px; }
.sports-page .game-board .odd-link,.sports-page .result-board .odd-link,.sports-page .history-board .odd-link { font-family:'Noto Sans KR','Malgun Gothic',sans-serif; }
.sports-page .result-row .result-row__team.is-selected,.sports-page .history-row .history-row__team.is-selected { background:var(--ui-selected); color:#fff; border-color:#c6a977; box-shadow:none; }
.sports-page .result-row .result-row__team.is-selected strong,.sports-page .history-row .history-row__team.is-selected strong { color:#fff; }
@media(max-width:760px) { .game-icon { width:29px; height:29px; } }
