/* ══════════════════════════════════════════════════════════════════════
   마추 모바일 '전부 초록' (2026-09-15 대표 요청) — 오늘의 경주(racing/index.php) · 경주 상세(racing/race.php)
   기존 콘텐츠 색 덮어쓰기 (race 담당).
   ⚠ 파일 전체가 @media (max-width: 900px) 한 덩어리 안. PC(≥901px)는 한 줄도 바뀌지 않는다.
   ⚠ 범위 — 두 화면에만 있는 형제 조합으로 좁힌다(다른 화면은 칠하지 않는다).
       index.php : .m3-race ~ .jt2-fadeup            (m3 시간표 블록 바로 뒤의 기존 본문)
       race.php  : .jt2-back ~ .jt2-col             (본문) · .jt2-back ~ .jt2-pagehead--top (제목·메타)
   ⚠ 밝은 규칙은 jt2.css 의 다크 규칙보다 명시도가 높다 → 밝은 규칙마다 다크(body.jt-dark) 짝을 둔다.
   ⚠ shell(green.css)이 jt2 토큰(--jt2-hero·bad·tint-red·amber·dash·hover·--jt-up)과
     .jt2-gate/.jt2-note/.jt2-warn · .jt2-down/.v.bad · .mv-meet 경마장 칩 을 이미 초록/회색/잉크로 옮겼다 → 여기선 다시 쓰지 않는다.
     여기 남긴 것은 ① 하드코딩 색이라 토큰이 닿지 않는 곳, ② 토큰(주황→회색, 빨강→연초록)대로 두면
     이 두 화면에서 상태 구분이 사라지거나 뜻이 뒤집히는 곳뿐이다.
   이 파일을 지우면 원래 색(과 shell 토큰 색)으로 돌아간다.
   ══════════════════════════════════════════════════════════════════════ */
@media (max-width: 900px) {

/* ════════════ 공통(두 화면) ════════════ */

/* '출전마 분석' 진입 버튼 — 연파랑 바탕(#E8F0FE)·호버(#DCE8FB) → 연초록 · 다크 남색 바탕/연파랑 글자/파랑 테두리 → 다크 초록 */
html body .m3-race ~ .jt2-fadeup .jt-fieldgo,
html body .jt2-back ~ .jt2-pagehead--top .jt-fieldgo { background: #E8F6EF; }
html body .m3-race ~ .jt2-fadeup .jt-fieldgo:hover,
html body .jt2-back ~ .jt2-pagehead--top .jt-fieldgo:hover { background: #DDF1E5; }
html body.jt-dark .m3-race ~ .jt2-fadeup .jt-fieldgo,
html body.jt-dark .jt2-back ~ .jt2-pagehead--top .jt-fieldgo { background: #143325; color: #7FD9A8; border-color: #245C40; }
html body.jt-dark .m3-race ~ .jt2-fadeup .jt-fieldgo:hover,
html body.jt-dark .jt2-back ~ .jt2-pagehead--top .jt-fieldgo:hover { background: #173D2A; }

/* 경주 상태 태그 '결과 대기'·'결과 없음'(jtm_status_tag .jt-tag--amber) — 주황 → 회색 윤곽 칩.
   토큰만으로는 채움 회색 '예정'(.jt-tag)과 똑같아져 윤곽선으로 구분한다. 초록이면 '발매중'처럼 보여 회색 */
html body .m3-race ~ .jt2-fadeup .jt-tag--amber,
html body .jt2-back ~ .jt2-pagehead--top .jt-tag--amber { background: #F1F4F9; color: #5A6A82; box-shadow: inset 0 0 0 1px #CBD5E1; }
html body.jt-dark .m3-race ~ .jt2-fadeup .jt-tag--amber,
html body.jt-dark .jt2-back ~ .jt2-pagehead--top .jt-tag--amber { background: #202A3C; color: #A7B4C9; box-shadow: inset 0 0 0 1px #3A4760; }


/* ════════════ racing/index.php — 기존 본문 ════════════ */

/* 카드행 결과 배지 — 적중(빨강 하드코딩) → 진초록 채움 · 대기중(주황) → 회색 윤곽 · 발행중 다크(남색 바탕) → 다크 연초록.
   발행중(연초록)·미적중(회색)·예정(회색)과 계속 구분된다 */
html body .m3-race ~ .jt2-fadeup .mv-res--ok   { background: #0E7C4C; color: #FFFFFF; }
html body .m3-race ~ .jt2-fadeup .mv-res--wait { background: #F1F4F9; color: #5A6A82; box-shadow: inset 0 0 0 1px #CBD5E1; }
html body.jt-dark .m3-race ~ .jt2-fadeup .mv-res--ok   { background: #3FC482; color: #0D1320; }
html body.jt-dark .m3-race ~ .jt2-fadeup .mv-res--wait { background: #202A3C; color: #A7B4C9; box-shadow: inset 0 0 0 1px #3A4760; }
html body.jt-dark .m3-race ~ .jt2-fadeup .mv-res--live { background: #143325; color: #7FD9A8; }
/* 미적중 다크 — 초록 기운 바탕(#152B21)이라 '적중'과 헷갈린다 → 회색 */
html body.jt-dark .m3-race ~ .jt2-fadeup .mv-res--no   { background: #202A3C; color: #8B98AC; }

/* '곧 출발' 태그 — 빨강 틴트(하드코딩) → 진초록 채움(흰 글자). '고신뢰'(연초록 틴트)와 구분 유지 */
html body .m3-race ~ .jt2-fadeup .jt2-mrow--v3 .mv-tag--soon { background: #0E7C4C; color: #FFFFFF; }
html body.jt-dark .m3-race ~ .jt2-fadeup .jt2-mrow--v3 .mv-tag--soon { background: #3FC482; color: #0D1320; }
/* '고신뢰' 태그 다크 — jt2 가 밝은 연초록(#E7F6EE)만 두고 다크 짝이 없어 어두운 행 위에서 거의 흰 알약으로 튄다 (3단계 m3g3-polish).
   밝은 모드와 같은 '연바탕 + 초록 글자' 틴트로: 다크 짙은 초록 연바탕 + 글자(8.1:1) + 테두리.
   같은 자리의 '곧 출발'(밝은 채움 #3FC482)과 채움/틴트로 계속 구분된다. 표시 조건(발주·공개 로직)은 그대로 */
html body.jt-dark .m3-race ~ .jt2-fadeup .jt2-mrow--v3 .mv-tag--hi { background: #173D2A; color: #9BE3BC; box-shadow: inset 0 0 0 1px #2E6B4A; }

/* '🔒 멤버십 전용 픽' 칩 — 초록 틴트면 '열림'처럼 보인다 → 회색 칩 (열린 픽 볼 초록과 구분) */
html body .m3-race ~ .jt2-fadeup .jt2-mrow--v3 .mv-picks .jt2-chip--blue { background: #F1F4F9; color: #5A6A82; }
html body.jt-dark .m3-race ~ .jt2-fadeup .jt2-mrow--v3 .mv-picks .jt2-chip--blue { background: #202A3C; color: #A7B4C9; }

/* 경주 다시보기 칩의 ▶ 원 — 빨강 → 진초록 채움. 다크는 밝은 채움 위 흰 ▶ 가 2:1 이라 짙은 글자 */
html body .m3-race ~ .jt2-fadeup .jt2-vodchips a i { background: #0E7C4C; color: #FFFFFF; }
html body.jt-dark .m3-race ~ .jt2-fadeup .jt2-vodchips a i { background: #3FC482; color: #0D1320; }


/* ════════════ racing/race.php — 제목·메타 줄 ════════════ */

/* 관심 버튼 — 금색 테두리/주황 글자/노랑 별(하드코딩) → 짙은 초록 */
html body .jt2-back ~ .jt2-pagehead--top .jt-favbtn:hover { border-color: #9FD4B6; color: #0B5E3A; }
html body .jt2-back ~ .jt2-pagehead--top .jt-favbtn:hover svg { color: #12945B; }
html body .jt2-back ~ .jt2-pagehead--top .jt-favbtn.on { border-color: #9FD4B6; background: #DDF1E5; color: #0B5E3A; }
html body .jt2-back ~ .jt2-pagehead--top .jt-favbtn.on svg { color: #0B5E3A; }
html body.jt-dark .jt2-back ~ .jt2-pagehead--top .jt-favbtn:hover { border-color: #2E6B4A; color: #9BE3BC; }
html body.jt-dark .jt2-back ~ .jt2-pagehead--top .jt-favbtn:hover svg { color: #9BE3BC; }
html body.jt-dark .jt2-back ~ .jt2-pagehead--top .jt-favbtn.on { border-color: #2E6B4A; background: #173D2A; color: #9BE3BC; }
html body.jt-dark .jt2-back ~ .jt2-pagehead--top .jt-favbtn.on svg { color: #9BE3BC; }

/* 날씨 메타 필 — 주황 → 짙은 초록 연바탕. '주로' 필(.jt2-meta--blue = 연초록)·일반 필(흰 바탕)과 구분 유지 */
html body .jt2-back ~ .jt2-pagehead--top .jt2-meta--amber { background: #DDF1E5; border-color: #9FD4B6; color: #0B5E3A; }
html body.jt-dark .jt2-back ~ .jt2-pagehead--top .jt2-meta--amber { background: #173D2A; border-color: #2E6B4A; color: #9BE3BC; }


/* ════════════ racing/race.php — 본문(.jt2-col) ════════════ */

/* 공개 대기(시간잠금) 카드 → 가상 레이스 링크 글자 — 연파랑(#C8D9F5) → 연한 초록 (카드는 원래 짙은 초록) */
html body .jt2-back ~ .jt2-col .jt-tlock .lab { color: #D7EEE1; }

/* 2·3픽 신뢰도 막대 다크 — 남색 기운(#2C3A54) → 다크 초록 테두리색 (밝은 모드는 shell 토큰 #9FD4B6) */
html body.jt-dark .jt2-back ~ .jt2-col .jt2-bar--mid i,
html body.jt-dark .jt2-back ~ .jt2-col .jt-bar--mid i { background: #245C40; }

/* 승식 가이드·경기 환경 태그 — '적중'·'지금 관측값'·'확정'(빨강 틴트) → 진초록 채움(ai.php·stats 의 적중 표시와 같은 값) ·
   '젖음'(주황) → 짙은 초록 연바탕. 토큰대로면 '젖음'이 '마름'(회색)과 같아진다. '미적중'·'─'·'예보'·'예상'·'마름'(회색)과 구분 유지 */
html body .jt2-back ~ .jt2-col .jt2-tag--hit  { background: #0E7C4C; color: #FFFFFF; }
html body .jt2-back ~ .jt2-col .jt2-tag--tent { background: #DDF1E5; color: #0B5E3A; }
html body.jt-dark .jt2-back ~ .jt2-col .jt2-tag--hit  { background: #3FC482; color: #0D1320; }
html body.jt-dark .jt2-back ~ .jt2-col .jt2-tag--tent { background: #173D2A; color: #9BE3BC; }

/* 승식 가이드 '고배당' 칩 — 주황 → 짙은 초록 연바탕 + 테두리. 토큰대로면 회색 '보조' 칩과 같아지고, 연초록 '추천'과도 구분해야 한다 */
html body .jt2-back ~ .jt2-col .jt2-chip--amber { background: #DDF1E5; color: #0B5E3A; box-shadow: inset 0 0 0 1px #9FD4B6; }
html body.jt-dark .jt2-back ~ .jt2-col .jt2-chip--amber { background: #173D2A; color: #9BE3BC; box-shadow: inset 0 0 0 1px #2E6B4A; }

/* 승식 가이드 기준 환급액 숫자 — 빨강(하드코딩) → 잉크(강조를 키우지 않는다) */
html body .jt2-back ~ .jt2-col .jt2-betpay .pay { color: #0F2E20; }
html body.jt-dark .jt2-back ~ .jt2-col .jt2-betpay .pay { color: #E8F2EC; }

/* 경기 환경 '💧 젖은 주로' — 주황 → 잉크(주의 = 잉크, 마른 주로 = 초록과 구분. 토큰대로면 흐린 회색) */
html body .jt2-back ~ .jt2-col .jt2-amber-tx { color: #0F2E20; }
html body.jt-dark .jt2-back ~ .jt2-col .jt2-amber-tx { color: #E8F2EC; }

/* 다시보기 재생 판 — 파란 빛·그림자(하드코딩) → 초록 빛·그림자 (바탕 검정은 그대로) */
html body .jt2-back ~ .jt2-col .jt2-vodplay { background: radial-gradient(520px 300px at 50% 42%, rgba(18,148,91,.35), transparent 70%), #0B1526; }
html body .jt2-back ~ .jt2-col .jt2-vodplay i { box-shadow: 0 10px 26px rgba(18,148,91,.45); }

/* 출마표 착순 배지 — 1착 금 · 2착 은(회색) · 3착 동(하드코딩) → 3단 초록.
   1착 진초록 채움(흰 글자 5.2:1) · 2착 연바탕 + 진초록 글자(4.7:1) + 초록 테두리 · 3착 더 연한 바탕 + 작은 초록 글자(5.1:1) + 연한 테두리.
   (3단계 m3g3-polish: 2착·3착이 같은 연초록 칩으로 보인다는 검수 → 바탕 농도·테두리 농도 두 겹으로 구분)
   (3단계 2차: 밝은 모드 2착·3착이 확대해야 구분된다는 재검수 → 2착 테두리를 기본 초록 #12945B 1.5px 로 진하게.
    2착 = 진한 테두리형 · 3착 = 연한 채움형 — 다크(2착 테두리 / 3착 채움)와 같은 짝. 테두리 대비 흰 행 위 3.9:1)
   테두리는 inset 그림자 — 배지 폭·높이(시안 w40)를 바꾸지 않는다. 4착↓ 은 jt2 회색 그대로 */
html body .jt2-back ~ .jt2-col .jt2-ord--1 { background: #0E7C4C; color: #FFFFFF; }
html body .jt2-back ~ .jt2-col .jt2-ord--2 { background: #E8F6EF; color: #0E7C4C; box-shadow: inset 0 0 0 1.5px #12945B; }
html body .jt2-back ~ .jt2-col .jt2-ord--3 { background: #F2FAF5; color: #17794A; box-shadow: inset 0 0 0 1px #D7EEE1; }
html body.jt-dark .jt2-back ~ .jt2-col .jt2-ord--1 { background: #3FC482; color: #0D1320; }
html body.jt-dark .jt2-back ~ .jt2-col .jt2-ord--2 { background: #143325; color: #7FD9A8; box-shadow: inset 0 0 0 1.5px #3FC482; }
/* 4단계(09-16): 다크 2착·3착이 비슷하다는 최종 검수 → 2착 밝은 초록 1.5px 테두리형 · 3착 테두리 없는 옅은 채움형 */
html body.jt-dark .jt2-back ~ .jt2-col .jt2-ord--3 { background: #10281C; color: #52D190; box-shadow: none; }

/* 출전 '제외' 칩 — 빨강 → 회색 윤곽 칩 + 잉크 글자 (토큰대로면 연초록이 되어 '좋은 표시'처럼 읽힌다) */
html body .jt2-back ~ .jt2-col .jt2-chip--red { background: #F1F4F9; color: #0F2E20; box-shadow: inset 0 0 0 1px #CBD5E1; }
html body.jt-dark .jt2-back ~ .jt2-col .jt2-chip--red { background: #202A3C; color: #E8F2EC; box-shadow: inset 0 0 0 1px #3A4760; }

/* 오픈톡 관리자 삭제 버튼 눌림 — 빨강 → 회색 (토큰대로면 연초록) */
html body .jt2-back ~ .jt2-col .jt2-talk-del:hover { background: #F1F4F9; color: #0F2E20; }
html body.jt-dark .jt2-back ~ .jt2-col .jt2-talk-del:hover { background: #202A3C; color: #E8F2EC; }


/* ════════════ 공용 날짜 막대(.jt2-days) — 오늘의 경주 · 경기일정 · 배당 계산기 · 마추예측(jtm_day_pills) ════════════
   (3단계 2차 m3g3-polish) 재검수: 밝은 모드에서 토(#17794A)·일(#0B5E3A)이 명도 차이뿐이라 한눈에 구분이 약하다.
   원래 시안은 토 파랑 / 일 빨강(색상 차이) — 초록 한 가지로는 색상 차이를 못 내므로 '모양'으로 가른다:
   금·토 = 초록 글자만(shell green.css 26절 그대로) · 일 = 요일 글자에 짙은 초록 연바탕 알약(#DDF1E5 + #0B5E3A 6.6:1).
   다크도 같은 모양(#173D2A + 글자 #9BE3BC 그대로 8.1:1) — 두 모드 규칙을 맞춘다. 선택된 날([aria-current]) 은 채움 그대로.
   ⚠ shell 26절(같은 선택자 · green.css 가 이 파일보다 늦게 실린다)을 .jt2-days 한 단계 더 붙여 이긴다 — 색은 26절 값과 같게 둔다.
   알약 여백: 세로 padding 1 / margin -1 로 높이 불변. 좌우 padding 4 는 칸을 넓혀서 확보한다(일요일 칸만 +8px) —
   375px 에서 칸 좌우 안쪽 여백이 4px 뿐이라 음수 margin 으로 자리를 지키면 알약이 칸 테두리에 1px 로 붙는다(DPR3 확인).
   알약 왼쪽 끝 = 원래 글자 자리(테두리에서 5px) · 날짜 숫자와 5px(gap). 가로 스크롤 막대라 칸이 넓어져도 줄바꿈 없음. 글자·순서·링크 무변경 */
html body .jt2-days .jt2-day--sun:not([aria-current="page"]) .w {
  background: #DDF1E5; color: #0B5E3A; border-radius: 6px;
  padding: 1px 4px; margin: -1px 0;
}
html body.jt-dark .jt2-days .jt2-day--sun:not([aria-current="page"]) .w { background: #173D2A; color: #9BE3BC; }

} /* @media max-width:900px */