*{box-sizing:border-box}
html{color-scheme:light}
body{overflow-x:hidden}
.demo-banner{display:flex;align-items:center;gap:14px;padding:16px max(18px,calc((100vw - 1464px)/2));background:#153b5c;color:#fff}
.demo-banner strong{font-size:17px;letter-spacing:.3px}
.demo-banner p{margin:4px 0 0;font-size:12px;color:#dce6ee;line-height:1.6}
.demo-tag{flex:none;padding:5px 9px;border-radius:5px;color:#17354c;background:#ffd77d;font-weight:700}
.demo-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:12px 18px 6px;max-width:1500px;margin:0 auto}
button{font:inherit;cursor:pointer;border:1px solid #bccad5;background:#fff;color:#173b59;border-radius:5px;padding:7px 12px;min-height:36px}
button:hover{background:#edf3f8}button:focus-visible,select:focus-visible,tr.b:focus-visible{outline:2px solid #1769aa;outline-offset:2px}
#demo-play{background:#1769aa;color:#fff;border-color:#1769aa}
#demo-progress{color:#40566a;font-variant-numeric:tabular-nums}
#demo-network{margin-left:auto;font-size:12px;color:#1a7045}
.demo-help,.demo-alert{max-width:1464px;margin:4px auto 10px;padding:0 18px;font-size:12px;color:#627080;line-height:1.65}
.demo-alert{color:#a32929}
.bar{flex-wrap:wrap;gap:8px 12px}
.bar label{white-space:nowrap}.bar select{min-height:32px}
.rules{margin-bottom:14px;background:#fff;border:1px solid #e3e8ee;border-radius:6px;padding:10px 14px}
.rules summary{cursor:pointer;color:#42566b;font-weight:600}.rules .note{margin:8px 0 0;line-height:1.7}
.panel{min-width:0}.panel h3{flex-wrap:wrap;gap:5px 12px}.panel h3 small{line-height:1.6}
.chart-scroll,.table-scroll{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.chart-scroll svg{min-width:700px}.table-scroll table{min-width:1050px}
tr.b.is-selected{background:#e7f0fa}
@media(max-width:700px){
  .demo-banner{padding:13px 12px;gap:10px;align-items:flex-start}.demo-banner strong{font-size:15px}
  .demo-tag{font-size:11px;padding:4px 7px}.demo-toolbar{padding:10px 12px 5px;gap:7px}
  button{padding:7px 10px;min-height:40px}.demo-help,.demo-alert{padding:0 12px}
  #demo-network{margin-left:0;width:100%}.bar{position:static;padding:10px 12px;align-items:center}
  .bar .brand{width:100%;font-size:14px}.chip{font-size:12px}.bar label{font-size:12px}
  main{padding:8px 10px}.panel{padding:10px 8px 6px}.panel h3{font-size:13px}
  .panel h3 small{width:100%;order:3}.panel h3 .pnl{font-size:12px}
  .chart-scroll svg{min-width:1400px}
  th,td{padding:6px 8px}.rules{padding:9px 10px}
}