/* 매직오브 스코어 화면 3/3 — Claude 마감(폐하 지시로 고친 것: 사진·적중 색·적중률 칸·로고·줄 맞춤·확률 칸 색·국기 단추·휴대폰 머리). 가장 나중에 읽혀 앞 두 파일을 덮음 */
/* Claude 마감 17(2026-10-30): 분석 글 사진 — 글 제목 아래 16:9, 모서리 둥글게, 낮·밤 같은 모양 */
.ai-article .ai-photo{margin:10px 0 14px;border-radius:12px;overflow:hidden;aspect-ratio:16/9;background:var(--line)}
.ai-article .ai-photo img{display:block;width:100%;height:100%;object-fit:cover}

/* Claude 마감 19(2026-10-31 폐하 지시): 적중은 더 파란색(빗나감은 그대로 빨강) · 예측 기록 카드는 "자세히"를 맨 위, 판정은 팀 이름 오른쪽에 작게 */
:root{--hit:#2F62E0;--hit-soft:#E8EEFF;--hit-text:#1F4FC4}
:root[data-theme=dark]{--hit:#6E98FF;--hit-soft:#1C2848;--hit-text:#9DBBFF}
.result-hit,.ai-badge.ai-badge-hit,.ai-review-hit .ai-verdict{color:var(--hit-text)!important;background:var(--hit-soft)!important;border-color:var(--hit)!important}
.record-card .record-more{align-self:flex-end;display:inline-flex;align-items:center;gap:4px;margin:-4px 0 -6px;padding:6px 0;min-height:32px;color:var(--mint-text);font-size:14px;font-weight:700}
.record-card .record-more .icon{width:16px;height:16px}
.record-card .prediction-teams{align-items:center!important;flex-wrap:wrap;gap:8px 16px!important}
.record-card .prediction-teams .ai-badge,.record-card .prediction-teams .record-wait{flex:none;align-self:center;font-size:13px!important;line-height:1.3!important;font-weight:750!important;min-height:0!important;padding:4px 9px!important;border-radius:6px!important;display:inline-flex!important;gap:0 4px!important;white-space:nowrap!important;width:auto}
.record-card .prediction-teams .record-wait{font-size:12px!important;font-weight:500!important;padding:4px 0!important}

/* Claude 마감 20(2026-10-31 폐하 지시): 경기 예측 탭 오른쪽 종목별 최근 30일 적중률(누르면 아래 리그별) · 예측 기록 30경기씩 쪽 번호 */
.ai-tabs{flex-wrap:wrap;align-items:center}
.acc-sports{margin-left:auto;display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:6px 0}
.acc-label{font-size:13px;color:var(--muted-text);margin-right:2px}
.acc-sport{font:inherit;font-size:14px;min-height:36px;padding:6px 12px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--ink);cursor:pointer;white-space:nowrap}
.acc-sport b{color:var(--mint-text);margin-left:2px}
.acc-sport[aria-expanded=true]{border-color:var(--mint);background:var(--mint-soft)}
.acc-leagues{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;margin:-16px 0 24px;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--surface);font-size:14px}
.acc-leagues[hidden]{display:none}
.acc-leagues strong{font-size:14px}
.acc-league{white-space:nowrap}
.acc-league b{color:var(--mint-text)}
.acc-league small{color:var(--muted-text)}
.record-pager{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;margin:24px 0 4px}
.record-pager a,.record-pager span[aria-current]{min-width:40px;min-height:40px;padding:0 10px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);font-size:14px;text-decoration:none}
.record-pager span[aria-current]{background:var(--mint);border-color:var(--mint);color:var(--on-accent);font-weight:700}
.record-pager .gap{color:var(--muted-text);padding:0 2px}
@media (max-width:640px){.acc-sports{margin-left:0;width:100%;padding-bottom:10px}.acc-label{width:100%}}

/* Claude 마감 21(2026-10-31 폐하 지시 "여기는 왜 팀 로고 안 박냐"): 경기 예측·예측 기록 카드에 팀 로고(없으면 첫 글자 동그라미) */
.pc-mark{flex:none;object-fit:contain}
/* 로고가 없으면 아무것도 안 그림(첫 글자 동그라미 뺌, 2026-10-31 폐하 지시 "울 이라고 쓰는데 칸 차지하게 지워라") */
.record-card .prediction-teams b{flex-direction:row!important;align-items:center!important;gap:6px!important}
.pc-mark-sm{width:22px;height:22px;margin:0}
/* 로고는 팀 이름 왼쪽 같은 줄(카드 높이 안 늘림, 2026-10-31 폐하 지시 "로고면 팀명 좌측에"·"불필요하게 칸 절대 늘리지 마라") */
.pc-name{display:inline-flex;align-items:center;gap:6px;min-width:0}

/* Claude 마감 22(2026-10-31 폐하 지시 "모바일 좌우 비뚤고 규격 안 맞는 것 점검"): 경기 예측·예측 기록에서 상자 없는 "다가오는 경기·경기별 예측 기록" 제목이
   위 큰 제목·탭·아래 카드보다 20~24px 안으로 들어가 있던 것을 같은 왼쪽 줄로(좌우 같게) */
.ai-tabs ~ .section-heading,.record-games>.section-heading{padding-left:0!important;padding-right:0!important}

/* Claude 마감 23(2026-10-31 폐하 지시 "홈승·무승부·원정승 3색이라 피곤하다, 셋 다 무승부처럼, 이기는 쪽만 테두리 + 가장 높음"): 세 칸 같은 회색, 낮·밤 같음 */
.prob-cell.prob-home,.prob-cell.prob-away,.prob-cell.prob-draw,:root[data-theme=dark] .prob-cell.prob-home,:root[data-theme=dark] .prob-cell.prob-away,.prob-cell.is-top{background:var(--surface-2)!important}
.prob-cell.prob-home span,.prob-cell.prob-away span,.prob-cell.prob-draw span,:root[data-theme=dark] .prob-cell.prob-home span,:root[data-theme=dark] .prob-cell.prob-away span{color:var(--muted-text)!important}
.prob-cell.prob-home strong,.prob-cell.prob-away strong,.prob-cell.prob-draw strong,:root[data-theme=dark] .prob-cell.prob-home strong,:root[data-theme=dark] .prob-cell.prob-away strong{color:var(--ink)!important}
.prob-cell.is-top{border-color:var(--mint)!important}
.prob-cell.is-top strong{color:var(--mint-text)!important}

/* Claude 마감 24(2026-10-31 폐하 지시 "우측 위에 태극기, 태극기 버튼이 언어 설정"): 머리 오른쪽 국기 단추(매직오브트렌드 것과 같은 모양), 낮·밤 같음 */
.lang-menu{position:relative;flex:none}
.lang-menu summary{list-style:none;width:40px;height:36px;display:grid;place-items:center;cursor:pointer;border-radius:10px}
.lang-menu summary::-webkit-details-marker{display:none}
.lang-menu summary:focus-visible{outline:2px solid var(--mint);outline-offset:1px}
.lang-menu svg{width:26px;height:17px;border-radius:2px;box-shadow:0 0 0 1px var(--line);flex:none}
.lang-menu ul{position:absolute;right:0;top:40px;z-index:30;min-width:150px;margin:0;padding:6px;list-style:none;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.18)}
.lang-menu li a{display:flex;align-items:center;gap:10px;min-height:40px;padding:0 10px;border-radius:8px;color:var(--ink);font-size:14px;font-weight:500;text-decoration:none;white-space:nowrap}
.lang-menu li a:hover,.lang-menu li a[aria-current]{background:var(--mint-soft)}
@media(max-width:700px){.lang-menu,.theme-button{order:2!important}.header-member{gap:10px}.header-member a{min-width:0}}
@media(max-width:700px){.header-inner{column-gap:8px}.lang-menu summary{width:32px}.theme-button,.theme-button:hover{min-width:34px!important;padding:4px!important}}
@media(max-width:430px){html[lang=en] .brand-name{font-size:18px;letter-spacing:-.02em}html[lang=en] .header-member a{font-size:12px}}
@media(max-width:360px){html[lang=en] .brand-name,html[lang=ko] .brand-name{font-size:16px}.header-member{gap:6px}.header-member a{font-size:11px}.brand-mark,.brand>svg{width:30px;height:30px}}
@media(max-width:360px){.site-header .brand-mark{width:26px!important;height:30px!important}.site-header .brand-mark svg{width:20px!important;height:20px!important}.site-header .brand{gap:4px}html[lang=en] .site-header .brand-name,html[lang=ko] .site-header .brand-name{font-size:15px}.header-inner{column-gap:5px!important}.header-member{gap:5px!important;margin-left:auto!important}.lang-menu summary{width:28px}.lang-menu svg{width:22px;height:15px}.theme-button,.theme-button:hover{min-width:30px!important;padding:2px!important}}
@media(max-width:340px){.site-header .header-inner{padding-left:0!important;padding-right:0!important;width:calc(100% - 24px)!important;margin-left:12px!important;margin-right:12px!important}html[lang=en] .site-header .brand-name{font-size:14px;letter-spacing:-.03em}html[lang=en] .header-member a{font-size:10.5px}}
/* 2026-10-31 폐하 지시: 적중률은 이름 바로 아래, 해/달은 국기 오른쪽(첫 줄에서 안 내려감), 회원가입은 머리에서 뺌 */
.brand-block{display:flex;flex-direction:column;align-items:flex-start;gap:2px;flex:none;min-width:0}
.brand-block .header-accuracy{margin-left:0!important;order:0!important;width:auto!important;padding:0!important}
@media(max-width:1200px){.site-header .primary-nav{order:5!important}.site-header .header-member{margin-left:auto!important}}
@media(max-width:700px){
.header-inner{flex-wrap:wrap}
.brand-block{flex:1 1 auto;order:1}
.brand-block .brand{min-height:36px}
.brand-block .header-accuracy{font-size:12px;gap:5px}
.brand-block .header-accuracy img{width:18px;height:18px}
.header-member{order:2!important;margin-left:auto!important}
.lang-menu{order:3!important}
.site-header .theme-button{order:3!important;margin-left:0!important}
}
@media(max-width:360px){.brand-block .header-accuracy{font-size:11px;gap:4px}.brand-block .header-accuracy img{width:16px;height:16px}}
/* 지난 경기 카드: 결과(홈승) 오른쪽에 AI 판정, 꺾쇠 대신 "상세보기" 글자 */
.wt-result{flex-direction:row!important;flex-wrap:nowrap!important;align-items:center!important;gap:6px!important}
.wt-toggle,.wt-row[open] .wt-toggle{width:auto!important;height:auto!important;border:0!important;border-radius:0!important;transform:none!important;background:none!important;font-size:12px;font-weight:650;color:var(--muted-text);white-space:nowrap;justify-self:end}
.wt-toggle::before,.wt-toggle::after{display:none!important}
.wt-toggle-less,.wt-row[open] .wt-toggle-more{display:none}
.wt-row[open] .wt-toggle-less{display:inline}
.wt-result .wt-badge{display:inline-flex;align-items:center;justify-content:center;align-self:stretch}
/* PC(1201px~, 2026-10-31 폐하 지시): 적중률 줄은 메뉴(오늘 경기…) 바로 위, 메뉴 글자는 밑줄에 가깝게 */
@media(min-width:1201px){
.site-header .header-inner{display:grid!important;grid-template-columns:auto minmax(0,1fr) auto auto auto;grid-template-areas:"brand acc member lang theme" "brand nav member lang theme";column-gap:28px;row-gap:2px;align-items:center;padding-block:14px 0;min-height:0}
.site-header .brand-block{display:contents}
.site-header .brand{grid-area:brand;align-self:center;padding-bottom:12px}
.site-header .brand-block .header-accuracy{grid-area:acc;align-self:end;justify-self:start;padding:0 0 2px!important}
.site-header .primary-nav{grid-area:nav;align-self:end;gap:28px;height:auto!important;margin:0!important}
.site-header .header-member{grid-area:member;margin-left:0!important;align-self:center}
.site-header .lang-menu{grid-area:lang;align-self:center}
.site-header .theme-button{grid-area:theme;align-self:center;margin-left:0}
}
@media(min-width:701px){
.site-header .primary-nav a{min-height:0!important;height:auto!important;padding:8px 0 9px!important;line-height:1.2}
.site-header .primary-nav a[aria-current]:after{top:auto!important;bottom:0!important}
}
