/* ─────────────────────────────────────────────────────────────────────────
   기록실 — Archive.dc.html 이식.

   ★ 시안 helmet CSS 그대로다. 전역 규칙(html/body/a/스크롤바)만 뺀다 —
     shell.css 가 이미 갖고 있고, 두 번 쓰면 갈라진다.
   ★ 본문 폭 상한·격자·문서 스크롤은 이 파일이 갖는다 — 화면마다 다르다.
   ───────────────────────────────────────────────────────────────────────── */

[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=content]{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden}

[data-r=two]{display:grid;grid-template-columns:minmax(0,440px) minmax(0,1fr)}

[data-r=two2]{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}

[data-r=rcards]{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}

[data-r=rkrow],[data-r=kkut]{grid-template-columns:36px 92px minmax(0,1fr) 120px 72px 84px}

[data-r=evrow]{grid-template-columns:80px 76px 124px 96px minmax(120px,1fr) 84px 108px}

@media (max-width:1100px) and (min-width:761px){[data-r=evrow]{grid-template-columns:72px 0 112px 96px minmax(0,1fr) 80px 100px}[data-r=evrow]>*:nth-child(2){visibility:hidden}}

[data-r=hrow]{grid-template-columns:120px 64px 84px minmax(0,1fr) 72px}

[data-r=trow]{grid-template-columns:90px 70px 90px minmax(0,1fr)}

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

@media (max-width:1100px){[data-r=two],[data-r=two2]{grid-template-columns:minmax(0,1fr)}}

@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],[data-r=dcol]{display:none}
[data-r=main]{display:contents}
[data-r=head]{order:0;height:64px}
[data-r=tabs]{order:1;position:sticky;top:0;z-index:5;overflow-x:auto;scrollbar-width:none}
[data-r=content]{order:2;overflow:visible}
[data-r=rcards]{grid-template-columns:minmax(0,1fr)}
[data-r=rkrow],[data-r=kkut]{grid-template-columns:28px 76px minmax(0,1fr)}
[data-g=ev]{grid-area:ev}[data-g=cards]{grid-area:cards}[data-g=meta]{grid-area:meta}[data-g=res]{grid-area:res}[data-g=res2]{grid-area:res2}
[data-r=evrow]{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"ev cards" "meta cards" "res res2";row-gap:4px!important;padding:12px!important}
[data-r=hrow]{grid-template-columns:minmax(0,1fr) 72px;row-gap:4px!important}
[data-r=trow]{grid-template-columns:70px minmax(0,1fr)}
[data-exp=closed] [data-r=kkut]{display:none!important}
[data-r=more]{display:flex}
[data-r=tabbar]{display:flex}
[data-r=hidem]{display:none}
}

@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}

[data-r=main] [style*="overflow-y: auto"],[data-r=main] [style*="overflow: auto"]{overflow-y:hidden!important;max-height:none!important}

@media (min-width:761px){
[data-r=main]{display:flex;flex-direction:column}
[data-r=main]{padding:16px;gap:12px}
[data-r=main] [style*="background: rgb(15, 17, 19)"],[data-r=main] [style*="background: rgb(12, 13, 15)"]{background:transparent!important}
[data-r=main] [style*="background: rgb(18, 20, 23)"]{background:#181b20!important;border-color:transparent!important}
[data-r=main] [data-r=tabs],[data-r=main] [data-r=content]>div:first-child,[data-r=main] [data-r=two]>div{background:#181b20!important;border:none!important;border-radius:12px;overflow:hidden}
[data-r=two]{gap:12px!important}
[data-r=main] [data-r=content]{display:flex;flex-direction:column;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 이하에서 숨으므로 축약 칩을 대신 띄운다.
   같이 브랜드 글자를 감춰 즐은 헤더에 자리를 만든다 — 로고 마크는 남는다.
   ★ 게임은 이 규칙이 없다. 헤더 아래 펼친 지갑 카드(mwal)가 같은 것을 보여준다
     (2026-09-26 디자인: 「모바일은 모든 화면에서 잔고가 보이고, 게임만 펼친 형태」). */
@media (max-width:760px){[data-r=mbal]{display:flex!important}[data-r=hbname]{display:none!important}}

/* ★ 머리는 본문을 내려도 따라온다(시안). 이 한 줄이 없으면 모바일에서
   잔고 칩과 메뉴가 스크롤과 같이 사라진다 — 이식 때 생성기가 전역 규칙로 오해해
   버렸던 것을 되살렸다. 게임은 바깥이 100vh 라 필요 없다. */
[data-r=head]{position:sticky;top:0;z-index:40}

/* ★ 더보기 시트는 모바일 것이다. 데스크톱은 왼쪽 메뉴가 있어서 필요 없다. */
@media (min-width:761px){[data-r=moresheet]{display:none!important}}

/* ── 흐름 성향(시안 §19.40) — 계기판 줄 · 지속률 줄 · 모바일 순서 A → B → D → C */
[data-r=grow]{grid-template-columns:120px 72px minmax(0,1fr) 72px}
[data-r=prow]{grid-template-columns:120px 56px 110px minmax(0,1fr) 56px 128px}
@media (max-width:760px){
[data-r=trendwrap] [data-r=tD]{order:3}[data-r=trendwrap] [data-r=tC]{order:4}
[data-r=gval]{display:none}[data-r=grow]{grid-template-columns:92px minmax(0,1fr) 64px;gap:8px}
[data-r=prow]{grid-template-columns:minmax(0,1fr) 44px 92px 76px;gap:8px}[data-r=pbar]{display:none!important}[data-r=prow]>:nth-child(5){display:none}
[data-r=strip]>button{flex:0 0 56px!important}
}