:root{
  --bg:#0a0c0e;--panel:#14181c;--panel2:#1b2126;--line:#2a333a;
  --ink:#f0f2f0;--muted:#8d99a3;--accent:#e8a33d;--accent-rgb:232,163,61;
  --accent-deep:#b8791f;--clay:#4a9db0;--rose:#e18a9a;--ok:#7fb069;--r:18px;
  --ombre:0 18px 50px -20px rgba(0,0,0,.85);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{height:100%;margin:0;background:var(--bg);color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;overscroll-behavior:none}
body{display:flex;flex-direction:column;overflow:hidden}

/* ---------- barre haute ---------- */
header{position:relative;z-index:5;display:flex;align-items:center;gap:10px;
  padding:10px 12px;background:linear-gradient(180deg,#1b2126,#14181c);
  border-bottom:1px solid var(--line)}
header .mark{width:34px;height:34px;border-radius:50%;flex:none;
  background:radial-gradient(circle at 35% 30%,#fff 0 5%,#f6d38a 18%,#c3811f 48%,#241a0a 72%);
  box-shadow:0 0 18px rgba(var(--accent-rgb),.35)}
header h1{margin:0;font-size:16px;font-weight:800;letter-spacing:-.01em}
header .sous{color:var(--muted);font-size:11px;margin-top:1px}
header .pousse{margin-left:auto}
.pastille{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;
  color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:6px 10px;background:#0e1114}
.pastille b{color:var(--ink)}
.point-vert{width:7px;height:7px;border-radius:50%;background:var(--ok);box-shadow:0 0 8px rgba(127,176,105,.8)}
.point-rouge{width:7px;height:7px;border-radius:50%;background:var(--rose);box-shadow:0 0 8px rgba(225,138,154,.8)}
.point-bleu{width:7px;height:7px;border-radius:50%;background:var(--off);transition:background .2s}
.point-bleu.allume{background:#3fa9f5;box-shadow:0 0 8px rgba(63,169,245,.9)}

/* ---------- carte ---------- */
#carte{flex:1;position:relative;background:#0b0e11}
.maplibregl-ctrl-attrib{font-size:9px;background:rgba(10,12,14,.7)!important}
.maplibregl-ctrl-attrib a{color:var(--muted)!important}
.maplibregl-ctrl-group{background:#14181c!important;border:1px solid var(--line)!important}
.maplibregl-ctrl-group button+button{border-top:1px solid var(--line)!important}
.maplibregl-ctrl-group button span{filter:invert(1) brightness(1.6)}

/* marqueur de point */
.marqueur{display:flex;flex-direction:column;align-items:center;cursor:pointer;
  font-size:20px;line-height:1;transform:translateY(-2px);filter:drop-shadow(0 3px 6px rgba(0,0,0,.6))}
.marqueur .bulle{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;
  background:#14181c;border:2px solid var(--c,#e8a33d);box-shadow:0 0 0 3px rgba(0,0,0,.35)}
.marqueur .etiquette{margin-top:3px;font-size:10px;font-weight:700;color:#fff;
  background:rgba(10,12,14,.75);padding:2px 6px;border-radius:6px;white-space:nowrap;max-width:120px;
  overflow:hidden;text-overflow:ellipsis}

/* position */
.pos-dot{width:18px;height:18px;border-radius:50%;background:#3fa9f5;
  border:3px solid #fff;box-shadow:0 0 0 2px rgba(63,169,245,.45),0 2px 8px rgba(0,0,0,.6)}
.pos-halo{position:absolute;inset:-14px;border-radius:50%;background:rgba(63,169,245,.22);
  animation:pulse 2.4s ease-out infinite}
@keyframes pulse{0%{transform:scale(.6);opacity:.9}100%{transform:scale(1.6);opacity:0}}

/* ---------- boutons flottants ---------- */
.actions{position:absolute;right:12px;bottom:18px;display:flex;flex-direction:column;gap:10px;z-index:4}
.rond{width:50px;height:50px;border-radius:16px;border:1px solid var(--line);background:#14181c;
  color:var(--ink);display:grid;place-items:center;font-size:20px;cursor:pointer;
  box-shadow:var(--ombre);transition:transform .12s,border-color .12s}
.rond:active{transform:scale(.94)}
.rond.actif{border-color:rgba(var(--accent-rgb),.8);color:var(--accent);background:#1d2329}
.rond.fort{background:linear-gradient(180deg,#f0b055,var(--accent-deep));color:#231604;border:0}
.badge-cache{position:absolute;top:-5px;right:-5px;background:var(--rose);color:#1b0a0e;
  font-size:9px;font-weight:800;border-radius:999px;padding:2px 5px}

/* ---------- feuille basse ---------- */
.voile{position:fixed;inset:0;background:rgba(4,6,8,.6);backdrop-filter:blur(3px);opacity:0;
  pointer-events:none;transition:opacity .2s;z-index:9}
.voile.ouvert{opacity:1;pointer-events:auto}
.feuille{position:fixed;left:0;right:0;bottom:0;z-index:10;max-height:86vh;overflow-y:auto;
  background:linear-gradient(180deg,var(--panel2),var(--panel));border-top:1px solid var(--line);
  border-radius:22px 22px 0 0;padding:8px 16px 26px;transform:translateY(102%);
  transition:transform .26s cubic-bezier(.3,.9,.3,1);box-shadow:var(--ombre);-webkit-overflow-scrolling:touch}
.feuille.ouvert{transform:translateY(0)}
.poignee{width:44px;height:4px;border-radius:999px;background:#39434b;margin:6px auto 14px}
.feuille h2{margin:0 0 4px;font-size:17px;font-weight:800;display:flex;align-items:center;gap:8px}
.feuille .intro{color:var(--muted);font-size:12.5px;margin:0 0 14px;line-height:1.45}
label.champ{display:flex;flex-direction:column;gap:5px;font-size:12px;color:var(--muted);
  font-weight:600;margin-bottom:11px}
input,select,textarea{background:rgba(0,0,0,.25);border:1px solid var(--line);border-radius:11px;
  color:var(--ink);font:inherit;font-size:14px;padding:11px;width:100%}
input:focus,select:focus,textarea:focus{outline:none;border-color:rgba(var(--accent-rgb),.65)}
textarea{resize:vertical;min-height:60px}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.btn{width:100%;border:0;border-radius:13px;padding:14px;font:inherit;font-weight:800;font-size:14px;
  background:linear-gradient(180deg,#f0b055,var(--accent-deep));color:#231604;cursor:pointer;
  box-shadow:0 10px 24px -12px rgba(var(--accent-rgb),.8)}
.btn:active{transform:translateY(1px)}
.btn.secondaire{background:transparent;border:1px solid rgba(var(--accent-rgb),.5);
  color:var(--accent);box-shadow:none}
.btn.discret{background:#1b2126;border:1px solid var(--line);color:var(--muted);box-shadow:none}
.btn.danger{background:transparent;border:1px solid rgba(225,138,154,.5);color:var(--rose)}
.ligne{display:flex;gap:9px}
.ligne>*{flex:1}
.aide{color:var(--muted);font-size:11.5px;line-height:1.45;margin:8px 0 0}

/* listes */
.item{display:flex;align-items:center;gap:11px;padding:11px 12px;border:1px solid var(--line);
  border-radius:14px;background:#151a1f;margin-bottom:8px;cursor:pointer}
.item:active{background:#1a2026}
.item .ico{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;font-size:18px;
  background:rgba(255,255,255,.05);border:1px solid var(--line);flex:none}
.item .txt{min-width:0;flex:1}
.item .txt b{display:block;font-size:13.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.item .txt span{display:block;font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.item .chev{color:var(--muted);font-size:16px;flex:none}
.vide{color:var(--muted);font-size:12.5px;text-align:center;padding:22px 10px;border:1px dashed var(--line);
  border-radius:14px}

/* champs personnalisés dans le formulaire de type */
.champ-def{display:grid;grid-template-columns:1fr 120px 34px;gap:7px;margin-bottom:7px;align-items:center}
.champ-def input,.champ-def select{padding:9px;font-size:13px}
.champ-def .moins{background:#20272d;border:1px solid var(--line);color:var(--rose);border-radius:10px;
  height:100%;cursor:pointer;font-weight:800}

.avancement{height:7px;border-radius:999px;background:#20272d;overflow:hidden;margin:10px 0 4px}
.avancement>i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--accent-deep),var(--accent));
  transition:width .2s}
.jauge{display:flex;justify-content:space-between;font-size:11.5px;color:var(--muted)}

.frise{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-top:10px}
.frise>div{background:#151a1f;padding:10px 12px;display:flex;justify-content:space-between;font-size:12.5px}
.frise>div span:first-child{color:var(--muted)}

a{color:var(--accent)}
@media(min-width:760px){
  .feuille{left:auto;right:16px;bottom:16px;width:420px;border-radius:22px;border:1px solid var(--line)}
  .feuille.ouvert{transform:translateY(0)}
}
