/* ══════════════════════════════════════════════════════════════════════
   마추 모바일 '전부 초록' 2단계 (2026-09-15 대표 요청) — sheet 담당
   예상지(racing/sheet.php) · 내 예상 경마지(racing/paper.php) · 경기일정(racing/schedule.php)
   기존 콘텐츠 색 덮어쓰기.
   ⚠ 파일 전체가 @media (max-width: 900px) 한 덩어리 안 → PC(≥901px)는 한 줄도 바뀌지 않는다.
     안쪽을 @media screen 으로 한 번 더 감싼다 — 인쇄(PDF 저장)는 페이지 @media print 규칙 그대로(field 와 같은 방식).
   ⚠ 범위 — 세 화면에만 있는 조상/형제로 좁힌다(다른 화면은 칠하지 않는다).
       sheet.php : .sh-race (경주 지면) · .sh-days ~ .sh-picker / .sh-days ~ .dc-wrap (날짜 띠 뒤 형제 — field.php 에는 .sh-days 가 없다)
       paper.php : .pp-race (경주 묶음) · .sh-days ~ .pp-sum
       schedule  : .jt2-sched
   ⚠ 공용 부품(.sh-tg 승식 딱지 · .sh-badge · .sh-gate · .sh-ov 예상 표시 창 · .sh-toast)은 shell(green.css) 몫 → 여기 두지 않는다.
   ⚠ 페이지 본문 <style> 이 이 파일보다 뒤에 나오므로 'html body ' 로 명시도를 올린다.
     밝은 규칙이 jt2.css 의 .jt-dark 규칙보다 세지므로 밝은 규칙마다 다크(body.jt-dark) 짝을 둔다.
     style="" 속성(마번 색)만 !important.
   이 파일을 지우면 원래 색으로 돌아간다.
   ══════════════════════════════════════════════════════════════════════ */
@media (max-width: 900px) {
@media screen {

/* ════════════ 예상지 · 내 예상 경마지 공통 ════════════ */

/* ── 1. 마번 색(말마다 파랑·보라·빨강·주황·금색 — jtm_fld_hue 인라인 style) → 전 두수 같은 진초록 (field 와 같은 값) ── */
html body .sh-race .sh-hd .no,
html body .sh-race .sh-brief .st-h .nm .no,
html body .pp-race .pp-h .no { background: #0E7C4C !important; color: #FFFFFF; }
html body.jt-dark .sh-race .sh-hd .no,
html body.jt-dark .sh-race .sh-brief .st-h .nm .no,
html body.jt-dark .pp-race .pp-h .no { background: #3FC482 !important; color: #0D1320; }

/* ── 2. 마체중 증감 — 증가(빨강 #D62B2B) → 잉크 · 감소(파랑 #1D6FD4) → 초록 글자 (field 와 같은 뜻 매핑) ──
   다크: 원래 초록 작은 글자(#17794A)가 어두운 카드 위 3.1:1 → 다크 초록 글자. '직전'(.ago 회색 칩)·최근 5전(.l5)은 제외 */
html body .sh-race .sh-kv dd i.up,
html body .pp-race .pp-kv dd i.up { color: #0F2E20; }
html body .sh-race .sh-kv dd i.dn,
html body .pp-race .pp-kv dd i.dn { color: #17794A; }
html body.jt-dark .sh-race .sh-kv dd i:not(.ago),
html body.jt-dark .pp-race .pp-kv dd:not(.l5) i:not(.ago) { color: #7FD9A8; }
html body.jt-dark .sh-race .sh-kv dd i.up,
html body.jt-dark .pp-race .pp-kv dd:not(.l5) i.up { color: #E8F2EC; }

/* ── 3. 주행습성 칩 — 선행(빨강)·선입(주황)·중간(파랑)·추입(초록) → 초록 농도 4단계(글자로 구분, 채움형 없음 = 추천처럼 보이지 않게) ──
   선행: 짙은 초록 연바탕+테두리 · 선입: 짙은 초록 연바탕 · 중간: 연바탕 · 추입: 더 연한 바탕+연한 테두리. 모름(—)은 회색 그대로 */
html body .sh-race .sh-kv .sh-st--front,
html body .pp-race .pp-kv .sh-st--front { background: #DDF1E5; color: #0B5E3A; box-shadow: inset 0 0 0 1px #9FD4B6; }
html body .sh-race .sh-kv .sh-st--stalk,
html body .pp-race .pp-kv .sh-st--stalk { background: #DDF1E5; color: #0B5E3A; }
html body .sh-race .sh-kv .sh-st--mid,
html body .pp-race .pp-kv .sh-st--mid { background: #E8F6EF; color: #17794A; }
html body .sh-race .sh-kv .sh-st--close,
html body .pp-race .pp-kv .sh-st--close { background: #F2FAF5; color: #17794A; box-shadow: inset 0 0 0 1px #D7EEE1; }
html body.jt-dark .sh-race .sh-kv .sh-st--front,
html body.jt-dark .pp-race .pp-kv .sh-st--front { background: #173D2A; color: #9BE3BC; box-shadow: inset 0 0 0 1px #2E6B4A; }
html body.jt-dark .sh-race .sh-kv .sh-st--stalk,
html body.jt-dark .pp-race .pp-kv .sh-st--stalk { background: #173D2A; color: #9BE3BC; }
html body.jt-dark .sh-race .sh-kv .sh-st--mid,
html body.jt-dark .pp-race .pp-kv .sh-st--mid { background: #143325; color: #7FD9A8; }
html body.jt-dark .sh-race .sh-kv .sh-st--close,
html body.jt-dark .pp-race .pp-kv .sh-st--close { background: #10281C; color: #7FD9A8; box-shadow: inset 0 0 0 1px #1D3A2B; }

/* ── 4. 경주 머리 '경주 상세 ›'/'예상지 ›' 링크 — 다크에서 #17794A 가 회색 띠 위 2.5:1 → 다크 초록 글자 ── */
html body.jt-dark .sh-race .sh-rhd .go,
html body.jt-dark .pp-race .sh-rhd .go { color: #7FD9A8; }


/* ════════════ racing/sheet.php — 예상지 ════════════ */

/* ── 5. 경주 고르기 칩 선택(밝은 초록 #22A45D + 흰 글자 3.2:1) → 진초록 채움 · 위에 얹힌 개수 배지(shell 진초록)와 붙지 않게 바탕색 테두리 ── */
html body .sh-days ~ .sh-picker .rc.on { background: #0E7C4C; border-color: #0E7C4C; }
html body .sh-days ~ .sh-picker .rc.on .sh-badge { box-shadow: 0 0 0 2px #FFFFFF; }
html body.jt-dark .sh-days ~ .sh-picker .rc.on { background: #3FC482; border-color: #3FC482; }
html body.jt-dark .sh-days ~ .sh-picker .rc.on b,
html body.jt-dark .sh-days ~ .sh-picker .rc.on span { color: #0D1320; }
html body.jt-dark .sh-days ~ .sh-picker .rc.on .sh-badge { box-shadow: 0 0 0 2px #0D1320; }

/* ── 6. 경주편성 요약 표 경주 번호 링크 — 다크 3.1:1 → 다크 초록 글자 (field 의 같은 표는 건드리지 않는다) ── */
html body.jt-dark .sh-days ~ .dc-wrap .dc-tbl td.no a { color: #7FD9A8; }

/* ── 7. 지난 경주 칸 착순 뱃지 — 1착 빨강 채움 → 진초록 채움 · 2~3착 연빨강 → 짙은 초록 연바탕 · 그 밖·기록없음 회색 그대로 ── */
html body .sh-race .sh-pc .sh-o--1 { background: #0E7C4C; color: #FFFFFF; }
html body .sh-race .sh-pc .sh-o--p { background: #DDF1E5; color: #0B5E3A; }
html body.jt-dark .sh-race .sh-pc .sh-o--1 { background: #3FC482; color: #0D1320; }
html body.jt-dark .sh-race .sh-pc .sh-o--p { background: #173D2A; color: #9BE3BC; }

/* ── 8. 지난 경주 전체 착순 속 '이 말' 줄 — 금색 바탕(#FFF4E0)·갈색 글자(#8A5A12) → 연바탕 + 짙은 초록 글자 ── */
html body .sh-race .sh-pc .fin li.me { background: #E8F6EF; }
html body .sh-race .sh-pc .fin li.me b,
html body .sh-race .sh-pc .fin li.me i,
html body .sh-race .sh-pc .fin li.me span { color: #0B5E3A; }
html body.jt-dark .sh-race .sh-pc .fin li.me { background: #143325; }
html body.jt-dark .sh-race .sh-pc .fin li.me b,
html body.jt-dark .sh-race .sh-pc .fin li.me i,
html body.jt-dark .sh-race .sh-pc .fin li.me span { color: #9BE3BC; }

/* ── 9. 지난 경주 기록(시간) — 다크에서 #17794A 가 회색 칸 위 2.5:1 → 다크 초록 글자 ── */
html body.jt-dark .sh-race .sh-pc .ph3 b { color: #7FD9A8; }


/* ════════════ racing/paper.php — 내 예상 경마지 (로그인 회원 화면) ════════════ */

/* ── 10. 하루 요약 숫자 — 다크에서 #17794A 가 회색 칸 위 2.5:1 → 다크 초록 글자 ── */
html body.jt-dark .sh-days ~ .pp-sum b { color: #7FD9A8; }

/* ── 11. 경주 상태 '집계 중'(주황) → 회색 윤곽 칩 — '경주 전'(회색 채움)·'결과 확정'(초록)과 구분 ── */
html body .pp-race .pp-st.wait { background: #F1F4F9; color: #5A6A82; box-shadow: inset 0 0 0 1px #CBD5E1; }
html body.jt-dark .pp-race .pp-st.wait { background: #202A3C; color: #A7B4C9; box-shadow: inset 0 0 0 1px #3A4760; }

/* ── 12. 승식 줄 — 적중(빨강) → 진초록 채움 딱지 + 초록 굵은 글자 · 미완성 안내(주황) → 잉크 · 미적중 회색 그대로 ── */
html body .pp-race .pp-ln.hit .bt { background: #0E7C4C; color: #FFFFFF; }
html body .pp-race .pp-ln.hit .rs { color: #17794A; }
html body .pp-race .pp-ln.part .rs { color: #0F2E20; }
html body.jt-dark .pp-race .pp-ln.hit .bt { background: #3FC482; color: #0D1320; }
html body.jt-dark .pp-race .pp-ln.hit .rs { color: #7FD9A8; }
html body.jt-dark .pp-race .pp-ln.part .rs { color: #E8F2EC; }

/* ── 13. 등록한 말 착순 — 3착 이내(연빨강) → 짙은 초록 연바탕 · 착외·경주 전·제외 회색 그대로 ── */
html body .pp-race .pp-h .rd b.o.p { background: #DDF1E5; color: #0B5E3A; }
html body.jt-dark .pp-race .pp-h .rd b.o.p { background: #173D2A; color: #9BE3BC; }

/* ── 14. 최근 N전 착순 칸 — 1착 빨강 채움 → 진초록 채움 · 2~3착 연빨강 → 짙은 초록 연바탕 ── */
html body .pp-race .pp-kv dd.l5 i.w { background: #0E7C4C; color: #FFFFFF; }
html body .pp-race .pp-kv dd.l5 i.p { background: #DDF1E5; color: #0B5E3A; }
html body.jt-dark .pp-race .pp-kv dd.l5 i.w { background: #3FC482; color: #0D1320; }
html body.jt-dark .pp-race .pp-kv dd.l5 i.p { background: #173D2A; color: #9BE3BC; }

/* ── 15. 마필노트 메모 상자 — 금색 바탕·갈색 글자 → 연바탕 + 연한 테두리 + 잉크 ── */
html body .pp-race .pp-h .nt { background: #E8F6EF; border-color: #D7EEE1; color: #0F2E20; }
html body.jt-dark .pp-race .pp-h .nt { background: #143325; border-color: #1D3A2B; color: #E8F2EC; }

/* ── 16. 등록한 말 줄 옅은 띠 — 1착 빨강 기운 · 2~3착 파랑 기운 → 초록 기운 두 농도 ── */
html body .pp-race .pp-h.win { background: linear-gradient(90deg, rgba(18,148,91,.08), transparent 60%); }
html body .pp-race .pp-h.plc { background: linear-gradient(90deg, rgba(18,148,91,.04), transparent 60%); }
html body.jt-dark .pp-race .pp-h.win { background: linear-gradient(90deg, rgba(63,196,130,.10), transparent 60%); }
html body.jt-dark .pp-race .pp-h.plc { background: linear-gradient(90deg, rgba(63,196,130,.05), transparent 60%); }


/* ════════════ racing/schedule.php — 경기일정 ════════════ */

/* ── 17. 오픈톡 자리표시 '—'(파란 회색 #B8C2D2) → 무채색 회색 · 다크는 토큰 그대로 ── */
html body .jt2-sched .jt2-talkn--none { color: #A7B4C9; }
html body.jt-dark .jt2-sched .jt2-talkn--none { color: var(--jt2-faint); }

/* ── 18. 상태 칩 — shell 토큰대로면 적중(연초록)·발매중(연초록)이 같아진다 ──
   적중 N승식 → 진초록 채움 · 발매중 → 연바탕+초록 글자(대비 4.0 → 4.9) · 결과 대기/없음 → 회색 윤곽(예정·확정 회색 채움과 구분) */
html body .jt2-sched .jt2-stat--hit { background: #0E7C4C; color: #FFFFFF; }
html body .jt2-sched .jt2-stat--live { background: #E8F6EF; color: #17794A; }
html body .jt2-sched .jt2-stat--wait { box-shadow: inset 0 0 0 1px #CBD5E1; }
html body.jt-dark .jt2-sched .jt2-stat--hit { background: #3FC482; color: #0D1320; }
html body.jt-dark .jt2-sched .jt2-stat--live { background: #143325; color: #7FD9A8; }
html body.jt-dark .jt2-sched .jt2-stat--wait { box-shadow: inset 0 0 0 1px #3A4760; }

/* ── 19. 발주 전 잠긴 픽 '멤버십 전용 픽' 칩(연초록 — 열린 픽처럼 보임) → 회색 칩 (race 담당 오늘의 경주와 같은 처리) ── */
html body .jt2-sched .jt2-chip--blue { background: #F1F4F9; color: #5A6A82; }
html body.jt-dark .jt2-sched .jt2-chip--blue { background: #202A3C; color: #A7B4C9; }

/* ── 20. 일정 검증 배지 · 날씨 칩 NOW — 초록 틴트 글자 #0E8A46 대비 4.0 → 초록 글자 #17794A (4.9) ── */
html body .jt2-sched .jt2-verify:not(.jt2-verify--none) { background: #E8F6EF; color: #17794A; }
html body .jt2-sched .jt2-verify:not(.jt2-verify--none) i { background: #17794A; }
html body .jt2-sched .jt2-wx2 .lv { background: #E8F6EF; color: #17794A; }
/* '일정 미검증' 배지 점(파란 회색 #B8C2D2 채움) → 무채색 회색 · 다크는 토큰 그대로 */
html body .jt2-sched .jt2-verify--none i { background: #A7B4C9; }
html body.jt-dark .jt2-sched .jt2-verify--none i { background: var(--jt2-faint); }
html body.jt-dark .jt2-sched .jt2-verify:not(.jt2-verify--none) { background: #143325; color: #7FD9A8; }
html body.jt-dark .jt2-sched .jt2-verify:not(.jt2-verify--none) i { background: #7FD9A8; }
html body.jt-dark .jt2-sched .jt2-wx2 .lv { background: #143325; color: #7FD9A8; }


/* ════════════ 3단계 — 다크 넓은 면 남색 슬레이트(#232E43 --jt2-tint-grey · #1B2434 --jt2-inset) → 초록 기운 무채색 ════════════
   바탕 #15201B · 그 면에 붙은 구분선 #22322A. 카드(#161E2C)·페이지 바닥(#0D1320)은 대상 아님 → 그대로.
   바탕이 카드와 밝기가 같아지므로 테두리 없는 상자(.sh-note · .pp-kv)는 안쪽 윤곽선(box-shadow, 크기 변화 없음)으로 모양을 남긴다.
   밝은 모드는 무채색 회색(#F1F4F9)이라 그대로. 점선 안내 상자 테두리는 shell 초록(#245C40) 그대로. */

/* ── 21. sheet — 경주편성 요약 머리 · 경주 머리 띠 · 정보지 머리 ── */
html body.jt-dark .sh-days ~ .dc-wrap .dc-hd,
html body.jt-dark .sh-race .sh-rhd,
html body.jt-dark .sh-race .st-wrap .st-hd { background: #15201B; border-bottom-color: #22322A; }

/* ── 22. sheet — 말별 지난 경주 칸(.sh-past · 두 칸 .sh-pc) · '최근 출전 기록이 없습니다' 띠(.sh-pc--none) · 회원 메모 ── */
html body.jt-dark .sh-race .sh-past { background: #15201B; }
html body.jt-dark .sh-race .sh-row { border-bottom-color: #22322A; }
html body.jt-dark .sh-race .sh-info { border-right-color: #22322A; border-bottom-color: #22322A; }
html body.jt-dark .sh-race .sh-pc { border-right-color: #22322A; }
html body.jt-dark .sh-race .sh-pc .fin,
html body.jt-dark .sh-race .sh-pc .fin-none { border-top-color: #22322A; }
html body.jt-dark .sh-race .sh-note { background: #15201B; box-shadow: inset 0 0 0 1px #22322A; }

/* ── 23. paper(회원) — 하루 요약 칸 · 경주 머리 띠 · 해설 첫 줄 · 말 정보 상자 ── */
html body.jt-dark .sh-days ~ .pp-sum > div { background: #15201B; border-color: #22322A; }
html body.jt-dark .pp-race .sh-rhd { background: #15201B; border-bottom-color: #22322A; }
html body.jt-dark .pp-race .pp-intro { background: #15201B; border-bottom-color: #22322A; }
html body.jt-dark .pp-race .pp-kv { background: #15201B; box-shadow: inset 0 0 0 1px #22322A; }

/* ── 24. paper(비로그인) — '로그인하면 내 예상이 쌓입니다' 안내 상자
   공용 .jt2-gate 라 페이지 표시가 없다 → '예상지 보기'(racing/sheet.php) 버튼을 품은 상자로 좁힌다(서버 racing/*.php 중 paper 한 곳뿐). ── */
html body.jt-dark .jt2-card > .jt2-gate:has(> a.jt2-btn--ghost[href$="/racing/sheet.php"]) { background: #15201B; }

/* ── 25. schedule — 아래 넓은 점선 안내 상자 · 발주 임박 강조 행(초록 왼쪽 막대는 그대로) ── */
html body.jt-dark .jt2-sched .jt2-note { background: #15201B; }
html body.jt-dark .jt2-sched .jt2-mrow--hl,
html body.jt-dark .jt2-sched .jt2-row--hl { background: #15201B; }

/* 4단계(09-16) '직전' 칩(당일 실측 없어 직전 경주 값) — 다크에서 밝은 회색 알약이 그대로 남던 것 */
html body .sh-race .sh-kv dd i.ago, html body .pp-race .pp-kv dd i.ago { color: #5A6A82; }
html body.jt-dark .sh-race .sh-kv dd i.ago, html body.jt-dark .pp-race .pp-kv dd i.ago { background: #202A3C; color: #A7B4C9; }

} /* @media screen */
} /* @media (max-width: 900px) */
