/* ─────────────────────────────────────────────────────────────────────
   홈 — Home.dc.html 이식(시안 §19.73).

   ★ 시안 helmet CSS 그대로다. 전역 규칙(html/body/a/스크롤바)만 뺀다 — shell.css 가 이미 갖고 있다.
   ★ 홈만의 규칙은 맨 아래 두 덩어리(hstats · hmid · hbot · home · hbal)다. 나머지는 다른 화면과 같은 셸 틀.
   ───────────────────────────────────────────────────────────────────── */

[data-r=grid]{display:grid;height:100%;grid-template-columns:var(--rail,212px) minmax(0,1fr);grid-template-rows:56px minmax(0,1fr);grid-template-areas:"rail head" "rail main"}

[data-r=grid]{grid-template-columns:var(--rail,212px) minmax(0,1fr) minmax(0,1280px) minmax(0,1fr);grid-template-areas:"head head head head" "rail . main ."}

[data-r=grid]{--hh:56px}

[data-r=main]{grid-area:main;display:flex;flex-direction:column;min-height:0;overflow:hidden}

[data-r=tabbar]{display:none}

@media (max-width:760px){
[data-r=grid]{display:flex;flex-direction:column;overflow-y:auto;padding-bottom:78px}
[data-r=grid]>*{flex-shrink:0}
[data-r=rail]{display:none}
[data-r=main]{display:contents}
[data-r=head]{order:0;height:64px}
[data-r=home]{order:2}
[data-r=tabbar]{display:flex}
}

@media (max-width:760px){[data-r=htog]{display:none!important}}

[data-shell=page]{height:auto!important;min-height:100vh;overflow:visible!important}

[data-r=grid]{height:auto!important;min-height:100vh}

[data-r=main]{overflow:visible!important;min-height:0!important}

@media (min-width:761px){
[data-r=main]{display:flex;flex-direction:column}
[data-r=main]{padding:16px;gap:12px}
}

@keyframes conn-pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.8)}}

[data-r=rail] [data-r=mi]{transition:background .12s}

[data-r=rail] [data-r=mi]:hover{background:#23282e!important}

[data-r=rail] [data-r=mi]:hover a,[data-r=rail] a[data-r=mi]:hover{color:#e6e8ea!important}

@media (max-width:1100px){[data-r=conn]{display:none!important}}

@media (max-width:760px){[data-r=dwal]{display:none!important}}

/* ★ 모바일 잔고 축약 칩 — 다른 화면과 같다(데스크톱 칩 dwal 이 760 이하에서 숨는다) */
@media (max-width:760px){[data-r=mbal]{display:flex!important}[data-r=hbname]{display:none!important}}

/* ★ 머리는 본문을 내려도 따라온다(시안) */
[data-r=head]{position:sticky;top:0;z-index:40}

@media (min-width:761px){[data-r=moresheet]{display:none!important}}

/* ── 홈 §19.73 ─────────────────────────────────────────────────────────
   ≤1100 숫자 카드 2열(선그래프 한 줄 전체) · 가운데/아래 1열 / ≤760 한 열 · 잔고 두 칸 */
@media (max-width:1100px){[data-r=hstats]{grid-template-columns:repeat(2,minmax(0,1fr))!important}[data-r=hspark]{grid-column:1 / -1}[data-r=hmid],[data-r=hbot]{grid-template-columns:1fr!important}}
@media (max-width:760px){[data-r=home]{padding:10px!important;gap:10px!important}[data-r=hbal]{width:100%;display:grid!important;grid-template-columns:1fr 1fr}[data-r=hbal]>div{min-width:0}}

/* 시안 style-hover — 봇 줄 · 희귀패 · 오늘 통계 · 목록 줄 */
[data-r=hbotrow]:hover{background:#1f2328}
[data-r=hrare]:hover,[data-r=hlink]:hover{background:#1b1f24!important}
/* 인라인 display 가 [hidden] 을 이기므로 홈 안에서는 따로 끈다(공지 없음 · 등급 없음 · 관리 링크 등) */
[data-r=home] [hidden]{display:none!important}

/* §19.73b 족보 출현 — 휴대폰은 이론 · 마지막 숨김(시안 helmet 그대로) */
@media (max-width:760px){[data-r=jkx]{display:none!important}[data-r=jkrow]{grid-template-columns:22px 62px minmax(40px,1fr) 92px!important}}

/* §19.73d 봇 순위 — 휴대폰은 승패 숨김 · 구슬 최근 6칸(앞 4칸 숨김) */
@media (max-width:760px){[data-r=hbotwl]{display:none!important}[data-r=hbead][data-m=hide]{display:none!important}}   /* 구슬은 인라인 display:flex 라 !important */
/* 휴대폰 한 줄에 들어가게 — 간격 6 · 구슬 18 · 구슬 간격 3 · 순위 14 · 이름 54 · 승률 42 (360 에서 290px) */
/* 시안 §19.73d — 구슬 간격 --bq = clamp(3px, (카드 폭 − 370) / 50, 8px) · 휴대폰 3 */
[data-r=hbotrow]{--bq:clamp(3px,calc((100cqw - 370px) / 50),8px)}
@media (max-width:760px){[data-r=hbotrow]{grid-template-columns:14px minmax(54px,1.1fr) minmax(42px,1fr) auto!important;column-gap:6px!important;padding:0 2px!important;--bq:3px}[data-r=hbead]{width:18px!important;height:18px!important}}
/* 봇 줄 간격이 카드 폭을 따라간다(cqi) — 지금 테이블 카드가 기준 */
[data-id=table]{container-type:inline-size}