/* coin3.css — COIN3 2026-10-23 · 9시 경주마 줄 · 장중 단타 줄의 네모 2×2 · 판 kv2 줄 · 살 수 있나 한 줄
   = 매집 D:/mazip/app/web/intraday.css 344~378(ROW 2차·3차: .it-cg · .it-c · .it-lv · .it-lvt · .it-hole · .tz-kv.it-kv2) · 308~309(.it-liq .it-lqb) 값 그대로 [매집 그대로]
   매집 「html body #view .it-nr」 앞머리 → 9시 = 「#pePanel .d1-card.c3-on」 · 장중 = intra3.css 가 이미 같은 규칙(#i3Root .it-nr .it-c …)을 가짐 · 판 = 「#x10Sheet .c3-sh」 [바꿈: 우리 화면 틀]
   글꼴 크기 = 매집 실측(10-23 18:1x 내부 브라우저): --fs-1 14 · --fs-2 15 · --fs-3 17 · --fs-5 19 · --fs-8 25 · 칸 7/9 · 모서리 10 · 줄 카드 18 · 칸 사이 6
   색 = 우리 색표(--x-*)에 매집 토큰 이름을 이어 붙인 intra3.css 값 그대로(장중 줄과 같은 색) */

/* ---------- 9시 줄: 매집 토큰(intra3.css #i3Root 와 같은 값) ---------- */
#pePanel .d1-card.c3-on {
  --card-2: var(--x-card2); --text: var(--x-text); --muted: var(--x-muted); --faint: var(--x-faint); --line: var(--x-line);
  --neutral-bg: var(--x-neutral-bg); --neutral: var(--x-muted); --ok: #4CC38A; --ok-ink: #5FD394; --accent: var(--x-accent);
  --fs-1: 14px; --fs-2: 15px; --fs-3: 17px; --fs-5: 19px; --fs-8: 25px;
}
body.x10[data-theme="light"] #pePanel .d1-card.c3-on { --ok-ink: #0F6B39; --ok: #16884A; }   /* 매집 밝게 값 */

/* 9시 줄 = 매집 카드 틀(.it-nr: 모서리 18 · 안쪽 12 · 왼쪽 18 · 줄 밑 네모 2×2 · 오른쪽 › 세로 가운데) [바꿈: 줄 안 글(이름·지금·최고·청산)은 9시 그대로 · 자리만 매집 차례]
   매집 차례: ① 이름 ↔ 큰 숫자(자리 모자라면 큰 숫자가 다음 줄 오른쪽 — 매집 .it-n1 flex-wrap) ② 작은 글 ↔ 오른쪽 작은 글 ③ 네모 2×2 · › */
#pePanel .d1-card.c3-on { display: flex; flex-wrap: wrap; align-items: center; column-gap: 8px; row-gap: 4px; position: relative;
  border-radius: 18px; padding: 12px 40px 12px 18px; }
#pePanel .d1-card.c3-on > .rl1-l, #pePanel .d1-card.c3-on > .rl1-r { display: contents; }
#pePanel .d1-card.c3-on > .u3d-logo { order: 1; flex: none; }
#pePanel .d1-card.c3-on .rl1-nm { order: 2; flex: 1 1 0; min-width: 0; max-width: 100%; }   /* 매집 [브레인 10-19] 긴 이름만 … 줄임(한 줄 고정) */
#pePanel .d1-card.c3-on .rl1-nm > b, #pePanel .d1-card.c3-on .rl1-nm > .d1-st { flex: none; }
#pePanel .d1-card.c3-on .rl1-nm > small { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* FIX3 2026-10-24 #5(QA3: 폰 390 에서 한글 이름·「조금 비싸게」 알약이 「최고 +x%」 밑에 깔려 1글자만 — 이름 칸 100px 에 ★·코드·이름·알약을 한 줄로 넣던 것):
   이름 칸 안에서 줄 넘김 허용 — 한글 이름이 통째로 안 들어가면 코드 밑 둘째 줄로(그 줄 폭 = 이름 칸 전체, 넘치면 … 줄임) · 알약도 자리 없으면 다음 줄.
   큰 숫자 「최고」 자리는 그대로(겹치지 않음). 넓은 화면(1280)은 한 줄에 다 들어가 모양 그대로 [내 발명] */
#pePanel .d1-card.c3-on .rl1-nm { flex-wrap: wrap; row-gap: 2px; overflow: hidden; }
#pePanel .d1-card.c3-on .rl1-nm > .c3-lq { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
#pePanel .d1-card.c3-on .rl1-big { order: 3; margin-left: auto; text-align: right; }
#pePanel .d1-card.c3-on > .c3-br { order: 4; flex: 0 0 100%; height: 0; }
#pePanel .d1-card.c3-on .rl1-l > .rl1-s { order: 5; flex: 1 1 auto; min-width: 0; margin-top: 0; padding-left: 36px; }   /* 로고 28 + 사이 8 = 이름 밑에 줄 맞춤 */
#pePanel .d1-card.c3-on .rl1-l > .rl1-s ~ .rl1-s { order: 6; flex-basis: 100%; }
#pePanel .d1-card.c3-on .rl1-at { order: 7; margin-left: auto; text-align: right; white-space: nowrap; }
#pePanel .d1-card.c3-on .rl1-r > :not(.rl1-big):not(.rl1-at) { order: 8; }
#pePanel .d1-card.c3-on > .c3-cg { order: 9; flex: 0 0 100%; min-width: 0; }
#pePanel .d1-card.c3-on > .c3-chev { position: absolute; right: 12px; top: 50%; margin-top: -10px; width: 20px; height: 20px; color: var(--faint); }   /* 매집 .it-srow .chev(20px · 흐린 색 · 세로 가운데) */
/* 줄 글꼴 = 매집 카드 실측(이름 19px 800 · 큰 숫자 25px 800 · 작은 글 14px) [매집 그대로 · 글 내용은 9시 그대로] */
#pePanel .d1-card.c3-on .rl1-nm b { font-size: 19px; font-weight: 800; letter-spacing: -0.03em; }
#pePanel .d1-card.c3-on .rl1-nm small { font-size: 14px; }
#pePanel .d1-card.c3-on .rl1-big { font-size: 25px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.15; }
#pePanel .d1-card.c3-on .rl1-big small { font-size: 14px; font-weight: 400; color: var(--muted); letter-spacing: 0; margin-right: 1px; }
#pePanel .d1-card.c3-on .rl1-big.rl1-none { font-size: 14px; }
#pePanel .d1-card.c3-on .rl1-s, #pePanel .d1-card.c3-on .rl1-at { font-size: 14px; }

/* 네모 2×2 — 매집 intraday.css 346~352 값 그대로 */
#pePanel .d1-card.c3-on .it-cg { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin-top: 4px; }
#pePanel .d1-card.c3-on .it-c { display: flex; flex-direction: column; min-width: 0; background: var(--card-2, var(--neutral-bg)); border-radius: 10px; padding: 7px 9px; text-align: left; }
#pePanel .d1-card.c3-on .it-c .k { font-size: var(--fs-1, 13px); color: var(--muted); font-weight: 400; line-height: 1.5; }
#pePanel .d1-card.c3-on .it-c .v { display: flex; align-items: center; justify-content: flex-start; font-size: var(--fs-5, 16px); font-weight: 700; color: var(--text); white-space: nowrap; margin-top: 1px; line-height: 1.5; text-align: left; }
#pePanel .d1-card.c3-on .it-c .s { font-size: var(--fs-1, 13px); color: var(--muted); font-weight: 400; margin-top: 1px; white-space: normal; word-break: keep-all; overflow-wrap: anywhere; line-height: 1.35; text-align: left; }
#pePanel .d1-card.c3-on .it-c .s .nw { white-space: nowrap; }
#pePanel .d1-card.c3-on .it-c .it-nov { color: var(--muted); font-weight: 500; }
#pePanel .d1-card.c3-on .it-lv { display: inline-flex; gap: 2px; margin-right: 6px; flex: none; }
#pePanel .d1-card.c3-on .it-lv i { width: 6px; height: 11px; border-radius: 2px; background: var(--line); }
#pePanel .d1-card.c3-on .it-lv[data-n="3"] i { background: var(--ok, #22a35a); }
#pePanel .d1-card.c3-on .it-lv[data-n="2"] i:nth-child(-n+2) { background: #d9a400; }
#pePanel .d1-card.c3-on .it-lv[data-n="1"] i:nth-child(1) { background: var(--muted); }
#pePanel .d1-card.c3-on .it-lvt[data-c="ok"] { color: var(--ok-ink, #1a7f37); }
#pePanel .d1-card.c3-on .it-lvt[data-c="mid"] { color: #f2c94c; }
#pePanel .d1-card.c3-on .it-lvt[data-c="low"] { color: var(--muted); }
body.x10[data-theme="light"] #pePanel .d1-card.c3-on .it-lvt[data-c="mid"] { color: #b88a00; }
#pePanel .d1-card.c3-on .it-c .it-hole { flex: none; margin-left: 6px; font-size: var(--fs-1, 13px); font-weight: 500; color: var(--muted); border: 1px solid var(--line); border-radius: 6px; padding: 0 4px; line-height: 1.4; white-space: nowrap; }
/* 9시 줄 이름 옆 알약 = 매집 .it-pl.it-lq(거래 적음 자리) [바꿈: 등급 이름] */
#pePanel .d1-card.c3-on .rl1-nm .c3-lq { display: inline-flex; align-items: center; flex: none; margin-left: 6px; padding: 1px 8px; border-radius: 999px; background: var(--neutral-bg); color: var(--muted);
  font-size: var(--fs-1); font-weight: 400; line-height: 20px; white-space: nowrap; vertical-align: middle; }

/* ---------- 장중 줄: intra3 네모(신호 순간)는 숨기고 지금 네모 · 알약도 지금 것만 ---------- */
#i3Root .it-nr.c3-on .it-tx > .it-cg:not(.c3-cg) { display: none; }
#i3Root .it-nr.c3-on .it-nk > .it-lq:not(.c3-lq) { display: none; }
body #i3Root .it-nr .it-c .it-nov { color: var(--muted); font-weight: 500; }   /* 매집 FIX_BK */

/* 알약 등급 모양 — 매집 거래 적음(회색) · 거래 멈춤(테두리) 그대로 · [내 발명] 조금 비싸게 = 노랑 글 · 비싸게 사짐 = 주황 글 · 30단 넘음 = 테두리(회색) */
#pePanel .c3-lq[data-s="mid"], #i3Root .it-nk .c3-lq[data-s="mid"] { color: #f2c94c; }
#pePanel .c3-lq[data-s="hi"], #i3Root .it-nk .c3-lq[data-s="hi"] { color: #fdb022; }
#pePanel .c3-lq[data-s="stop"], #pePanel .c3-lq[data-s="over"], #i3Root .it-nk .c3-lq[data-s="stop"], #i3Root .it-nk .c3-lq[data-s="over"] { background: transparent; box-shadow: inset 0 0 0 1px var(--muted); }
body.x10[data-theme="light"] #pePanel .c3-lq[data-s="mid"], body.x10[data-theme="light"] #i3Root .it-nk .c3-lq[data-s="mid"] { color: #b88a00; }
body.x10[data-theme="light"] #pePanel .c3-lq[data-s="hi"], body.x10[data-theme="light"] #i3Root .it-nk .c3-lq[data-s="hi"] { color: #b54708; }

/* ---------- 판: 매집 kv2 줄 · 살 수 있음 한 줄(intraday.css 370~378 · 308~309 · service.css tz-kv 값 그대로) ---------- */
#x10Sheet .c3-sh { margin: 4px 0 12px; }
#x10Sheet .c3-sh .tz-kv { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 0; border-top: 1px solid var(--line); font-size: var(--fs-3); }
#x10Sheet .c3-sh .tz-kv > span { flex: none; color: var(--muted); min-width: 0; }
#x10Sheet .c3-sh .tz-kv.it-kv2 > b { display: inline-flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 2px 6px; min-width: 0; font-size: var(--fs-5, 16px); font-weight: 700; color: var(--text); text-align: right; font-variant-numeric: tabular-nums; }
#x10Sheet .c3-sh .tz-kv.it-kv2 .it-lv { display: inline-flex; gap: 2px; margin-right: 0; flex: none; }
#x10Sheet .c3-sh .it-lv i { width: 6px; height: 11px; border-radius: 2px; background: var(--line); }
#x10Sheet .c3-sh .it-lv[data-n="3"] i { background: var(--ok, #22a35a); }
#x10Sheet .c3-sh .it-lv[data-n="2"] i:nth-child(-n+2) { background: #d9a400; }
#x10Sheet .c3-sh .it-lv[data-n="1"] i:nth-child(1) { background: var(--muted); }
#x10Sheet .c3-sh .tz-kv.it-kv2 .it-lvt { font-weight: 700; }
#x10Sheet .c3-sh .it-lvt[data-c="ok"] { color: var(--ok-ink, #1a7f37); }
#x10Sheet .c3-sh .it-lvt[data-c="mid"] { color: #f2c94c; }
#x10Sheet .c3-sh .it-lvt[data-c="low"] { color: var(--muted); }
body.x10[data-theme="light"] #x10Sheet .c3-sh .it-lvt[data-c="mid"] { color: #b88a00; }
#x10Sheet .c3-sh .tz-kv.it-kv2 .it-kvs { font-size: var(--fs-2, 14px); font-weight: 400; color: var(--muted); white-space: normal; word-break: keep-all; }
#x10Sheet .c3-sh .tz-kv.it-kv2 .it-kvs .nw { white-space: nowrap; }
#x10Sheet .c3-sh .tz-kv.it-kv2 .it-kvt { font-size: var(--fs-2, 14px); font-weight: 400; color: var(--muted); }
#x10Sheet .c3-sh .tz-kv.it-kv2 .it-hole { flex: none; font-size: var(--fs-1, 13px); font-weight: 500; color: var(--muted); border: 1px solid var(--line); border-radius: 6px; padding: 0 4px; line-height: 1.4; white-space: nowrap; }
#x10Sheet .c3-sh .it-liq { margin: 2px 0 0; padding: 0; font-size: var(--fs-3); color: var(--text); line-height: 1.55; }   /* 매집 실측 17px · 글 흰색 · 위 선 없음 */
#x10Sheet .c3-sh .it-liq .it-lqb { font-weight: 700; margin-right: 4px; color: var(--muted); }
#x10Sheet .c3-sh .it-liq .it-lqb[data-s="ok"] { color: var(--ok-ink, #1a7f37); }
#x10Sheet .c3-sh .it-liq .it-lqb[data-s="mid"] { color: #f2c94c; }   /* [내 발명 색] */
#x10Sheet .c3-sh .it-liq .it-lqb[data-s="hi"] { color: #fdb022; }    /* [내 발명 색] */
body.x10[data-theme="light"] #x10Sheet .c3-sh .it-liq .it-lqb[data-s="mid"] { color: #b88a00; }
body.x10[data-theme="light"] #x10Sheet .c3-sh .it-liq .it-lqb[data-s="hi"] { color: #b54708; }
#x10Sheet .i3-sh > .tz-kv.c3-x { display: none; }   /* intra3 차트 밑 네 줄 = 위 kv2 로 옮김 */

/* ---------- 바뀐 칸만 깜빡(intra3.css i3-fl 0.6초 · 매집 it-fx-blink 꼴) ---------- */
.c3-cg .c3-fl, .c3-sh .c3-fl { animation: c3-fl .6s ease-out; border-radius: 4px; }
@keyframes c3-fl { 0% { background-color: var(--x-neutral-bg, rgba(127, 127, 127, .25)); } 100% { background-color: transparent; } }
@media (prefers-reduced-motion: reduce) { .c3-cg .c3-fl, .c3-sh .c3-fl { animation: none !important; } }