:root{font:15px/1.4 "Instrument Sans",Arial,sans-serif;color:#1c3028;background:#eeeee6;font-variant-numeric:tabular-nums}*{box-sizing:border-box}body{margin:0}main{max-width:1920px;margin:auto}header{height:64px;padding:0 2.4vw;display:flex;align-items:center;gap:20px;background:#faf9f1;border-bottom:1px solid #b6bdb1}.brand{display:flex;align-items:center;gap:12px;font-size:25px;letter-spacing:-1.4px;font-weight:750}.brand i{width:25px;height:25px;background:repeating-linear-gradient(120deg,#2d5c42 0 5px,transparent 5px 8px);border-radius:4px}.session{border-left:1px solid #acb6a8;padding-left:20px;color:#526356}#status{margin-left:auto;font:600 13px monospace}#status:before,.lamp{display:inline-block;width:8px;height:8px;border-radius:100%;background:#7dbf88;margin-right:8px;content:""}.board{display:grid;grid-template-columns:minmax(0,1fr) clamp(232px,24vw,360px);min-height:520px;height:min(75vh,780px)}.pit{position:relative;min-width:0;overflow:hidden;background:#bdc3b3}.pit canvas{width:100%;height:100%;display:block;touch-action:none}.pit-title,.pit-caption,.actor-label{position:absolute;background:#152820e8;color:#fff8df;padding:7px 12px;border-radius:4px;font-size:13px}.pit-title{top:17px;left:18px}.pit-caption{bottom:16px;left:18px}.actor-label{transform:translate(-50%,-100%);background:#f5c76a;color:#18291f;font-weight:700;max-width:245px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:0 3px 8px #0003}.render-error{position:absolute;bottom:10%;left:3%;background:#fff;padding:10px}.market{background:#172521;color:#f5f3df;padding:clamp(12px,1.8vw,26px);overflow:auto}.market h1{font-size:clamp(28px,3vw,50px);line-height:1;margin:0;letter-spacing:-2px}.market-head{display:grid;grid-template-columns:1fr auto;align-items:end}.market-head h1{grid-row:span 2}.market-head span,.quote-row span,.market small,.credit a{color:#b0c0b0;font-size:11px}.market-head b{font-size:23px;color:#f3c665}.quote-row,.section-label,.print,.order,.desk-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.quote-row{padding:10px 0;border-bottom:1px solid #405047}.quote-row b,.print,.level{font:13px monospace}.market h2,.desk h2{font-size:16px;margin:14px 0 7px;letter-spacing:-.25px}.chartbox{height:clamp(85px,15vh,155px);position:relative}.chart{height:100%}.waiting{position:absolute;inset:40% 0 auto;text-align:center;color:#b0c0b0;font-size:12px}.credit{text-align:right}.credit a{font-size:9px}.depth,.desk-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.depth h3{font-size:11px;color:#b0c0b0;margin:3px 0}.level{position:relative;display:flex;justify-content:space-between;padding:4px}.level i{position:absolute;inset:1px auto 1px 0;background:#477a5866}.depth>div+div i{background:#a65c4466}.level span,.level b{z-index:1}.print,.order{padding:6px 0;border-top:1px solid #808b7b4d}.desk{padding:16px 2.4vw 22px;background:#faf9f1}.desk-head h2{margin:0;font-size:22px}.desk-head{margin-bottom:8px}.desk form,.join{display:flex;align-items:end;gap:12px}label{display:grid;gap:3px;flex:1;font-size:12px;color:#47594e}input,button{font:inherit;padding:9px 12px;border:1px solid #a6b2a5;border-radius:4px}button{cursor:pointer;background:#244e39;color:white;border-color:#244e39}.desk-grid{margin-top:10px}.desk-grid h2{margin:0 0 5px}.desk-grid,.desk-head span,#notice{font-size:13px}.order button{padding:2px 6px}.join label{max-width:320px}
@media(max-width:650px){header{height:43px;gap:8px}.brand{font-size:19px}.brand i{width:17px;height:17px}.session{font-size:11px;padding-left:7px}.board{height:auto;min-height:0;display:flex;flex-direction:column}.pit{height:clamp(235px,40vh,400px)}.market{display:grid;grid-template-columns:1fr 1fr;column-gap:15px;padding:10px 12px}.market-head,.quote-row{grid-column:1}.section-label{grid-column:2;grid-row:1}.chartbox{grid-column:2;grid-row:2;height:55px}.credit{grid-column:2}.market>h2{grid-row:4}.depth,#tape{grid-row:5}.market h2{margin:5px 0}.pit-title,.pit-caption,.actor-label{font-size:11px;padding:4px 8px}.desk-grid{grid-template-columns:1fr}.desk{padding:10px 12px}.print{font-size:10px}.section-label small{font-size:9px}.desk-head{align-items:baseline}}

.brand,#status{flex-shrink:0;white-space:nowrap}.session{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:650px){
  .market{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .market>*{min-width:0}
  .market-head{grid-template-columns:minmax(0,1fr) auto;column-gap:6px}
  .market-head b{font-size:18px}
  .market-head h1{font-size:28px}
  .section-label{gap:4px}
  .section-label h2{font-size:13px}
  .chartbox{overflow:hidden}
  .chart{position:absolute;inset:0;width:100%;min-width:0}
  .depth{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:7px}
  .level{font-size:10px}
}