/* S30 Bench shell */
body.bshell header .modesw,body.bshell header .s23sw{display:none!important}
body.bshell header .htitle{display:none}
#bmenu{font-size:13px;padding:6px 12px;margin-right:12px;border-radius:8px;background:#121a24;border:1px solid #2a3a50;color:#dfe8f3;cursor:pointer;white-space:nowrap}
#bmenu.on,#bmenu:hover{border-color:#5aa0ff;color:#fff}
#bcrumb{flex:1;margin-left:18px;font-size:14px;color:#8fa0b5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#bcrumb b{color:#eef2f7;font-weight:600}
header{gap:6px}
#bnav{position:fixed;z-index:90;left:0;top:0;bottom:0;width:290px;background:#0b1017f8;border-right:1px solid #243041;box-shadow:8px 0 40px #000b;transform:translateX(-105%);transition:transform .18s;display:flex;flex-direction:column;padding:12px}
#bnav.open{transform:none}
.bnh{display:flex;align-items:baseline;gap:8px;margin-bottom:8px}.bnh b{font-size:16px;color:#fff}.bnh span{font-size:11px;color:#6d7d92;flex:1}.bnh button{background:none;border:0;color:#8fa0b5;font-size:16px;cursor:pointer}
#bns{background:#0f151e;border:1px solid #233142;border-radius:7px;color:#dfe8f3;padding:7px 9px;font-size:13px;margin-bottom:6px}
#bnavlist{overflow:auto;flex:1}
#bnavlist h6{margin:12px 2px 4px;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#6d8aa8}
#bnavlist button{display:flex;align-items:center;gap:9px;width:100%;text-align:left;background:none;border:1px solid transparent;border-radius:7px;color:#cfd8e3;padding:7px 8px;font-size:13px;cursor:pointer}
#bnavlist button i{font-style:normal;width:20px;text-align:center}#bnavlist button small{margin-left:auto;font-size:10px;color:#e9c84f}
#bnavlist button:hover{background:#141d29}#bnavlist button.on{background:#16243a;border-color:#3b6fb3;color:#fff}
.bnf{font-size:10.5px;color:#c79a52;margin:8px 2px 0}
@media(max-width:820px){#bmenu span{display:none}#bcrumb{font-size:12px;margin-left:6px}#bnav{width:86vw}}
/* S30b aids */
.bwrap{position:relative;display:block}.bwrap input{position:relative;z-index:1;width:100%}
.bband{position:absolute;left:0;right:0;top:50%;height:10px;transform:translateY(-50%);opacity:.38;border-radius:5px;pointer-events:none;z-index:2;mix-blend-mode:screen}
.bztxt{display:block;font-size:10.5px;min-height:0;margin:-2px 0 3px}
.bwrap.bglow{border-radius:7px;box-shadow:0 0 0 1px #ff9f40aa,0 0 14px #ff9f4088;animation:bgl 1.4s ease-in-out infinite alternate}
@keyframes bgl{from{box-shadow:0 0 0 1px #ff9f4066,0 0 6px #ff9f4044}to{box-shadow:0 0 0 1px #ff9f40,0 0 16px #ff9f40aa}}
.bwarn{background:#2a1a0c;border:1px solid #ff9f4088;border-radius:8px;padding:6px 8px;font-size:11.5px;color:#ffd2a0;margin-bottom:8px}.bwarn div+div{margin-top:4px}
.bghost{background:#0d131b;border:1px solid #223042;border-radius:9px;padding:6px 9px;margin-bottom:8px;font-size:12px}
.bghost summary{cursor:pointer;color:#cfd8e3;font-weight:600;font-size:12px}.bghost summary small{color:#6d7d92;font-weight:400}
.bgr{display:grid;grid-template-columns:1fr auto auto;gap:2px 8px;align-items:baseline;margin-top:5px}.bgr span{color:#8fa0b5}.bgr s{text-decoration:none;color:#7d8da2;font-size:11px}
.bgr canvas{grid-column:1/-1;width:100%;height:22px}
.bgdb{display:flex;justify-content:space-between;gap:6px;margin-top:6px;color:#8fa0b5;font-size:11.5px}.bgdb b{color:#eef2f7}
.bgbar{display:block;height:6px;background:#1a2430;border-radius:3px;margin-top:3px;overflow:hidden}.bgbar u{display:block;height:100%}
.bgc{margin:6px 0 0;font-size:11.5px;color:#b9c6d6;line-height:1.35}
#toolsdrawer>.bghost,#seqdrawer>.bghost{position:absolute;right:12px;bottom:12px;width:260px;z-index:5}
/* S30e phone pass (≤820): header fits, every panel stacks in one column, no page side-scroll */
.krod>summary{cursor:pointer;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#8d9aab;margin:2px 0 6px}
@media(max-width:820px){
 html,body{overflow-x:hidden;max-width:100vw}
 header{padding:0 8px;gap:4px}header .brand>div{display:none}#bcrumb{display:none}
 header .status{min-width:0;flex-shrink:1;overflow:hidden}header .status #stat,header .status .k,header .status #simt{display:none}
 #callbtn{padding:4px 8px;font-size:12px;margin-right:4px}
 :is(.kpanel,#rvpanel,#cbpanel),#toolsdrawer,#seqdrawer{top:52px!important;height:auto!important;width:auto!important;left:0!important;right:0!important;bottom:0!important;border-radius:0;max-width:100vw}
 :is(.kpanel,#rvpanel,#cbpanel) .tdh,#ldpanel .tdh{flex-wrap:wrap;gap:2px 8px;padding:8px 44px 6px 10px;position:relative}:is(.kpanel,#rvpanel,#cbpanel) .tdh span{font-size:10.5px;line-height:1.3}
 :is(.kpanel,#rvpanel,#cbpanel) .tdh .kclose{position:absolute;right:8px;top:6px}
 :is(.kpanel,#rvpanel,#cbpanel) :is(.cbb,.rvb){display:flex!important;flex-direction:column;overflow-y:auto;overflow-x:hidden;padding:6px 8px;gap:8px;-webkit-overflow-scrolling:touch}
 :is(.kpanel,#rvpanel,#cbpanel) .cbmid{order:-1;flex:none}:is(.kpanel,#rvpanel,#cbpanel) .rvstage{flex:none;height:46vh;min-height:260px}
 :is(.kpanel,#rvpanel,#cbpanel) .rvl,:is(.kpanel,#rvpanel,#cbpanel) .rvr{overflow:visible;flex:none;min-width:0}
 :is(.kpanel,#rvpanel,#cbpanel) .rvl{display:grid;grid-template-columns:1fr 1fr;gap:0 10px}:is(.kpanel,#rvpanel,#cbpanel) .rvl>*{min-width:0}:is(.kpanel,#rvpanel,#cbpanel) .rvl>.bwarn,:is(.kpanel,#rvpanel,#cbpanel) .rvl>h5+div,:is(.kpanel,#rvpanel,#cbpanel) .rvl>select,:is(.kpanel,#rvpanel,#cbpanel) .rvl>.cbsafe{grid-column:1/-1}
 :is(.kpanel,#rvpanel,#cbpanel) .rvl h5{grid-column:1/-1}:is(.kpanel,#rvpanel,#cbpanel) .bwrap{grid-column:1/-1}
 :is(.kpanel,#rvpanel,#cbpanel) table,:is(.kpanel,#rvpanel,#cbpanel) .kro{max-width:100%;overflow-x:auto;display:block}
 :is(.kpanel,#rvpanel,#cbpanel) .rvtag{font-size:10px;padding:2px 5px;max-width:42vw;white-space:normal}
 :is(.kpanel,#rvpanel,#cbpanel) .kcv{height:130px}
 :is(.kpanel,#rvpanel,#cbpanel) button,:is(.kpanel,#rvpanel,#cbpanel) select{min-height:34px}:is(.kpanel,#rvpanel,#cbpanel) input[type=range]{height:28px}
 #toolsdrawer,#seqdrawer{overflow-x:hidden;overflow-y:auto}#toolsdrawer *,#seqdrawer *{max-width:100%}
 #toolsdrawer svg,#seqdrawer svg{height:auto}
 #ldpanel .ldsvg{min-width:560px}#ldpanel .ldmid::before{content:'← swipe the diagram →';display:block;font-size:10.5px;color:#6d7d92;padding:4px 8px}
 .bghost{font-size:12.5px}
 #toolsdrawer .tdb,#seqdrawer .sqgrid{display:flex!important;flex-direction:column;overflow:visible}#toolsdrawer .tdf.man{grid-column:auto}#toolsdrawer .tdfaces{grid-template-columns:1fr}#seqdrawer .sqnodes{margin:6px 4px;grid-template-columns:repeat(4,1fr)}#seqdrawer .sqgrid{padding:0 8px 10px}
 #toolsdrawer>.bghost,#seqdrawer>.bghost{position:static;width:auto;margin:8px}
}