:root{ --lm-orange:#FF6F5E; --goal:#FF6600; --ink:#222; --line:#e5e9ef; }
*{box-sizing:border-box;}
body{margin:0;background:#f4f6f9;font-family:'Malgun Gothic',dotum,sans-serif;color:var(--ink);font-size:13px;}
#hdr{background:linear-gradient(135deg,#FF6F5E,#f5533f);color:#fff;padding:12px 16px;display:flex;align-items:center;gap:12px;}
#hdr .badge{background:#fff;color:#f5533f;font-weight:800;font-size:17px;padding:7px 13px;border-radius:8px;}
#hdr .sub{font-size:12px;opacity:.92;}
#hdr .live{margin-left:auto;font-size:11px;background:rgba(255,255,255,.2);padding:4px 10px;border-radius:12px;}
#hdr .live b{color:#fff;}
#tabs{display:flex;gap:6px;margin-left:14px;}
.tab{cursor:pointer;font-size:12px;font-weight:700;color:#fff;background:rgba(255,255,255,.18);padding:6px 14px;border-radius:16px;user-select:none;transition:all .15s;}
.tab:hover{background:rgba(255,255,255,.32);}
.tab.on{background:#fff;color:#f5533f;}
/* #board: 헤더+테이블 묶음. 모바일은 화면폭에 맞춤(스코어+양팀 항상 보이게, 아래 media query) */
table.sb{width:100%;table-layout:fixed;border-collapse:collapse;background:#fff;}
table.sb td, table.sb th{word-break:break-word;overflow-wrap:break-word;}
table.sb th{background:#5a7d9a;color:#fff;font-weight:700;padding:7px 4px;font-size:12px;}
table.sb td{padding:6px 5px;border-bottom:1px solid var(--line);text-align:center;vertical-align:middle;}
.lg{font-weight:700;color:#fff;border-radius:4px;padding:2px 6px;font-size:11px;white-space:nowrap;}
.tm-h{text-align:right;font-weight:600;white-space:normal;overflow-wrap:break-word;}
.tm-a{text-align:left;font-weight:600;white-space:normal;overflow-wrap:break-word;}
.sc{font-weight:800;font-size:15px;min-width:52px;white-space:nowrap;}
.sc .g{display:inline-block;padding:1px 7px;border-radius:4px;min-width:22px;}
.sc .g.win{background:var(--goal);color:#fff;}      /* 이기는 팀 = 주황 */
.sc .g.draw{background:#e6e9ee;color:#9099a3;}       /* 무승부 = 연회색(지는 팀과 동일) */
.sc .g.lose{background:#e6e9ee;color:#9099a3;}       /* 지는 팀 = 연회색 */
.sc .g.pop{animation:goalpop .7s ease;}
@keyframes goalpop{0%{transform:scale(1);}22%{transform:scale(1.7);background:#ffd400;color:#c00;}55%{transform:scale(1.15);}100%{transform:scale(1);}}
.scwrap{display:inline-flex;align-items:center;justify-content:center;}
.sg{min-width:40px;display:inline-flex;align-items:center;}
.sg.l{justify-content:flex-end;padding-right:4px;}
.sg.r{justify-content:flex-start;padding-left:4px;}
.sidegoal{display:inline-block;text-align:center;color:var(--goal);font-size:15px;line-height:1;font-weight:800;animation:goalbadge 1.3s ease;}
.sidegoal span{display:block;font-size:8px;letter-spacing:.5px;margin-top:1px;}
@keyframes goalbadge{0%{opacity:0;transform:scale(.5);}18%{opacity:1;transform:scale(1.25);}82%{opacity:1;}100%{opacity:1;}}
tr.row-goal{animation:rowflash 1.6s ease;}
@keyframes rowflash{0%{background:#fff4cc;}55%{background:#fffbe9;}100%{background:#fff;}}
/* 골 타임라인 팝업 (스코어 클릭) */
.sclink{cursor:pointer;}
/* iframe 임베드에서 position:fixed는 화면중앙이 어긋나므로(부모가 스크롤) → 문서기준 absolute + 클릭지점 배치 */
#gpop{position:absolute;top:0;left:0;width:100%;background:rgba(20,24,31,.5);z-index:99999;display:none;}
#gpop.on{display:block;}
#gpop .card{position:absolute;left:0;right:0;margin:0 auto;width:92%;max-width:430px;max-height:min(80vh,520px);background:#fff;border-radius:14px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 12px 40px rgba(0,0,0,.4);animation:gpin .2s ease;}
@keyframes gpin{0%{opacity:0;transform:translateY(12px) scale(.97);}100%{opacity:1;transform:none;}}
#gpop .gh{position:relative;background:linear-gradient(135deg,#FF6F5E,#f5533f);color:#fff;padding:13px 34px;display:flex;align-items:center;gap:8px;}
#gpop .gh .tm{flex:1;font-weight:800;font-size:13.5px;text-align:center;line-height:1.25;}
#gpop .gh .gsc{background:#fff;color:#f5533f;font-weight:900;font-size:16px;padding:3px 10px;border-radius:8px;white-space:nowrap;}
#gpop .gh .x{position:absolute;top:7px;right:11px;cursor:pointer;font-size:22px;line-height:1;opacity:.9;}
#gpop .gh .x:hover{opacity:1;}
#gpop .gl{font-size:11px;text-align:center;padding:6px;color:#8a94a0;border-bottom:1px solid var(--line);}
#gpop .gbody{overflow-y:auto;padding:6px 0;}
#gpop .ev{display:flex;align-items:flex-start;font-size:12.5px;padding:6px 10px;}
#gpop .ev .h{flex:1;text-align:right;padding-right:9px;}
#gpop .ev .a{flex:1;text-align:left;padding-left:9px;}
#gpop .ev .min{flex:0 0 48px;text-align:center;font-weight:800;color:#5a7d9a;font-variant-numeric:tabular-nums;padding-top:1px;}
#gpop .ev.goal .min{color:#f5533f;}
#gpop .ev .who{font-weight:600;}
#gpop .ev .as{display:block;font-size:10.5px;color:#98a1ab;font-weight:400;}
#gpop .tag{display:inline-block;font-size:9px;font-weight:800;padding:1px 4px;border-radius:3px;background:#ffe6cc;color:#d1620a;margin-left:3px;vertical-align:middle;}
#gpop .gf{border-top:1px solid var(--line);padding:10px;text-align:center;}
#gpop .gf a{display:inline-block;background:#5a7d9a;color:#fff;text-decoration:none;font-weight:700;font-size:12px;padding:8px 18px;border-radius:8px;}
#gpop .gempty{padding:26px 12px;text-align:center;color:#98a1ab;font-size:12.5px;}
.st{font-size:11px;font-weight:700;white-space:nowrap;}
.st.live{color:#e8340c;}
.st.sch{color:#888;}
.st.fin{color:#555;}
.ht{color:#999;font-size:11px;}
.tc-kick{color:#667;font-size:12px;font-weight:700;white-space:nowrap;}   /* 시작(킥오프) 고정칸 */
.tc-st{white-space:nowrap;border-left:1px solid #eef1f5;}                 /* 시간(경과/상태) 고정칸 */
td.pin{cursor:pointer;font-size:16px;color:#ccd2da;user-select:none;transition:color .12s,transform .12s;}
td.pin:hover{color:var(--lm-orange);transform:scale(1.2);}
td.pin.on{color:var(--lm-orange);}
tr.row-pin{background:#fff8f2;}
tr.row-pin td{border-bottom:1px solid #ffe0d3;}
#empty{color:#999;}
.scoretd{white-space:normal;}
.scoretd .sclink{text-decoration:none;display:inline-block;cursor:pointer;border-radius:5px;padding:1px 3px;transition:background .12s;}
.scoretd .sclink:hover{background:#fff0ec;box-shadow:0 0 0 1px #ffd9cf;}
.rsm{font-size:10px;color:#3a6ea5;font-weight:600;margin-top:2px;line-height:1.3;}
.rank{color:#a7aeb8;font-size:10px;font-weight:600;}   /* 팀 순위 [1] 회색 소형 */
.tlink{color:inherit;text-decoration:none;cursor:pointer;border-bottom:1px dotted transparent;}
.tlink:hover{color:var(--lm-orange);border-bottom-color:var(--lm-orange);}   /* 팀명 → team_view */
.lglink{text-decoration:none;cursor:pointer;}
.lglink:hover .lg{filter:brightness(1.12);box-shadow:0 0 0 2px rgba(0,0,0,.12);}  /* 리그 → matches_view */
.lc{white-space:nowrap;}
.lc .ic{text-decoration:none;font-size:16px;margin:0 3px;cursor:pointer;opacity:.85;transition:opacity .12s,transform .12s;display:inline-block;}
.lc .ic:hover{opacity:1;transform:scale(1.3);}
/* 섹션 구분 바 */
tr.secbar td{color:#fff;font-weight:700;font-size:12px;text-align:left;padding:6px 14px;letter-spacing:.3px;background:#6b7280;}
tr.secbar.pin td{background:linear-gradient(90deg,#FF6F5E,#f5533f);}
tr.secbar.g0 td{background:#586170;}   /* 진행중 */
tr.secbar.g1 td{background:#748092;}   /* 예정 */
tr.secbar.g2 td{background:#9aa2ad;}   /* 종료·미확정 */
.tm-goal{color:#fff !important;background:var(--goal);border-radius:4px;padding:1px 4px;animation:tmgoal 1.3s ease;}
@keyframes tmgoal{0%{background:#ffd400;}55%{background:var(--goal);}100%{background:var(--goal);}}
.datebar{background:#eef1f5;font-weight:700;color:#445;padding:6px 10px;text-align:left;font-size:12px;}
#empty{padding:40px;text-align:center;color:#999;}
/* 모바일: 화면폭에 맞춤(핏). 긴 팀명은 아래로 줄바꿈. 단일 table(fixed)이라 헤더=본문 자동정렬.
   HT(전반스코어)칸만 숨겨 팀명 공간확보 → 남은 8칸 재분배(합100%, 인라인폭 덮으려 !important) */
@media (max-width:640px){
  body{font-size:12px;}
  #hdr{padding:9px 11px;flex-wrap:wrap;}
  #hdr>div>div:first-child{font-size:13px;}
  #tabs{margin-left:auto;gap:4px;}
  .tab{font-size:11px;padding:5px 9px;}
  table.sb th{font-size:11px;padding:6px 2px;}
  table.sb td{padding:6px 2px;font-size:11px;}
  table.sb th:nth-child(8), table.sb td:nth-child(8){display:none;}   /* HT 숨김 */
  table.sb th:nth-child(1){width:5% !important;}    /* 핀 */
  table.sb th:nth-child(2){width:10% !important;}   /* 리그 */
  table.sb th:nth-child(3){width:9% !important;}    /* 시작 */
  table.sb th:nth-child(4){width:11% !important;}   /* 시간 */
  table.sb th:nth-child(5){width:21% !important;}   /* 홈팀 */
  table.sb th:nth-child(6){width:15% !important;}   /* 스코어(양옆 슬롯 여유) */
  table.sb th:nth-child(7){width:21% !important;}   /* 원정팀 */
  table.sb th:nth-child(9){width:8% !important;}    /* 분석·배당 */
  .lg{font-size:9px;padding:1px 3px;white-space:normal;word-break:break-word;line-height:1.2;}
  .tc-kick{font-size:11px;white-space:normal;}
  .tc-st{font-size:10px;}
  .st{font-size:10px;}
  .sc{font-size:13px;min-width:0;}                 /* 칸 넘침 방지: 최소폭 해제 */
  .sc .g{padding:1px 3px;min-width:12px;}
  .sg{min-width:0;font-size:8px;padding:0;}        /* GOAL 슬롯 축소(정상시 폭≈0) */
  .tm-h,.tm-a{font-size:11px;line-height:1.25;}
  .rank{font-size:8.5px;}
  .rsm{font-size:8.5px;}
  .lc .ic{font-size:15px;margin:0 1px;}
  td:first-child{font-size:15px;}
  tr.secbar td{font-size:11px;}
}
/* 초소형(≤360px, 예: 300~360 구형폰): 글자·여백 더 축소 */
@media (max-width:360px){
  body{font-size:11px;}
  #hdr>div>div:first-child{font-size:12px;}
  .tab{font-size:10px;padding:4px 7px;}
  table.sb th{font-size:10px;padding:5px 1px;}
  table.sb td{font-size:10px;padding:5px 1px;}
  .lg{font-size:8px;padding:1px 2px;}
  .tc-kick{font-size:9.5px;}
  .tc-st{font-size:9px;}
  .st{font-size:9px;}
  .sc{font-size:11px;}
  .sc .g{min-width:11px;padding:1px 2px;}
  .tm-h,.tm-a{font-size:10px;line-height:1.2;}
  .rank{font-size:8px;}
  .rsm{font-size:8px;}
  .lc .ic{font-size:13px;}
  td:first-child{font-size:13px;}
  tr.secbar td{font-size:10px;}
}
