/* 거래 화면 v4d: ① 상태 바(app.css, 동기화 상세 S 는 칩을 누르면 열림) → ② 돈 띠(M) → ③ 메인(E 봇 · B 차트 · C 호가) → ④ 최근 7일(G) → ⑤ 하단 탭(F, '성과' 탭 = Q 자산 추이).
   1920 기준 → 1440·1280(③ 2열) → 390(세로 한 줄 흐름). 넓은 화면에서 오른쪽이 비지 않도록 max-width 를 쓰지 않는다. */
.tpage{display:flex;flex-direction:column;gap:10px;padding:10px var(--gutter) 28px}
.ph{display:flex;align-items:center;gap:8px;padding:8px 12px 4px;min-height:34px}
.ttab{font-weight:700;font-size:13px;white-space:nowrap}
.bsp{flex:1}
select{font:inherit;font-weight:600;font-size:12px;color:var(--ink);background:var(--bg2);border:1px solid var(--line);border-radius:var(--r-b);padding:2px 6px;min-height:26px}

/* ===== ② 돈 띠 ===== */
.money{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1.55fr) minmax(0,.95fr) minmax(0,1.2fr) minmax(0,1.35fr) minmax(0,.9fr);min-height:112px;overflow:hidden}
.mc{display:flex;flex-direction:column;justify-content:center;gap:2px;min-width:0;padding:10px 14px;border-right:1px solid var(--line)}
.mc:last-child{border-right:0}
.mlh{display:flex;align-items:baseline;gap:6px;min-width:0}
.ml{font-size:12px;font-weight:600;color:var(--ink-2);white-space:nowrap}
.ago{font-size:11px;font-weight:600;color:var(--warn);white-space:nowrap}
.ago:empty{display:none}
.mv{font-size:28px;font-weight:600;line-height:1.15;white-space:nowrap}
.mv.s{font-size:18px}
.mvr{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 8px}
.mvr .pc{font-size:13px;font-weight:600;white-space:nowrap}
.ms{font-size:11.5px;font-weight:500;color:var(--ink-2);line-height:1.4;display:flex;flex-wrap:wrap;gap:0 10px}
.ms .si{white-space:nowrap}
.mv.na,.pc.na{color:var(--mute)}
.parts{display:grid;grid-template-columns:repeat(4,auto);justify-content:start;gap:0 14px;font-size:11.5px}
.parts .pt{display:flex;flex-direction:column;min-width:0}
.parts .pt i{color:var(--ink-2);font-weight:600;white-space:nowrap}
.parts .pt b{font-weight:600;white-space:nowrap}
.money.stale .mv,.money.stale .pc,.money.stale .pt b,.money.stale .up,.money.stale .dn{color:var(--mute)}
/* 포지션 칸 */
.pl{display:flex;align-items:baseline;gap:8px;min-width:0;white-space:nowrap}
.pl .side{display:inline-block;font-size:11px;font-weight:700;padding:0 6px;border-radius:4px;border:1px solid currentColor;line-height:17px}
.pl .qty{font-size:15px;font-weight:600}
.pl .pn{font-size:13px;font-weight:600}
.pl .lv{font-size:11.5px;color:var(--ink-2);font-weight:600}
.pl.none0{font-size:18px;font-weight:600;color:var(--mute)}
/* 위험 칸: 단계 색은 연한 바탕 + 얇은 전체 테두리 */
.mc.mr{--lvc:var(--up);--lvt:var(--up-t);gap:3px;background:color-mix(in srgb,var(--lvc) 9%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--lvc) 40%,transparent)}
.mc.mr[data-lv="warn"]{--lvc:var(--warn);--lvt:var(--warn)}
.mc.mr[data-lv="danger"]{--lvc:var(--orange);--lvt:var(--orange)}
.mc.mr[data-lv="crit"]{--lvc:var(--dn);--lvt:var(--dn-t)}
.mc.mr[data-lv="na"]{--lvc:var(--mute);--lvt:var(--ink-2)}
.mrt{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.lvw{display:inline-flex;align-items:center;min-height:20px;padding:0 8px;border-radius:4px;font-size:12px;font-weight:700;color:var(--lvt);border:1px solid color-mix(in srgb,var(--lvc) 60%,transparent);white-space:nowrap}
.lvw:empty{display:none}
.gauge{position:relative;height:8px;border-radius:4px;overflow:hidden;background:var(--bg2);border:1px solid var(--line)}
.gauge .gf{position:absolute;left:0;top:0;bottom:0;background:var(--lvc);min-width:2px}
.gauge .gk{position:absolute;top:0;bottom:0;width:1px;background:var(--ink-2);opacity:.7}
.gscale{position:relative;height:12px;font-size:10px;font-weight:600;color:var(--ink-2)}
.gscale span{position:absolute;top:0;transform:translateX(-50%)}
.msub{font-size:11.5px;font-weight:500;color:var(--ink-2);display:flex;flex-wrap:wrap;gap:0 12px}
.msub b{color:var(--ink);font-weight:600}
.money.stale .mc.mr{background:transparent;box-shadow:none}
.money.stale .gf{background:var(--mute)}
.mc.two{gap:4px}
.mc.two .blk{display:flex;flex-direction:column;gap:0}

/* ===== ③ 메인 3열 ===== */
.tgrid{display:grid;gap:10px;height:clamp(620px,calc(100vh - 400px),780px);
  grid-template-columns:minmax(290px,23fr) minmax(0,57fr) minmax(270px,20fr);
  grid-template-rows:minmax(0,1fr);
  grid-template-areas:"E B C"}
.area{min-width:0;min-height:0;overflow:hidden;position:relative}
.E{grid-area:E;display:flex;flex-direction:column;overflow-y:auto;scrollbar-width:thin}
.B{grid-area:B;display:flex;flex-direction:column}
.C{grid-area:C;display:flex;flex-direction:column}

/* 봇 운영 */
.bline{margin:2px 12px 6px;padding:7px 10px;border-radius:var(--r-b);background:var(--bg2);border:1px solid var(--line);font-size:12.5px;font-weight:600;color:var(--ink);line-height:1.4}
.bline.warn{border-color:color-mix(in srgb,var(--warn) 55%,transparent);background:var(--tint-warn)}
.bline.bad{border-color:color-mix(in srgb,var(--dn) 55%,transparent);background:var(--tint-dn)}
.steps{list-style:none;margin:0 12px;padding:0;display:flex;flex-direction:column}
.step{display:grid;grid-template-columns:20px minmax(0,1fr) auto;align-items:center;gap:8px;min-height:21px;padding:0 4px;border-top:1px solid var(--line);font-size:12.5px}
.step:first-child{border-top:0}
.step .sn{display:grid;place-items:center;width:18px;height:18px;border-radius:50%;border:1px solid var(--line);font-size:10.5px;font-weight:700;color:var(--mute)}
.step .sl{font-weight:600;color:var(--ink)}
.step .ss{font-size:11.5px;font-weight:600;color:var(--mute);white-space:nowrap}
.step .ss.feed{color:var(--ink-2);font-weight:500}
.step .ss.feed.lag{color:var(--warn);font-weight:600}.step .ss.feed.down{color:var(--dn-t);font-weight:600}
.step[data-s="off"] .sl{color:var(--mute)}
.tsum{margin:8px 12px 0;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-b);background:var(--bg2)}
.tsum .sh{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:12px;font-weight:700;color:var(--ink);margin-bottom:4px}
.tsum .sh .rcl{font-size:11px;font-weight:500;color:var(--ink-2);white-space:nowrap}
.tsum .sh .rcl b{color:var(--ink);font-weight:600}
.gl4{display:grid;grid-template-columns:auto minmax(0,1fr) auto minmax(0,1fr);gap:3px 10px;margin:0;font-size:12px}
.gl4 dt{color:var(--ink-2);font-weight:500;white-space:nowrap}
.gl4 dd{margin:0;text-align:right;font-weight:600;white-space:nowrap}
.bset{margin:8px 12px 0;border:1px solid var(--line);border-radius:var(--r-b);background:var(--bg2)}
.bset summary{display:flex;align-items:center;gap:6px;min-height:30px;padding:0 10px;font-size:12px;font-weight:700;color:var(--ink);cursor:pointer;list-style:none}
.bset summary::-webkit-details-marker{display:none}
.bset summary .ic{width:14px;height:14px;color:var(--ink-2)}
.bset summary .bapp{margin-left:auto;font-size:11px;font-weight:600;color:var(--warn);white-space:nowrap}
.bset[open] summary{border-bottom:1px solid var(--line)}
.bsl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 12px;margin:0;padding:7px 10px 8px;font-size:12px}
.bsl dt{color:var(--ink-2);font-weight:500;white-space:nowrap}
.bsl dd{margin:0;text-align:right;font-weight:600;color:var(--ink);white-space:nowrap}
.ops{margin:8px 12px 0;display:flex;flex-direction:column;gap:6px}
.opline{display:flex;align-items:center;gap:6px;margin:0;font-size:11.5px;font-weight:600;color:var(--ink-2)}
.opline .ic{width:13px;height:13px}
.og{display:grid;gap:6px}
.og.g3{grid-template-columns:repeat(3,minmax(0,1fr))}.og.g2{grid-template-columns:repeat(2,minmax(0,1fr))}.og.g1{grid-template-columns:minmax(0,1fr)}
.og.emg{margin-top:4px;padding-top:8px;border-top:1px solid var(--line)}
.btnwrap{display:block;min-width:0}
.btnwrap .btn{width:100%;padding:0 6px;gap:5px;white-space:nowrap}
.btnwrap .btn .ic{flex:0 0 auto;width:14px;height:14px}
.eset{margin:auto 12px 0;padding:8px 0 10px;display:flex;flex-wrap:wrap;gap:6px 6px;align-items:center}
.tchip:empty{display:none}
.tchip{font-size:11.5px;font-weight:600;border:1px solid var(--line);border-radius:4px;padding:1px 7px;background:var(--bg2);color:var(--ink);white-space:nowrap}
.fee{font-size:11.5px;font-weight:500;color:var(--ink-2);white-space:nowrap}

/* 시세 줄 · 차트 */
.qline{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:4px 20px;padding:8px 14px 2px}
.sym{display:flex;align-items:center;gap:8px;white-space:nowrap}
.sname{font-size:15px;font-weight:700}
.mk{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;color:var(--ink-2)}
.px{display:flex;align-items:baseline;gap:10px}
.px .big{font-size:24px;font-weight:600;line-height:1.1}
.px .chg{font-size:12.5px;font-weight:600}
.c{display:flex;flex-direction:column;gap:0;min-width:0}
.c .l{font-size:11px;font-weight:600;color:var(--ink-2);white-space:nowrap}
.c b{font-size:13px;font-weight:600;white-space:nowrap}
.qmoreb{margin-left:auto;display:inline-flex;align-items:center;gap:4px;min-height:26px;padding:0 8px;border-radius:var(--r-b);border:1px solid var(--line);background:var(--btn-bg);font:inherit;font-size:12px;font-weight:600;color:var(--btn-ink);cursor:pointer}
.qmoreb .ic{width:13px;height:13px}.qmoreb[aria-expanded="true"] .ic{transform:rotate(180deg)}
.qmore{position:absolute;z-index:8;left:8px;right:8px;top:100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:6px 16px;padding:10px 14px;border-radius:var(--r);background:var(--card-hi);border:1px solid var(--line)}
.stag{font-size:11px;font-weight:700;color:var(--warn);white-space:nowrap}
.stag:empty{display:none}
.B.stale .qline .px .big,.B.stale .qline .chg,.B.stale .qline .c b{color:var(--mute)}
.B.stale .cwrap{opacity:.5}
.bh{display:flex;align-items:center;gap:8px;padding:4px 12px 2px;flex-wrap:wrap}
.binfo{display:flex;flex-wrap:wrap;gap:2px 12px;padding:2px 14px;font-size:11.5px;font-weight:500;color:var(--ink-2);min-height:18px}
.binfo b{color:var(--ink);font-weight:600}
.binfo .ma.m7 b{color:var(--live)}.binfo .ma.m25 b{color:#EB40B5}.binfo .ma.m99 b{color:#8B5CF6}
:root[data-theme="light"] .binfo .ma.m25 b{color:#B02A8C}:root[data-theme="light"] .binfo .ma.m99 b{color:#6D3FD1}
.cwrap{flex:1;min-height:0;display:flex;flex-direction:column;position:relative}
.cmain{flex:1;min-height:120px;position:relative}
.vhdr{padding:2px 14px;font-size:11px;font-weight:500;color:var(--ink-2)}.vhdr b{color:var(--ink);font-weight:600}
.cvol{height:76px;position:relative}
.depthwrap{position:absolute;inset:0;background:transparent}
.depthsvg{width:100%;height:100%}
.dpt{font-size:11px;fill:var(--ink-2);font-weight:500}.dpg{stroke:var(--line);stroke-width:1}
.bchips{display:flex;flex-wrap:wrap;gap:4px;padding:4px 12px 8px}
.bchips button{border:1px solid var(--line);background:var(--btn-bg);color:var(--btn-ink);font:inherit;font-size:11.5px;font-weight:600;border-radius:var(--r-b);padding:1px 9px;cursor:pointer;min-height:24px}
.bchips button.on{background:var(--seg-on-bg);color:var(--seg-on-ink);border-color:var(--seg-on-bg)}
.B:fullscreen{background:var(--bg);padding:10px}
.B:fullscreen .cwrap{min-height:70vh}
.mtip{position:absolute;z-index:6;min-width:240px;max-width:min(440px,90%);padding:8px 10px;border-radius:var(--r);font-size:12px;font-weight:500;line-height:1.5;pointer-events:none;background:var(--card-hi);border:1px solid var(--line);color:var(--ink)}
.mtip[hidden],.cerr[hidden]{display:none}
.mtip b{display:block;margin-bottom:2px}.mtip div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cerr{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);z-index:7;padding:8px 14px;border-radius:var(--r);font-weight:700;font-size:13px;background:var(--card-hi);border:1px solid color-mix(in srgb,var(--dn) 60%,transparent);color:var(--dn-t)}

/* 호가 · 최근 체결 */
.cols{display:grid;grid-template-columns:1.1fr 1fr 1fr;padding:0 12px;font-size:11px;font-weight:600;color:var(--ink-2);gap:4px}
.cols span:nth-child(n+2){text-align:right}
.cbody{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.book{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center;padding:2px 0;overflow:hidden}
.rows{display:flex;flex-direction:column;overflow:hidden}
.br{position:relative;overflow:hidden;display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:4px;padding:0 12px;height:19px;line-height:19px;font-size:12px;font-weight:500}
.br>span{position:relative;z-index:1}
.br span:nth-child(n+2){text-align:right}
.br .dq{position:absolute;right:0;top:1px;bottom:1px;z-index:0;opacity:.18;pointer-events:none;margin:0;padding:0;min-height:0}
.br.ask .dq{background:var(--dn)}.br.bid .dq{background:var(--up)}
.br.ask .p{color:var(--dn-t)}.br.bid .p{color:var(--up-t)}
.od{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:4px;vertical-align:middle;background:currentColor}
.hmid{position:relative;z-index:2;display:flex;align-items:baseline;gap:8px;padding:4px 12px;margin:2px 0;background:var(--card);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.hmid b{font-size:17px;font-weight:600}.hmid small{color:var(--ink-2);font-weight:500}
.trows{flex:1;min-height:0;overflow:hidden}
.trows .br{height:18px;line-height:18px}
.trows .t{color:var(--ink-2)}
.C.stale .book,.C.stale .trows{opacity:.45}

/* 동기화 상세 (상단 칩 아래에 열림) */
.spop{right:auto;width:min(420px,calc(100vw - 16px));max-height:calc(100vh - 70px);overflow:auto;padding:0 0 4px}
.spop .ph{padding:6px 8px 2px 12px}
.spop .icon-btn{width:28px;height:28px}
.srows{display:flex;flex-direction:column;padding:0 12px}
.sr{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;min-height:24px;border-top:1px solid var(--line);font-size:12px}
.sr:first-child{border-top:0}
.sr .sk{font-weight:600;white-space:nowrap}
.sr .sx{color:var(--ink-2);font-weight:500;text-align:right;line-height:1.3}
.sr .sv{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;white-space:nowrap}
.sr[data-s="ok"] .sv{color:var(--up-t)}
.sr[data-s="sync"] .sv,.sr[data-s="lag"] .sv{color:var(--warn)}
.sr[data-s="diff"] .sv,.sr[data-s="down"] .sv{color:var(--dn-t)}
.sr[data-s="na"] .sv{color:var(--ink-2)}
.sr.eng .sk{color:var(--ink-2)}
.lat{margin:4px 12px 8px;border-top:1px solid var(--line);padding-top:4px}
.lat .lh{display:grid;grid-template-columns:minmax(0,1fr) 62px 70px;gap:6px;font-size:11px;font-weight:600;color:var(--ink-2)}
.lat .lh span:nth-child(n+2){text-align:right}
.lat .lr{display:grid;grid-template-columns:minmax(0,1fr) 62px 70px;gap:6px;min-height:18px;align-items:center;font-size:12px}
.lat .lr span:nth-child(n+2){text-align:right;font-weight:600}
.lat .lr .lk{font-weight:500}
.lat .err{font-size:11px;color:var(--ink-2);font-weight:500;margin-top:2px}

/* ===== ④ 최근 7일 · 자산 추이(하단 '성과' 탭) ===== */
.G{display:flex;flex-direction:column;height:232px}
.fperf{display:flex;flex-direction:column;height:320px;padding-top:4px}
.fperf[hidden]{display:none}
.Q .eqwrap{position:relative;flex:1;min-height:0}
.Q .eqchart{position:absolute;inset:0}
.Q .eqnote{padding:0 12px 6px;font-size:11px;color:var(--ink-2);font-weight:500;min-height:16px}
.Q .eqnote:empty{display:none}
.Q .eqempty{position:absolute;inset:0;display:grid;place-items:center;color:var(--mute);font-weight:600;font-size:12.5px;pointer-events:none}
.G .gsum7{font-size:12px;font-weight:600;color:var(--ink-2)}
.G .g7{padding:0 8px 6px;overflow:auto;flex:1;min-height:0}
.g7 table{width:100%;border-collapse:collapse;font-size:12px}
.g7 th{font-size:11px;font-weight:600;color:var(--ink-2);padding:3px 5px;text-align:right;white-space:nowrap}
.g7 th:first-child,.g7 td:first-child{text-align:left}
.g7 td{padding:2px 5px;border-top:1px solid var(--line);text-align:right;white-space:nowrap;font-weight:500;line-height:1.3}
.g7 td:first-child{color:var(--ink-2)}
.g7 tr.today td{background:var(--tint-acc)}
.g7 td small.flw{display:block;font-size:10.5px;font-weight:500;color:var(--ink-2);white-space:nowrap;line-height:1.2}

/* ===== ⑤ 하단 탭 ===== */
.F{display:flex;flex-direction:column;overflow:visible}
.ftabs{display:flex;gap:2px;padding:6px 8px;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--line);align-items:center}
.ftabs::-webkit-scrollbar{display:none}
.ftabs button{border:0;background:transparent;font:inherit;font-weight:600;font-size:12.5px;color:var(--ink-2);padding:4px 11px;border-radius:var(--r-b);cursor:pointer;white-space:nowrap;min-height:28px}
.ftabs button:hover{color:var(--ink)}
.ftabs button.on{background:var(--tab-on-bg);color:var(--tab-on-ink)}
.ftabs .cnt{font-weight:700;margin-left:2px}
.fbar{display:flex;gap:10px;flex-wrap:wrap;padding:0 12px}
.fbar:not(:empty){padding-top:8px}
.fbody{min-height:0;max-height:min(460px,60vh);overflow:auto;padding:0 6px 8px}
.fbody[hidden]{display:none}
.tw{overflow:auto}
.fbody table{width:100%;border-collapse:collapse;font-size:12px}
.fbody th{position:sticky;top:0;background:var(--card);z-index:1;font-size:11.5px;padding:6px 8px;white-space:nowrap;text-align:left;border-bottom:1px solid var(--line)}
.fbody th.r,.fbody td.r{text-align:right}
.fbody td{padding:5px 8px;border-top:1px solid var(--line);white-space:nowrap}
.fbody tr.none td{text-align:center;color:var(--mute);padding:18px 8px;font-weight:600}
.fbody tr.sumrow td{font-weight:700;background:var(--tint-acc)}
.fbody tr.hit td{background:var(--tint-live);animation:flashnt .2s ease-out}
.fbody tr.stale td{color:var(--mute)}
.fbody tr.stale .up,.fbody tr.stale .dn{color:var(--mute)}
.sidebadge{display:inline-block;font-size:10.5px;font-weight:700;padding:0 5px;border-radius:4px;border:1px solid currentColor;line-height:16px}
.sumline{padding:6px 10px;font-size:12px;font-weight:500;color:var(--ink-2)}.sumline b{color:var(--ink)}
.sumline.hnote{color:var(--warn)}
.empty0{display:flex;flex-direction:column;align-items:center;gap:4px;padding:28px 8px;color:var(--mute);font-weight:600}
.empty0 b{font-size:15px;color:var(--ink-2)}
.pcards{display:none}
.lvl-tag{display:inline-block;font-size:10.5px;font-weight:700;padding:0 5px;border-radius:4px;border:1px solid currentColor;line-height:16px}
.lvl-tag.WARN{color:var(--warn)}.lvl-tag.ERROR{color:var(--dn-t)}.lvl-tag.INFO{color:var(--ink-2)}
.cdbar{display:none}

/* ===== 폭별 배치 ===== */
@media (max-width:1699px){
  .tgrid{height:auto;grid-template-columns:minmax(0,1fr) minmax(300px,32%);grid-template-rows:auto 570px;
    grid-template-areas:"E C" "B C"}
  .E{flex-direction:row;flex-wrap:wrap;align-content:flex-start;overflow:hidden}
  .E .ph{flex:0 0 100%;padding-bottom:0;min-height:30px}
  .E .bline{flex:1 1 280px;margin:2px 12px 0}
  .E .steps{flex:1 1 100%;flex-direction:row;margin:6px 12px 0;order:3}
  .E .step{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:0;border-top:0;border-left:1px solid var(--line);padding:0 8px;min-height:36px;justify-content:center}
  .E .step:first-child{border-left:0}
  .E .step .sn{display:none}
  .E .step .sl{font-size:11.5px;white-space:nowrap}
  .E .step .ss{font-size:10.5px}
  .E #e-sum,.E .eset{display:none}
  .E #e-chain,.E #e-risk{flex:1 1 280px;margin:8px 12px 0;order:2}
  .E .ops{flex:1 1 300px;margin:8px 12px 10px;order:3}
  .E .bset{flex:1 1 300px;margin:8px 12px 10px;order:4}
  .E .bline{order:1}
  .binfo .xr{display:none}
  .qline{flex-wrap:nowrap;gap:6px 14px;padding:6px 12px 2px}
  .px .big{font-size:20px}.qmoreb .qml{display:none}
  .bh .ttab{display:none}
  .money{grid-template-columns:repeat(6,minmax(0,1fr))}
  .mv{font-size:24px}
  .parts{gap:0 10px}
}
@media (max-width:1300px){
  .mc{padding:8px 10px}
  .mv{font-size:22px}
  .parts{grid-template-columns:repeat(2,auto)}
  .money{min-height:108px}
  .px .big{font-size:18px}
  .fbody table.pos .hx{display:none}
}
@media (max-width:1100px){
  .tgrid{grid-template-columns:minmax(0,1fr);grid-template-rows:none;grid-template-areas:"E" "B" "C"}
  .B{height:460px}.C{height:300px}
  .money{grid-template-columns:repeat(3,minmax(0,1fr))}
  .mc{border-bottom:1px solid var(--line)}
}

/* 휴대폰(390): 상태 바 → 돈 띠 → 봇 → 7일 → 하단 탭 → 차트 → 호가 */
@media (max-width:760px){
  .tpage{gap:8px;padding:8px 12px 24px}
  .money{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"eq td" "ps mr" "cu yd";min-height:0}
  .mc{border-right:0;border-bottom:1px solid var(--line);padding:8px 10px}
  .mc.eq{grid-area:eq;border-right:1px solid var(--line)}.mc.td{grid-area:td}.mc.ps{grid-area:ps;border-right:1px solid var(--line)}.mc.mr{grid-area:mr}.mc.cu{grid-area:cu;border-right:1px solid var(--line);border-bottom:0}.mc.two{grid-area:yd;border-bottom:0}
  .mv{font-size:21px}.mc.eq .mv{font-size:23px}
  .parts{grid-template-columns:repeat(2,auto)}
  .gscale{display:none}
  .ms{font-size:11px}
  .tgrid{display:contents}
  .money{order:0}.E{order:1;display:block;overflow:visible}.G{order:2;height:auto}.F{order:3}.B{order:4}.C{order:5}
  .tpage{min-width:0}
  .fperf{height:260px}
  .E .bline{margin:2px 10px 8px}
  .E .steps{flex-direction:row;margin:0 10px 10px;gap:0}
  .E .step{padding:0 4px;min-height:30px}
  .E .step .sl{font-size:10.5px;white-space:normal;line-height:1.2}
  .E .step .ss{display:none}
  .E #e-sum,.E .eset{display:none}
  .E #e-chain,.E #e-risk{margin:0 10px 10px}
  .E .bset,.E .ops{margin:0 10px 10px}
  .E .ops{margin-bottom:12px}
  .B{height:520px}
  .cdbar{display:none}
  .C{height:340px}
  .G:not(.open) .g7{display:none}
  .G .ph{cursor:pointer;min-height:44px}
  .G .g7{max-height:none}
  .ftabs{padding:6px 6px}
  .ftabs button{min-height:44px;padding:4px 12px}
  .fbody table.pos{display:none}
  .pcards{display:block}
  .pcard{border:1px solid var(--line);border-radius:var(--r);padding:8px 10px;margin:6px 4px}
  .pcard .r1{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.pcard .big{margin-left:auto;font-size:17px;font-weight:600}
  .pcard dl{display:grid;grid-template-columns:1fr 1fr;gap:2px 10px;margin:6px 0 0;font-size:12px}.pcard dt{color:var(--ink-2);font-weight:500}.pcard dd{margin:0;text-align:right;font-weight:600}
  .hm{display:none}
  .fbody th,.fbody td{padding:7px 6px}
  .qline{flex-wrap:wrap}
  .qmoreb{margin-left:0}
  .bh{flex-wrap:wrap;gap:6px 8px}
  .bh .ivs{flex:1 1 100%;display:flex}
  .bh .ivs button{flex:1 1 0;min-width:0;padding:2px 4px}
  .bh .bsp{display:none}
  .bh #bfull{margin-left:auto}
}

/* 봇 운영: 상태 배지·보유 줄·설정 변경·확인 창 (v4e) */
.estate{margin-left:auto;font-size:12px;font-weight:700;padding:2px 10px;border-radius:999px;border:1px solid var(--line);background:var(--bg2);color:var(--ink-2);white-space:nowrap}
.estate.run{color:var(--up-t,var(--up));border-color:color-mix(in srgb,var(--up) 55%,var(--line));background:var(--tint-up,var(--bg2))}
.estate.hold{color:var(--warn);border-color:color-mix(in srgb,var(--warn) 55%,var(--line));background:var(--tint-warn)}
.estate.off{color:var(--mute)}
.epos{margin:6px 0 0;font-size:12px;font-weight:600;color:var(--ink);word-break:keep-all}
.E .tsum{margin-top:8px}
.E .tsum#e-chain{padding-bottom:8px}
.opline.lock{color:var(--warn)}
.bsl dd{white-space:normal;word-break:keep-all}
.bsl dd small.pend,.bsl dd small.est{display:inline-block;margin-left:6px;font-size:10.5px;font-weight:700;color:var(--warn);white-space:nowrap}
.bedit{padding:0 10px 9px}
.bedit .btn{width:100%}
.cbx{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:16px;background:rgba(0,0,0,.55)}
.cbx[hidden]{display:none}
.cbx.sed{z-index:55}
.cbx-b{width:min(440px,100%);max-height:calc(100vh - 32px);overflow:auto;padding:16px;border-radius:var(--r);background:var(--card-hi);border:1px solid var(--line);color:var(--ink)}
.cbx-b h3{margin:0 0 10px;font-size:15px;font-weight:700}
.cbx-b dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:5px 12px;margin:0 0 12px;font-size:12.5px}
.cbx-b dt{color:var(--ink-2);white-space:nowrap}
.cbx-b dd{margin:0;text-align:right;font-weight:600;word-break:keep-all}
.cbx-a{display:flex;gap:8px;justify-content:flex-end}
.cbx-a .btn{min-width:84px;min-height:34px}
.btn.primary{background:var(--btn-main-bg);border-color:transparent;color:var(--btn-main-ink)}
.btn.primary:disabled{background:var(--btn-dis-bg);color:var(--btn-dis-ink);border-color:var(--line)}
.sef{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 12px;align-items:center;margin-bottom:12px;font-size:12.5px;word-break:keep-all}
.sef label{color:var(--ink-2);font-weight:600;white-space:nowrap}
.sin{display:flex;align-items:center;gap:6px}
.sin input{flex:1 1 auto;min-width:0;height:32px;padding:0 8px;border-radius:var(--r-b);border:1px solid var(--line);background:var(--bg2);color:var(--ink);font:inherit;font-weight:600;text-align:right}
.sin b{min-width:42px;font-size:12px;color:var(--ink-2);font-weight:600}
.spv{border-top:1px solid var(--line);padding-top:10px}
.spv small.est{color:var(--warn);font-weight:700;margin-left:4px}
.seerr{min-height:18px;margin:0 0 10px;font-size:12.5px;font-weight:600;color:var(--dn-t);word-break:keep-all}
@media (max-width:520px){.cbx{padding:10px}.cbx-b{padding:14px}.cbx-b dt{white-space:normal}}
@media (min-width:761px) and (max-width:1699px){
  .E #e-chain .gl4,.E #e-risk .gl4{grid-template-columns:auto minmax(0,1fr)}
  .bsl{grid-template-columns:auto minmax(0,1fr) auto minmax(0,1fr);gap:4px 14px}
  .bsl dd{text-align:left}
  .bsl dd#bs-mul{grid-column:2 / -1}
}
.cbx-pw{display:block;width:100%;box-sizing:border-box;height:36px;margin:0 0 12px;padding:0 10px;border-radius:var(--r-b);border:1px solid var(--line);background:var(--bg2);color:var(--ink);font:inherit;font-size:16px;font-weight:600}
.cbx-pw[hidden]{display:none}
/* v4g: 설정 창 방향 3칸 버튼·항목 설명, 첫 화면 방향 배지 */
.sdir{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--line);border-radius:var(--r-b);overflow:hidden;background:var(--bg2)}
.sdir button{min-height:34px;padding:0 6px;border:0;border-right:1px solid var(--line);background:transparent;color:var(--ink-2);font:inherit;font-size:12.5px;font-weight:700;cursor:pointer;white-space:nowrap}
.sdir button:last-child{border-right:0}
.sdir button.on{background:var(--btn-main-bg);color:var(--btn-main-ink)}
.shint{grid-column:1 / -1;margin:-4px 0 2px;font-size:11.5px;line-height:1.45;color:var(--ink-2);word-break:keep-all}
.dirbadge{margin-left:auto;padding:1px 9px;border-radius:999px;border:1px solid color-mix(in srgb,var(--warn) 55%,var(--line));background:var(--bg2);color:var(--warn);font-size:12px;font-weight:700;white-space:nowrap}
.dirbadge[hidden]{display:none}
.dirbadge + .pstate{margin-left:8px}

/* ===== v4f: 첫 화면 재구성 — ID 띠(환경·계정·종목·상태) → 돈·한도 4칸 → 운영 버튼(E)·포지션·보호(P)·다음 실행(X) → 차트(접힘) → 하단 탭 4개 ===== */
.idband{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:8px 24px;padding:12px 16px;align-items:center}
.idl{display:flex;align-items:center;gap:8px 18px;flex-wrap:wrap;min-width:0}
.idenv{font-size:20px;font-weight:800;line-height:1.2;padding:4px 16px;border-radius:6px;border:2px solid var(--live);color:var(--live);background:color-mix(in srgb,var(--live) 12%,transparent);white-space:nowrap}
.idenv.live{border-color:var(--dn);color:var(--dn-t);background:var(--tint-dn)}
.idsym{display:flex;align-items:baseline;gap:6px 14px;flex-wrap:wrap;min-width:0}
.idsym b{font-size:34px;font-weight:800;line-height:1;white-space:nowrap}
.idmk{font-size:14px;font-weight:600;color:var(--ink-2);white-space:nowrap}
.idacct{font-size:12.5px;font-weight:600;color:var(--ink-2);word-break:keep-all}
.idacct:empty{display:none}
.idr{display:flex;flex-direction:column;gap:5px;min-width:0}
.idstate{display:flex;align-items:center;gap:6px 12px;flex-wrap:wrap}
.estate{font-size:15px;font-weight:800;padding:3px 14px;border-radius:999px;border:1px solid var(--line);background:var(--bg2);color:var(--ink-2);white-space:nowrap;margin-left:0}
.estate.run{color:var(--up-t);border-color:color-mix(in srgb,var(--up) 55%,var(--line));background:var(--tint-up)}
.estate.hold{color:var(--warn);border-color:color-mix(in srgb,var(--warn) 55%,var(--line));background:var(--tint-warn)}
.estate.off{color:var(--mute)}
.idwhy{font-size:13px;font-weight:700;color:var(--ink);word-break:keep-all;min-width:0}
.idwhy.warn{color:var(--warn)}.idwhy.bad{color:var(--dn-t)}
.idwhy[hidden]{display:none}
.idfresh{display:flex;flex-wrap:wrap;gap:2px 16px;font-size:12px;color:var(--ink-2)}
.idfresh .fr{white-space:nowrap}.idfresh .fr b{color:var(--ink);font-weight:600}
.idfresh .fr.bad,.idfresh .fr.bad b{color:var(--dn-t);font-weight:700}
.iddec{font-size:12.5px;color:var(--ink-2);word-break:keep-all;line-height:1.5}
.iddec .dly{white-space:nowrap;margin-left:6px}.iddec .dly.bad{color:var(--dn-t);font-weight:700}
.money{grid-template-columns:minmax(0,1fr) minmax(0,1.6fr) minmax(0,1fr) minmax(0,1.3fr)}
.mc.lim{gap:6px}.mc.lim .mv{font-size:20px;white-space:normal;word-break:keep-all}
.mc.lim .gf{background:var(--accent)}
.mc.lim.warn .gf{background:var(--warn)}.mc.lim.bad{background:var(--tint-dn);box-shadow:inset 0 0 0 1px var(--dn)}.mc.lim.bad .gf{background:var(--dn)}
.tgrid{height:auto;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:auto;grid-template-areas:"E P X";align-items:stretch}
.E,.P,.X{overflow:visible;display:flex;flex-direction:column}
.P{grid-area:P}.X{grid-area:X}
.kv{display:grid;grid-template-columns:auto minmax(0,1fr);gap:5px 14px;margin:0;padding:6px 14px 8px;font-size:12.5px}
.kv dt{color:var(--ink-2);font-weight:500;white-space:nowrap}
.kv dd{margin:0;text-align:right;font-weight:600;word-break:keep-all;min-width:0}
.pv.ok{color:var(--up-t)}.pv.bad{color:var(--dn-t);font-weight:800}.pv.warn{color:var(--warn)}
.kv dd.bad{color:var(--dn-t);font-weight:700}.kv dd.warnx{color:var(--warn)}
.P.bad{background:var(--tint-dn);box-shadow:inset 0 0 0 2px var(--dn)}
.P.warn{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--warn) 60%,var(--line))}
.ph2{padding:6px 14px 0;margin-top:4px;border-top:1px solid var(--line);font-size:12px;font-weight:700}
.pstate{margin-left:auto;font-size:12.5px;font-weight:700;color:var(--ink-2);white-space:nowrap}
.pstate.ok{color:var(--up-t)}.pstate.bad{color:var(--dn-t)}
.xwhy{margin:0;padding:0 14px 6px 30px;font-size:12.5px;font-weight:600;color:var(--dn-t);word-break:keep-all}
.xwhy:empty{display:none}
.X .bset{margin-top:auto}
.op-start{padding:8px 14px 0}
.op-start .btn{width:100%;min-height:46px;font-size:15px}
.op-stop{margin:14px 14px 0;padding-top:14px;border-top:1px solid var(--line)}
.op-stop .og{display:grid;gap:8px;grid-template-columns:1fr 1fr}
.op-stop .btn{width:100%;min-height:46px;white-space:normal;line-height:1.2;padding:4px 8px}
.btnwrap .btn.primary:disabled{background:var(--btn-dis-bg);color:var(--btn-dis-ink)}
.opprog{display:none;flex-wrap:wrap;gap:4px 6px;align-items:center;margin-top:10px;font-size:12px}
.opprog.show{display:flex}
.opprog b{font-weight:700;margin-right:2px}
.opprog small{flex:1 1 100%;color:var(--ink-2);font-size:11.5px;line-height:1.4;word-break:keep-all}
.stp{padding:1px 9px;border-radius:999px;border:1px solid var(--line);color:var(--mute);white-space:nowrap}
.stp.past{color:var(--ink-2)}
.stp.cur{color:var(--ink);border-color:var(--accent);font-weight:700}
.stp.cur.ok{color:var(--up-t);border-color:var(--up)}
.stp.cur.bad{color:var(--dn-t);border-color:var(--dn);background:var(--tint-dn)}
.stp.cur.warn{color:var(--warn);border-color:var(--warn)}
.E .ops{margin:0;display:flex;flex-direction:column;gap:0}
.E .opline{margin:12px 14px 12px}
.bhl{font-size:12px;font-weight:500;color:var(--ink-2)}
.B{display:flex;flex-direction:column;height:auto}
.B:not(.folded) .cwrap{height:380px;flex:none}
.B.folded .cwrap,.B.folded .binfo{display:none}
.B .bh .btn{min-height:28px}
.g7{padding:0 8px 6px}
.Q.fperf{height:auto;min-height:320px}
.Q .eqwrap{min-height:230px;flex:none;height:230px}
.fbody .sumline{padding:4px 8px}
/* 1440·1280·1100: 3칸을 2열로(포지션·보호가 옆칸과 짝, 다음 실행은 아래 한 줄) */
@media (max-width:1699px){
  .tgrid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"E P" "X X";height:auto}
  .money{grid-template-columns:repeat(4,minmax(0,1fr))}
  .X .kv{grid-template-columns:auto minmax(0,1fr) auto minmax(0,1fr)}
}
@media (max-width:1100px){
  .idband{grid-template-columns:minmax(0,1fr)}
  .money{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mc{border-bottom:1px solid var(--line)}
  .tgrid{grid-template-columns:minmax(0,1fr);grid-template-areas:"E" "P" "X"}
  .X .kv{grid-template-columns:auto minmax(0,1fr)}
}
/* 휴대폰: ID → 돈 → 포지션·보호 → 운영 → 다음 실행 → 하단 탭 → 차트, 정지·즉시 청산은 하단 고정 바 */
@media (max-width:760px){
  .idband{padding:10px 12px}
  .idsym b{font-size:28px}
  .idenv{font-size:17px;padding:3px 12px}
  .money{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"eq td" "cu lim"}
  .mc.lim{grid-area:lim;border-right:0}
  .tpage{padding-bottom:164px}
  .idband{order:0}.money{order:1}.P{order:2}.E{order:3;display:flex}.X{order:4}.F{order:5}.B{order:6}
  .tgrid{display:contents}
  .P,.E,.X{overflow:visible}
  .op-stop{position:fixed;left:0;right:0;bottom:0;z-index:35;margin:0;padding:8px 12px calc(8px + env(safe-area-inset-bottom));background:var(--card-hi);border-top:1px solid var(--line);box-shadow:0 -6px 16px rgba(0,0,0,.4)}
  .op-stop .btn{min-height:50px}
  .opprog{margin-top:6px}
  .op-start .btn{min-height:50px}
  .mc.lim .mv{font-size:17px}
  .X .kv{grid-template-columns:auto minmax(0,1fr)}
  .B{height:auto}
  .B:not(.folded) .cwrap{height:300px}
}
/* 이전 폭별 배치(E 행 배치·고정 높이)를 v4f 의 세로 흐름으로 되돌린다 */
.E,.P,.X{flex-direction:column;flex-wrap:nowrap;align-content:stretch;overflow:visible}
.E .ph,.P .ph,.X .ph{flex:none}
.E .ops,.X .bset{flex:none;order:0;margin-left:0;margin-right:0}
.X .bset{margin:auto 14px 12px}
.E .ops .opline{margin:12px 14px 12px}
.pstate:empty{display:none}
/* v4f-2: 거래량 막대 제거(시간 축만), 운영 칸 상태 채움, 휴대폰 고정 바 간격 */
.cvol{height:30px}
.vhdr{display:none}
.ekv{padding:12px 14px 4px;margin-top:6px;border-top:1px solid var(--line)}
.ekv dd{white-space:normal}
.E .ops{flex:1 1 auto}
@media (max-width:760px){
  .op-stop .og{gap:28px}
  .op-stop .btn{min-height:52px}
  .ekv{margin-top:2px}
}