Files

251 lines
19 KiB
CSS

:root{color-scheme:dark;--bg:#000;--fg:#f2f2f2;--mut:#8a8a8a;--line:#1d1d1d;--line2:#2c2c2c;--acc:#3ddc84;--blue:#7cc4ff}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
button{background:#0d0d0d;color:var(--fg);border:1px solid #3a3a3a;padding:6px 11px;font:inherit;cursor:pointer;border-radius:0}
button:hover{border-color:#888}
a{color:var(--blue)}
header{position:sticky;top:0;z-index:5;background:#000;border-bottom:1px solid var(--line2);padding:10px 16px;display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center}
h1{font-size:17px;margin:0;font-weight:650;letter-spacing:.01em}
#st{font-size:13px;color:var(--mut)}
#st b{font-weight:600}
#st .ok{color:var(--acc)}#st .bad{color:#ff7b72}
.bar{display:flex;flex-wrap:wrap;gap:6px;align-items:center;width:100%}
.chip{padding:4px 10px;border:1px solid #333;color:#cfcfcf;font-size:13px;user-select:none;cursor:pointer;background:#000}
.chip.on{background:#151515;box-shadow:inset 0 -2px 0 currentColor}
.chips-sel .chip:not(.on){opacity:.55}
.chip .n{color:var(--mut);margin-left:5px;font-variant-numeric:tabular-nums}
.sw{display:inline-flex;gap:6px;align-items:center;font-size:13px;color:#cfcfcf;cursor:pointer;user-select:none;padding:4px 2px}
.sw i{width:28px;height:16px;border:1px solid #555;position:relative;display:inline-block}
.sw i:after{content:"";position:absolute;top:2px;left:2px;width:10px;height:10px;background:#777}
.sw.on i{border-color:var(--acc)}.sw.on i:after{left:14px;background:var(--acc)}
.sp{flex:1}
main{padding:0 16px 140px;max-width:1100px}
.day{margin-top:18px}
.dh{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline;padding:6px 0;border-bottom:1px solid var(--line2)}
.dh h2{font-size:13px;color:#bbb;font-weight:650;margin:0;text-transform:uppercase;letter-spacing:.06em}
.dh .cnt{font-size:12px;color:var(--mut);display:flex;flex-wrap:wrap;gap:2px 10px;min-width:0}
.dh .cnt span{white-space:nowrap}
.row{display:grid;grid-template-columns:62px minmax(0,1fr) 150px 64px 28px;gap:2px 12px;align-items:center;padding:7px 6px;border-bottom:1px solid var(--line);cursor:pointer;border-left:2px solid transparent}
.row:hover{background:#0b0b0b}
.row.cur{background:#06140c;border-left-color:var(--acc)}
.row.noise{opacity:.5}
.t{font-variant-numeric:tabular-nums;color:#d8d8d8}
.ch{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ch b{font-weight:600}
.fq{color:var(--mut);font-size:12px;font-variant-numeric:tabular-nums;margin-left:6px}
.g{font-size:11px;padding:0 5px;border:1px solid #444;margin-right:7px;color:#bbb;vertical-align:1px}
.tag{font-size:11px;padding:0 5px;border:1px solid #ff7b72;color:#ff7b72;margin-left:6px}
.avia{color:#7cc4ff;border-color:#7cc4ff}.marine{color:#3ddc84;border-color:#3ddc84}
.pmr{color:#ffb454;border-color:#ffb454}.lpd{color:#ff7b72;border-color:#ff7b72}
.ham{color:#d2a8ff;border-color:#d2a8ff}.rail{color:#e3e3e3;border-color:#e3e3e3}.other{color:#aaa}
.wf{height:22px;width:150px;display:block}
.d{color:var(--mut);font-size:13px;text-align:right;font-variant-numeric:tabular-nums}
.dl{color:var(--mut);text-decoration:none;text-align:center;font-size:15px}
.dl:hover{color:var(--fg)}
.empty{color:var(--mut);padding:30px 0}
#more{margin:18px 0}
/* frequencies: panel beside the list (desktop), pill strip (phone) */
#wrap{display:grid;grid-template-columns:minmax(0,1fr);max-width:1100px}
#stats{padding:6px 16px 10px;order:-1} /* phone: the pill strip above the list */
.fq-h{display:flex;flex-wrap:wrap;gap:2px 10px;align-items:baseline;margin:0 0 8px}
.fq-h b{font-size:13px;font-weight:600;color:#f2f2f2;letter-spacing:.02em}.fq-h span{font-size:11.5px;color:var(--mut)}
.fq-l{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding-bottom:4px;-webkit-overflow-scrolling:touch}
.fq-l::-webkit-scrollbar{display:none}
.fq-r{flex:none;display:inline-flex;align-items:center;gap:8px;background:#0a0a0a;border:1px solid #232323;border-radius:999px;padding:5px 11px;
color:#d8d8d8;font:inherit;font-size:13px;cursor:pointer;white-space:nowrap;position:relative}
.fq-r::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.fq-r .fq-n{display:flex;gap:6px;align-items:baseline;min-width:0}.fq-r .fq-n b{font-weight:500;color:#e8e8e8}
.fq-r .fq-n i{display:none}.fq-r .fq-c{font-size:12px;color:var(--mut);font-variant-numeric:tabular-nums}
.fq-r .fq-b{display:none}
.fq-r.on{border-color:currentColor;background:color-mix(in srgb,currentColor 14%,#000)}.fq-r.on .fq-c{color:#f2f2f2}
.fq-r.all{color:#bdbdbd}.fq-r.all::before{display:none}
@media (min-width:1100px){
#wrap{grid-template-columns:minmax(0,1fr) 320px;gap:0 22px;max-width:1440px;align-items:start}
#stats{order:0;position:sticky;top:132px;max-height:calc(100vh - 150px);overflow:auto;padding:4px 16px 16px 0;scrollbar-width:thin}
.fq-l{flex-direction:column;gap:1px;overflow:visible}
.fq-r{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"n c" "b b";gap:3px 10px;border:0;border-left:2px solid transparent;
border-radius:0;background:none;padding:6px 8px 7px 10px;text-align:left}
.fq-r::before{display:none}
.fq-r:hover{background:#0c0c0c}
.fq-r.on{background:#0d1a12;border-left-color:currentColor}
.fq-r .fq-n{grid-area:n;flex-direction:column;gap:0;overflow:hidden}
.fq-r .fq-n b{font-size:13px;font-weight:500;line-height:1.3;white-space:normal;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.fq-r .fq-n i{display:block;font-style:normal;font-size:11px;color:var(--mut);font-variant-numeric:tabular-nums}
.fq-r .fq-c{grid-area:c;align-self:center;font-size:13px;color:#cfcfcf}
.fq-r.on .fq-c{color:currentColor}
.fq-r .fq-b{grid-area:b;display:block;height:3px;background:#161616;position:relative}
.fq-r .fq-b .bar{position:absolute;left:0;top:0;bottom:0;background:currentColor;opacity:.8}
.fq-r.all{border-bottom:1px solid #1a1a1a;margin-bottom:4px}
}
.fq-r.avia{color:#7cc4ff}.fq-r.marine{color:#3ddc84}.fq-r.pmr{color:#ffb454}.fq-r.lpd{color:#ff7b72}.fq-r.ham{color:#d2a8ff}.fq-r.rail{color:#e3e3e3}.fq-r.other{color:#9a9a9a}
/* wide screens: everything on one centred column (1440 px), equal margins left and right */
@media (min-width:1100px){
:root{--side:max(16px,calc((100vw - 1440px) / 2))}
header{padding-left:var(--side);padding-right:var(--side)}
#nearwrap{max-width:none!important;padding-left:var(--side)!important;padding-right:var(--side)!important}
#wrap{padding:0 16px;max-width:1472px;margin:0 auto}
main#src{max-width:1440px;margin:0 auto}
#pl{padding-left:var(--side)!important;padding-right:var(--side)!important}
}
/* found sources */
#src{padding-top:14px}
#src .sx-top{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:4px 0 14px}
#src .sx-t{background:#080808;border:1px solid #1c1c1c;padding:10px 14px;display:grid;gap:2px}
#src .sx-t b{font-size:22px;font-weight:600;color:#f2f2f2;font-variant-numeric:tabular-nums;line-height:1.1}
#src .sx-t span{font-size:12px;color:var(--mut)}
#src .sx-t.q b{color:var(--acc)}
#src .sx-note{grid-column:1/-1;margin:0;font-size:12px;color:#666}
#src .sx-spec{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:14px}
#src .sx-band{background:#060606;border:1px solid #1c1c1c;border-top:2px solid #2a2a2a;padding:8px 10px 4px;text-align:left;color:inherit;font:inherit;cursor:pointer}
#src .sx-band:hover{border-color:#2c2c2c}
#src .sx-band.on{border-color:#2f4a38;border-top-color:var(--acc);background:#07120b}
#src .sx-band.avia{border-top-color:#7cc4ff55}#src .sx-band.ham{border-top-color:#d2a8ff55}#src .sx-band.marine{border-top-color:#3ddc8455}#src .sx-band.pmr{border-top-color:#ffb45455}
#src .sb-h{display:flex;align-items:baseline;gap:8px;margin-bottom:4px}
#src .sb-h b{font-size:13px;font-weight:600;color:#ececec}#src .sb-h span{font-size:11px;color:var(--mut);flex:1}
#src .sb-h em{font-style:normal;font-size:13px;color:#cfcfcf;font-variant-numeric:tabular-nums}
#src .sx-bar{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;margin:0 0 10px;padding:8px 0;border-top:1px solid #161616;border-bottom:1px solid #161616}
#src .sx-seg{display:flex;flex-wrap:wrap;gap:0;border:1px solid #232323}
#src .sx-seg button{background:none;border:0;border-right:1px solid #232323;color:#bdbdbd;font:inherit;font-size:13px;padding:5px 12px;cursor:pointer}
#src .sx-seg button:last-child{border-right:0}
#src .sx-seg button i{font-style:normal;color:#6f6f6f;margin-left:4px;font-variant-numeric:tabular-nums}
#src .sx-seg button.on{background:#0d1a12;color:#f2f2f2}#src .sx-seg button.on i{color:var(--acc)}
#src .sx-sort{margin-left:auto;font-size:12.5px;color:var(--mut);display:flex;gap:8px;align-items:center}
#src .sx-sort select{background:#0a0a0a;color:#ddd;border:1px solid #2a2a2a;padding:4px 8px;font:inherit;font-size:13px}
#src .sx-list{display:grid}
#src .sx-hd,#src .sx-r{display:grid;grid-template-columns:96px minmax(180px,1fr) 128px 170px 170px 120px 104px;gap:14px;align-items:center}
#src .sx-hd{font-size:11px;color:#666;text-transform:uppercase;letter-spacing:.06em;padding:4px 10px}
#src .sx-gh{display:flex;gap:10px;align-items:baseline;padding:14px 10px 6px;border-bottom:1px solid #1c1c1c}
#src .sx-gh b{font-size:13px;color:#ececec}#src .sx-gh span{font-size:12px;color:var(--mut)}
#src .sx-gh.avia b{color:#7cc4ff}#src .sx-gh.ham b{color:#d2a8ff}#src .sx-gh.marine b{color:#3ddc84}#src .sx-gh.pmr b{color:#ffb454}
#src .sx-r{padding:8px 10px;border-bottom:1px solid #121212;border-left:2px solid transparent}
#src .sx-r:hover{background:#0a0a0a}
#src .sx-r.active{border-left-color:#3ddc8466}#src .sx-r.wide{border-left-color:#ffb45466}#src .sx-r.carrier,#src .sx-r.continuous{opacity:.55}
#src .sf{font-size:15px;font-weight:600;color:#f2f2f2;font-variant-numeric:tabular-nums}
#src .sl{display:grid;min-width:0}#src .sl b{font-weight:500;font-size:13.5px;color:#e4e4e4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#src .sl i{font-style:normal;font-size:11.5px;color:#6f6f6f}
#src .k{font-size:11px;padding:1px 7px;border:1px solid #444;color:#bbb;font-style:normal;white-space:nowrap}
#src .k.active{border-color:#3ddc8488;color:var(--acc)}#src .k.wide,#src .k.continuous{border-color:#ffb45488;color:#ffb454}
#src .sm{display:grid;grid-template-columns:minmax(0,1fr) 44px;gap:8px;align-items:center}
#src .sm i{height:5px;background:#151515;position:relative;display:block}
#src .sm i b{position:absolute;left:0;top:0;bottom:0;background:#7cc4ff}#src .sm.a i b{background:var(--acc)}
#src .sm em{font-style:normal;text-align:right;font-size:12.5px;color:#cfcfcf;font-variant-numeric:tabular-nums}
#src .st2{font-size:12.5px;color:#9a9a9a}
#src .sa{display:flex;justify-content:flex-end}#src .sa .ok{font-size:12px;color:var(--acc)}
#src .sa .pr{background:none;border:1px solid #2f4a38;color:var(--acc);font:inherit;font-size:12.5px;padding:3px 10px;cursor:pointer}
#src .sa .pr:hover{background:#0d1a12}
@media (max-width:1200px){#src .sx-spec{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){
#src .sx-top{grid-template-columns:repeat(2,minmax(0,1fr))}
#src .sx-hd{display:none}
#src .sx-r{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"f k" "l l" "m a" "t s";gap:4px 10px;padding:10px}
#src .sf{grid-area:f}#src .sk{grid-area:k}#src .sl{grid-area:l}#src .sm{grid-area:m}#src .sm.a{grid-area:a}#src .st2{grid-area:t}#src .sa{grid-area:s}
#src .sx-sort{margin-left:0}
}
@media (max-width:560px){#src .sx-spec{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}#src .sx-band{padding:6px 6px 2px}
#src .sb-h{flex-wrap:wrap;gap:0 6px}#src .sb-h b{font-size:12px}#src .sb-h span{flex-basis:100%;order:3;font-size:10.5px}}
/* day header strip */
.dh .dbar{display:inline-flex;width:120px;height:6px;gap:1px;align-self:center;overflow:hidden}
.dh .dbar i{display:block;background:currentColor;min-width:2px}
.dh .top3{color:#9a9a9a}.dh .top3 b{color:#cfcfcf;font-weight:600}
/* found sources */
#pl{position:fixed;left:0;right:0;bottom:0;z-index:10;background:#050505;border-top:1px solid #333;padding:8px 16px calc(8px + env(safe-area-inset-bottom))}
#pl .top{display:flex;gap:10px;align-items:center;min-width:0}
#pl .ti{min-width:0;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#pl .ti b{font-weight:600}
#pl .ti .m{color:var(--mut);font-size:13px;margin-left:8px}
#pl .ctl{display:flex;gap:6px;align-items:center}
#pl .ctl button{min-width:40px;height:34px;padding:0 10px}
#pp{min-width:52px!important;border-color:var(--acc)!important;color:var(--acc)}
#seek{position:relative;height:38px;margin-top:6px;cursor:pointer;touch-action:none}
#seek canvas{width:100%;height:100%;display:block}
#tm{font-size:12px;color:var(--mut);font-variant-numeric:tabular-nums;white-space:nowrap}
#pl .opt{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center;margin-top:4px}
#spd.on{border-color:var(--blue);color:var(--blue)}
.kb{font-size:11px;color:#666}
@media (max-width:700px){
.row{grid-template-columns:62px minmax(0,1fr) 54px 24px;padding:9px 2px}
.row .t{font-size:13.5px}
.row .wf{grid-column:2/4;grid-row:2;width:100%}
.kb{display:none}
header{padding:8px 12px;position:static} main{padding:0 12px 170px}
#pl{padding-left:12px;padding-right:12px}
}
#live{font-size:12px;color:var(--mut)}
#live .dot{display:inline-block;width:7px;height:7px;background:var(--acc);margin-right:5px;vertical-align:1px}
#live .dot.off{background:#ffb454}
#msg{margin:10px 16px 0;padding:8px 12px;border:1px solid #ffb454;color:#ffb454;font-size:14px;max-width:1068px}
.row.new{animation:flash 3.5s ease-out}
@keyframes flash{0%{background:#123d24}100%{background:transparent}}
#big{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:18px;padding:6px 22px;border:1px solid var(--acc);color:var(--acc);background:#000}
#cp.on{border-color:var(--acc);color:var(--acc)}
@media (max-width:700px){#cp .lbl{display:none}}
.tabs{display:flex;gap:0}
.tabs button{border-color:#333;padding:4px 12px;font-size:14px}
.tabs button+button{border-left:none}
.tabs button.on{border-color:var(--acc);color:var(--acc);background:#06140c}
body.srcmode header .bar{display:none}
#src table{border-collapse:collapse;width:100%;font-size:14px;font-variant-numeric:tabular-nums}
#src th{text-align:left;color:var(--mut);font-weight:600;font-size:12px;padding:6px 8px;border-bottom:1px solid var(--line2);white-space:nowrap}
#src td{padding:6px 8px;border-bottom:1px solid var(--line);white-space:nowrap}
#src td.lab{white-space:normal;min-width:140px}
#src tr.carrier td,#src tr.continuous td{color:#777}
#src .k{font-size:11px;padding:0 5px;border:1px solid #444;color:#bbb}
#src .k.active{border-color:var(--acc);color:var(--acc)}
#src .k.wide,#src .k.continuous{border-color:#ffb454;color:#ffb454}
#src .hd{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;margin:14px 0 8px;color:var(--mut);font-size:13px}
#src .tw{overflow-x:auto}
#src button.pr{padding:2px 8px;font-size:12px}
#src .ok{color:var(--acc);font-size:12px}
.conv{border:1px solid #1f3a2a;border-left:2px solid #2e7d50;margin:6px 0;background:#030805}
.conv .ch2{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center;padding:5px 8px;font-size:12px;color:#8fbf9f;border-bottom:1px solid #12301f}
.conv .ch2 button{padding:2px 10px;font-size:12px;border-color:#2e7d50;color:#3ddc84}
.gap{font-size:11px;color:#777;padding:1px 8px 1px 74px}
.gap.miss{color:#ffb454}
.trx{grid-column:2/-1;margin:5px 0 1px;padding:2px 0 2px 10px;border-left:2px solid #2f7a4c;color:#ececec;font-size:14.5px;line-height:1.42;white-space:normal;overflow-wrap:anywhere}
.trx.lc{color:#9a9a9a;border-left-color:#555;font-style:italic}
.trx.q{color:#5f5f5f;border-left-color:#2a2a2a;font-size:12px;padding-top:0;padding-bottom:0}
.trx .lg{font-size:10px;border:1px solid #3d4a66;color:#8fa6d0;padding:0 4px;margin-right:7px;vertical-align:1px;font-style:normal}
#tt{margin-top:6px;font-size:15px;line-height:1.4;color:#ececec;max-height:4.3em;overflow:auto;padding-left:10px;border-left:2px solid #2f7a4c}
#tt:empty{display:none}#tt.lc{color:#9a9a9a;font-style:italic;border-left-color:#555}#tt.q{color:#5f5f5f;font-size:12px;border-left-color:#2a2a2a}
.acl{grid-column:2/-1;display:flex;flex-wrap:wrap;gap:4px;margin-top:2px}
.ac{font-size:11px;padding:0 5px;border:1px solid #333;color:#aaa;white-space:nowrap;font-variant-numeric:tabular-nums}
.ac.ulli{border-color:#7cc4ff;color:#7cc4ff}.ac.emg{border-color:#ff4d4d;color:#ff4d4d;font-weight:700}
#near{margin:10px 0 0;padding:6px 10px;border:1px solid #1d2a36;font-size:12px;color:#8aa;display:flex;flex-wrap:wrap;gap:4px 6px;align-items:center}
#near b{color:#bcd;font-weight:600;margin-right:4px}
#near[hidden]{display:none}
#spk-vol{width:90px;accent-color:var(--acc);vertical-align:middle}
@media (max-width:700px){.gap{padding-left:52px}.acl,.trx{grid-column:1/-1}}
/* found sources v2: legend, plots, detail view, tooltip */
#src .sx-t span+span{color:#6a6a6a}
#src .sx-leg{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center;margin:0 0 10px;font-size:12.5px;color:#cfcfcf}
#src .sx-leg .lg{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
#src .sx-leg .lg svg{display:block}
#src .sx-leg .lg.mut{color:var(--mut);margin-left:auto;white-space:normal}
#src .sx-plot{width:100%;min-width:0}
#src svg.sxs{display:block;cursor:crosshair;touch-action:pan-y;user-select:none;-webkit-user-select:none}
#src svg.sxs *{pointer-events:none}
#src .sxs .gl{stroke:#101010;stroke-width:1}#src .sxs.big .gl{stroke:#161616}#src .sxs .gl.z{stroke:#161616}
#src .sxs .bl{stroke:#2e2e2e;stroke-width:1}
#src .sxs .tl{fill:#6a6a6a;font:10px system-ui}
#src .sxs .zs{fill:#3ddc84;fill-opacity:.1;stroke:#3ddc8455}
#src .sxs .cur line{stroke:#9a9a9a;stroke-width:1;stroke-dasharray:3 3}
#src .sxs .cur circle{fill:none;stroke:#f2f2f2;stroke-width:1.5}
#src .sxs .brush{fill:#7cc4ff;fill-opacity:.14;stroke:#7cc4ff;stroke-width:1}
#src .sx-det{background:#060606;border:1px solid #1c1c1c;padding:10px 12px 6px;margin:0 0 12px}
#src .sd-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px;margin-bottom:6px}
#src .sd-h b{font-size:14px;color:#ececec}#src .sd-h span{font-size:12px;color:var(--mut)}#src .sd-h .sp{flex:1}
#src .sd-h button{background:none;border:1px solid #2a2a2a;color:#cfcfcf;font:inherit;font-size:12.5px;padding:2px 10px;cursor:pointer;align-self:center}
#src .sd-h button:hover{background:#0d1a12;border-color:#2f4a38}
#src .sd-hint{margin:4px 0 2px;font-size:11.5px;color:#5f5f5f}
#src .sx-r.hl{animation:sxhl 2.2s ease-out}
@keyframes sxhl{0%,35%{background:#17301f;box-shadow:inset 3px 0 0 var(--acc)}100%{background:transparent;box-shadow:inset 3px 0 0 transparent}}
#sx-tip{position:fixed;z-index:50;display:none;pointer-events:none;background:#0d0d0d;border:1px solid #333;padding:7px 10px;font-size:12px;color:#ddd;max-width:300px;box-shadow:0 4px 14px #000a}
#sx-tip b{font-size:13.5px;color:#f2f2f2;font-variant-numeric:tabular-nums}
#sx-tip .t1{color:#e4e4e4;margin-top:1px}#sx-tip .t2{color:#9a9a9a;margin-top:2px}
#sx-tip dl{display:grid;grid-template-columns:auto auto;gap:1px 12px;margin:5px 0 0}
#sx-tip dt{color:#7a7a7a}#sx-tip dd{margin:0;color:#e0e0e0;text-align:right;font-variant-numeric:tabular-nums}
#sx-tip .ok{color:#3ddc84}#sx-tip .q{color:#7cc4ff}
@media (max-width:900px){#src .sx-leg .lg.mut{margin-left:0;flex-basis:100%}}
@media (max-width:560px){#src .sx-band{padding:6px 4px 2px}#src .sx-band svg.sxs{width:100%}#src .sx-leg{gap:4px 12px;font-size:12px}#src .sx-det{padding:8px 6px 4px}}