.cab.jr { padding-top: 1.5rem; }
.jr-head { display: flex; flex-direction: column; gap: .25rem; }
.cab .jr-sub { color: var(--muted); font-size: .9375rem; }
.cab .jr-loading { margin-top: 1.5rem; color: var(--muted); font-size: .9375rem; }
.jr-tools { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .625rem; margin: 1.25rem 0 .5rem; }
.jr-tools .bl-tabs { max-width: 100%; overflow-x: auto; }
.bl-tabs a.off { color: var(--faint); }
.bl-tabs a.off[aria-current="true"] { color: var(--muted); }

.cab .jr-one { font-weight: 650; }

.jr-pick { display: flex; align-items: center; gap: .5rem; min-height: 3.125rem; padding: 0 .375rem 0 .875rem; background: var(--panel); border: 1px solid var(--line); border-radius: .625rem; cursor: pointer; }
.jr-pick:focus-within { border-color: var(--brass-line); }
.jr-pick-l { color: var(--muted); font-size: .875rem; font-weight: 600; }
.cab .jr-pick select { width: auto; min-width: 7.5rem; min-height: 2.5rem; margin: 0; padding: 0 .25rem; background: transparent; border: 0; color: var(--text); font-size: .9375rem; font-weight: 650; cursor: pointer; }
.jr-pick select:focus { outline: none; }

.jr-seg { display: inline-flex; gap: .25rem; padding: .25rem; background: var(--panel); border: 1px solid var(--line); border-radius: .625rem; }
.jr-seg input { position: absolute; width: 1px; height: 1px; margin: 0; opacity: 0; }
.jr-seg label { display: inline-flex; align-items: center; gap: .4375rem; min-height: 2.5rem; padding: .25rem .875rem; border-radius: .4375rem; color: var(--muted); font-size: .9375rem; font-weight: 600; white-space: nowrap; cursor: pointer; }
.jr-seg label:hover { color: var(--text); }
.jr-seg input:checked + label { background: var(--raise); color: var(--text); }
.jr-seg input:focus-visible + label { outline: 2px solid var(--accent); outline-offset: 2px; }
.jr-seg-bang { display: inline-grid; place-items: center; width: 1.125rem; height: 1.125rem; border-radius: 50%; background: var(--warn); color: var(--night); font-size: .75rem; font-weight: 800; }
.cab .jr-open { min-height: 3.125rem; }
.cab .jr-zone { margin-left: auto; color: var(--muted); font-size: .875rem; }
.cab .jr-sim { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: .25rem 0; color: var(--warn); font-size: .9375rem; font-weight: 600; }

.cab .jr-day { position: sticky; top: 3.5rem; z-index: 2; margin: 0; padding: 1rem .25rem .5rem; background: var(--night); color: var(--muted); font-size: .9375rem; font-weight: 650; font-stretch: 100%; }
.jr-list { display: grid; gap: .25rem; margin: 0; padding: 0; list-style: none; }
.jr-row { display: grid; grid-template-columns: 1.75rem 5rem 8rem minmax(0, 1fr) 5.5rem; align-items: center; gap: .875rem; min-height: 3rem; padding: .5rem 1rem .5rem .75rem; background: var(--panel); border-radius: .5rem; }
.jr-list.nosrc .jr-row { grid-template-columns: 1.75rem 8rem minmax(0, 1fr) 5.5rem; }
.jr-kd { min-width: 0; overflow: hidden; color: var(--muted); font-size: .875rem; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.jr-kd.good { color: var(--up); }
.jr-kd.act { color: var(--warn); }
.jr-src { min-width: 0; overflow: hidden; color: var(--text); font-size: 1rem; font-weight: 750; font-stretch: 112%; letter-spacing: .01em; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
a.jr-src:hover { text-decoration: underline; text-underline-offset: .2em; }
.jr-src.acct { color: var(--muted); font-weight: 600; font-stretch: 100%; letter-spacing: 0; }
.cab .jr-text { font-size: 1rem; line-height: 1.45; overflow-wrap: anywhere; }
.jr-time { color: var(--muted); font-size: .9375rem; font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.jr-row.act { background: var(--warn-t); box-shadow: inset 3px 0 0 var(--warn); }
.jr-text .times { margin-left: .25rem; }

.jg { display: inline-grid; place-items: center; width: 1.75rem; height: 1.75rem; border-radius: 50%; background: var(--raise); color: var(--muted); }
.jg::before { content: ""; }
.jg-buy::before { width: .75rem; height: .75rem; border-radius: 50%; background: var(--up); }
.jg-sell::before { width: .8125rem; height: .8125rem; border-radius: 50%; box-shadow: inset 0 0 0 .1875rem var(--down); }
.jg-other::before { width: .375rem; height: .375rem; border-radius: 50%; background: var(--muted); }
.jg-you::before, .jg-ok::before, .jg-wait::before { display: none; }
.jg-you svg { width: 1.125rem; height: 1.125rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.jg-ok svg, .jg-wait svg { width: 1.125rem; height: 1.125rem; fill: none; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.jg-ok svg { stroke: var(--up); }
.jg-wait svg { stroke: var(--muted); }
.jg-act { background: var(--warn); color: var(--night); }
.jg-act::before { content: "!"; font-size: .9375rem; font-weight: 800; line-height: 1; }

.jr-more { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin-top: 1rem; }
.cab .jr-end, .cab .jr-note { color: var(--muted); font-size: .9375rem; overflow-wrap: anywhere; }
.jr-note:empty { display: none; }
.jr-empty { margin-top: .75rem; }
.jr-first { margin-top: 1.5rem; }

.bot-tabs .jr-tools { margin-top: .75rem; }
.bot-tabs .jr-row { background: var(--raise); }
.bot-tabs .jr-row.act { background: var(--warn-t); }
.bot-tabs .jr-day { position: static; background: transparent; }

@media (max-width: 600px) {
  .cab.jr { padding: 1rem 1rem 3rem; }
  .jr-tools { gap: .5rem; margin-top: 1rem; }
  .jr-tools .bl-tabs { display: flex; flex: 1 1 100%; }
  .jr-tools .bl-tabs a { flex: 1 0 auto; justify-content: center; padding: .25rem .5rem; }
  .jr-pick { flex: 1 1 0; min-width: 0; padding-left: .75rem; }
  .cab .jr-pick select { min-width: 0; flex: 1; }
  .jr-seg { display: flex; flex: 1 1 100%; flex-wrap: wrap; }
  .jr-seg label { flex: 1 1 auto; justify-content: center; padding: .25rem .625rem; }
  .cab .jr-open { flex: 1 1 100%; min-height: 2.75rem; }
  .cab .jr-zone { display: none; }
  .jr-row { grid-template-columns: 1.75rem auto minmax(0, 1fr) auto; grid-template-areas: "g src kd time" "g text text text"; align-items: start; gap: .125rem .75rem; padding: .625rem .75rem .75rem; border-radius: .625rem; }
  .jr-list.nosrc .jr-row { grid-template-columns: 1.75rem minmax(0, 1fr) auto; grid-template-areas: "g kd time" "g text text"; }
  .jr-kd { grid-area: kd; align-self: center; }
  .jr-row .jg { grid-area: g; margin-top: .125rem; }
  .jr-src { grid-area: src; align-self: center; }
  .jr-text { grid-area: text; }
  .jr-time { grid-area: time; align-self: center; font-size: .875rem; }
  .jr-more button { flex: 1 1 100%; }
}