/* BACCA 대시보드 */
:root{
  --bg:#0a0e14; --panel:#121823; --panel2:#1a2230; --line:#222c3a;
  --text:#e6edf3; --text2:#8b98a8; --text3:#5c6776;
  --red:#e5484d; --blue:#3b82f6; --green:#22c55e; --gold:#f5b301; --accent:#22d3a8;
  --hd:56px;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font-family:-apple-system,'Segoe UI','Pretendard',Roboto,'Noto Sans KR',sans-serif;-webkit-font-smoothing:antialiased}
#app{height:100dvh;display:flex;flex-direction:column;overflow:hidden}
.boot{padding:40px;text-align:center;color:var(--text2)}
button{font-family:inherit;cursor:pointer}

.topbar{min-height:var(--hd);flex-shrink:0;display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:8px 16px;background:var(--panel);border-bottom:1px solid var(--line)}
.logo{font-weight:900;font-size:18px;letter-spacing:1px;background:linear-gradient(135deg,#22d3a8,#3b82f6);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.logo small{font-weight:600;font-size:11px;color:var(--text3);-webkit-text-fill-color:var(--text3);margin-left:6px;letter-spacing:0}
.live-dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 8px var(--green);animation:pulse 1.6s infinite}
@keyframes pulse{50%{opacity:.4}}
.topbar .right{margin-left:auto;font-size:12px;color:var(--text2)}

.main{flex:1;display:flex;min-height:0}
.rooms{width:300px;flex-shrink:0;background:var(--panel);border-right:1px solid var(--line);overflow-y:auto}
.room{padding:12px 14px;border-bottom:1px solid var(--line);cursor:pointer;transition:background .12s}
.room:hover{background:var(--panel2)}
.room.on{background:var(--panel2);box-shadow:inset 3px 0 0 var(--accent)}
.room-top{display:flex;align-items:center;gap:7px;margin-bottom:7px}
.room-name{font-weight:700;font-size:14px}
.st-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.st-observing{background:var(--green);box-shadow:0 0 6px var(--green)}
.st-error,.st-idle{background:var(--text3)}
.room-meta{margin-left:auto;font-size:11px;color:var(--text3)}
.trail{display:flex;gap:3px;flex-wrap:wrap}
.dot{width:16px;height:16px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:9px;font-weight:800;color:#fff;flex-shrink:0}
.dot.B{background:var(--red)} .dot.P{background:var(--blue)} .dot.T{background:var(--green)}
.cnts{display:flex;gap:8px;margin-top:7px;font-size:11px}
.cnts b{font-weight:800} .cb{color:var(--red)} .cp{color:var(--blue)} .ct{color:var(--green)}

.detail{flex:1;overflow-y:auto;padding:18px 20px;min-width:0}
.detail .empty{height:100%;display:flex;align-items:center;justify-content:center;color:var(--text3)}
.dh{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.dh h2{margin:0;font-size:20px}
.badge{font-size:11px;padding:3px 9px;border-radius:20px;background:var(--panel2);color:var(--text2);border:1px solid var(--line)}
.summary{display:flex;gap:10px;margin-left:auto;flex-wrap:wrap}
.scard{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:8px 14px;text-align:center;min-width:64px}
.scard .v{font-size:20px;font-weight:800;line-height:1.1}
.scard .l{font-size:10px;color:var(--text3);margin-top:2px}

.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px;margin-bottom:16px}
.card h3{margin:0 0 12px;font-size:13px;color:var(--text2);font-weight:700;letter-spacing:.5px;text-transform:uppercase}
.roadwrap{overflow-x:auto;padding-bottom:4px}
.road{display:grid;grid-auto-flow:column;grid-template-rows:repeat(6,var(--rc,26px));gap:1px;background:var(--line);border:1px solid var(--line);width:max-content}
.road .col{display:grid;grid-template-rows:repeat(6,var(--rc,26px));gap:1px}
.cell{width:var(--rc,26px);height:var(--rc,26px);background:var(--panel);display:flex;align-items:center;justify-content:center;position:relative}
.ring{width:18px;height:18px;border-radius:50%;border:2.5px solid transparent}
.ring.B{border-color:var(--red)} .ring.P{border-color:var(--blue)}
.fill{width:19px;height:19px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:800;color:#fff}
.fill.B{background:var(--red)} .fill.P{background:var(--blue)} .fill.T{background:var(--green)}
.pairdot{position:absolute;width:6px;height:6px;border-radius:50%}
.pairdot.bk{background:var(--red);right:2px;bottom:2px} .pairdot.pl{background:var(--blue);left:2px;top:2px}
.derived{display:flex;gap:18px;flex-wrap:wrap}
.derived .road{grid-template-rows:repeat(6,14px)} .derived .col{grid-template-rows:repeat(6,14px)}
.derived .cell{width:14px;height:14px} .derived .ring{width:9px;height:9px;border-width:2px}
.dlabel{font-size:11px;color:var(--text3);margin-bottom:5px}

.pred{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.pred .pill{padding:8px 14px;border-radius:10px;background:var(--panel2);border:1px solid var(--line);font-size:13px}
.muted{color:var(--text3);font-size:12px}
.pill{padding:8px 14px;border-radius:10px;background:var(--panel2);border:1px solid var(--line);font-size:13px;display:inline-block}
.predwrap{display:flex;gap:18px;align-items:flex-start;flex-wrap:wrap}
.consensus{flex-shrink:0;width:150px;border-radius:12px;padding:14px;text-align:center;border:2px solid}
.consensus.B{background:rgba(229,72,77,.12);border-color:var(--red)}
.consensus.P{background:rgba(59,130,246,.12);border-color:var(--blue)}
.consensus .cl{font-size:11px;color:var(--text2);letter-spacing:1px}
.consensus .cbig{font-size:30px;font-weight:900;margin:6px 0}
.consensus.B .cbig{color:var(--red)} .consensus.P .cbig{color:var(--blue)}
.consensus .cs{font-size:12px;color:var(--text2)}
.predtbl{flex:1;min-width:280px;border-collapse:collapse;font-size:13px}
.predtbl th{text-align:left;color:var(--text3);font-weight:600;font-size:11px;padding:4px 8px;border-bottom:1px solid var(--line)}
.predtbl td{padding:7px 8px;border-bottom:1px solid var(--line)}
.predtbl .ctr{text-align:center} .predtbl .rgt{text-align:right}
.predtbl .good{color:var(--green)} .predtbl .bad{color:var(--text2)}
.btn-bt{background:var(--panel2);color:var(--text);border:1px solid var(--line);border-radius:9px;padding:8px 14px;font-size:13px;font-weight:700;margin-left:6px;white-space:nowrap}
.btn-bt:hover{border-color:var(--accent);color:var(--accent)}
.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.62);display:flex;align-items:center;justify-content:center;z-index:200;padding:20px}
.modal{width:100%;max-width:560px;max-height:86dvh;overflow-y:auto;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:22px}
.modal h3{margin:0 0 14px;font-size:17px}
.bttbl td{padding:9px 8px}
.bttbl tbody tr:first-child td b{font-size:15px}
@media(max-width:760px){ .rooms{width:120px} .room-name{font-size:12px} }

/* ── 시그널 보드 ── */
.main-wrap{flex:1;display:flex;min-height:0}
.board{flex:1;overflow-y:auto;padding:16px 20px}

/* 우측 손익 시뮬 레이어 */
.pnl-layer{width:300px;flex-shrink:0;background:var(--panel);border-left:1px solid var(--line);overflow-y:auto;display:flex;flex-direction:column;transition:width .2s,margin .2s}
body.pnl-hidden .pnl-layer{width:0;margin-right:-1px;border-left:0;overflow:hidden}
.pnl-head{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--panel);z-index:1}
.pnl-title{font-weight:900;font-size:15px;flex:1}
.pnl-hide{background:var(--panel2);color:var(--text2);border:1px solid var(--line);border-radius:8px;width:26px;height:26px;font-size:13px;font-weight:800}
.pnl-hide:hover{border-color:var(--red);color:var(--red)}
.pnl-body{padding:12px 14px}
.pnl-prov{font-size:12px;color:var(--text3);font-weight:700;margin-bottom:10px}
.pnl-grp{margin-bottom:14px}
.pnl-gh{font-size:13px;font-weight:700;margin-bottom:6px}
.pnl-gh b{color:var(--accent)}
.pnl-tbl{width:100%;border-collapse:collapse}
.pnl-tbl td{padding:7px 6px;border-bottom:1px solid var(--line);font-size:13px}
.pnl-tbl td:first-child{color:var(--text2);font-weight:700;width:54px}
.pnl-tbl .rgt{text-align:right}
.pnl-tbl .good{color:var(--green);font-weight:800}
.pnl-tbl .bad{color:var(--red);font-weight:800}
.pnl-lead-now{margin-left:auto;font-size:12px;font-weight:900}
.pnl-elite .pnl-gh b{color:var(--gold)}
.pnl-single .pnl-gh b{color:var(--accent)}
/* 손익 시뮬 챕터 접기/펼치기 */
.pnl-chap{border-top:2px dashed var(--line);margin-top:8px;padding-top:8px}
.pnl-chap:first-of-type{border-top:0;margin-top:0;padding-top:0}
.pnl-chap-h{font-size:13px;font-weight:800;display:flex;align-items:center;flex-wrap:wrap;gap:6px;cursor:pointer;user-select:none;padding:3px 0}
.pnl-chap-h:hover{color:var(--accent)}
.pnl-chap-arw{font-size:10px;color:var(--text3);transition:transform .15s}
.pnl-chap.collapsed .pnl-chap-arw{transform:rotate(-90deg)}
.pnl-chap.collapsed .pnl-chap-b{display:none}
.pnl-chap-b{margin-top:10px}
.pnl-note{font-size:10px;color:var(--text3);line-height:1.5;margin-top:8px}
.pnl-show{position:fixed;right:16px;bottom:16px;z-index:50;display:none;background:var(--accent);color:#04231d;border:0;border-radius:50%;width:48px;height:48px;font-size:20px;box-shadow:0 4px 14px rgba(0,0,0,.4)}
body.pnl-hidden .pnl-show{display:block}
.statbar{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:14px}
.statbar .stitle{margin-bottom:10px}
.rstats,.tstats{display:flex;gap:6px;flex-wrap:wrap}
.rstat{flex:1;min-width:62px;background:var(--panel2);border:1px solid var(--line);border-radius:9px;padding:8px 4px;text-align:center}
.rstat .rk{font-size:11px;color:var(--text2);font-weight:800}
.rstat .rv{font-size:19px;font-weight:800;margin:2px 0}
.rstat.up .rv{color:var(--green)}
.rstat .rn{font-size:10px;color:var(--text3)}
.tstat{flex:1;min-width:56px;background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:7px 3px;text-align:center}
.tstat .tk{font-size:10.5px;color:var(--text2);font-weight:700}
.tstat .tv{font-size:15px;font-weight:800;margin:2px 0}
.tstat .tn{font-size:9.5px;color:var(--text3)}
.tstat.up .tv{color:var(--green)} .tstat.down .tv{color:var(--text2)}
.tstat.cum{border-color:var(--accent)} .tstat.cum .tv{color:var(--accent)}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(232px,1fr));gap:14px}
.rcard{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px;position:relative;overflow:hidden;transition:border-color .2s,box-shadow .2s}
.rcard.h1{border-color:#caa23a66}
.rcard.h2{border-color:#e0922f99;box-shadow:0 0 12px #e0922f33}
.rcard.h3{border-color:#e5663dcc;box-shadow:0 0 16px #e5663d55}
.rcard.h4{border-color:var(--red);box-shadow:0 0 22px #e5484d77;animation:hotpulse 1.4s infinite}
@keyframes hotpulse{50%{box-shadow:0 0 30px #e5484dbb}}
.rcard.won{border-color:var(--green)}
.rc-top{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.rc-name{font-weight:700;font-size:14px;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rc-round{font-size:28px;font-weight:900;line-height:1;color:var(--text2)}
.rc-round small{font-size:12px;color:var(--text3);font-weight:700}
.rcard.h1 .rc-round{color:var(--gold)} .rcard.h2 .rc-round{color:#e0922f}
.rcard.h3 .rc-round,.rcard.h4 .rc-round{color:var(--red)}
.pick{text-align:center;font-size:30px;font-weight:900;padding:14px 0;border-radius:10px;margin-bottom:6px}
.pick.B{color:var(--red);background:rgba(229,72,77,.1)}
.pick.P{color:var(--blue);background:rgba(59,130,246,.1)}
.pick.mt{color:var(--text3);font-size:18px;background:var(--panel2)}
.rc-str{text-align:center;font-size:12px;color:var(--text2);margin-bottom:10px;min-height:14px}
.rcard .trail{justify-content:center}
.wonflash{position:absolute;inset:0;border-radius:inherit;background:rgba(34,197,94,.94);color:#04231d;display:flex;align-items:center;justify-content:center;font-size:23px;font-weight:900;animation:wf 2s ease-out forwards}
.wonflash.loss{background:rgba(229,72,77,.94);color:#fff}
@keyframes wf{0%,65%{opacity:1}100%{opacity:0;visibility:hidden}}
.stitle{font-size:11px;color:var(--text3);text-transform:uppercase;letter-spacing:.5px;font-weight:700}
.statbar .stitle{margin-bottom:10px}
.rstat.hot{border-color:var(--green);box-shadow:0 0 12px #22c55e44}
.rstat.hot .rv{color:var(--green)}

/* ── 바카라 구슬판 (볼차트) ── */
.beadwrap{overflow-x:auto;padding-top:2px}
.beadwrap::-webkit-scrollbar{height:5px}
.beadwrap::-webkit-scrollbar-thumb{background:var(--panel3,#2a3942);border-radius:3px}
.bead{display:flex;gap:3px;width:100%;background:#0a121b;border:1px solid var(--line);border-radius:8px;padding:5px}
.bcol{flex:1 1 0;display:flex;flex-direction:column;gap:3px;min-width:0}
.bd{width:100%;aspect-ratio:1;max-width:42px;align-self:center;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:#fff;line-height:1}
.bd.B{background:var(--red)} .bd.P{background:var(--blue)} .bd.T{background:var(--green)}
.bd.e{background:transparent;border:1px solid #1c2733;border-radius:50%}
.bead-empty{font-size:11px;color:var(--text3);padding:6px 0}

/* ── 추격 시퀀스 (실패 픽 누적) ── */
.chase{display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:wrap;min-height:56px;padding:6px 0;margin-bottom:6px}
.ch{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:14px;position:relative;flex-shrink:0;transition:.15s}
.ch.B{background:rgba(229,72,77,.16);color:var(--red);border:2px solid var(--red)}
.ch.P{background:rgba(59,130,246,.16);color:var(--blue);border:2px solid var(--blue)}
.ch.loss{opacity:.45;filter:grayscale(.2)}
.ch.loss::after{content:'✕';position:absolute;right:-3px;top:-4px;font-size:10px;color:var(--text2);background:var(--panel);border-radius:50%;width:13px;height:13px;display:flex;align-items:center;justify-content:center;line-height:1}
/* 무승부(타이·푸시) — 회차 미진행. 작게 표시해 실패칩과 구분(회차 착시 방지) */
.ch.push{background:var(--panel2)!important;color:var(--text3)!important;border-color:var(--line)!important;border-style:dashed!important;opacity:.7;width:18px!important;height:18px!important;font-size:9px!important;align-self:center}
.ch.push::after{content:'=';position:absolute;right:-4px;top:-5px;font-size:9px;font-weight:900;color:var(--text3);background:var(--panel);border-radius:50%;width:12px;height:12px;display:flex;align-items:center;justify-content:center;line-height:1}
.ch.win{background:var(--green)!important;border-color:var(--green)!important;color:#04231d!important}
.ch.pending{width:52px;height:52px;font-size:22px;box-shadow:0 0 14px rgba(255,255,255,.12);animation:chpulse 1.5s infinite}
.ch.pending.B{box-shadow:0 0 16px #e5484d77}
.ch.pending.P{box-shadow:0 0 16px #3b82f677}
@keyframes chpulse{50%{transform:scale(1.06)}}

/* ── 카드 빅로드(큰길) — 참조 이미지식 밝은 그리드 + 빈 동그라미 ── */
.bigroad-wrap{overflow-x:auto;padding-top:2px}
.bigroad-wrap::-webkit-scrollbar{height:6px}
.bigroad-wrap::-webkit-scrollbar-thumb{background:#2a3942;border-radius:3px}
.rcard .road{--rc:25px;background:#27374a;border:1px solid #324663;border-radius:6px;width:max-content;gap:1px}
.rcard .road .col{gap:1px}
.rcard .cell{background:#0d1722}
/* 광택 구슬 아이콘 (filled bead) */
.rb{width:20px;height:20px;border-radius:50%}
.rb.B{background:radial-gradient(circle at 33% 28%, #ff8d91, #e5484d 56%, #bd1e24);box-shadow:0 1px 2px rgba(0,0,0,.28),inset 0 0 3px rgba(255,255,255,.35)}
.rb.P{background:radial-gradient(circle at 33% 28%, #82b3ff, #3b82f6 56%, #1b51c7);box-shadow:0 1px 2px rgba(0,0,0,.28),inset 0 0 3px rgba(255,255,255,.35)}
.tieslash{position:absolute;left:50%;top:-12%;width:2px;height:124%;background:var(--green);transform:rotate(45deg);border-radius:2px}

/* ── 신뢰도 게이팅: 베팅/관망 + 국면 + 실효 적중률 ── */
.rc-badges{display:flex;align-items:center;justify-content:center;gap:5px;margin-bottom:10px;flex-wrap:wrap}
.act{font-size:11px;font-weight:800;padding:3px 10px;border-radius:13px}
.act.bet{background:rgba(34,197,94,.16);color:var(--green);border:1px solid var(--green)}
.act.skip{background:var(--panel2);color:var(--text2);border:1px solid var(--line)}
.regime{font-size:11px;color:var(--text2);padding:3px 9px;border-radius:13px;background:var(--panel2);border:1px solid var(--line)}
.rcard.skip{opacity:.4;background:#080b11;border-color:#161d28}
.rcard.skip .chase{filter:grayscale(.85) opacity(.55)}
.rcard.skip .act.skip{background:#0c1119;color:var(--text3)}
.effbar .effrow{display:flex;gap:10px;flex-wrap:wrap}
.effcard{flex:1;min-width:96px;background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:10px 8px;text-align:center}
.effcard.big{border-color:var(--accent);background:rgba(34,211,168,.08)}
.effcard.big .ev{color:var(--accent)}
.effcard .el{font-size:11px;color:var(--text3);font-weight:600}
.effcard .ev{font-size:24px;font-weight:900;margin:3px 0}
.effcard .en{font-size:10px;color:var(--text3)}

/* ── 수익 차트 범례 + 룸별 실효 ── */
.chart-legend{display:flex;align-items:center;gap:14px;margin-bottom:8px;font-size:12px}
.chart-legend .lg{display:flex;align-items:center;gap:5px;color:var(--text2)}
.chart-legend .lg::before{content:'';width:12px;height:12px;border-radius:3px;display:inline-block}
.chart-legend .lg.bet::before{background:var(--accent)}
.chart-legend .lg.all::before{background:#5c6776}
.rc-eff{text-align:center;font-size:11px;color:var(--text2);margin-top:4px}
.rc-eff b{color:var(--accent)}

/* ── 게이팅 최적화 ── */
.gate-sum{display:flex;align-items:stretch;gap:10px;flex-wrap:wrap}
.gate-sum .gs{flex:1;min-width:90px;background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:10px;text-align:center}
.gate-sum .gs.arrow{flex:0 0 auto;min-width:0;background:transparent;border:none;display:flex;align-items:center;color:var(--text3);font-size:20px;padding:0 2px}
.gate-sum .gs.best{border-color:var(--green);background:rgba(34,197,94,.08)}
.gate-sum .gl{font-size:11px;color:var(--text3)}
.gate-sum .gv{font-size:22px;font-weight:900;margin:3px 0}
.gate-sum .gs.best .gv{color:var(--green)}
.gate-sum .gv2{font-size:13px;font-weight:700;margin:4px 0;line-height:1.3}
.gate-sum .gn{font-size:10px;color:var(--text3)}
.gategrid{border-collapse:collapse;font-size:12px;width:100%}
.gategrid th{color:var(--text3);font-weight:600;font-size:11px;padding:5px 6px;border:1px solid var(--line)}
.gategrid td.gx{text-align:center;padding:5px 6px;border:1px solid var(--line);color:var(--text2)}
.gategrid td.gx small{display:block;font-size:9px;color:var(--text3);font-weight:400}
.gategrid td.gx.dim{opacity:.4}
.gategrid td.gx.good{background:rgba(34,197,94,.14);color:var(--green);font-weight:700}
.gategrid td.gx.best{outline:2px solid var(--accent);outline-offset:-2px;color:var(--accent)}

/* ── 게임사별 탭 ── */
.grid-head{display:flex;align-items:center;gap:14px;margin:4px 2px 12px;flex-wrap:wrap}
.grid-head .stitle{margin:0}
/* 최상단 게임(게임사) 선택 */
.game-sel{display:inline-flex;gap:6px;margin-left:6px}
.gs-btn{background:var(--panel2);color:var(--text2);border:1px solid var(--line);border-radius:16px;padding:6px 14px;font-size:13px;font-weight:800;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.gs-btn span{background:var(--bg);color:var(--text3);border-radius:10px;padding:0 7px;font-size:11px;font-weight:800}
.gs-btn:hover{border-color:var(--accent);color:var(--text)}
.gs-btn.on{background:var(--blue);color:#fff;border-color:var(--blue)}
.gs-btn.on span{background:rgba(0,0,0,.25);color:#fff}
.prov-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-left:auto}
.ptab{background:var(--panel2);color:var(--text2);border:1px solid var(--line);border-radius:18px;padding:6px 14px;font-size:13px;font-weight:700;display:inline-flex;align-items:center;gap:6px}
.ptab span{background:var(--bg);color:var(--text3);border-radius:10px;padding:0 7px;font-size:11px;font-weight:800}
.ptab:hover{border-color:var(--accent);color:var(--text)}
.ptab.on{background:var(--accent);color:#04231d;border-color:var(--accent)}
.ptab.on span{background:rgba(0,0,0,.2);color:#04231d}

/* 검증 트랙레코드 패널 */
.tr-kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:12px}
.tr-kpi>div{background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:2px}
.tr-kpi b{font-size:22px;line-height:1.1}
.tr-kpi small{font-size:10px}
.tr-honest{background:rgba(224,162,58,.1);border:1px solid rgba(224,162,58,.35);color:#e0b96a;border-radius:8px;padding:8px 11px;font-size:12px;margin-bottom:12px;line-height:1.5}
.tr-cols{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.tr-h{font-weight:800;font-size:13px;margin-bottom:6px;color:var(--text)}
@media(max-width:680px){.tr-cols{grid-template-columns:1fr}.tr-kpi{grid-template-columns:1fr}}

/* 따라가기 시뮬 패널 */
.fs-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.fs-card{background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:12px}
.fs-card.fs-chase{border-color:rgba(214,69,69,.45);background:rgba(214,69,69,.06)}
.fs-name{font-weight:800;font-size:13px;margin-bottom:8px}
.fs-warn{color:#d64545;font-size:11px;font-weight:800}
.fs-top{display:flex;gap:14px;margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid var(--line)}
.fs-top>div{display:flex;flex-direction:column;gap:1px}
.fs-top b{font-size:18px;line-height:1.1}
.fs-top span{font-size:10px}
.fs-risks{display:flex;flex-direction:column;gap:4px}
.fs-risk{display:flex;align-items:baseline;gap:6px;font-size:12px}
.fs-risk span{color:var(--text3);min-width:96px}
.fs-risk b{font-size:13px}
.fs-risk small{font-size:10px}
.fs-lesson{background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:10px 12px;font-size:12px;line-height:1.6;color:var(--text2)}
@media(max-width:680px){.fs-grid{grid-template-columns:1fr}}

/* 엣지 리서치 패널 */
.er-sec{margin-bottom:16px}
.er-cols{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.er-stat{font-size:14px;margin-bottom:4px}
.er-stat b{font-size:18px}
.er-lead{background:rgba(46,204,150,.08);border:1px solid rgba(46,204,150,.35);border-radius:8px;padding:10px 12px;color:var(--text)}
@media(max-width:680px){.er-cols{grid-template-columns:1fr}}

/* 감추기/나오기 섹션 */
.sec{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:14px}
.sec-head{display:flex;align-items:center;gap:8px;cursor:pointer;user-select:none;margin-bottom:10px;flex-wrap:wrap}
.sec.collapsed .sec-head{margin-bottom:0}
.sec-title{font-size:11px;color:var(--text3);text-transform:uppercase;letter-spacing:.5px;font-weight:700;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.sec-arrow{font-size:10px;color:var(--text3);transition:transform .15s;flex-shrink:0}
.sec.collapsed .sec-arrow{transform:rotate(-90deg)}
.sec.collapsed .sec-body{display:none}
.sec-head:hover .sec-arrow{color:var(--accent)}
/* 그리드 섹션은 투명(카드 자체가 패널) */
.sec.gridsec{background:transparent;border:0;padding:0}
.sec.gridsec .prov-tabs{display:inline-flex;gap:6px;flex-wrap:wrap}

/* 시간창별 라운드 세로 막대 그래프 (1·3·5·10분) */
.winmode{display:inline-flex;gap:4px;margin-left:4px}
.winmode-btn,.winprov-btn{background:var(--bg);color:var(--text3);border:1px solid var(--line);border-radius:14px;padding:3px 11px;font-size:11px;font-weight:700;text-transform:none;letter-spacing:0}
.winmode-btn:hover,.winprov-btn:hover{border-color:var(--accent);color:var(--text2)}
.winmode-btn.on{background:var(--accent);color:#04231d;border-color:var(--accent)}
.winprov-btn.on{background:var(--blue);color:#fff;border-color:var(--blue)}
.wincharts{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.vchart{background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:10px 8px}
.vchart-h{font-size:12px;font-weight:800;text-align:center;margin-bottom:10px;color:var(--text)}
.vbars{position:relative;display:flex;justify-content:space-around;gap:6px;height:150px;margin-bottom:20px;background:rgba(255,255,255,.025);border-radius:4px;padding:0 4px}
/* 50% 기준선 (점선) */
.vbars::after{content:'';position:absolute;left:0;right:0;bottom:50%;border-top:1px dashed rgba(245,179,1,.45);pointer-events:none;z-index:0}
.vbar-col{position:relative;flex:1;max-width:26px;height:100%}
.vbar-fill{position:absolute;left:0;right:0;bottom:0;background:var(--blue);border-radius:3px 3px 0 0;transition:height .35s ease;min-height:2px;z-index:1}
.vbar-fill.up{background:var(--accent)}
.vbar-fill.down{background:var(--blue);opacity:.5}
.vbar-fill.hot{background:var(--gold);box-shadow:0 0 8px var(--gold)}
.vbar-val{position:absolute;left:-5px;right:-5px;text-align:center;font-size:9px;color:var(--text2);font-weight:700;transform:translateY(-11px);z-index:2}
.vbar-lbl{position:absolute;left:0;right:0;bottom:-18px;text-align:center;font-size:10px;color:var(--text3);font-weight:700}
@media(max-width:760px){.wincharts{grid-template-columns:repeat(2,1fr)}}

/* 베팅 가능 룸 피드 — 실시간 등장/퇴장 */
.betfeed{display:flex;flex-wrap:wrap;gap:18px;align-items:flex-start;min-height:40px}
.betempty{color:var(--text3);padding:22px;text-align:center;font-size:14px;width:100%}
.betcard{width:312px;background:var(--panel);border:1px solid var(--line);border-left:6px solid var(--accent);border-radius:16px;padding:18px 20px;position:relative;
  transition:opacity .4s ease,transform .4s ease;animation:bcPop 1.3s ease-out}
.betcard.bc-enter{opacity:0;transform:translateY(-20px) scale(.9)}
.betcard.bc-exit{opacity:0;transform:scale(.88);pointer-events:none}
@keyframes bcPop{0%{box-shadow:0 0 3px 2px rgba(34,211,168,.65)}100%{box-shadow:0 0 22px 7px rgba(34,211,168,0)}}
.bc-room{font-size:21px;font-weight:900;color:var(--text);margin-bottom:14px;display:flex;align-items:center;gap:9px;letter-spacing:.3px;line-height:1.2}
.bc-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;background:var(--text3)}
.bc-dot.st-observing{background:var(--green);box-shadow:0 0 6px var(--green)}
.bc-body{display:flex;align-items:center;gap:20px;margin-bottom:14px}
.bc-pick{width:84px;height:84px;flex-shrink:0;border-radius:16px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:44px;font-weight:900;line-height:1}
.bc-pick small{font-size:13px;font-weight:700}
.bc-pick.B{color:var(--red);background:rgba(229,72,77,.13)}
.bc-pick.P{color:var(--blue);background:rgba(59,130,246,.13)}
.bc-info{display:flex;flex-direction:column;gap:9px}
.bc-round{font-size:32px;font-weight:900}
.bc-round small{font-size:14px;color:var(--text3);margin-left:2px}
.betcard .chase{gap:5px} .betcard .ch{width:30px;height:30px;font-size:13px}
.betcard.h1{border-left-color:var(--gold)}
.betcard.h2{border-left-color:#e0922f;box-shadow:0 0 12px #e0922f44}
.betcard.h3{border-left-color:#e5663d;box-shadow:0 0 16px #e5663d66}
.betcard.h4{border-left-color:var(--red);box-shadow:0 0 18px #e5484d77}
.betcard.h2 .bc-round,.betcard.h3 .bc-round,.betcard.h4 .bc-round{color:var(--red)}
.betcard.won{border-color:var(--green);box-shadow:0 0 18px #22c55e77}

/* ───── 라이트 모드 ───── */
body.light{
  --bg:#eef1f6; --panel:#ffffff; --panel2:#f1f4f9; --line:#dce3ec;
  --text:#16202e; --text2:#566374; --text3:#8995a5;
  --red:#d83a3f; --blue:#2f6fed; --green:#1f9d54; --gold:#c98a00; --accent:#0ea88a;
}
body.light .topbar,body.light .pnl-layer{box-shadow:0 1px 3px rgba(0,0,0,.06)}
body.light .vbars{background:rgba(0,0,0,.035)}
body.light .vbar-track{background:rgba(0,0,0,.05)}
body.light .vbar-fill.down{opacity:.4}
body.light .logo small{-webkit-text-fill-color:var(--text3)}
body.light .winmode-btn.on,body.light .pnl-show{color:#fff}
body.light .modal-bg{background:rgba(20,28,40,.45)}
body.light .betcard{box-shadow:0 2px 8px rgba(20,30,50,.07)}
body.light .scard,body.light .card{box-shadow:0 1px 4px rgba(20,30,50,.05)}

/* 베팅 카드 경과 타이머 */
.bc-timer{margin-left:auto;font-size:13px;font-weight:800;background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:3px 10px;letter-spacing:.3px;white-space:nowrap;color:var(--text3)}
.bc-timer.open{color:var(--green);border-color:var(--green)}
.bc-timer.urgent{color:#fff;background:var(--red);border-color:var(--red)}
.bc-timer.closed{color:var(--text3)}
/* 베팅 끝난 뒤 결과 표시(result-hold) 카드 */
.bc-resbadge{margin-left:auto;font-size:13px;font-weight:900;border-radius:12px;padding:3px 11px;letter-spacing:.3px;white-space:nowrap}
.bc-resbadge.win{color:#04231d;background:var(--green)}
.bc-resbadge.loss{color:#fff;background:var(--red)}
.betcard.bc-win{border-color:var(--green);border-left-color:var(--green);box-shadow:0 0 16px #22c55e66}
.betcard.bc-loss{border-color:var(--red);border-left-color:var(--red);box-shadow:0 0 16px #e5484d55;opacity:.92}
.regime.rg-win{color:var(--green)} .regime.rg-loss{color:var(--red)}

/* 차트 모달 툴바 (구간/밴드 선택) */
.chart-bar{display:flex;align-items:center;gap:8px;margin:6px 0 12px;flex-wrap:wrap}
.chart-bar .winmode{margin-left:0}

/* ── 예측율 헤드라인 (2R 누적 ~75%) ── */
.predhead{background:linear-gradient(135deg,rgba(34,197,94,.10),rgba(15,23,42,.4));border:1px solid rgba(34,197,94,.25);border-radius:14px;padding:14px 18px;margin:0 0 14px;display:flex;flex-wrap:wrap;align-items:center;gap:18px}
.predhead .ph-main{display:flex;align-items:center;gap:16px;flex:1;min-width:260px}
.predhead .ph-label{font-size:13px;color:var(--muted,#94a3b8);line-height:1.5}
.predhead .ph-label b{color:var(--text,#e2e8f0);font-size:15px}
.predhead .ph-sub{display:block;font-size:11px;color:var(--muted,#94a3b8)}
.predhead .ph-val{font-size:38px;font-weight:800;letter-spacing:-1px;color:#e2e8f0;display:flex;flex-direction:column;align-items:flex-end;line-height:1}
.predhead .ph-val.good{color:#22c55e;text-shadow:0 0 18px rgba(34,197,94,.4)}
.predhead .ph-target{font-size:11px;font-weight:600;color:var(--muted,#94a3b8);margin-top:3px}
.predhead .ph-steps{display:flex;gap:8px}
.predhead .ph-step{background:rgba(15,23,42,.5);border:1px solid rgba(148,163,184,.18);border-radius:10px;padding:7px 13px;text-align:center;min-width:62px}
.predhead .ph-step.on{border-color:rgba(34,197,94,.5);background:rgba(34,197,94,.08)}
.predhead .ph-step span{display:block;font-size:10px;color:var(--muted,#94a3b8)}
.predhead .ph-step b{font-size:16px;color:#e2e8f0}
.predhead .ph-step b.good{color:#22c55e}
.predhead .ph-note{flex-basis:100%;font-size:10.5px;color:var(--muted,#94a3b8);line-height:1.5;border-top:1px solid rgba(148,163,184,.12);padding-top:8px}
.predhead .ph-note b{color:#cbd5e1}
body.light .predhead{background:linear-gradient(135deg,rgba(34,197,94,.10),rgba(241,245,249,.6));border-color:rgba(34,197,94,.3)}
body.light .predhead .ph-step{background:#fff}

/* ── 목표 승률 플래너 ── */
.btn-hl{background:linear-gradient(135deg,#22c55e,#16a34a)!important;color:#fff!important;border-color:#16a34a!important;font-weight:700}
.tp-ctl{display:flex;flex-direction:column;gap:10px;margin:6px 0 14px}
.tp-row{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--muted,#94a3b8)}
.tp-row>span:first-child{min-width:96px;color:var(--text,#e2e8f0);font-weight:600}
.tp-row input[type=number]{width:110px;padding:6px 9px;border-radius:8px;border:1px solid rgba(148,163,184,.3);background:rgba(15,23,42,.5);color:inherit;font-size:13px}
.tp-row label{display:inline-flex;align-items:center;gap:5px;cursor:pointer}
.tp-kpi{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:6px 0 14px}
.tpk{background:rgba(15,23,42,.5);border:1px solid rgba(148,163,184,.18);border-radius:12px;padding:11px 12px;text-align:center}
.tpk span{display:block;font-size:11px;color:var(--muted,#94a3b8);margin-bottom:4px}
.tpk b{font-size:22px;font-weight:800}
.tpk b.good{color:#22c55e}.tpk b.bad{color:#ef4444}
.tp-ev{margin-top:10px;font-size:12.5px;color:var(--muted,#94a3b8);text-align:center;padding:8px;background:rgba(15,23,42,.4);border-radius:10px}
.tp-result{padding:18px;text-align:center;border-radius:12px;background:rgba(239,68,68,.08);border:1px solid rgba(239,68,68,.3)}
.tp-honest{margin-top:12px;font-size:11px;line-height:1.6;color:var(--muted,#94a3b8);border-top:1px solid rgba(148,163,184,.15);padding-top:10px}
.tp-honest b{color:#cbd5e1}
body.light .tpk,body.light .tp-row input[type=number],body.light .tp-ev{background:#fff}

/* ── 정통 로드맵 스코어보드 (룸 상세 모달) ── */
.rcard{cursor:pointer;transition:transform .1s,box-shadow .1s}
.rcard:hover{transform:translateY(-2px);box-shadow:0 4px 16px rgba(34,197,94,.18)}
.rd-counts{font-size:13px;color:var(--muted,#94a3b8);margin:0 0 12px}
.rd-counts b.B{color:#ef4444}.rd-counts b.P{color:#3b82f6}
.rd-grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.rd-box{background:rgba(15,23,42,.4);border:1px solid rgba(148,163,184,.16);border-radius:10px;padding:10px}
.rd-title{font-size:12px;font-weight:700;color:var(--text,#e2e8f0);margin-bottom:8px}
.rd-derivedrow{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:12px}
.rd-roadbox{background:rgba(15,23,42,.4);border:1px solid rgba(148,163,184,.16);border-radius:10px;padding:10px}
.rd-rdtitle{font-size:12px;font-weight:700;margin-bottom:8px;display:flex;justify-content:space-between;align-items:baseline}
.rd-rdtitle .muted{font-size:10px;font-weight:400}
.rd-ask{margin-top:8px;font-size:12px;color:var(--muted,#94a3b8);text-align:center;border-top:1px solid rgba(148,163,184,.12);padding-top:7px}
.rd-ask b.B{color:#ef4444}.rd-ask b.P{color:#3b82f6}
/* 로드 그리드(구슬판/대로/파생) — 가로스크롤 컬럼 */
.road{display:flex;gap:1px;overflow-x:auto;background:rgba(255,255,255,.02);padding:3px;border-radius:6px;min-height:0}
.road .col{display:flex;flex-direction:column;gap:1px;flex:0 0 auto}
.road .cell{width:22px;height:22px;display:flex;align-items:center;justify-content:center;position:relative}
.road.derived .cell{width:16px;height:16px}
.road.bead .cell{width:24px;height:24px}
.rb{width:17px;height:17px;border-radius:50%;display:inline-block}
.rb.B{background:radial-gradient(circle at 35% 30%,#ff7a7a,#dc2626)}
.rb.P{background:radial-gradient(circle at 35% 30%,#7ab0ff,#2563eb)}
.bead-dot{width:21px;height:21px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:800;color:#fff}
.bead-dot.bd-B{background:radial-gradient(circle at 35% 30%,#ff7a7a,#dc2626)}
.bead-dot.bd-P{background:radial-gradient(circle at 35% 30%,#7ab0ff,#2563eb)}
.bead-dot.bd-T{background:radial-gradient(circle at 35% 30%,#5ee08a,#16a34a)}
.dr{width:12px;height:12px;display:inline-block;border-radius:50%;box-sizing:border-box}
.dr.dr-r.circle{border:2.5px solid #dc2626;background:transparent}
.dr.dr-b.circle{border:2.5px solid #2563eb;background:transparent}
.dr.dr-r.solid{background:#dc2626}
.dr.dr-b.solid{background:#2563eb}
.dr.dr-r.slash{width:14px;height:3px;border-radius:2px;background:#dc2626;transform:rotate(45deg)}
.dr.dr-b.slash{width:14px;height:3px;border-radius:2px;background:#2563eb;transform:rotate(45deg)}
.tieslash{position:absolute;width:26px;height:2px;background:#22c55e;transform:rotate(-45deg);opacity:.85}
.pr{position:absolute;top:1px;right:1px;width:6px;height:6px;border-radius:50%}
.pr-b{background:#dc2626}.pr-p{background:#2563eb}
body.light .road{background:rgba(0,0,0,.03)}
body.light .rd-box,body.light .rd-roadbox{background:#f8fafc}

/* ── 슈 패턴 통계 패널 (룸 상세) ── */
.rd-stats{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:10px 0}
.rds{background:rgba(15,23,42,.5);border:1px solid rgba(148,163,184,.16);border-radius:9px;padding:8px;text-align:center}
.rds span{display:block;font-size:10px;color:var(--muted,#94a3b8);margin-bottom:3px}
.rds b{font-size:16px;font-weight:800;color:var(--text,#e2e8f0)}
.rds b.B{color:#ef4444}.rds b.P{color:#3b82f6}
.rds b.rg-streak{color:#f59e0b}.rds b.rg-chop{color:#22c55e}.rds b.rg-mixed{color:var(--muted,#94a3b8)}
body.light .rds{background:#f8fafc}