/* ─────────────────────────────────────────────────────────────────────────
게임 화면 — 시안(Seotda Game.dc.html) helmet CSS 를 그대로 옮긴 것.
★ 손대지 않는다. 시안이 기준이고(CLAUDE.md §7) 여기서 값을 바꾸면
시안과 화면이 갈라진다. 바꿔야 하면 시안을 먼저 고친다.
★ 셸(헤더·왼쪽 메뉴·격자)은 shell.css 가 갖는다 — 게임 밖 화면도 같은 셸을
쓰기 때문이다. 이 파일은 게임 화면에만 있는 것만 담는다.
★ [data-r=hname] 은 딜러의 족보 이름이다. 헤더 브랜드는 [data-r=hbname] 이라
더 이상 겹치지 않는다(2026-09-26 시안이 이름을 갈랐다).
───────────────────────────────────────────────────────────────────────── */
[data-r=hname]{font-size:47px}
[data-r=bead]{display:flex;flex-direction:column}
[data-r=botpicks]{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center}
[data-r=botrows]{flex:none}
[data-r=chat]{display:flex;flex-direction:column;flex:1;min-height:0}
[data-r=tnum]{font-size:30px}
[data-r=dealer]{flex:1 1 auto;min-height:330px}
[data-r=beadbox]{flex:none;height:auto;container-type:inline-size;--bc:18}
[data-r=beadgrid]{grid-auto-columns:0}
[data-old="1"]{display:none!important}
[data-r=lset]{gap:5px!important}
[data-r=betwrap]{max-width:860px;width:100%;margin:0 auto;box-sizing:border-box}
[data-r=ptg]{display:none}
@media (min-width:761px) and (max-height:800px){
[data-r=lset]{gap:4px!important;padding:6px 12px!important}
[data-r=lset] [style*="height: 32px"],[data-r=lset] [style*="height: 34px"]{height:27px!important}
[data-r=lset] [style*="height: 30px"]{height:26px!important}
[data-r=lset] [style*="grid-template-rows: 30px 30px"]{grid-template-rows:26px 26px!important}
[data-r=lset] [style*="height: 26px"]{height:22px!important}
[data-r=streakgrid]{grid-template-rows:22px 22px!important}
[data-r=patsel],[data-r=pst],[data-r=patseed]{display:none!important}
[data-r=ptg]{display:inline}
[data-r=beadbox]{--bc:30}
[data-old="1"]{display:flex!important}
[data-r=pnl]{grid-template-columns:26px minmax(0,1fr) 26px minmax(0,1fr) 62px!important;grid-template-rows:26px!important;gap:4px!important}
[data-r=pnlx]{display:none}
[data-r=lbal] [style*="font-size: 22px"]{font-size:17px!important}
[data-r=lbal] [style*="font-size: 18px"]{font-size:15px!important}
[data-r=lbal] [style*="padding: 3px 12px"]{padding:1px 12px!important}
[data-r=botpicks]{padding-top:4px!important;padding-bottom:4px!important;gap:2px!important}
[data-r=botpicks] [style*="height: 28px"]{height:24px!important}
[data-r=botbar]{justify-content:flex-start}
[data-r=botbtn]{min-width:26px!important;height:26px!important;border-radius:13px!important;font-size:10.5px!important}
[data-r=bead]{padding:6px 12px!important}
[data-r=gametop]{padding-top:6px!important;padding-bottom:6px!important}
[data-r=dealer]{min-height:230px!important}
[data-r=hcard]{width:76px!important;height:118px!important}
[data-r=hcardh]{height:118px!important}
[data-r=status]{padding-top:6px!important}
[data-r=mystat]{padding:6px 12px!important}
[data-r=mystat] [style*="padding: 9px 11px"]{padding:6px 9px!important}
}
[data-r=arc]{top:14px}
[data-r=shoe]{top:34px;right:78px;transform:rotate(-10deg) scale(.72)}
[data-r=felt]{background-image:url("data:image/svg+xml;utf8,")}
[data-r=hcard]{width:94px;height:146px}
[data-r=hcardh]{height:146px}
[data-r=winb]{min-width:170px;padding:8px 20px}
[data-r=winb] b{font-size:24px}
[data-r=slabel]{font-size:28px}
[data-r=sbadge]{font-size:19px;padding:4px 7px}
[data-r=sidegap]{gap:30px}
[data-r=timer]{width:88px;height:88px}
[data-r=bigroad]{width:100%;aspect-ratio:22/6;grid-template-columns:repeat(22,1fr);grid-template-rows:repeat(6,1fr);background-size:calc(100% / 22) calc(100% / 6)}
/* 한 글자 버튼은 정원, 「수동」은 알약 — 지름은 height 와 aspect-ratio 가 만든다.
★ width 를 주지 않는다. 주면 인라인 min-width:44px(수동)를 눌러 알약이 안 된다. */
[data-r=botbtn]{min-width:28px;height:28px;border-radius:14px!important;flex:none!important}
[data-r=botbar]{flex:1 1 0;min-width:max-content;flex-wrap:nowrap;justify-content:flex-end;align-items:center;align-self:center}
@media (max-width:760px){
[data-r=hname]{font-size:18px}
[data-r=rail],[data-r=botpicks],[data-r=deskonly]{display:none}
[data-r=botbar]{order:1}
[data-r=gametop]{order:2}
[data-r=dealer]{order:3}
[data-r=status]{order:4}
[data-r=betwrap]{order:5}
[data-r=gametop]{padding:8px 10px!important;gap:6px!important}
[data-r=tog]{padding:0 7px!important}
[data-r=livedot],[data-r=autoicon]{display:none}
[data-r=gtitle]{font-size:14px!important}
[data-r=autobtn]{padding:0 10px!important;font-size:12px!important}
[data-r=left],[data-r=chat]{position:absolute;left:0;right:0;bottom:0;height:82%;z-index:40;transform:translateY(102%);transition:transform .25s ease;border:1px solid #2e3339;border-bottom:0;border-radius:16px 16px 0 0}
[data-sheet=auto] [data-r=left],[data-sheet=chat] [data-r=chat]{transform:none}
[data-sheet=auto] [data-r=scrim],[data-sheet=chat] [data-r=scrim]{display:block}
[data-r=modal]{padding:12px!important}
[data-r=tnum]{font-size:19px}
/* ★ !important 가 있어야 한다 — 「베팅내역」 링크가 인라인 display:flex 를
갖고 있어서 그것 없이는 모바일에서 안 숨고, 게임 상단이 두 줄로
밀려 한 화면을 넘긴다. */
[data-r=hidem]{display:none!important}
[data-r=dealer]{flex:none;height:204px;min-height:0}
/* ★ 결과(족보 이름 · 승패 배너)가 보이게 하는 자리 잡기 — 2026-09-26 시안.
무대를 204 로 줄이고 카드·이름·뷰지를 줄여 아래에 글자 들어갈 틈을 낸다. */
[data-r=sidegap]{top:44px!important}
[data-r=bgrid]{aspect-ratio:620/190!important}
[data-r=sidegap]>*>*{gap:6px!important}
[data-r=sidegap]{align-items:stretch!important;bottom:8px!important}
[data-r=sidegap] [data-r=hname]{margin-top:2px}
[data-r=dbl],[data-r=dbr]{top:6px!important;height:20px!important;padding:0 7px!important;font-size:10.5px!important;gap:4px!important}
[data-r=dbl] *,[data-r=dbr] *{font-size:10.5px!important}
[data-r=dbl]{left:6px!important}[data-r=dbr]{right:6px!important}
[data-r=beadbox]{height:87px}
[data-r=arc]{top:10px}
[data-r=shoe]{top:6px;right:78px;transform:rotate(-10deg) scale(.56)}
[data-r=hcard]{width:58px;height:91px}
[data-r=hcardh]{height:91px}
[data-r=winb]{min-width:96px;padding:5px 10px}
[data-r=schipL],[data-r=schipR]{width:22px!important;height:22px!important;top:-15px!important;font-size:8px!important}
[data-r=schipL]{right:auto!important;left:-13px!important}
[data-r=schipR]{right:-13px!important}
[data-r=tiechip]{top:-18px!important;transform:translateX(-50%)!important}
[data-r=betwrap]{padding-top:20px!important}
[data-r=winb] b{font-size:15px}
[data-r=winb] span{font-size:10px!important}
[data-r=slabel]{font-size:18px}
[data-r=sbadge]{font-size:13px;padding:3px 5px}
[data-r=sidegap]{gap:10px}
[data-r=timer]{width:54px;height:54px}
[data-r=bigroad]{aspect-ratio:22/6;grid-template-rows:repeat(6,1fr);background-size:calc(100% / 22) calc(100% / 6)}
[data-r=botbar]{display:none!important}
}
@media (min-width:761px) and (max-height:800px){
[data-r=betwrap]{max-width:560px!important}
}
@media (min-width:761px){
[data-r=bead]{display:none!important}
}
@media (min-width:761px) and (max-height:800px){
[data-r=logrow]{height:21px!important;font-size:11.5px!important}
}
/* ── 시안 Revision-6·7 (2026-09-29) ─────────────────────────────────────
★ 봇통계 버튼은 중앙 상단바로 옮겼다 — 좁은 폭에서는 글자를 숨기고 아이콘만(시안 그대로).
★ 단계 설정 팝업(P/B·사이드) 모바일: 두 열 대신 「현재 | 추천」 탭. */
@media (min-width:761px) and (max-width:1420px){
[data-r=bstxt]{display:none}
}
@media (max-width:760px){
[data-r=modal]{padding:0!important}
[data-r=modal]>div{max-width:none!important;height:100%!important;border-radius:0!important;border:none!important}
[data-r=pbtabs]{display:flex!important}
[data-r=pbsums]{grid-template-columns:1fr!important}
[data-r=pbgrid]{grid-template-columns:56px minmax(0,1fr) minmax(0,1fr)!important}
[data-r=ac]{display:none!important}
[data-tab=cur] [data-r=sdgrid]{grid-template-columns:48px repeat(3,minmax(0,1fr))!important}
[data-tab=rec] [data-r=sdgrid]{grid-template-columns:48px repeat(2,minmax(0,1fr))!important}
[data-tab=cur] [data-r=rc],[data-tab=cur] [data-r=recsum],
[data-tab=rec] [data-r=cc],[data-tab=rec] [data-r=cursum]{display:none!important}
}
/* ── 시안에 없는 것 — 우리 폼이 필요로 하는 최소한만 ────────────────────
★ 시안은 입력칸이 전부 표시용 div 다(목업이라 값이 안 바뀐다).
우리는 실제로 저장해야 하므로 같은 자리에 input/select 를 두고
생김새만 시안의 div 와 맞춘다. */
[data-a=fld] {
height: 30px; width: 100%; min-width: 0;
border: 1px solid #2e3339; border-radius: 6px; background: #0f1113;
color: #e6e8ea; font-family: 'Space Grotesk',Pretendard,system-ui,sans-serif; font-size: 13px;
font-weight: 600; padding: 0 10px; outline: none;
}
[data-a=fld]:focus { border-color: #3f82e0; }
/* 시안의 「div + chevron」 과 같은 모양의 네이티브 select */
/* ★ `betmethod` 는 원래 `pick` 이었다 — 추천표 이식하며 이름을 바꾸면서 다크 스타일이
빠져 이 콤보만 흰 배경으로 남았다(2026-09-26 Lewis 지적). 같은 규칙을 준다. */
[data-a=pick],
[data-a=betmethod] {
height: 32px; min-width: 0;
border: 1px solid #2e3339; border-radius: 6px; background-color: #171a1e;
color: #e6e8ea; font-size: 13px; font-family: inherit;
padding: 0 20px 0 10px; outline: none; cursor: pointer;
appearance: none; -webkit-appearance: none;
background-repeat: no-repeat; background-position: right 7px center;
background-image: url("data:image/svg+xml;utf8,");
}
[data-a=pick][data-sm],
[data-a=betmethod][data-sm] { height: 26px; font-size: 12.5px; padding: 0 18px 0 9px; }
/* 단계 설정 모달 */
[data-a=stagemodal]:not([hidden]) { display: flex; }
[data-a=stagemodal][hidden] { display: none; }
[data-r=stagegrid] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
[data-a=stage] {
width: 100%; min-width: 0; height: 28px;
border: 1px solid #2e3339; border-radius: 5px; background: #0f1113;
color: #e6e8ea; font-family: 'Space Grotesk',Pretendard,system-ui,sans-serif; font-size: 12px;
text-align: right; padding: 0 7px; outline: none;
}
@media (max-width: 760px) {
[data-r=stagegrid] { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
/* 저장 버튼 */
[data-a=save] {
height: 34px; border: none; border-radius: 6px;
background: #e6e8ea; color: #0c0d0f; font-size: 13px; font-weight: 700; cursor: pointer;
}
[data-a=txt] {
height: 32px; width: 100%; border: 1px solid #2e3339; border-radius: 6px;
background: #0f1113; color: #e6e8ea; font-size: 13px; padding: 0 10px; outline: none;
}
/* ── 모바일 게임 홈 — 한 화면에 들어간다 (2026-09-26 시안 §19.10) ──────────
★ 맨 윗자리 하나를 둘이 나눠 쓴다. 기본은 30초 안내 카드, 「오늘 그만」을
누른 날은 잔액·총베팅 두 칸. 어느 쪽인지는 game.js 가 정한다.
★ 펼친 지갑 카드(mwal)와 내 적중률 카드(mystat)는 접는다 — 잔고는 헤더
축약 칩(mbal)이 대신한다. 두 칸을 다 두면 한 화면을 넘긴다.
★ 헤더 브랜드는 hbname, 딜러 족보 이름은 hname 이다. 한때 둘 다 hname 이라
모바일에서 브랜드를 감추면 「갑오·망통」까지 사라졌는데, 2026-09-26 시안이
헤더 쪽 이름을 hbname 으로 갈라서 해결됐다. 다시 합치지 말 것. */
@media (max-width: 760px) {
[data-r=mwal], [data-r=mystat] { display: none !important; }
[data-r=tip30] { display: flex; order: 0; }
[data-r=mbalrow] { display: flex; order: 0; }
[data-r=mbal] { display: flex !important; }
[data-r=hbname] { display: none !important; }
}
/* ★ 더보기 시트는 모바일 것이다. 데스크톱은 왼쪽 메뉴가 있어서 필요 없다. */
@media (min-width:761px){[data-r=moresheet]{display:none!important}}
/* ★ 「저장필요」 강조 — 원본 `.ab-btn-save.dirty`(791~793) 그대로.
설정을 고쳐놓고 저장을 안 누르면 다음 판에 옛 값으로 걸린다. 눈에 띄어야 한다.
원복 버튼도 함께 깜빡인다(원본 2026-09-07 운영자 지시). */
@keyframes abSaveBlink { 0%,100% { opacity: 1 } 50% { opacity: .45 } }
[data-a="save"].is-dirty,
[data-a="revert"].is-dirty {
background: #FFD54F !important;
border-color: #FFD54F !important;
color: #1a1a1a !important;
font-weight: 800;
animation: abSaveBlink 1s ease-in-out infinite;
}
/* ★ 텍스트 선택 금지 — 원본 `.ab-panel-grid`(631~632) 그대로.
칩·존·버튼을 드래그하면 글자가 통째로 파랗게 잡혀 조작이 지저분해진다.
입력칸만 선택을 허용한다(값을 고쳐 써야 하므로). */
[data-r=grid] { user-select: none; -webkit-user-select: none; }
[data-r=grid] input,
[data-r=grid] textarea { user-select: text; -webkit-user-select: text; }
/* 드래그 중인 칩 고스트 — 원본 `.ab-chip-dragging`. */
.chip-dragging {
transform: translate(-50%, -50%) scale(1.08);
opacity: .9;
z-index: 9999;
filter: drop-shadow(0 6px 12px rgba(0,0,0,.6));
}
/* 베팅내역 요약 여섯 칸 — 좁으면 세 칸씩 두 줄(시안 hsum) */
@media (max-width:1060px){[data-r=hsum]{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
/* ── 시안 §19.19 · §19.20 (2026-09-29) — 좌패널 컨트롤 26 · 베팅 3칸 패널 · 저장 줄 ──────────
★ 시안 CSS 는 React 가 풀어 쓴 인라인 스타일(`height: 32px`)을 잡는다. 우리 마크업은 서버가 쓴
그대로(`height:32px`)이고 셀렉트·입력칸은 클래스(data-a)로 높이를 받으므로 같은 뜻으로 옮겼다.
★ 단계 설정 팝업은 우리 폼 안(lset 안)에 있다 — 시안에서는 밖이라 이 규칙을 안 받는다. 그래서 뺀다. */
@media (min-width:761px){
[data-r=lset] [style*="height:32px"]:not([data-r=modal] *),
[data-r=lset] [style*="height:30px"]:not([data-r=modal] *),
[data-r=lset] [data-a=pick]:not([data-sm]):not([data-r=modal] *),
[data-r=lset] [data-a=betmethod]:not([data-r=modal] *),
[data-r=lset] [data-a=fld]{height:26px!important;font-size:12.5px!important}
[data-r=lset] [style*="grid-template-rows:30px 30px"]{grid-template-rows:26px 26px!important}
[data-r=lset] [style*="repeat(5,30px)"]{grid-template-columns:minmax(0,1fr) repeat(5,26px)!important}
[data-r=lset]{gap:5px!important}
[data-r=savebar] > *{height:34px!important;font-size:13px!important}
}
@media (min-width:761px) and (max-height:800px){
[data-r=lset] [data-r=pnl][data-r=pnl]{grid-template-rows:26px!important}
[data-r=savebar] > *{height:27px!important}
[data-r=betpanel]{padding:6px!important;gap:4px!important}
[data-r=pathead]{padding-bottom:4px!important}
}
/* 진행배너 글자 — 배너를 꽉 채우게 22px(2026-09-29 Lewis 「배너에 꽉차게 크게」, 원본 배너도 20px 굵게).
짧은 화면 · 모바일은 긴 안내 문구가 두 줄로 늘어 화면을 밀지 않게 줄인다. */
@media (min-width:761px) and (max-height:800px){ [data-game=status]{font-size:18px!important} }
@media (max-width:760px){ [data-game=status]{font-size:16px!important} }
/* §19.49 프리셋 1~4 — 인라인 display:flex 가 [hidden] 을 이기므로 따로 끈다 · 좁으면 「프리셋」 글자만 숨긴다 */
[data-a=preset-confirm][hidden],[data-a=preset-runnote][hidden]{display:none!important}
@media (max-width:760px){[data-r=plab]{display:none}}
/* ── 시안 §19.49b 게임 태블릿 폭 (2026-10-01) ─────────────────────────────
★ 761~1099 좌·우 패널 260/280, 761~899 240/250(바깥 여백 0, 중앙이 나머지) · 761~1099 머리 「프리셋」 글자 숨김(§19.49c).
레일 자동 접기(761~1399)는 shell.js railForced.
★ 좁은 중앙은 컨테이너 쿼리(ctr = [data-r=center]) — 봇픽 줄 이름표(botlab·botrate·botwl·beads·bead1)는 game.js 가 단다. */
@media (min-width:761px) and (max-width:1099px){[data-r=grid]{grid-template-columns:var(--rail,68px) 0 260px minmax(0,1fr) 280px 0!important}}
@media (min-width:761px) and (max-width:1099px){[data-r=plab]{display:none!important}}
@media (min-width:761px) and (max-width:899px){[data-r=grid]{grid-template-columns:var(--rail,68px) 0 240px minmax(0,1fr) 250px 0!important}}
@media (min-width:761px){
[data-r=center]{container-type:inline-size;container-name:ctr}
@container ctr (max-width:600px){
[data-r=beads]{gap:4px!important}
[data-r=bead1]{width:18px!important;height:18px!important;font-size:9.5px!important}
}
@container ctr (max-width:560px){
[data-r=botwl]{display:none!important}
[data-r=botlab]{width:54px!important;font-size:11.5px!important}
[data-r=botrate]{width:44px!important;font-size:12px!important}
[data-r=beads]{gap:3px!important}
[data-r=bead1]{width:16px!important;height:16px!important;font-size:8.5px!important}
[data-r=botrows]>div{gap:6px!important}
[data-r=nextpick]{width:22px!important;height:22px!important;font-size:12px!important}
[data-r=hname]{font-size:30px!important}
[data-r=slabel]{font-size:18px!important}
[data-r=sbadge]{font-size:13px!important;padding:2px 5px!important}
[data-r=hcard]{width:58px!important;height:90px!important}
[data-r=hcardh]{height:90px!important}
[data-r=sidegap]{gap:14px!important}
[data-r=dbl],[data-r=dbr]{font-size:10.5px!important;height:20px!important;padding:0 6px!important;top:6px!important}
[data-r=dbl]{left:6px!important}[data-r=dbr]{right:6px!important}
}
@container ctr (max-width:420px){
[data-r=sidegap]{gap:6px!important}
[data-r=hcard]{width:44px!important;height:69px!important}
[data-r=hcardh]{height:69px!important}
[data-r=hname]{font-size:22px!important}
[data-r=slabel]{font-size:15px!important}
[data-r=sbadge]{font-size:11px!important}
[data-r=timer]{transform:scale(.8)}
[data-r=sidegap]>*>div:nth-child(2){gap:4px!important}
}
@container ctr (max-width:380px){
[data-r=chips]{flex-wrap:wrap;row-gap:4px;gap:4px!important}
[data-r=chips]>*{min-width:24px!important;min-height:24px!important}
[data-r=chips] button,[data-r=chips] span{min-width:24px!important;min-height:24px!important}
[data-r=botrate]{display:none!important}
[data-r=bead1]:nth-child(-n+3){display:none!important}
}
@container ctr (max-width:300px){
[data-r=status]{padding:6px 10px 0!important}
[data-r=banno]{font-size:13px!important;padding:1px 6px!important;margin-right:8px!important}
[data-r=bantext]{display:block!important;font-size:13px;line-height:30px!important;min-height:30px!important;padding:0 10px!important;white-space:nowrap!important;overflow:hidden!important}
[data-r=sidegap]{gap:4px!important}
[data-r=hcard]{width:34px!important;height:53px!important}
[data-r=hcardh]{height:53px!important}
[data-r=hname]{font-size:16px!important}
[data-r=slabel]{font-size:12px!important}
[data-r=sbadge]{font-size:10px!important;padding:2px 4px!important}
[data-r=timer]{transform:scale(.62)}
[data-r=sidegap]>*>div:nth-child(2){gap:3px!important}
[data-r=bead1]:nth-child(-n+5){display:none!important}
[data-r=bead1]{width:14px!important;height:14px!important;font-size:8px!important}
}
}
/* ── 시안 §19.49d 태블릿 좌패널 칸 안 글자 잘림 (2026-10-01) ────────────────
★ 761~1099: 수익 · 손실 · 배율 두 줄(높이 압축 규칙보다 우선) · P/B 방식 콤보를 추천 1~5 위 한 줄로 ·
사이드 진행 줄은 상태 글자 · 판수를 숨기고 대상 이름을 남긴다.
★ pbsel 은 셀렉터를 세 번 겹쳤다 — 우리 CSS 의 높이 압축 규칙 [data-r=lset] [style*="repeat(5,30px)"] 가
더 강해서(시안은 그 규칙이 공백 차이로 안 걸린다) 그대로 두면 800×700 에서 시안과 달라진다. */
@media (min-width:761px) and (max-width:1099px){
[data-r=pnl][data-r=pnl][data-r=pnl]{grid-template-columns:32px minmax(0,1fr) 72px!important;grid-template-rows:26px 26px!important;gap:4px 8px!important}
[data-r=pnl] [data-r=pnlx]{display:block!important}
[data-r=pbsel][data-r=pbsel][data-r=pbsel]{grid-template-columns:repeat(5,minmax(0,1fr))!important}
[data-r=pbsel]>select{grid-column:1 / -1}
[data-r=sprow][data-r=sprow]{grid-template-columns:minmax(0,1fr) auto auto!important;gap:6px!important;padding:0 7px!important}
[data-r=sprow] [data-r=pst]{display:none!important}
[data-r=sprow] [data-r=ptg]{display:block!important}
}
@media (min-width:761px) and (max-width:1099px){[data-r=sprow] [data-r=ptrig]{display:none}}
@media (min-width:761px) and (max-width:899px){[data-r=sprow][data-r=sprow]{gap:4px!important;padding:0 5px!important}[data-r=sprow] [data-r=ptg] button{margin-right:3px!important;padding:0 3px!important}}
/* ── 봇픽 줄 깜빡임 — 원본 wslobbyWeb.html 그대로(2026-10-01 Lewis 승인) ─────────────
★ 새 픽 원: botBlink 0.8s 4회(.bot-circle-pending) · 순위 모드 따라가는 봇이 바뀐 줄: 0.35s 3회(.ab-rank-blink).
game.js blinkOnce 가 data-blink 를 붙였다 뗀다. */
@keyframes sdBotBlink{0%,100%{opacity:1}50%{opacity:.25}}
[data-blink=pick]{animation:sdBotBlink .8s ease-in-out 4}
[data-blink=rank]{animation:sdBotBlink .35s ease-in-out 3}
/* §19.50 내 베팅 기록 — 직전 결과 줄이 들어올 때 결과색으로 한 번 흐려진다(1.2s, 끝 색 = 머무는 배경 #15181c). game.js markTopLog */
@keyframes sdLogWin{from{background-color:rgba(95,212,154,.15)}to{background-color:#15181c}}
@keyframes sdLogLose{from{background-color:rgba(240,138,127,.15)}to{background-color:#15181c}}
/* §19.56 휴대폰 승리 배너 — 두 줄을 한 줄로(「승리했습니다! +20,000」) 낮춰 딜링 무대 안에 다 들어오게(전엔 아래 15px 잘림) */
@media (max-width:760px){[data-r=winb]{flex-direction:row!important;align-items:baseline!important;gap:6px!important;padding:3px 10px!important;min-width:0!important;top:-2px!important}[data-r=winb] span{font-size:11px!important}[data-r=winb] b{font-size:15px!important;line-height:1.2}}
/* §19.57 게임 화면 숫자 = Space Grotesk — 공용 헤더 칩은 var(--sd-num, JetBrains Mono) 라 게임에서만 바뀐다 */
:root{--sd-num:'Space Grotesk',Pretendard,system-ui,sans-serif}
/* §19.57 수익 배지 — 데스크탑 1400 이상에서만 13(1px 크게) */
@media (min-width:1400px){[data-r=dbl]{font-size:13px!important}}
/* §19.58 휴대폰 — 「섯다 바카라」 숨김 · 위 줄 한 줄(연결 점 · 순위 버튼 2 · 오토 · 톱니) */
@media (max-width:760px){[data-r=gtitle]{display:none!important}[data-r=gametop]{flex-wrap:nowrap!important;gap:6px!important;padding:8px 10px!important}[data-r=gametop]>*{min-width:0}[data-r=rankbtns]{gap:4px!important}[data-r=rankbtns] button{padding:0 7px!important}}
/* §19.59 30초 해설 — 휴대폰은 바텀시트 */
@media (max-width:760px){[data-r=tipbg]{align-items:flex-end!important;padding:0!important}[data-r=tipsheet]{max-width:none!important;border-radius:16px 16px 0 0!important;border-bottom:none!important;max-height:92vh!important}}
/* §19.59 인라인 display 가 [hidden] 을 이기므로 따로 끈다 */
[data-game=tipbg][hidden],[data-game=tipnodata][hidden],[data-game=tipdata][hidden],[data-game=tipwhy][hidden],[data-game=tipwin][hidden],[data-game=tippay][hidden],[data-game^=tipname-][hidden]{display:none!important}
/* §19.62 빅로드 머리 땡 건수 — 좁은 폭은 「땡」 글자(tlab) 숨기고 아이콘 + 숫자 */
@container (max-width:300px){[data-r=tlab]{display:none}}
@media (max-width:760px){[data-r=road]>div:first-child{gap:7px!important;font-size:11.5px!important;flex-wrap:nowrap}[data-r=tlab]{display:none}}
@media (min-width:761px) and (max-width:1099px){[data-r=tlab]{display:none}}
/* §19.63 사이드만 얹었을 때 안내 — 나타남 · 휴대폰 크기 · 인라인 display 가 [hidden] 을 이기므로 따로 끈다 */
@keyframes sn-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
@media (max-width:760px){[data-r=sidenote]{font-size:11.5px!important;padding:6px 10px!important;top:4px!important}}
[data-game=sidenote][hidden]{display:none!important}