/* NHIP V3.0 — compact trading workspace refinement.
   CSS-only: intentionally does not change quote, exchange, account, or order logic. */
:root{--v30-space:7px;--v30-radius:8px}
/* Use available viewport space without forcing the whole page into a giant chart. */
.tp{gap:var(--v30-space);min-width:0}
.tp-head{gap:7px 11px;padding:8px 10px;border-radius:var(--v30-radius)}
.tp-body{gap:7px;align-items:start}
.tp-mid{gap:7px;min-width:0}
.tp-chart,.tp-info,.tp-ticket{padding:8px 9px;border-radius:var(--v30-radius);min-width:0}
.tp-chart .trade-chart{height:clamp(250px,36vh,340px);min-height:230px}
.tp-wl,.tp-ticket{top:7px;max-height:calc(100dvh - 14px);overflow:auto;overscroll-behavior:contain}
.tp-wl{padding:6px}
.tp-wr{min-height:27px;padding:3px 5px;gap:4px;font-size:10.5px}
.tp-wr span:last-child{min-width:44px}
.tp-th{margin-bottom:6px;font-size:12px}
.tp-tools{gap:5px;margin-bottom:3px}
.tp-rng button,.tp-tabs button{min-height:24px;padding-inline:6px;font-size:10px}
.tp-chart .trade-chart canvas,.tp-chart .trade-chart svg{max-width:100%}
.tp-t{font-size:10.5px}
.tp-t th{padding:4px 5px;font-size:9.5px;white-space:nowrap}
.tp-t td{padding:5px;white-space:nowrap}
.tp-ticket .tr-side button{min-height:33px}
.tp-ticket .tr-go{min-height:37px}
.tp-acct{gap:4px;margin-bottom:6px}
.tp-acct div{padding:4px 5px}
.tp-ig div{padding:4px 0}
/* Wide monitors: reserve a predictable order-ticket column and avoid oversized chart height. */
@media(min-width:1440px){.tp-body{grid-template-columns:minmax(170px,200px) minmax(0,1fr) minmax(270px,300px)}.tp-chart .trade-chart{height:clamp(280px,38vh,360px)}}
@media(min-width:1101px) and (max-width:1439px){.tp-body{grid-template-columns:minmax(145px,175px) minmax(0,1fr) minmax(250px,280px)}.tp-chart .trade-chart{height:clamp(245px,35vh,315px)}}
@media(max-width:1100px){.tp-body{grid-template-columns:minmax(0,1fr) minmax(260px,300px)}.tp-wl{position:static;grid-column:1/-1;max-height:none}.tp-wlist{display:flex;gap:4px;overflow-x:auto;padding-bottom:2px}.tp-wr{flex:0 0 auto;min-width:110px}.tp-chart .trade-chart{height:clamp(250px,38vh,330px)}}
@media(max-width:900px){.tp-body{grid-template-columns:minmax(0,1fr)}.tp-wl,.tp-ticket{position:static;max-height:none}.tp-wlist{display:flex;overflow-x:auto}.tp-chart .trade-chart{height:clamp(235px,34vh,300px);min-height:220px}}
@media(max-width:600px){.tp{gap:6px}.tp-head{padding:7px;gap:6px}.tp-px b{font-size:21px}.tp-stats{gap:4px 6px}.tp-stats dt{font-size:8px}.tp-stats dd{font-size:10px}.tp-chart,.tp-info,.tp-ticket{padding:7px}.tp-chart .trade-chart{height:250px;min-height:220px}.tp-t{font-size:10px}.tp-t th,.tp-t td{padding:4px}.tp-ticket .tr-side button{min-height:36px}.tp-ticket .tr-go{min-height:40px}}
@media(max-width:360px){.tp-chart .trade-chart{height:225px;min-height:210px}.tp-stats dd{font-size:9px}.tp-px b{font-size:19px}}
@media(prefers-reduced-motion:reduce){.tp *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}