:root{
  --bg:#0f1420; --panel:#171e2e; --panel2:#1e2740; --line:#2b3550; --ink:#e6ecfa;
  --mut:#8a97b5; --accent:#f4a93c; --accent2:#3d9bff; --good:#37d67a; --bad:#ff5b6e;
  --radius:10px; font-synthesis:none;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);
  font:14px/1.4 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
button{font:inherit;cursor:pointer;border:1px solid var(--line);background:var(--panel2);
  color:var(--ink);padding:.4em .7em;border-radius:8px}
button:hover,a.btn:hover{border-color:var(--accent2)}
a.btn{font:inherit;cursor:pointer;border:1px solid var(--line);background:var(--panel2);
  color:var(--ink);padding:.4em .7em;border-radius:8px;text-decoration:none;white-space:nowrap}
button.pri{background:var(--accent);color:#1a1200;border-color:var(--accent);font-weight:600}
a{color:var(--accent2)}
.app{display:grid;grid-template-columns:var(--side-w,280px) minmax(0,1fr);height:100vh;height:100dvh}
/* ---- sidebar ---- */
.side{background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0;min-width:0;position:relative}
.brand{display:flex;align-items:center;gap:.5em;padding:14px 16px;border-bottom:1px solid var(--line);font-weight:700}
.brand .logo{width:26px;height:26px;flex:none;display:block}
.drop{margin:12px;padding:16px;border:1.5px dashed var(--line);border-radius:var(--radius);
  text-align:center;color:var(--mut);font-size:13px}
.dirrow{margin:-4px 12px 8px;display:flex}
.dirrow button{flex:1;font-size:12px;padding:.35em .6em}
.impbox{margin:0 12px 8px;padding:8px;border:1px solid var(--line);border-radius:8px;background:var(--panel2);
  font-size:12px;max-height:45vh;overflow:auto;min-width:0;overflow-wrap:anywhere}
.impbox .ihead{display:flex;align-items:center;gap:6px;font-weight:600;margin-bottom:4px}
.impbox .ihead span{flex:1;min-width:0}
.impbox progress{width:100%;height:10px;accent-color:var(--accent)}
.impbox .istat{color:var(--mut);margin:4px 0}
.impbox .icounts{display:flex;flex-wrap:wrap;gap:4px 10px;margin:4px 0}
.impbox .ok{color:var(--good)} .impbox .dup{color:var(--accent)} .impbox .bad{color:var(--bad)}
.impbox details{margin:4px 0}
.impbox summary{cursor:pointer}
.impbox ul{margin:4px 0;padding-left:16px;max-height:30vh;overflow:auto}
.impbox li{margin:1px 0}
.impbox li .why{color:var(--mut)}
.impbox .iact{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.impbox .iact button{font-size:12px;padding:.3em .6em}
.drop.hot{border-color:var(--accent);color:var(--ink);background:var(--panel2)}
.sessions{overflow:auto;flex:1;padding:0 8px 12px}
.sess{padding:9px 10px;border-radius:8px;margin:3px 0;cursor:pointer;border:1px solid transparent}
.sess:hover{background:var(--panel2)}
.sess.on{background:var(--panel2);border-color:var(--accent2)}
.sess .t{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sess .m{color:var(--mut);font-size:12px;display:flex;justify-content:space-between;gap:6px;margin-top:2px}
.sess .src{font-size:10px;color:var(--mut);border:1px solid var(--line);border-radius:4px;padding:0 4px}
/* liste : filtres, mode sélection */
.listbar{display:flex;gap:6px;margin:0 12px 4px}
.listbar button{flex:1;padding:.3em .5em;font-size:12px}
.listbar button.on{border-color:var(--accent);color:var(--accent)}
.fmenu{margin:0 12px 6px;padding:8px;background:var(--panel2);border:1px solid var(--line);border-radius:8px;
  max-height:50vh;overflow:auto;display:flex;flex-direction:column;gap:6px}
.fgroup{border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.fgroup legend{color:var(--mut);font-size:11px;text-transform:uppercase;letter-spacing:.06em;padding:0;margin-bottom:2px}
.fopt{display:flex;align-items:center;gap:8px;padding:5px 4px;border-radius:6px;cursor:pointer;font-size:13px}
.fopt:hover{background:var(--panel)}
.fopt input,.sess .selcb{width:20px;height:20px;flex:none;accent-color:var(--accent);margin:0}
.fopt .readout{margin-left:auto}
.frow{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap}
.frow button{font-size:12px;padding:.3em .6em}
.fchips{margin:0 12px 4px;display:flex;flex-wrap:wrap;gap:4px 6px;align-items:center;font-size:12px}
.fchips .chip{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.linkbtn.inl{display:inline;margin:0;font-size:12px}
.selbar{margin:0 12px 6px;padding:6px;border:1px solid var(--accent);border-radius:8px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.selbar .selcount{flex:1 1 100%;font-size:12px;color:var(--ink);font-weight:600}
.selbar button{font-size:12px;padding:.35em .6em}
button.danger{border-color:var(--bad);color:var(--bad)}
button.danger:not(:disabled):hover{background:var(--bad);color:#1a0004}
.sessions.selmode .sess{display:flex;gap:10px;align-items:center}
.sess .body{min-width:0;flex:1}
.sess.picked{background:rgba(255,91,110,.10);border-color:var(--bad)}
.sess:focus-visible{outline:2px solid var(--accent2);outline-offset:-2px}
.bulkoffer{border:1px solid var(--accent);border-radius:8px;padding:8px;margin:0 0 8px;background:rgba(244,169,60,.10);font-size:13px}
.bulkoffer .bad{color:var(--bad)}
.bulkoffer .bk-wait{margin:4px 0;color:var(--mut);font-size:12px}
.spin{display:inline-block;width:.9em;height:.9em;margin-right:.5em;border:2px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:kspin .8s linear infinite;vertical-align:-.15em}
@keyframes kspin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.spin{animation-duration:3s}}
/* ---- main ---- */
.main{display:flex;flex-direction:column;min-width:0;min-height:0}
.top{display:flex;align-items:center;gap:14px;padding:10px 16px;border-bottom:1px solid var(--line);
  background:var(--panel);flex-wrap:wrap}
.top h1{font-size:16px;margin:0}
.top .sub{color:var(--mut);font-size:13px}
.spacer{flex:1}
.content{display:grid;grid-template-columns:var(--left-w,320px) minmax(0,1fr);gap:12px;padding:12px;overflow:auto;flex:1;min-height:0;align-items:start}
.col{display:flex;flex-direction:column;gap:12px;min-width:0}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:12px}
.card h2{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--mut);margin:0 0 8px}
/* lap list */
.laps{display:flex;flex-direction:column;gap:4px}
.lap{display:grid;grid-template-columns:18px 26px 1fr auto;align-items:center;gap:8px;
  padding:6px 8px;border-radius:7px;cursor:pointer}
.lap:hover{background:var(--panel2)}
.lap .sw{width:12px;height:12px;border-radius:3px}
.lap .n{color:var(--mut)}
.lap .tm{font-variant-numeric:tabular-nums;font-weight:600}
.lap .d{font-variant-numeric:tabular-nums;font-size:12px}
.lap.best .tm{color:var(--good)}
.lap .d.pos{color:var(--bad)} .lap .d.neg{color:var(--good)}
.lap.off{opacity:.4}
/* tables */
table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
th,td{text-align:right;padding:4px 6px;border-bottom:1px solid var(--line)}
th:first-child,td:first-child{text-align:left}
th{color:var(--mut);font-weight:500;font-size:11px;text-transform:uppercase;letter-spacing:.05em}
td .sw{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:5px;vertical-align:middle}
.hi{color:var(--good)} .lo{color:var(--bad)}
#map{height:var(--map-h,420px);border-radius:var(--radius);overflow:hidden;background:#09101c;position:relative;z-index:0}
.chart{height:170px;width:100%;overflow:hidden}
#chartSpeed{height:var(--speed-h,170px)} #chartRpm{height:var(--rpm-h,170px)} #chartDelta{height:var(--delta-h,170px)}
.chartwrap{position:relative}
.ctrls{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:8px}
.ctrls .seg{display:flex;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.ctrls .seg button{border:0;border-radius:0;background:transparent;padding:.35em .7em}
.ctrls .seg button.on{background:var(--accent2);color:#021226}
.readout{font-variant-numeric:tabular-nums;color:var(--mut);font-size:12px}
.play{display:flex;align-items:center;gap:8px}
input[type=range]{flex:1;accent-color:var(--accent)}
.empty{color:var(--mut);text-align:center;padding:40px}
.leaflet-container{background:#09101c}
.badge{background:var(--panel2);border:1px solid var(--line);border-radius:20px;padding:3px 10px;font-size:12px}
.badge b{color:var(--accent)}
.foot{color:var(--mut);font-size:11px;padding:6px 10px}
.hidden{display:none !important}
.car{width:16px;height:16px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #0008}

/* --- éditeur de circuit --- */
.track-row{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin:4px 0}
.track-row select,.track-row input{flex:1;min-width:90px}
#trackBody .hint{color:var(--mut);font-size:12px;margin:6px 0}
#trackBody .draw{border:1px solid var(--accent);border-radius:8px;padding:8px;margin-top:6px}
#trackBody .step{font-weight:600;color:var(--accent)}
.seclist{display:flex;flex-direction:column;gap:3px;margin:6px 0}
.seclist .s{display:flex;justify-content:space-between;font-size:12px;color:var(--mut)}
.chip{display:inline-block;padding:2px 8px;border-radius:20px;background:var(--panel2);
  border:1px solid var(--line);font-size:12px}
.chip b{color:var(--accent)}
.map-draw,.map-draw .leaflet-interactive,.map-draw .leaflet-grab{cursor:crosshair !important}
#map.map-draw{outline:2px solid var(--accent);outline-offset:-2px}
.draw-ov{position:absolute;left:8px;right:52px;top:8px;z-index:1000;background:rgba(15,20,32,.92);
  border:1px solid var(--accent);border-radius:8px;padding:8px 10px;font-size:13px;color:var(--ink);
  display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;cursor:default;box-shadow:0 2px 10px #0008}
.draw-ov .msg{flex:1 1 220px;min-width:0}
.draw-ov .msg b{color:var(--accent)}
.draw-ov .msg .bad{color:var(--bad)}
.draw-ov .btns{display:flex;gap:6px;flex-wrap:wrap}
.draw-ov button{padding:.35em .6em;font-size:13px}
button:disabled{opacity:.45;cursor:default}
.trk-cur{border:1px solid var(--line);border-radius:8px;padding:8px;background:var(--panel2)}
.trk-name{font-size:14px}
.trk-name .lbl{color:var(--mut);font-size:12px}
.trk-name b{color:var(--accent)}
.trk-meta{color:var(--mut);font-size:12px;margin:2px 0 4px}
#trackBody .hint.warn{color:var(--ink);border-left:3px solid var(--accent);padding-left:8px}
.cands{display:flex;flex-direction:column;gap:4px;margin:4px 0;max-height:300px;overflow:auto}
.cand{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 8px;text-align:left;padding:6px 8px;width:100%}
.cand .nm{grid-column:1/-1;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cand .ds{grid-row:2;grid-column:2;color:var(--mut);font-size:12px;white-space:nowrap;font-variant-numeric:tabular-nums}
.cand .mt{grid-row:2;grid-column:1;color:var(--mut);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cand.on{border-color:var(--accent);background:rgba(244,169,60,.10)}
.track-row input[type=search]{font:inherit;background:var(--panel2);color:var(--ink);border:1px solid var(--line);
  border-radius:8px;padding:.4em .6em}

/* --- comparaison de sessions : blocs de tours au même format que « Tours » --- */
.lap{position:relative}
.lapcb{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.lap .sw{display:flex;align-items:center;justify-content:center;font-size:10px;line-height:1;color:#0f1420}
.lapcb:checked+.sw::after{content:"✓"}
.lapcb:focus-visible+.sw{outline:2px solid var(--accent);outline-offset:2px}
.lapcb:disabled~*{opacity:.5}
.lap.out .n{color:var(--mut);font-style:italic}
.cmpblock{margin-bottom:10px}
.cmphead{display:flex;align-items:center;gap:6px;margin-bottom:4px}
.cmpfold{flex:1;min-width:0;display:flex;align-items:center;gap:6px;text-align:left;background:none;border:0;
  color:var(--ink);font:inherit;font-size:12px;font-weight:600;padding:3px 2px;cursor:pointer}
.cmpfold .ttl{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmpfold .chev{color:var(--mut)}
.cmpcount{color:var(--mut);font-size:11px;font-variant-numeric:tabular-nums}
.cmpDel{padding:1px 7px;font-size:12px;line-height:1.3}
#compareBody .hint{color:var(--mut);font-size:12px;margin:4px 0}
.hint.warn{color:var(--bad)}
.hint.hidden,.laps.hidden{display:none}
.charttip{position:fixed;z-index:1000;pointer-events:none;background:var(--panel2);color:var(--ink);
  border:1px solid var(--line);border-radius:8px;padding:6px 8px;font-size:11px;max-width:230px;
  box-shadow:0 4px 14px rgba(0,0,0,.45);font-variant-numeric:tabular-nums}
.charttip.hidden{display:none}
.charttip .tp-x{color:var(--mut);margin-bottom:3px}
.charttip .tp-r{display:grid;grid-template-columns:10px 1fr auto;gap:6px;align-items:center;line-height:1.5}
.charttip .sw{width:10px;height:10px;border-radius:2px}
.charttip .tp-l{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.charttip .tp-v{font-weight:600;text-align:right}

/* ---- circuits de l'appareil ---- */
.devbtn{margin:12px 12px 0;text-align:left;display:flex;justify-content:space-between;gap:6px}
.devbtn.on{border-color:var(--accent2);background:var(--panel2)}
.cnt{color:var(--accent);font-weight:700}
.top.circ .tb{display:none}
.devwrap{grid-column:1/3;display:flex;flex-direction:column;gap:10px;min-height:0}
.devfilters{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.devfilters input[type=search],.devfilters select{font:inherit;background:var(--panel2);color:var(--ink);
  border:1px solid var(--line);border-radius:8px;padding:.4em .6em}
.devfilters input[type=search]{flex:1;min-width:180px}
.devfilters label{color:var(--mut);font-size:13px;white-space:nowrap}
.devlist{display:flex;flex-direction:column}
.devrow{display:grid;grid-template-columns:24px 1fr auto auto;gap:10px;align-items:center;
  padding:6px 8px;border-bottom:1px solid var(--line);cursor:pointer}
.devrow:hover{background:var(--panel2)}
.devrow.on{background:rgba(244,169,60,.10)}
.devrow .nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.devrow .mt{color:var(--mut);font-size:12px;white-space:nowrap}
.devrow .sec{font-size:11px;border:1px solid var(--line);border-radius:4px;padding:0 5px;color:var(--mut)}
.devrow .sec.has{color:var(--good);border-color:var(--good)}
.devnote{color:var(--mut);font-size:13px}

/* ---- comptes : connexion, réglages ---- */
.sq{margin:8px 12px 4px;font:inherit;background:var(--panel2);color:var(--ink);
  border:1px solid var(--line);border-radius:8px;padding:.35em .6em}
.userbox{display:flex;gap:6px;align-items:center;padding:8px 10px;border-top:1px solid var(--line)}
.userbox .who{flex:1;color:var(--mut);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.userbox button{padding:.25em .55em;font-size:12px}
.auth{position:fixed;inset:0;background:var(--bg);display:flex;align-items:center;justify-content:center;z-index:2000;padding:16px}
.auth.hidden{display:none}
.authbox{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:20px;
  width:100%;max-width:360px;display:flex;flex-direction:column;gap:10px}
.authbox .brand{border:0;padding:0 0 6px}
.authbox h2{margin:0;font-size:16px}
.authbox label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--mut)}
.authbox input,.settings input,.settings select{font:inherit;background:var(--panel2);color:var(--ink);
  border:1px solid var(--line);border-radius:8px;padding:.45em .6em}
.authbox .err{color:var(--bad);font-size:13px;min-height:1em}
.authbox .hint{color:var(--mut);font-size:12px;margin:0}
.settings{grid-column:1/3;display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:12px;align-content:start}
.settings .card{display:flex;flex-direction:column;gap:8px}
.settings .row{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.settings .row input{flex:1;min-width:120px}
.settings table td,.settings table th{text-align:left;font-size:12px}
.settings .tok{font-family:ui-monospace,monospace;word-break:break-all;background:var(--panel2);
  border:1px dashed var(--accent);border-radius:8px;padding:8px;user-select:all}
.settings .note{color:var(--mut);font-size:12px}
.settings .librow{display:grid;grid-template-columns:1fr 1fr auto;gap:6px;align-items:center;padding:6px 0;border-bottom:1px solid var(--line)}
.settings .librow input{min-width:0;width:100%}
.settings .librow input[data-f=name]{grid-column:1/-1}
.settings .librow .note{grid-column:1/-1}
.settings .danger{border-color:var(--bad);color:var(--bad)}
.settings .msg{font-size:12px;color:var(--good);min-height:1em}
.settings .msg.bad{color:var(--bad)}

/* ---- disposition redimensionnable (poignées) ---- */
.colL{position:relative}
.split{touch-action:none;user-select:none;-webkit-user-select:none;outline:none;flex:none}
.split::after{content:"";position:absolute;background:var(--line);border-radius:3px;transition:background .12s}
.split:hover::after,.split:focus-visible::after,.split.drag::after{background:var(--accent2)}
.split:focus-visible{box-shadow:0 0 0 2px var(--accent2) inset;border-radius:4px}
.split-y{position:relative;height:14px;margin:2px 0 -6px;cursor:row-resize}
.split-y::after{left:50%;top:5px;width:44px;height:4px;margin-left:-22px}
.split-x{position:absolute;top:0;bottom:0;width:10px;cursor:col-resize;z-index:5}
.split-x::after{top:50%;left:3px;width:4px;height:44px;margin-top:-22px}
.side-split{right:-5px}
.col-split{right:-11px}
.only-mobile{display:none}
body.resizing{cursor:row-resize;user-select:none;-webkit-user-select:none}
body.resizing.rx{cursor:col-resize}
body.resizing iframe,body.resizing #map{pointer-events:none}
.linkbtn{display:block;margin-top:6px;padding:0;border:0;background:none;color:var(--accent2);font-size:11px;text-align:left}
.linkbtn:hover{text-decoration:underline}

/* ---- carte : contrôles Leaflet au thème ---- */
.leaflet-control-layers,.leaflet-bar a{background:var(--panel);color:var(--ink);border-color:var(--line)}
.leaflet-bar a:hover{background:var(--panel2)}
.leaflet-control-layers{border:1px solid var(--line) !important;border-radius:8px !important}
.leaflet-control-layers-expanded{padding:6px 10px 6px 8px;font-size:13px}
.leaflet-control-layers label{margin:2px 0}
.leaflet-control-layers-separator{border-top-color:var(--line)}
.leaflet-touch .leaflet-control-layers-toggle{width:36px;height:36px}
.leaflet-control-layers-toggle{background-color:#e6ecfa;border-radius:7px}
.leaflet-container .leaflet-control-attribution{background:rgba(15,20,32,.78);color:var(--mut);font-size:10px;
  max-width:100%;white-space:normal;line-height:1.35}
.leaflet-container .leaflet-control-attribution a{color:#9cc6ff}
.leaflet-control-attribution img{vertical-align:middle;height:12px}
.basemap-err{color:var(--bad)}

/* ---- téléphone : une colonne, défilement vertical seulement ---- */
@media (max-width: 760px){
  html,body{height:auto}
  .app{display:block;height:auto}
  .side{border-right:0;border-bottom:1px solid var(--line)}
  .side-split,.col-split{display:none}
  .only-mobile{display:block}
  .sessions{flex:none;height:var(--sess-h,200px)}
  .main{min-height:0}
  .content{display:flex;flex-direction:column;overflow:visible;padding:10px}
  .content>.col{width:100%}
  .top{padding:8px 10px;gap:8px}
  .card{overflow-x:auto}
  .settings{grid-template-columns:minmax(0,1fr)}
  .devrow{grid-template-columns:24px minmax(0,1fr) auto}
  .devrow .mt{display:none}
  .devfilters input[type=search]{min-width:0;width:100%}
  .play{flex:1 1 100%;flex-wrap:wrap}
  .play input[type=range]{min-width:120px}
  .split-y{height:22px;margin:0 0 -8px}
  .listbar button,.selbar button{padding:.55em .6em;font-size:13px}
  .sess .selcb,.fopt input{width:24px;height:24px}
  .fopt{padding:8px 4px}
  .split-y::after{top:8px;width:56px;margin-left:-28px;height:5px}
}

/* ---- groupes, partage, classements (social.js) ---- */
.navrow{display:flex;gap:0;margin:0}
.navrow .devbtn{flex:1;min-width:0;margin:8px 0 0 12px;font-size:12px}
.navrow .devbtn:last-child{margin-right:12px}
.selpanel{margin-top:4px}
.selpanel select{font:inherit;background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:.35em .5em}
.shrow{grid-template-columns:minmax(0,1fr) auto auto;}
.shrow .mt:last-child{grid-column:1/-1}
.srow{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin:4px 0}
.srow label{color:var(--mut);font-size:12px;min-width:7.5em}
.srow input,.srow select{flex:1;min-width:0;font:inherit;background:var(--panel2);color:var(--ink);
  border:1px solid var(--line);border-radius:8px;padding:.35em .5em}
.msg.bad{color:var(--bad)}
details.grp{border:1px solid var(--line);border-radius:8px;padding:6px 8px;margin:6px 0}
details.grp summary{cursor:pointer;display:flex;flex-wrap:wrap;gap:6px;align-items:baseline}
details.grp .grpbody{margin-top:6px;display:flex;flex-direction:column;gap:6px;min-width:0;overflow-x:auto}
details.grp .row{flex-wrap:wrap}
.btable{width:100%;border-collapse:collapse}
.btable td,.btable th{padding:4px 6px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.btable td.hi{color:var(--good);font-weight:700;white-space:nowrap}
#blist,#brank{overflow-x:auto}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;z-index:2000;padding:16px}
.modalbox{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;max-width:460px;width:100%}
.modalbox h2{margin:0 0 8px;font-size:16px}
@media (max-width: 760px){
  .navrow .devbtn{font-size:11px;padding:.35em .5em}
  .btable th:nth-child(5),.btable td:nth-child(5){display:none}
  .srow label{min-width:0;width:100%}
}
@media (max-width: 760px){ .shrow{grid-template-columns:minmax(0,1fr) auto} .shrow .mt{display:block;white-space:normal} }
@media (max-width: 760px){
  .devwrap,.devwrap>.card,#blist,#brank{min-width:0;max-width:100%}
  .btable{font-size:12px}
  .btable td,.btable th{padding:4px 3px}
  .btable button{padding:.3em .4em;font-size:12px;margin:1px 0}
  .devfilters>*{flex:1 1 auto}
}
@media (max-width: 760px){ #bq{flex:1 1 100%} }