/* ============================================================
   🛰️ BUCHARŮV GPS LAB — styl / style  (cyberpunk dark)
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Share+Tech+Mono&family=Rajdhani:wght@500;700&family=Orbitron:wght@700;900&display=swap');

:root{
  --bg:#0a0c10; --panel:#131c26; --panel2:#0d1117; --border:#1e3a5f;
  --accent:#00d4ff; --accent2:#00ff9d; --accent3:#ff6b35; --accent4:#ffd700;
  --text:#e2eaf4; --text2:#8fa8c4; --red:#ff4444;
  --mono:'Share Tech Mono',monospace; --body:'Rajdhani',sans-serif; --disp:'Orbitron',sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%}
body{background:var(--bg);color:var(--text);font-family:var(--body);font-size:14px;
  display:flex;flex-direction:column;min-height:100vh;
  background-image:radial-gradient(ellipse at 20% 0%,rgba(0,212,255,.05),transparent 60%),
    radial-gradient(ellipse at 80% 100%,rgba(0,255,157,.04),transparent 60%);}

/* ============================================================
   PIN TREZOR (styl v18 — HODINY a MINUTY a DVOUstovka)
   ============================================================ */
.pin-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:16px}
.pin-box{background:#0d1117;border:2px solid var(--accent4);border-radius:12px;
  padding:26px 30px;width:min(500px,94vw);text-align:center;
  box-shadow:0 8px 40px rgba(0,0,0,.9),0 0 30px rgba(255,215,0,.2)}
.pin-title{color:var(--accent4);font-family:var(--disp);font-size:17px;letter-spacing:2px;
  text-shadow:0 0 10px var(--accent4);margin-bottom:14px;line-height:1.4}
.pin-date{font-family:var(--mono);font-size:18px;font-weight:700;color:#00ff00;
  text-shadow:0 0 10px #00ff00,0 0 20px #00ff00;background:rgba(0,0,0,.85);
  padding:10px 14px;border-radius:8px;margin-bottom:8px;border:2px solid #00ff00;
  letter-spacing:2px;box-shadow:0 0 20px rgba(0,255,0,.5),inset 0 0 10px rgba(0,255,0,.2);
  position:relative;overflow:hidden}
.pin-clock{font-family:'Courier New',monospace;font-size:50px;font-weight:700;color:#00ff00;
  text-shadow:0 0 10px #00ff00,0 0 20px #00ff00,0 0 30px #00ff00;background:rgba(0,0,0,.85);
  padding:16px;border-radius:8px;margin:8px 0;border:2px solid #00ff00;letter-spacing:3px;
  box-shadow:0 0 20px rgba(0,255,0,.5),inset 0 0 10px rgba(0,255,0,.2);
  position:relative;overflow:hidden}
.pin-date::before,.pin-clock::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;
  background:linear-gradient(45deg,transparent 20%,rgba(0,255,0,.25) 40%,rgba(0,255,0,.4) 50%,rgba(0,255,0,.25) 60%,transparent 80%);
  animation:pinscan 2s linear infinite}
@keyframes pinscan{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.pin-ms{font-size:22px;color:#00cc00;text-shadow:0 0 10px #00ff00;vertical-align:super;margin-left:2px}
.pin-dotsep{margin:0 2px}
.pin-hint{color:var(--text2);font-size:13px;margin:8px 0;font-style:italic}
.pin-input{width:100%;padding:12px;margin-bottom:10px;border:2px solid var(--accent);border-radius:6px;
  font-size:28px;background:rgba(20,20,30,.9);color:var(--accent4);text-align:center;
  font-family:'Courier New',monospace;letter-spacing:8px;font-weight:700}
.pin-input:focus{outline:none;border-color:#00ff00;box-shadow:0 0 0 2px rgba(0,255,0,.3)}
.pin-err{color:var(--red);margin-bottom:6px;font-size:13px;display:none}
.pin-lock{color:var(--red);margin-bottom:8px;font-size:13px;display:none;font-weight:700;
  background:rgba(255,0,0,.15);padding:8px;border-radius:4px;border:1px solid var(--red)}
.pin-attempts{color:var(--accent4);font-size:12px;margin:6px 0 10px}
.pin-btn{padding:12px 30px;border:none;border-radius:6px;font-weight:700;cursor:pointer;
  background:#28a745;color:#fff;font-size:16px;font-family:var(--body);width:100%}
.pin-btn:hover{background:#218838}
.pin-btn:disabled{background:#333;cursor:not-allowed}

/* ============================================================
   APPKA
   ============================================================ */
.top{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:8px 14px;background:rgba(10,12,16,.97);border-bottom:1px solid var(--border);
  position:sticky;top:0;z-index:500}
.brand{font-family:var(--disp);font-size:15px;color:var(--accent);
  text-shadow:0 0 10px var(--accent);letter-spacing:1px;
  display:inline-block;transform-origin:left center;animation:wm-beat 1.4s ease-in-out infinite}
.brand b{color:var(--accent2)}
.ver{font-family:var(--mono);font-size:11px;color:var(--accent4);margin-left:4px;
  border:1px solid rgba(255,215,0,.35);border-radius:3px;padding:0 5px}
.badge{font-family:var(--mono);font-size:9px;color:var(--accent4);
  border:1px solid rgba(255,215,0,.4);border-radius:3px;padding:1px 6px;margin-left:6px}
.top-right{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.devinfo{font-family:var(--mono);font-size:11px;color:var(--text2)}
.logout{color:var(--text2);text-decoration:none;font-size:12px;border:1px solid var(--border);
  border-radius:4px;padding:4px 8px}
.logout:hover{color:var(--red);border-color:var(--red)}
.gear{background:rgba(0,212,255,.1);border:1px solid var(--border);color:var(--text);
  border-radius:4px;padding:4px 9px;cursor:pointer;font-size:14px}
.gear:hover{border-color:var(--accent);background:rgba(0,212,255,.2)}

/* ⚙️ menu vodoznaku / watermark settings */
.settings{position:fixed;top:46px;right:10px;z-index:1200;background:var(--panel);
  border:1px solid var(--accent4);border-radius:8px;padding:12px 14px;width:min(330px,92vw);
  box-shadow:0 8px 30px rgba(0,0,0,.75)}
.set-h{font-family:var(--mono);font-size:12px;color:var(--accent4);letter-spacing:1px;
  margin-bottom:10px;border-bottom:1px solid var(--border);padding-bottom:6px}
.set-row{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text);margin-bottom:11px;flex-wrap:wrap}
.set-row:last-child{margin-bottom:0}
.set-row input[type=color]{width:34px;height:26px;border:1px solid var(--border);border-radius:4px;
  background:var(--panel2);cursor:pointer;padding:1px}
.set-row input[type=range]{flex:1;min-width:90px;accent-color:var(--accent)}
.set-row input[type=checkbox]{width:16px;height:16px;accent-color:var(--accent2);cursor:pointer}

/* 💓 dýchající vodoznak / breathing watermark */
.watermark{position:absolute;top:12px;right:18px;z-index:450;pointer-events:none;
  font-family:var(--disp);font-weight:900;font-size:clamp(16px,2.8vw,38px);letter-spacing:3px;
  color:#ff5577;opacity:.18;white-space:nowrap;text-align:right;
  transform-origin:72% 50%;-webkit-text-stroke:1.5px #000;
  animation:wm-beat 1.4s ease-in-out infinite}
@keyframes wm-beat{0%,100%{transform:scale(1)}14%{transform:scale(1.06)}28%{transform:scale(1)}
  42%{transform:scale(1.04)}70%,100%{transform:scale(1)}}

.layout{display:flex;flex:1;min-height:0}
.side{width:340px;min-width:300px;display:flex;flex-direction:column;gap:8px;padding:8px;
  overflow-y:auto;border-right:1px solid var(--border);background:var(--panel2)}
.main{flex:1;display:flex;flex-direction:column;position:relative}
#map{flex:1;background:#0d1117}

.panel{background:var(--panel);border:1px solid var(--border);border-radius:6px;padding:10px}
.panel.grow{flex:1;display:flex;flex-direction:column;min-height:180px}
.phead{font-family:var(--mono);font-size:11px;color:var(--accent);letter-spacing:1px;
  text-transform:uppercase;margin-bottom:8px;border-bottom:1px solid var(--border);padding-bottom:4px}
.count{color:var(--text2)}
.row{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.row label{font-size:12px;color:var(--text2);width:70px}
.row input[type=date]{flex:1;background:var(--panel2);border:1px solid var(--border);
  color:var(--text);border-radius:4px;padding:5px;font-family:var(--mono);font-size:12px}
.row.btns{gap:4px}
.row2{display:flex;gap:6px;margin-bottom:6px}
.r2{flex:1;display:flex;align-items:center;gap:4px;min-width:0}
.r2 label{font-size:11px;color:var(--text2);width:auto}
.r2 input[type=date]{flex:1;min-width:0;background:var(--panel2);border:1px solid var(--border);
  color:var(--text);border-radius:4px;padding:4px;font-family:var(--mono);font-size:11px}
.qbtns{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;margin:4px 0}
.qb{background:rgba(0,212,255,.08);border:1px solid var(--border);color:var(--text);
  border-radius:4px;padding:5px 2px;cursor:pointer;font-family:var(--body);font-size:11px;text-align:center;white-space:nowrap}
.qb:hover{border-color:var(--accent);background:rgba(0,212,255,.2);color:var(--accent)}
.sel{background:var(--panel2);border:1px solid var(--border);color:var(--text);
  border-radius:4px;padding:5px 8px;font-size:13px;max-width:260px}
.sel.sm{padding:3px 5px;font-size:11px}

.b{background:rgba(0,212,255,.1);border:1px solid var(--border);color:var(--text);
  border-radius:4px;padding:6px 10px;cursor:pointer;font-family:var(--body);font-size:12px}
.b:hover{border-color:var(--accent);background:rgba(0,212,255,.2)}
.b.sm{padding:3px 8px;font-size:11px}
.b.primary{background:rgba(0,255,157,.12);border-color:rgba(0,255,157,.4);color:var(--accent2)}
.b.primary:hover{background:rgba(0,255,157,.25)}
.b.wide{width:100%;margin-top:6px;font-weight:700}
.hint{font-size:10px;color:var(--text2);margin:6px 0;line-height:1.4;font-style:italic}

.trips{overflow-y:auto;flex:1}
.trip{background:var(--panel2);border:1px solid var(--border);border-left:3px solid var(--accent);
  border-radius:4px;padding:7px 9px;margin-bottom:5px;cursor:pointer;transition:.12s}
.trip:hover{border-color:var(--accent);background:rgba(0,212,255,.06)}
.trip.sel{border-left-color:var(--accent2);background:rgba(0,255,157,.08)}
.tr-top{display:flex;justify-content:space-between;align-items:center;font-size:13px}
.tr-tm{font-family:var(--mono);font-size:11px;color:var(--text2)}
.tr-bot{display:flex;flex-wrap:wrap;gap:8px;font-size:11px;color:var(--text2);margin-top:4px}
.tr-bot span{white-space:nowrap}
.tr-pts{margin-left:auto;color:var(--accent4)}
.load,.empty{color:var(--text2);font-size:12px;text-align:center;padding:14px;line-height:1.6}
.empty.sm{padding:6px;font-size:11px}

.backups{margin-top:8px;max-height:220px;overflow-y:auto}
.bk{background:var(--panel2);border:1px solid var(--border);border-left:3px solid var(--accent4);
  border-radius:4px;padding:6px 8px;margin-bottom:5px}
.bk-t{font-size:12px;display:flex;justify-content:space-between;gap:6px}
.bk-dt{font-family:var(--mono);font-size:10px;color:var(--text2)}
.bk-b{font-size:11px;color:var(--text2);margin-top:3px}
.bk-dl{color:var(--accent);text-decoration:none;margin-left:6px}
.bk-dl:hover{text-shadow:0 0 8px var(--accent)}
.bk-sha{font-family:var(--mono);font-size:9px;color:#56708f;margin-top:2px}
.bk.pre{border-left-color:#ff9d00;opacity:.85}
.bk-tag{font-size:9px;color:#000;background:#ff9d00;border-radius:3px;padding:0 5px;margin-right:4px}
.bk-rs{background:rgba(0,255,157,.14);border:1px solid rgba(0,255,157,.5);color:var(--accent2);
  border-radius:4px;padding:1px 7px;cursor:pointer;font-family:var(--body);font-size:11px;margin-left:6px}
.bk-rs:hover{background:rgba(0,255,157,.3)}
.mono{font-family:var(--mono);font-size:9px;color:var(--accent);word-break:break-all}

/* ---------- přehrávač / player ---------- */
.player{display:flex;align-items:center;gap:10px;padding:8px 12px;flex-wrap:wrap;
  background:rgba(10,12,16,.97);border-top:1px solid var(--border)}
.pbtn{width:38px;height:38px;border-radius:50%;border:none;cursor:pointer;
  background:var(--accent2);color:#000;font-size:16px;font-weight:700;flex-shrink:0}
.pbtn:hover{box-shadow:0 0 12px var(--accent2)}
#seek{flex:1;min-width:120px;accent-color:var(--accent)}
.pt{font-family:var(--mono);font-size:13px;color:var(--accent4);min-width:74px;text-align:center}
.pv{font-family:var(--mono);font-size:13px;color:var(--accent2);min-width:66px;text-align:right}
.ctl{display:flex;align-items:center;gap:4px;font-size:13px;color:var(--text2);cursor:pointer}
.ctl input[type=color]{width:30px;height:26px;border:1px solid var(--border);border-radius:4px;
  background:var(--panel2);cursor:pointer;padding:1px}
.ctl input[type=checkbox]{width:16px;height:16px;accent-color:var(--accent2);cursor:pointer}
.dl{display:flex;gap:4px}

/* ---------- ikona bodu s rychlostí „022" ---------- */
.spd-wrap{background:transparent;border:none}
.spd-badge{width:52px;height:52px;border-radius:50%;background:rgba(5,8,12,.92);
  border:3px solid #002aff;display:flex;flex-direction:column;align-items:center;justify-content:center;
  line-height:1;transition:border-color .15s;cursor:pointer}
.spd-badge:hover{filter:brightness(1.3)}
.spd-badge .spd{font-family:'Courier New',monospace;font-size:19px;font-weight:700;color:#fff;
  text-shadow:0 0 6px rgba(255,255,255,.4)}
.spd-badge .spd-u{font-family:var(--mono);font-size:8px;color:var(--text2);margin-top:1px}

/* ---------- toast ---------- */
.toast{position:fixed;bottom:76px;left:50%;transform:translateX(-50%) translateY(20px);
  background:var(--panel);border:1px solid var(--accent2);color:var(--text);
  padding:10px 18px;border-radius:6px;font-size:13px;opacity:0;pointer-events:none;
  transition:.25s;z-index:999;box-shadow:0 4px 20px rgba(0,0,0,.6)}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.toast.bad{border-color:var(--red);color:#ffb0b0}

/* ---------- stavová lišta času / time status bar ---------- */
.tzbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:2px 14px;background:rgba(8,10,14,.95);border-bottom:1px solid var(--border);
  font-family:var(--mono);font-size:10px;color:var(--text2);letter-spacing:.3px}
.tzbadge{font-weight:700;color:#000;background:var(--accent4);border-radius:3px;padding:1px 6px;font-size:9px}
#tzinfo{opacity:.85}

/* A−/A+ a odpočet nečinnosti */
.fontctl{display:flex;gap:3px}
.gear.sm{padding:2px 7px;font-size:12px;font-family:var(--mono)}
.idlebox{font-family:var(--mono);font-size:11px;color:var(--accent2);
  border:1px solid var(--border);border-radius:4px;padding:3px 7px}
.idlebox #idle.warn{color:var(--red);animation:idleblink .8s steps(2) infinite}
@keyframes idleblink{50%{opacity:.3}}

/* nastavení: nové prvky */
.set-row.full{flex-direction:column;align-items:stretch;gap:5px}
.set-row.full input[type=text],.set-row select{width:100%;background:var(--panel2);
  border:1px solid var(--border);color:var(--text);border-radius:4px;padding:5px 6px;
  font-family:var(--body);font-size:12px}
.set-row select{flex:1;min-width:120px}
.settings{max-height:88vh;overflow-y:auto}
.b.sm.danger{border-color:var(--red);color:#ffb0b0;background:rgba(255,68,68,.1)}
.b.sm.danger:hover{background:rgba(255,68,68,.25)}
.logbox{background:#05080c;border:1px solid var(--border);border-radius:4px;
  font-family:var(--mono);font-size:10px;color:var(--accent2);padding:8px;margin-top:8px;
  max-height:220px;overflow:auto;white-space:pre-wrap;word-break:break-all}

/* 🖼️ fotka na mapě / photo overlay */
.photo{position:absolute;top:0;left:0;z-index:460;pointer-events:none;
  width:200px;height:auto;filter:drop-shadow(0 0 6px rgba(0,0,0,.45))}

/* 🕒 hodiny na mapě / clock overlay */
.mapclock{position:absolute;bottom:12px;left:12px;z-index:470;pointer-events:none;
  font-family:'Share Tech Mono',monospace;--clk-size:34px;line-height:1.05;
  text-shadow:0 0 8px rgba(0,0,0,.85),0 0 3px rgba(0,0,0,.9)}
.mapclock .clk-date{font-size:calc(var(--clk-size)*0.42);letter-spacing:1px;opacity:.92}
.mapclock .clk-time{font-size:var(--clk-size);font-weight:700;letter-spacing:2px}
.mapclock .clk-tag{font-size:calc(var(--clk-size)*0.26);letter-spacing:2px;opacity:.75}

/* reverzní / telegram tlačítko */
.pbtn.dir{background:var(--accent4);font-size:13px}
.b.sm.tg{border-color:#29b6f6;color:#cdeafd;background:rgba(41,182,246,.12)}
.b.sm.tg:hover{background:rgba(41,182,246,.28)}

/* toast je klikací / toast is clickable */
.toast.show{cursor:pointer}

/* 🌐 přepínání jazyka CZ/EN */
body:not(.lang-en) .en{display:none}
body.lang-en .cz{display:none}
.langflags{display:flex;gap:4px}
.flag{display:flex;align-items:center;gap:4px;background:rgba(0,212,255,.1);border:1px solid var(--border);
  border-radius:4px;padding:2px 6px;cursor:pointer;color:var(--text);font-family:var(--body);font-weight:700;
  font-size:11px;line-height:1;opacity:.55}
.flag img{width:22px;height:15px;display:block;border-radius:2px;object-fit:cover}
.flag:hover{border-color:var(--accent);background:rgba(0,212,255,.2);opacity:.85}
.flag.on{opacity:1;border-color:var(--accent2);box-shadow:0 0 8px rgba(0,255,157,.6)}
.robotlink{text-decoration:none;font-size:18px;line-height:1;padding:2px 4px;display:inline-block;
  filter:drop-shadow(0 0 4px rgba(0,212,255,.5));transform-origin:center;
  animation:wm-beat 1.4s ease-in-out infinite}
.robotlink:hover{filter:drop-shadow(0 0 10px var(--accent))}
.imp-row{margin-top:6px}
.imp-lbl{display:block;width:100%;text-align:center;cursor:pointer}
.drawgen{position:fixed;bottom:96px;left:50%;transform:translateX(-50%);z-index:3000;
  background:#1a8f6a;color:#fff;border:1px solid #fff;border-radius:6px;padding:6px 16px;
  font-family:var(--body);font-weight:700;font-size:13px;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.6)}
.drawgen:hover{background:#22b584}

/* 📝 volné textové overlaye na mapě */
.mapcap{position:absolute;top:0;left:0;z-index:472;pointer-events:none;white-space:nowrap;
  font-family:var(--body);font-weight:700;line-height:1.1}

/* 🌦️ počasí + 🌅 den/noc tint (jen přes mapu) */
.weatherfx{position:absolute;top:0;left:0;z-index:441;pointer-events:none}
.daynight{position:absolute;top:0;left:0;right:0;z-index:435;pointer-events:none;display:none;
  transition:background .8s linear}

/* 📊 graf nad přehrávačem (v toku) */
.graphfx{width:100%;height:90px;display:block;cursor:crosshair;border-top:1px solid var(--border);flex-shrink:0}

/* 🚗 ikona vozidla */
.veh-wrap{background:transparent;border:none;text-align:center}
.veh-ico{line-height:1;filter:drop-shadow(0 2px 3px rgba(0,0,0,.6))}
.veh-spd{font-family:var(--mono);font-size:10px;color:#fff;background:rgba(5,8,12,.8);
  border-radius:3px;padding:0 3px;margin-top:-2px;display:inline-block;white-space:nowrap}
/* 💡 světlomety v noci / brzdy */
.spd-wrap.night .spd-badge,.veh-wrap.night .veh-ico{filter:drop-shadow(0 0 14px rgba(255,245,200,.95)) drop-shadow(0 0 26px rgba(255,235,150,.6))}
.spd-wrap.brake .spd-badge,.veh-wrap.brake .veh-ico{filter:drop-shadow(0 0 16px rgba(255,40,40,.95)) drop-shadow(0 0 30px rgba(255,0,0,.6))}

/* skupinky v nastavení počasí */
.wx-grp{font-family:var(--mono);font-size:11px;color:var(--accent2);margin:9px 0 5px;letter-spacing:.5px}

/* 🧰 lišta nástrojů na mapě */
.maptools{position:absolute;top:78px;left:10px;z-index:478;display:flex;flex-direction:column;gap:5px}
.mt{width:34px;height:34px;border-radius:7px;border:1px solid var(--border);background:rgba(13,17,23,.92);
  color:#fff;font-size:16px;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center}
.mt:hover{border-color:var(--accent);background:rgba(0,212,255,.2)}
.mt.on{border-color:var(--accent2);background:rgba(0,255,157,.25);box-shadow:0 0 10px rgba(0,255,157,.5)}
.measurebox{position:absolute;top:78px;left:52px;z-index:478;background:rgba(13,17,23,.95);
  border:1px solid var(--accent4);border-radius:6px;padding:5px 10px;font-family:var(--mono);
  font-size:12px;color:var(--accent4);pointer-events:none;white-space:nowrap}

/* 🅿️ ikona parkování */
.park-wrap{background:transparent;border:none}
.park{width:26px;height:26px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);
  background:#2f6bff;border:2px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.6);
  display:flex;align-items:center;justify-content:center}
.park::after{content:'P';transform:rotate(45deg);color:#fff;font-weight:900;font-family:var(--disp);font-size:13px}

/* 🎥 režim nahrávání: schovej ovládání (v záznamu zůstane jen mapa + overlaye) */
body.recording .leaflet-control-container,
body.recording .maptools,
body.recording .measurebox,
body.recording .graphfx,
body.recording .player{ display:none !important; }
.recstop{position:fixed;top:5px;left:50%;transform:translateX(-50%);z-index:3000;
  background:#d12;color:#fff;border:1px solid #fff;border-radius:6px;padding:5px 14px;
  font-family:var(--body);font-weight:700;font-size:13px;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.6)}
.recstop:hover{background:#f33}

/* 📍 popisek zóny */
.zone-tt{background:rgba(0,212,255,.85);border:none;color:#021018;font-weight:700;font-family:var(--mono);
  font-size:11px;box-shadow:0 1px 4px rgba(0,0,0,.5)}
.zone-tt::before{display:none}

/* 📡 živý klient / live client */
.live-btn{border-color:rgba(0,255,157,.5);color:var(--accent2)}
.settings.live{width:min(380px,94vw)}
.lc-badge{font-family:var(--mono);font-size:9px;color:#000;background:var(--accent2);border-radius:3px;padding:1px 6px}
.lc-sub{font-family:var(--mono);font-size:11px;color:var(--accent);letter-spacing:1px;margin:12px 0 7px;
  border-bottom:1px solid var(--border);padding-bottom:4px}
.lc-src{font-family:var(--mono);font-size:11px;color:var(--accent2);background:var(--panel2);
  border:1px solid var(--border);border-radius:4px;padding:6px 8px;margin-bottom:8px}
.lc-src.bad{color:var(--accent4);border-color:var(--accent4)}
.lc-confirm{background:rgba(255,68,68,.1);border:1px solid rgba(255,68,68,.4);border-radius:4px;padding:6px 8px}
.lc-jobs{margin-top:6px;display:flex;flex-direction:column;gap:6px}
.lc-job{background:var(--panel2);border:1px solid var(--border);border-left:3px solid var(--accent2);
  border-radius:4px;padding:7px 9px}
.lc-jt{font-size:13px;display:flex;justify-content:space-between;gap:6px;align-items:center}
.lc-state{font-family:var(--mono);font-size:10px;white-space:nowrap}
.lc-jm{font-family:var(--mono);font-size:10px;color:var(--text2);margin-top:3px;word-break:break-all}
.lc-prog{height:6px;background:#05080c;border-radius:3px;overflow:hidden;margin:5px 0}
.lc-bar{height:100%;background:linear-gradient(90deg,var(--accent2),var(--accent));transition:width .4s}
.lc-ctrls{display:flex;gap:6px;margin-top:6px}
.lc-b{background:rgba(0,255,157,.14);border:1px solid rgba(0,255,157,.45);color:var(--accent2);
  border-radius:4px;padding:3px 12px;cursor:pointer;font-size:13px}
.lc-b:hover{background:rgba(0,255,157,.3)}
.lc-b.stop{background:rgba(255,68,68,.12);border-color:rgba(255,68,68,.5);color:#ffb0b0}
.lc-b.del{background:rgba(255,157,0,.12);border-color:rgba(255,157,0,.5);color:#ffcf80}
.settings.live input[type=text],.settings.live input[type=number],.settings.live select{
  background:var(--panel2);border:1px solid var(--border);color:var(--text);border-radius:4px;
  padding:5px 6px;font-family:var(--mono);font-size:12px}

/* ---------- responsive ---------- */
@media(max-width:800px){
  .layout{flex-direction:column;height:auto}
  .side{width:100%;border-right:none;border-bottom:1px solid var(--border)}
  .main{height:70vh}
  .pin-clock{font-size:38px}
  .tzbar{font-size:9px}
}
