/* Band Map: horizontal SSB-only 3600–3800 kHz. Theme variables are inherited. */
.sj.sj.sj{max-width:1960px!important}
.sj-workspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.48fr);gap:16px;align-items:start}
.sj-workspace-main{min-width:0}
.sj-bandmap-horizontal{margin-top:16px;min-width:0;padding:18px!important}
.sj-bandmap-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px;flex-wrap:wrap}
.sj-bandmap-head h2{font-size:20px;margin:0}
.sj-bandmap-description{margin:5px 0 0;color:var(--sj-muted);font-size:12px}
.sj-bandmap-controls{display:flex;flex-direction:column;gap:4px;padding:9px 14px;background:var(--sj-bg2);border:1px solid var(--sj-line);border-radius:10px}
.sj-bandmap-controls span{font-size:11px;color:var(--sj-muted)}
.sj-bandmap-controls strong{font-size:18px;color:var(--sj-accent);font-variant-numeric:tabular-nums}
.sj-bandmap-scroll{width:100%;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;padding:2px 1px 10px}
.sj-bandmap-scale{position:relative;min-width:950px;height:225px;margin:0 30px;border:1px solid var(--sj-line);border-radius:12px;background:var(--sj-bg2)}
.sj-band-track{position:absolute;left:0;right:0;bottom:42px;border-top:3px solid var(--sj-accent);opacity:.6}
.sj-band-tick{position:absolute;bottom:38px;height:13px;border-left:1px solid var(--sj-line)}
.sj-band-tick-label{position:absolute;top:14px;left:0;transform:translateX(-50%);font-size:12px;color:var(--sj-muted);font-variant-numeric:tabular-nums}
.sj-band-current-line{position:absolute;top:0;bottom:45px;border-left:2px solid #ff826b;z-index:2;pointer-events:none}
.sj-band-current-line::after{content:'';position:absolute;bottom:-5px;left:-5px;width:9px;height:9px;background:#ff826b;border-radius:50%}
.sj-band-spot{position:absolute;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:2px;min-width:80px;max-width:130px;padding:5px 7px;background:var(--sj-bg);border:1px solid var(--sj-line);border-top:3px solid var(--sj-spot-color);color:var(--sj-text);border-radius:7px;cursor:pointer;z-index:3}
.sj-band-spot strong{font-size:12px}.sj-band-spot small{font-size:10px;color:var(--sj-muted)}
.sj-band-spot:hover,.sj-band-spot:focus-visible{outline:2px solid var(--sj-accent);z-index:5}
.sj-bandmap-empty{position:absolute;left:0;right:0;top:85px;text-align:center;color:var(--sj-muted);font-size:13px;pointer-events:none}
.sj-bandmap-foot{margin:9px 0 0!important;font-size:12px;line-height:1.5;color:var(--sj-muted)}
@media(max-width:1350px){.sj-workspace{grid-template-columns:minmax(0,1fr)}.sj-workspace-main,.sj-correspondents{grid-column:auto}}
@media(max-width:640px){.sj-bandmap-horizontal{padding:12px!important}.sj-bandmap-head{align-items:stretch}.sj-bandmap-scale{min-width:800px}.sj-bandmap-controls{width:100%}}

/* Interactive horizontal viewport */
.sj-bandmap-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 10px;color:var(--sj-muted);font-size:13px;flex-wrap:wrap}
.sj-bandmap-buttons{display:flex;gap:6px}
.sj-bandmap-buttons button{padding:7px 11px;background:var(--sj-bg2);color:var(--sj-text);border:1px solid var(--sj-line);border-radius:8px;cursor:pointer;font:inherit}
.sj-bandmap-buttons button:hover{border-color:var(--sj-accent)}
.sj-bandmap-scale{min-width:0!important;margin:0 18px!important;cursor:grab;touch-action:pan-y;user-select:none}
.sj-bandmap-scale:active{cursor:grabbing}
.sj-band-spot{cursor:pointer}
.sj-bandmap-scroll{overflow-x:hidden}
@media(max-width:640px){.sj-bandmap-scale{min-width:0!important;height:220px}.sj-band-tick-label{font-size:10px}.sj-band-spot{min-width:52px;padding:3px}.sj-band-spot strong{font-size:10px}}

/* Manual station spots and test controls */
.sj-bandmap-add{display:flex;flex-wrap:wrap;align-items:end;gap:9px;margin:12px 0 15px}
.sj-bandmap-add label{display:flex;flex-direction:column;gap:5px;font-size:12px;color:var(--sj-muted)}
.sj-bandmap-add input{min-height:38px;min-width:120px;max-width:165px;border-radius:8px;border:1px solid var(--sj-line);background:var(--sj-bg2);color:var(--sj-text);padding:7px 10px;font:inherit;font-size:14px}
.sj-bandmap-add button{min-height:38px;border:1px solid var(--sj-line);background:var(--sj-bg2);color:var(--sj-text);border-radius:8px;padding:8px 12px;cursor:pointer;font:inherit;font-size:13px}
.sj-bandmap-add button.sj-bandmap-add-btn{background:var(--sj-accent);color:#081c30;font-weight:700}
#sjBandSpotStatus{font-size:12px;color:var(--sj-muted)}
@media(max-width:650px){.sj-bandmap-add label{flex:1 1 120px}.sj-bandmap-add input{max-width:none;width:100%}}

/* Real DX-cluster status; manual/test form removed. */
.sj-dx-live-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:12px 0 14px;padding:10px 12px;background:var(--sj-bg2,#132d4a);border:1px solid var(--sj-line,#32506d);border-radius:9px;color:var(--sj-muted,#abc4da);font-size:13px}
.sj-dx-live-bar #sjDxStatus{flex:1 1 230px;overflow-wrap:anywhere}
.sj-dx-live-bar #sjDxCount{white-space:nowrap;color:var(--sj-text,#e9f5ff);font-weight:700}
.sj-dx-live-bar button{border:1px solid var(--sj-line,#32506d);border-radius:7px;background:var(--sj-bg2,#173554);color:var(--sj-text,#e9f5ff);padding:8px 11px;font:inherit;cursor:pointer}


/* Vertical Band Map in the sticky right-hand column. Only this page is affected. */
#sjApp .sj-body-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px;align-items:start}
#sjApp .sj-body-main{min-width:0}
#sjApp .sj-bandmap-sidebar{min-width:0;position:sticky;top:76px;align-self:start;max-height:calc(100vh - 88px);z-index:15}
#sjApp .sj-bandmap-vertical{margin:0;padding:12px!important;display:flex;flex-direction:column;max-height:calc(100vh - 88px);overflow:hidden;min-height:0;background:var(--sj-bg);color:var(--sj-text)}
#sjApp .sj-bandmap-vertical .sj-bandmap-head{display:block;margin-bottom:8px}
#sjApp .sj-bandmap-vertical .sj-bandmap-head h2{font-size:16px}
#sjApp .sj-bandmap-vertical .sj-bandmap-description{display:none}
#sjApp .sj-bandmap-vertical .sj-bandmap-controls{margin-top:7px;padding:6px 9px;flex-direction:row;align-items:center;justify-content:space-between}
#sjApp .sj-bandmap-vertical .sj-bandmap-controls strong{font-size:14px}
#sjApp .sj-bandmap-vertical .sj-dx-live-bar{margin:4px 0 8px;padding:6px;gap:5px;font-size:11px}
#sjApp .sj-bandmap-vertical .sj-dx-live-bar #sjDxStatus{flex-basis:100%}
#sjApp .sj-bandmap-vertical .sj-dx-live-bar button{padding:5px 7px}
#sjApp .sj-bandmap-vertical .sj-bandmap-toolbar{display:flex;gap:6px;margin-bottom:7px;font-size:11px}
#sjApp .sj-bandmap-vertical .sj-bandmap-buttons button{padding:5px 7px}
#sjApp .sj-bandmap-vertical .sj-bandmap-scroll{flex:1;min-height:220px;overflow-y:auto;overflow-x:hidden;padding:0 2px}
#sjApp .sj-bandmap-vertical .sj-bandmap-scale{height:650px!important;min-height:650px;min-width:0!important;margin:8px 0 8px 0!important;touch-action:pan-x;cursor:grab}
#sjApp .sj-bandmap-vertical .sj-band-track{top:0;bottom:0;left:43px;right:auto;border-top:0;border-left:3px solid var(--sj-accent)}
#sjApp .sj-bandmap-vertical .sj-band-tick{left:39px;bottom:auto;height:auto;width:10px;border-left:0;border-top:1px solid var(--sj-line)}
#sjApp .sj-bandmap-vertical .sj-band-tick-label{top:-7px;left:-35px;transform:none;font-size:10px}
#sjApp .sj-bandmap-vertical .sj-band-current-line{left:0;right:0;bottom:auto;border-left:0;border-top:2px solid #ff826b;height:0}
#sjApp .sj-bandmap-vertical .sj-band-current-line:after{left:39px;top:-5px;bottom:auto}
#sjApp .sj-bandmap-vertical .sj-band-spot{transform:translateY(-50%);align-items:flex-start;min-width:0;max-width:102px;width:99px;padding:3px 5px;gap:0;border-top:1px solid var(--sj-line);border-left:3px solid var(--sj-spot-color)}
#sjApp .sj-bandmap-vertical .sj-band-spot strong{font-size:11px}
#sjApp .sj-bandmap-vertical .sj-band-spot small{font-size:9px}
#sjApp .sj-bandmap-vertical .sj-bandmap-empty{top:45%;left:52px;right:5px;text-align:left}
#sjApp .sj-workspace{grid-template-columns:minmax(0,1fr)}
#sjApp .sj-workspace-main,#sjApp .sj-correspondents{grid-column:auto}
@media(max-width:1150px){
 #sjApp .sj-body-layout{grid-template-columns:minmax(0,1fr)}
 #sjApp .sj-bandmap-sidebar{position:relative;top:auto;max-height:none;grid-row:1}
 #sjApp .sj-bandmap-vertical{max-height:480px}
 #sjApp .sj-bandmap-vertical .sj-bandmap-scale{height:500px!important;min-height:500px}
}

/* Frequency-to-callsign connector overlay; strictly scoped to the vertical Band Map. */
#sjApp .sj-bandmap-vertical .sj-band-connectors{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:2}
#sjApp .sj-bandmap-vertical .sj-band-connector{stroke:var(--sj-accent,#53abf7);stroke-width:1.05;fill:none;opacity:.66;vector-effect:non-scaling-stroke}
#sjApp .sj-bandmap-vertical .sj-band-connector-dot{fill:var(--sj-accent,#53abf7);opacity:.95}
#sjApp .sj-bandmap-vertical .sj-band-spot-linked{width:calc((100% - 66px)/2);max-width:110px;min-height:21px;gap:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box;z-index:3;padding:2px 4px;border-radius:5px}
#sjApp .sj-bandmap-vertical .sj-band-spot-linked strong{font-size:10px;line-height:1.1;overflow:hidden;text-overflow:ellipsis;max-width:100%}
#sjApp .sj-bandmap-vertical .sj-band-spot-linked small{font-size:9px;line-height:1.05}
#sjApp .sj-bandmap-vertical .sj-band-overflow{position:absolute;bottom:2px;right:4px;z-index:5;background:var(--sj-bg,#14263d);color:var(--sj-muted,#abc4da);border:1px solid var(--sj-line,#31506d);padding:3px 5px;border-radius:4px;font-size:10px}

/* 5MContest-like single-column frequency map: plain callsign text, not cards. */
#sjApp .sj-bandmap-vertical .sj-band-spot-5m,
#sjApp .sj-bandmap-vertical .sj-band-spot-5m.sj-band-spot-live{
  display:block;position:absolute;transform:translateY(-50%);
  width:auto;min-width:0;max-width:calc(100% - 70px);min-height:0;
  margin:0;padding:0 2px;border:0!important;border-radius:0!important;
  background:transparent!important;box-shadow:none!important;
  color:var(--sj-text);text-align:left;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;
  font-family:Consolas,'Lucida Console',monospace;font-size:11px;
  font-weight:600;line-height:14px;letter-spacing:0;z-index:4;
}
#sjApp .sj-bandmap-vertical .sj-band-spot-5m.sj-band-spot-live{color:var(--sj-accent,#63b8ff)}
#sjApp .sj-bandmap-vertical .sj-band-spot-5m:hover,
#sjApp .sj-bandmap-vertical .sj-band-spot-5m:focus-visible{
  color:var(--sj-accent,#63b8ff);text-decoration:underline;
  outline:1px dotted var(--sj-accent,#63b8ff);outline-offset:1px;
}
#sjApp .sj-bandmap-vertical .sj-band-connector{stroke:var(--sj-muted,#9cb6ce);opacity:.82;stroke-width:.85}
#sjApp .sj-bandmap-vertical .sj-band-connector-dot{fill:var(--sj-accent,#63b8ff)}
#sjApp .sj-bandmap-vertical .sj-band-tick-label{font-family:Consolas,'Lucida Console',monospace;font-size:10px}
