/* Terminal: list | main | ticket, positions docked below. Hairlines, no cards. */
.term { --dock-h: clamp(150px, 24svh, 236px); display: grid; grid-template-columns: 332px minmax(0, 1fr) 340px; grid-template-rows: minmax(0, 1fr) var(--dock-h);
  grid-template-areas: "list main ticket" "dock dock ticket";
  height: calc(100svh - var(--bar-h) - var(--banners-h, 0px)); min-height: 720px; }
.m-top, .m-buybar, .drawer-b { display: none; }
.t-list { grid-area: list; display: flex; flex-direction: column; min-height: 0; border-right: 1px solid var(--line); }
.t-main { grid-area: main; display: grid; grid-template-rows: auto minmax(260px, 1fr) auto clamp(120px, 18svh, 176px); min-width: 0; min-height: 0; }
/* before launch the dock only holds one line of text: give its height to the chart */
.term[data-phase="prelaunch"] { --dock-h: 96px; }
.t-ticket { grid-area: ticket; min-height: 0; overflow-y: auto; border-left: 1px solid var(--line); background: var(--ink-1); scrollbar-width: thin; }
.t-dock { grid-area: dock; display: flex; flex-direction: column; min-height: 0; border-top: 1px solid var(--line-2); background: var(--room); }

/* token list */
.tlist { display: flex; flex-direction: column; min-height: 0; height: 100%; }
.lt-tabs { padding: 4px 8px 0; border-bottom: 1px solid var(--line); flex: none; overflow-x: auto; scrollbar-width: none; }
.lt-tabs::-webkit-scrollbar { display: none; }
.lt-tabs button { padding: 10px 7px 11px; font-size: 12.5px; white-space: nowrap; flex: none; }
.lt-tabs button[aria-selected="true"]::after { left: 7px; right: 7px; }
.lt-ctl { display: flex; align-items: center; gap: 10px; min-height: 30px; padding: 8px 10px 0 10px; flex: none; }
.lt-iv { padding: 2px; border-radius: 7px; }
.lt-iv button { height: 22px; padding: 0 9px; font-size: 11.5px; border-radius: 5px; }
.lt-only { margin-left: auto; display: flex; align-items: center; gap: 6px; padding: 4px 2px; font-size: 11.5px; font-weight: 600; color: var(--text-3); white-space: nowrap; }
.lt-fb { display: flex; align-items: center; gap: 7px; margin: 8px 10px 0; padding: 6px 9px; border-radius: 6px; background: rgba(255, 90, 31, .07); font-size: 11.5px; line-height: 1.4; color: #ffcfb8; flex: none; }
.lt-fb i { width: 6px; height: 6px; border-radius: 50%; background: var(--ember); flex: none; }
.lt-src { flex: none; padding: 7px 12px 8px; border-top: 1px solid var(--line); font-size: 10.5px; color: var(--text-3); }
.lt-search { margin: 10px 10px 6px; flex: none; }
.lt-only i { width: 12px; height: 12px; border-radius: 3px; border: 1px solid var(--line-3); transition: background .15s, border-color .15s; }
.lt-only[aria-checked="true"] { color: var(--text); }
.lt-only[aria-checked="true"] i { background: var(--text); border-color: var(--text); box-shadow: inset 0 0 0 2px var(--ink-1); }
.lt-row.nt .lt-sym, .lt-row.nt .lt-px, .lt-row.nt .lt-ch, .lt-row.nt .ticon { opacity: .5; }
.lt-row.nt .lt-sub { color: var(--ember-hot); opacity: .8; }
.lt-search svg { flex: none; }
.lt-search input::-webkit-search-cancel-button { display: none; }
.lt-h { display: grid; grid-template-columns: minmax(0, 1fr) 72px 60px; gap: 0 8px; align-items: end; padding: 6px 12px 6px 48px; font-size: 10.5px; font-weight: 650; color: var(--text-3); letter-spacing: .04em; flex: none; }
.lt-h > span.r { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; }
.lt-h small { font-size: 10px; font-weight: 500; letter-spacing: .02em; color: var(--text-4); white-space: nowrap; }
.lt-h small:empty { display: none; }
.lt-h .r, .r { text-align: right; }
.lt-rows { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin; scrollbar-color: var(--ink-4) transparent; }
.lt-row { display: grid; grid-template-columns: 28px minmax(0, 1fr) 72px 60px; align-items: center; gap: 0 8px; height: 52px; padding: 0 12px;
  border-top: 1px solid var(--line); cursor: pointer; position: relative; }
.lt-row:hover { background: var(--ink-1); }
.lt-row[aria-selected="true"] { background: var(--ink-2); }
.lt-row[aria-selected="true"]::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 2px; background: var(--text); }
.lt-row:focus-visible { outline-offset: -2px; }
.lt-n { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.lt-sym { font-weight: 650; font-size: 13.5px; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lt-sub { font-size: 11px; color: var(--text-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lt-c { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; min-width: 0; }
.lt-px { font-size: 12.5px; color: var(--text); font-weight: 550; }
.lt-ch { font-size: 12.5px; font-weight: 600; }
.lt-px, .lt-ch, .lt-pxs, .lt-chs { max-width: 100%; overflow: hidden; white-space: nowrap; }
.lt-pxs, .lt-chs { font-size: 10.5px; color: var(--text-3); white-space: nowrap; }
.lt-chs.full { color: var(--ember-hot); }
.lt-note { padding: 18px 16px; font-size: 12.5px; color: var(--text-3); line-height: 1.6; }
.sk-row { cursor: default; }
.sk-row:hover { background: none; }

/* token header */
.t-head { border-bottom: 1px solid var(--line); min-height: 72px; display: flex; min-width: 0; }
.th { flex: 1; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 12px 20px; min-width: 0; }
.th-empty { flex: 1; display: flex; align-items: center; padding: 0 20px; color: var(--text-3); font-size: 13px; }
.th-id { display: flex; align-items: center; gap: 12px; min-width: 0; flex: 1 1 auto; overflow: hidden; }
.th-idt { min-width: 0; }
.th-ic .ticon { border-radius: 8px; }
.th-l1 { display: flex; align-items: baseline; gap: 12px; min-width: 0; overflow: hidden; }
.th-sym { font-size: 26px; line-height: 1.1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 280px; flex: 0 0 auto; min-width: 2.2em; }
.th-status { font-size: 12px; font-weight: 600; color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; flex: 0 1 auto; }
.th-status.listed { color: var(--up); }
.th-nt { font-size: 11px; font-weight: 650; color: var(--ember-hot); border: 1px solid rgba(255, 90, 31, .4); border-radius: 4px; padding: 1px 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; flex: 0 1 auto; }
.th-l2 { display: flex; align-items: center; gap: 10px; margin-top: 4px; font-size: 12px; color: var(--text-3); min-width: 0; white-space: nowrap; }
.th-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 200px; min-width: 0; }
.th-addr { display: inline-flex; align-items: center; gap: 2px; flex: none; }
.th-a { color: var(--text-2); text-decoration: none; display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.th-a:hover { color: var(--text); }
.th-a svg { opacity: .5; }
.th-r { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; flex: none; }
.th-px { display: flex; align-items: baseline; gap: 10px; white-space: nowrap; }
.th-price { font-size: 19px; font-weight: 650; letter-spacing: -.01em; }
.th-chg { font-size: 13px; font-weight: 600; }
.th-usd { font-size: 11.5px; color: var(--text-3); }
.th-kv { display: flex; gap: 0; }
.th-kv > div { display: flex; align-items: center; gap: 6px; padding: 0 0 0 14px; margin-left: 14px; border-left: 1px solid var(--line); }
.th-kv > div:first-child { border-left: 0; margin-left: 0; padding-left: 0; }
.th-kv dt { font-size: 11px; color: var(--text-3); white-space: nowrap; }
.th-kv dd { display: flex; align-items: center; gap: 6px; }
.th-kv b { font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.th-prog { width: 36px; height: 3px; background: var(--line-2); position: relative; overflow: hidden; border-radius: 2px; }
.th-prog i { position: absolute; inset: 0; background: var(--text-2); transform-origin: left; }

/* chart */
.t-chart { position: relative; min-height: 0; container-type: inline-size; }
/* a narrow chart keeps the close and the change in its legend, so the range buttons never sit on it */
@container (max-width: 760px) { .chart-legend span:nth-child(-n+3) { display: none; } }
.chart { position: absolute; inset: 0; }
.chart-canvas { position: absolute; inset: 0; display: block; touch-action: pan-y; }
.chart-legend { position: absolute; left: 14px; top: 10px; display: flex; gap: 12px; font-size: 11.5px; color: var(--text-2); font-variant-numeric: tabular-nums; pointer-events: none; }
.chart-legend b { color: var(--text-3); font-weight: 600; margin-right: 2px; }
.chart-note { position: absolute; inset: 0; display: grid; place-items: center; color: var(--text-3); font-size: 13px; pointer-events: none; }
.ch-tf { position: absolute; right: 78px; top: 8px; z-index: 2; padding: 2px; border-radius: 7px; }
.ch-tf button { height: 24px; padding: 0 8px; font-size: 12px; border-radius: 5px; }
.ch-tf button[aria-disabled="true"] { opacity: .35; cursor: not-allowed; }
/* source note: top left under the OHLC legend, away from the newest candles (right) and the volume bars (bottom) */
.chart-src { position: absolute; left: 14px; top: 32px; z-index: 1; font-size: 10.5px; color: var(--text-4, var(--text-3)); pointer-events: none; white-space: nowrap; max-width: calc(100% - 330px); overflow: hidden; text-overflow: ellipsis; }

/* game numbers */
/* 3 or 4 cells (the quantity cell hides for listed tokens): cells share the width, hairlines from a 1px gap */
.gbar { display: flex; flex-wrap: wrap; gap: 1px; background: var(--line); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.gbar > div { flex: 1 1 0; padding: 9px 16px 10px; min-width: 0; background: var(--room); }
.gbar > div[hidden] { display: none; }
.gbar dt { font-size: 11px; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: inline-block; max-width: 100%; }
.gbar dt[data-tip] { cursor: help; border-bottom: 1px dotted var(--text-4); }
.gbar dd { display: flex; align-items: center; gap: 10px; margin-top: 3px; }
.gbar b { font-size: 14px; font-weight: 600; white-space: nowrap; }
.gbar.pre b { font-weight: 500; color: var(--text-3); font-size: 13px; }
.g-bar { flex: 1; max-width: 70px; height: 3px; border-radius: 2px; background: var(--line-2); position: relative; overflow: hidden; }
.g-bar i { position: absolute; inset: 0; background: var(--text-2); transform-origin: left; }
.g-bar.hot i { background: var(--ember); }

/* tape */
.t-bottom { display: flex; flex-direction: column; min-height: 0; }
.tb-h { flex: none; padding: 0 8px; border-bottom: 1px solid var(--line); }
.tb-tabs button { padding: 8px 8px 7px; font-size: 11.5px; letter-spacing: .02em; }
.tb-tabs button[aria-selected="true"]::after { left: 8px; right: 8px; }
.t-bottom[data-b="tape"] .t-data, .t-bottom[data-b="data"] .t-tape { display: none; }
.t-tape { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.t-data { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin; }

/* GMGN token data: figures in a flowing grid, labelled as GMGN's, no verdicts */
.gm { padding: 10px 16px 12px; display: grid; gap: 10px; align-content: start; }
.gm-h { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 5px; font-size: 11px; font-weight: 650; letter-spacing: .02em; color: var(--text-3); }
.gm-risk .gm-h { color: var(--text-2); }
.gm-src { font-weight: 500; white-space: nowrap; }
.gm-grid { display: flex; flex-wrap: wrap; gap: 5px 20px; }
.gm-c { display: inline-flex; align-items: baseline; gap: 6px; white-space: nowrap; }
.gm-c span { font-size: 11.5px; color: var(--text-3); }
.gm-c b { font-size: 12.5px; font-weight: 600; color: var(--text); }
.gm-c.warn b { color: var(--ember); }
.m-honey { flex: none; font-size: 11px; font-weight: 650; color: var(--ember-hot); border: 1px solid rgba(255, 90, 31, .6); border-radius: 4px; padding: 0 5px; line-height: 17px; }
.gm-warn { padding: 8px 12px; border: 1px solid rgba(255, 90, 31, .45); border-radius: 8px; background: rgba(255, 90, 31, .08); color: #ffcfb8; font-size: 12px; line-height: 1.55; text-wrap: pretty; }
.gm-h > span:first-child { flex: none; }
.gm-soc { display: inline-flex; align-items: baseline; gap: 10px; margin-left: 14px; font-weight: 500; min-width: 0; }
.gm-soc-l { display: inline-flex; flex-wrap: wrap; gap: 4px 12px; }
.gm-h .gm-src { margin-left: auto; }
.gm-a { display: inline-flex; align-items: center; gap: 3px; color: var(--text-2); text-decoration: none; }
.gm-a:hover { color: var(--text); }
.gm-a svg { opacity: .5; }
.gm-state { font-size: 12px; color: var(--text-3); line-height: 1.55; }
.gm.empty .gm-sec { display: none; }
.th-honey { border-color: rgba(255, 90, 31, .7); background: rgba(255, 90, 31, .1); }
.tape { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin; }
.tape-t th { padding: 6px 16px 5px; position: sticky; top: 0; background: var(--room); z-index: 1; }
.tape-t td { padding: 5px 16px; font-size: 12.5px; }
.tape-t td a { color: var(--text-2); }
.tape-note { padding: 14px 16px; font-size: 12.5px; color: var(--text-3); }

/* ticket */
.ticket { display: flex; flex-direction: column; min-height: 100%; padding-bottom: 16px; }
.tk-h { display: flex; align-items: center; gap: 8px; padding: 16px 20px 14px; border-bottom: 1px solid var(--line); }
.tk-title { flex: 1; font-size: 21px; line-height: 1.15; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tk-seg { margin: 14px 20px 0; }
.tk-room { margin: 14px 20px 0; padding: 11px 14px 12px; border: 1px solid var(--line-2); border-radius: var(--r2);
  background: linear-gradient(180deg, rgba(240, 222, 204, .035), rgba(240, 222, 204, 0)); }
.tk-room-h { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: 12px; color: var(--text-2); }
.tk-room-v { font-size: 18px; font-weight: 700; color: var(--text); letter-spacing: -.01em; }
.tk-room-v.full { color: var(--ember-hot); }
.tk-room-v.pend { font-size: 13px; font-weight: 500; color: var(--text-3); }
.tk-room-bar { display: block; height: 3px; border-radius: 2px; background: var(--line-2); margin-top: 9px; overflow: hidden; position: relative; }
.tk-room-bar i { position: absolute; inset: 0; background: var(--text-2); transform-origin: left; transition: transform .4s var(--ease); }
.tk-room.hot .tk-room-bar i { background: var(--ember); }
.tk-room-s { display: block; margin-top: 7px; font-size: 11.5px; color: var(--text-3); line-height: 1.5; }
.tk-est { font-size: 11.5px; color: var(--text-3); line-height: 1.5; }
.ticket.nt .tk-pre, .ticket.nt .tk-amt, .ticket.nt .tk-dl, .ticket.nt .tk-out, .ticket.nt .tk-seg { opacity: .4; pointer-events: none; }
.tk-amt { display: block; margin: 12px 20px 0; padding: 12px 14px 10px; border: 1px solid var(--line-2); border-radius: var(--r2); background: var(--room); cursor: text; transition: border-color .15s; }
.tk-amt:focus-within { border-color: var(--line-3); box-shadow: 0 0 0 3px rgba(240, 222, 204, .05); }
.tk-amt-h { display: flex; justify-content: space-between; align-items: center; font-size: 11.5px; color: var(--text-3); }
.tk-bal { font-size: 11.5px; color: var(--text-3); }
.tk-bal:hover:not(:disabled) { color: var(--text); }
.tk-bal:disabled { cursor: default; }
.tk-amt-in { display: flex; align-items: baseline; gap: 8px; margin-top: 6px; }
.tk-in { flex: 1; min-width: 0; width: 100%; background: none; border: 0; outline: none; color: var(--text); font-size: 26px; font-weight: 650; letter-spacing: -.01em; padding: 0; }
.tk-in::placeholder { color: var(--text-4); }
.tk-in:disabled { color: var(--text-2); -webkit-text-fill-color: var(--text-2); }
.tk-unit { font-size: 13px; font-weight: 650; color: var(--text-2); }
.tk-eq { min-height: 18px; font-size: 12px; color: var(--text-3); margin-top: 2px; }
.tk-pre { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin: 10px 20px 0; }
.tk-pre button { height: 28px; border: 1px solid var(--line); border-radius: 6px; font-size: 12px; font-weight: 650; color: var(--text-2); }
.tk-pre button:hover { border-color: var(--line-3); color: var(--text); }
.ticket.pre .tk-pre button, .ticket.pre .tk-seg button { pointer-events: none; opacity: .6; }
.tk-dl { margin: 14px 20px 0; font-size: 12.5px; }
.tk-dl > div { display: flex; justify-content: space-between; gap: 12px; padding: 5px 0; color: var(--text-3); }
.tk-dl dd { color: var(--text); font-weight: 550; text-align: right; }
.tk-dl .hot dd b { color: var(--ember-hot); }
.tk-slip { font-size: 12.5px; color: var(--text); font-weight: 550; border-bottom: 1px dotted var(--text-3); }
.tk-out { margin: 12px 20px 0; padding-top: 12px; border-top: 1px solid var(--line); display: grid; gap: 7px; }
.tk-out > div { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 8px; font-size: 12.5px; line-height: 1.5; }
html[lang="en"] .tk-out > div { grid-template-columns: 92px minmax(0, 1fr); }
.tk-out span { color: var(--text-3); }
.tk-out b { font-weight: 550; color: var(--text); }
.tk-out .o-now b, .tk-out .o-down b { color: #ffcfb8; }
.tk-out .o-up b { color: #bdebd3; }
.tk-caps { font-size: 11.5px; color: var(--text-3); line-height: 1.5; }
.tk-act { margin: 18px 20px 0; }
.tk-go { height: 48px; font-size: 15px; }
.tk-go.busy { position: relative; overflow: hidden; }
.tk-go.busy::after { content: ''; position: absolute; left: 0; bottom: 0; height: 2px; width: 30%; background: var(--text-3); animation: txrun 1s var(--ease) infinite; }
.tk-why { margin-top: 8px; font-size: 12px; color: var(--text-3); text-align: center; line-height: 1.5; }
.tk-capnote { margin-top: 6px; font-size: 11.5px; color: var(--text-3); text-align: center; line-height: 1.5; }
.tk-foot { margin: auto 20px 0; padding-top: 18px; font-size: 11.5px; line-height: 1.6; color: var(--text-3); }
.tk-kbd { opacity: .45; color: var(--text-2); }

/* dock */
.dock-h { display: flex; align-items: center; justify-content: space-between; padding: 0 16px 0 10px; border-bottom: 1px solid var(--line); flex: none; }
.dock-meta { font-size: 11.5px; }
.dock-b { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin; }
.pos-note { display: flex; align-items: center; gap: 16px; padding: 22px 20px; font-size: 13px; color: var(--text-3); flex-wrap: wrap; }
.pos-note .ended { color: var(--text-2); }
.pos-row { position: relative; display: grid; grid-template-columns: minmax(150px, 1.25fr) repeat(3, minmax(0, .8fr)) minmax(0, .7fr) minmax(120px, .9fr) minmax(0, 1.7fr) auto;
  align-items: center; gap: 14px; padding: 11px 20px 11px 22px; border-bottom: 1px solid var(--line); }
.pos-row::before { content: ''; position: absolute; left: 0; top: 8px; bottom: 8px; width: 3px; border-radius: 0 2px 2px 0; background: var(--line-2); }
.pos-row.gain::before { background: var(--up); }
.pos-row.loss::before { background: linear-gradient(180deg, transparent, var(--ember) 25%, var(--ember-hot) 50%, var(--ember) 75%, transparent); box-shadow: 0 0 calc(4px + var(--loss, 0) * 14px) rgba(255, 90, 31, .7); }
.pos-t { display: flex; align-items: center; gap: 10px; min-width: 0; color: var(--text); text-decoration: none; }
.pos-t > span:last-child { display: flex; flex-direction: column; min-width: 0; }
.pos-sym { font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pos-sub { font-size: 11.5px; color: var(--text-3); white-space: nowrap; }
.pos-k { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pos-k > span { font-size: 11px; color: var(--text-3); }
.pos-k b { font-size: 13.5px; font-weight: 600; white-space: nowrap; }
.pos-pnl small { font-size: 11px; color: var(--text-3); }
.pos-exp b.exp-soon { color: var(--ember-hot); }
.pos-exp b.exp-done { color: var(--text-2); font-weight: 500; font-size: 11.5px; white-space: normal; line-height: 1.35; }
.pos-bar { display: block; height: 2px; width: 100%; max-width: 110px; background: var(--line-2); position: relative; overflow: hidden; margin-top: 3px; }
.pos-bar i { position: absolute; inset: 0; background: var(--text-3); transform-origin: left; }
.pos-bar.soon i { background: var(--ember); }
.pos-res { font-size: 12.5px; color: var(--text-2); line-height: 1.5; }
.pos-res.bad { color: var(--ember-hot); }
.pos-act { display: flex; gap: 6px; justify-content: flex-end; }
.hist .tbl td, .recent .tbl td { font-size: 12.5px; }
.tbl-wrap:has(tbody:empty) { display: none; }
.pager { display: flex; align-items: center; justify-content: center; gap: 12px; padding: 12px; font-size: 12px; }
/* v1.3 profit review in the history table: pending countdown / voided / claim */
.pay-tag { display: inline-block; margin-left: 4px; padding: 0 5px; border-radius: 3px; font-size: 11px; line-height: 17px; white-space: nowrap; }
.pay-tag.held { color: var(--text-2); background: color-mix(in srgb, var(--text-3) 18%, transparent); }
.pay-tag.void { color: var(--ember-hot); background: color-mix(in srgb, var(--ember) 14%, transparent); }
.pay-btn { margin-left: 6px; height: 22px; padding: 0 8px; font-size: 11.5px; }

/* 1280–1439: slimmer side columns */
@media (max-width: 1439px) {
  .term { grid-template-columns: 312px minmax(0, 1fr) 324px; }
  .pos-row { grid-template-columns: minmax(140px, 1.2fr) repeat(3, minmax(0, .8fr)) minmax(110px, .9fr) minmax(0, 1.5fr) auto; }
  .pos-row .hide-m { display: none; }
}
.t-main > * { min-width: 0; } /* a long header never widens the middle column into the ticket */
/* 1280–1439: the middle column is ~640 px; the identity line keeps the name, the price block drops the USD figure */
@media (max-width: 1439px) { .th { gap: 14px; padding: 12px 16px; } .th-usd { display: none; } }
/* 900–1279: the list becomes a drawer */
@media (max-width: 1279px) {
  .th-kv > div:nth-child(3) { display: none; }
  .term { grid-template-columns: minmax(0, 1fr) 316px; grid-template-areas: "main ticket" "dock ticket"; }
  .t-list { display: none; }
  .drawer-b { display: inline-flex; position: absolute; z-index: 5; margin: 20px 0 0 -2px; }
  .term { position: relative; }
  .t-head { padding-left: 76px; }
  .drawer-b { left: 16px; top: 0; }
}
/* phones and small tablets */
@media (max-width: 899px) {
  .term { display: block; height: auto; min-height: 0; padding-bottom: calc(76px + var(--safe-b)); }
  .drawer-b { display: none; }
  .t-head { padding-left: 0; min-height: 0; border-bottom: 0; }
  .m-top { display: block; position: sticky; top: calc(var(--bar-h) + var(--safe-t)); z-index: 20; background: var(--room); border-bottom: 1px solid var(--line); }
  .m-pick { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 16px; text-align: left; }
  .m-pick-t { flex: 1; display: flex; align-items: baseline; gap: 10px; min-width: 0; }
  .m-pick-t b { font: 400 20px/1.1 var(--display); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .m-pick-t small { font-size: 12.5px; color: var(--text-2); white-space: nowrap; }
  .m-pick-c { width: 8px; height: 8px; border-right: 1.5px solid var(--text-2); border-bottom: 1.5px solid var(--text-2); transform: rotate(45deg) translate(-2px, -2px); flex: none; }
  .m-tabs { padding: 0 6px; }
  .m-tabs button { flex: 1; }
  .t-main { display: block; }
  .th { flex-direction: column; align-items: stretch; gap: 8px; padding: 12px 16px 8px; }
  .th-id { display: none; }
  .th-r { align-items: stretch; }
  .th-px { justify-content: flex-start; }
  .th-usd { margin-left: auto; }
  .th-kv { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; }
  .th-kv > div { flex-direction: column; align-items: flex-start; gap: 3px; margin-left: 0; padding: 0 10px; }
  .th-kv > div:first-child { padding-left: 0; }
  .th-kv > div:nth-child(3) { display: flex; }
  .th-kv dd b { font-size: 13px; }
  .t-chart { height: 320px; }
  .chart-legend { display: none; } /* the price and change sit right above the chart; the range buttons take the top */
  .gbar > div { flex: 1 1 30%; padding: 9px 12px 10px; }
  .t-bottom { display: block; }
  .tb-h { display: none; }
  .t-bottom .t-tape, .t-bottom .t-data { display: none; height: auto; }
  .tape { max-height: none; overflow: visible; }
  .term[data-mtab="tape"] .t-chart, .term[data-mtab="tape"] .gbar, .term[data-mtab="pos"] .t-chart, .term[data-mtab="pos"] .gbar,
  .term[data-mtab="data"] .t-chart, .term[data-mtab="data"] .gbar, .term[data-mtab="data"] .t-head { display: none; }
  .term[data-mtab="tape"] .t-bottom .t-tape { display: flex; }
  .term[data-mtab="data"] .t-bottom .t-data { display: block; overflow: visible; }
  .gm { padding: 14px 16px 18px; gap: 14px; }
  .gm-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 14px; }
  .gm-c { justify-content: space-between; min-width: 0; }
  .gm-c span { overflow: hidden; text-overflow: ellipsis; }
  .ch-tf { right: 70px; }
  .ch-tf button { padding: 0 6px; font-size: 11.5px; }
  .chart-src { top: auto; bottom: 26px; left: 10px; max-width: calc(100% - 80px); }
  .t-ticket { display: none; }
  .t-dock { display: none; border-top: 0; }
  .term[data-mtab="pos"] .t-dock { display: flex; }
  .term[data-mtab="pos"] .t-head, .term[data-mtab="tape"] .t-head { display: none; }
  .dock-h { position: sticky; top: calc(var(--bar-h) + 103px); background: var(--room); z-index: 3; }
  .hide-s { display: none; }
  .m-buybar { display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; padding: 10px 14px calc(10px + var(--safe-b)); background: linear-gradient(rgba(14, 12, 11, 0), var(--room) 30%); }
  .m-buy { height: 50px; font-size: 15.5px; }
  .pos-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px 14px; padding: 14px 16px 14px 18px; }
  .pos-t { grid-column: 1 / 3; }
  .pos-exp { grid-column: 1 / 3; }
  .pos-res { grid-column: 1 / 3; }
  .pos-act { grid-column: 1 / 3; justify-content: stretch; }
  .pos-act .btn { flex: 1; height: 40px; }
  .ticket-layer .ticket { min-height: 0; padding-bottom: 8px; }
  .recent-t th:nth-child(5), .recent-t td:nth-child(5) { display: none; }
  .hist-t th:nth-child(3), .hist-t td:nth-child(3), .hist-t th:nth-child(6), .hist-t td:nth-child(6), .hist-t th:nth-child(9), .hist-t td:nth-child(9) { display: none; }
  .ticket-layer .tk-h { padding-right: 56px; }
  .tk-kbd { display: none; }
  .list-layer .tlist { height: min(72dvh, 640px); }
}

/* small notes: no one-character last lines (CJK wraps anywhere) */
.tk-room-s, .tk-est, .tk-caps, .tk-why, .tk-capnote, .tk-foot { text-wrap: pretty; }