:root{
  --blue:#075db8;
  --blue-dark:#084987;
  --blue-soft:#e9f3ff;
  --orange:#f39a32;
  --green:#17834f;
  --red:#c2382b;
  --amber:#b97309;
  --ink:#17263a;
  --muted:#728095;
  --bg:#f2f5f9;
  --card:#fff;
  --line:#dce4ee;
  --shadow:0 9px 28px rgba(29,58,92,.10);
  --safe-top:env(safe-area-inset-top);
  --safe-bottom:env(safe-area-inset-bottom);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
button:disabled{cursor:default;opacity:.55}
.hidden{display:none!important}
.muted{color:var(--muted);font-size:.84rem}
.eyebrow{font-size:.68rem;letter-spacing:.12em;font-weight:950;color:var(--blue);margin-bottom:3px}
.topbar{
  position:sticky;top:0;z-index:30;color:#fff;
  background:linear-gradient(135deg,var(--blue),var(--blue-dark));
  padding:calc(11px + var(--safe-top)) 14px 11px;
  box-shadow:0 6px 20px rgba(7,93,184,.23)
}
.topbar-inner{max-width:1180px;margin:auto;display:flex;justify-content:space-between;align-items:center;gap:10px}
.brand{display:flex;align-items:center;gap:10px}
.brand-mark{width:43px;height:43px;border-radius:14px;background:#fff;color:var(--blue);display:grid;place-items:center;font-weight:950;font-size:.95rem}
.brand h1{margin:0;font-size:1.33rem;line-height:1}.brand small{opacity:.82}
.top-actions{display:flex;align-items:center;gap:7px}
.top-btn{border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.12);color:#fff;border-radius:12px;padding:8px 10px;font-weight:800}
main{max-width:1180px;margin:auto;padding:12px}
.hero-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:3px 0 12px}
.hero-title h2{margin:0;font-size:1.55rem}.hero-title p{margin:3px 0 0;color:var(--muted)}
.primary,.secondary,.danger,.round-btn{
  border:0;border-radius:13px;padding:10px 13px;font-weight:850
}
.primary{background:var(--blue);color:#fff}
.secondary{background:#edf3fa;color:var(--blue)}
.danger{background:#fff0ee;color:var(--red)}
.xl{min-height:52px;font-size:1rem}.full{width:100%}
.metrics{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;margin-bottom:12px}
.metric{background:#fff;border:1px solid var(--line);border-radius:17px;padding:13px;box-shadow:var(--shadow)}
.metric .label{font-size:.73rem;color:var(--muted);font-weight:750}.metric .value{font-size:1.58rem;font-weight:950;margin-top:3px}
.prospectus-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
.pro-card{display:grid;grid-template-columns:132px minmax(0,1fr);background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:var(--shadow);min-height:188px}
.cover{position:relative;background:linear-gradient(155deg,#dfeeff,#c8dcf3);min-height:188px;overflow:hidden}
.cover img{width:100%;height:100%;object-fit:cover;display:block}
.cover-fallback{height:100%;display:grid;place-items:center;color:var(--blue);font-size:2rem;font-weight:950}
.cover-badge{position:absolute;left:8px;bottom:8px;background:rgba(18,31,48,.82);color:#fff;border-radius:999px;padding:5px 8px;font-size:.68rem;font-weight:800}
.pro-body{padding:13px;display:flex;flex-direction:column;min-width:0}
.pro-head{display:flex;justify-content:space-between;gap:8px}.pro-name{font-size:1.12rem;font-weight:950;line-height:1.12}.pro-dates{font-size:.78rem;color:var(--muted);margin-top:4px}
.status{height:max-content;white-space:nowrap;border-radius:999px;padding:6px 8px;font-size:.7rem;font-weight:850;background:#eef2f6}
.status.READY{background:#e9f7ef;color:var(--green)}
.status.ANALYZING,.status.QUEUED{background:#fff4df;color:var(--amber)}
.status.RETRYING{background:#fff1d8;color:#a75c00}
.status.ERROR{background:#fff0ee;color:var(--red)}
.progress-row{margin-top:auto}.progress-label{display:flex;justify-content:space-between;font-size:.72rem;color:var(--muted);margin-bottom:5px}
.progress{height:8px;border-radius:99px;background:#edf1f5;overflow:hidden}.progress span{display:block;height:100%;background:linear-gradient(90deg,var(--blue),#48a2ee)}
.pro-message{font-size:.76rem;color:var(--muted);margin-top:8px;min-height:18px}
.pro-actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}
.empty{background:#fff;border:1px dashed #cbd6e3;border-radius:20px;padding:35px;text-align:center;color:var(--muted)}
.modal{border:0;background:transparent;padding:0;width:min(590px,calc(100% - 20px))}
.modal::backdrop,.point-sheet::backdrop{background:rgba(12,22,34,.5);backdrop-filter:blur(3px)}
.modal-card{background:#fff;border-radius:22px;padding:17px;box-shadow:0 22px 70px rgba(0,0,0,.25)}
.modal-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.modal-head h2{margin:0;font-size:1.45rem}
.round-btn{background:#edf1f6;padding:8px 10px}
label{display:block;font-size:.83rem;font-weight:850;margin-top:12px}
input,select,textarea{width:100%;margin-top:6px;border:1px solid #cdd8e5;border-radius:13px;background:#fff;padding:11px;color:var(--ink);font-size:16px}
.date-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.info-box{margin:12px 0;background:#eef6ff;color:#3d6088;border-radius:12px;padding:10px;font-size:.79rem;line-height:1.35}
.diag-row{display:flex;justify-content:space-between;gap:10px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:11px;margin-top:8px}.diag-dot{width:11px;height:11px;border-radius:50%;background:var(--red)}.diag-dot.ok{background:var(--green)}
.reader{position:fixed;inset:0;background:#2a3037;z-index:60;display:flex;flex-direction:column}
.reader-head{padding:calc(7px + var(--safe-top)) 8px 7px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:8px}
.reader-info{min-width:0;flex:1}.reader-title{font-weight:950;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.reader-sub{font-size:.75rem;color:var(--muted)}
.reader-progress{width:125px}.reader-progress .progress{height:7px}
.reader-body{display:grid;grid-template-columns:minmax(0,1fr) 340px;min-height:0;flex:1}
.pdf-zone{overflow:auto;padding:7px;background:#30363d}
.offer-side{overflow:auto;background:#f5f8fb;border-left:1px solid #d2dce8;padding:9px}
.page{position:relative;margin:0 auto 9px;background:#fff;box-shadow:0 5px 18px rgba(0,0,0,.3)}
.page canvas{display:block;width:100%;height:100%}
.hotspot{position:absolute;border:2px solid rgba(7,93,184,.9);background:rgba(7,93,184,.11);border-radius:7px;padding:0}
.hotspot.PRESENT{border-color:var(--green);background:rgba(23,131,79,.15)}
.hotspot.ABSENT{border-color:var(--red);background:rgba(194,56,43,.14)}
.offer-item{background:#fff;border:1px solid var(--line);border-radius:14px;padding:10px;margin-bottom:7px}.offer-item.PRESENT{border-left:5px solid var(--green)}.offer-item.ABSENT{border-left:5px solid var(--red)}.offer-item strong{display:block;font-size:.9rem}.offer-item .small{font-size:.73rem;color:var(--muted);margin-top:3px}
.point-sheet{width:min(560px,100%);max-height:92dvh;border:0;border-radius:24px 24px 0 0;padding:0;margin:auto 0 0 auto}
.point-sheet form{background:#fff;padding:10px 14px calc(14px + var(--safe-bottom));max-height:92dvh;overflow:auto}
.grabber{width:42px;height:5px;background:#d6dde6;border-radius:99px;margin:0 auto 10px}
.point-title{font-size:1.3rem;font-weight:950;line-height:1.08}
.field-section{margin-top:13px}.field-label{font-size:.88rem;font-weight:900;margin-bottom:7px}
.presence-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.presence{min-height:55px;border:2px solid var(--line);background:#fff;border-radius:15px;font-weight:950;font-size:1rem}.presence.selected.present{border-color:var(--green);background:#edf9f2;color:var(--green)}.presence.selected.absent{border-color:var(--red);background:#fff1ef;color:var(--red)}
.chips{display:flex;flex-wrap:wrap;gap:7px}.chip{border:1px solid #ccd7e3;background:#fff;border-radius:999px;padding:9px 11px;font-size:.84rem;font-weight:800}.chip.selected{background:var(--blue-soft);border-color:var(--blue);color:var(--blue)}
.quantity-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.qty{border:1px solid #d3dce7;background:#fff;border-radius:13px;padding:10px 5px;text-align:center;font-size:.76rem;font-weight:850}.qty b{display:block;font-size:1.2rem;color:var(--orange);letter-spacing:-2px;margin-bottom:2px}.qty.selected{border-color:var(--orange);background:#fff5e7;color:#8b4a00}
.help{font-size:.75rem;color:var(--muted);margin-top:5px}.sticky-save{position:sticky;bottom:0;margin-top:14px}
.toast{position:fixed;z-index:120;left:50%;bottom:calc(16px + var(--safe-bottom));transform:translate(-50%,18px);opacity:0;pointer-events:none;background:#142236;color:#fff;border-radius:13px;padding:10px 14px;max-width:90vw;text-align:center;transition:.2s}.toast.show{opacity:1;transform:translate(-50%,0)}
.login{min-height:100vh;display:grid;place-items:center;padding:18px;background:radial-gradient(circle at top,#dfeeff,var(--bg) 48%)}
.login-card{width:min(410px,100%);background:#fff;border:1px solid var(--line);border-radius:24px;padding:22px;box-shadow:var(--shadow)}
.login-mark{width:68px;height:68px;border-radius:20px;background:linear-gradient(145deg,var(--blue),var(--blue-dark));color:#fff;display:grid;place-items:center;font-weight:950;margin-bottom:14px}.login h1{margin:0;font-size:1.9rem}.login p{color:var(--muted);line-height:1.4}
@media(max-width:850px){
  .prospectus-grid{grid-template-columns:1fr}
  .reader-body{grid-template-columns:1fr}.offer-side{display:none}
}
@media(max-width:430px){
  main{padding:8px}
  .topbar{padding-left:9px;padding-right:9px}.brand-mark{width:38px;height:38px}.brand h1{font-size:1.18rem}
  .top-btn span{display:none}.hero-actions{align-items:flex-end}.hero-title h2{font-size:1.28rem}.hero-title p{font-size:.78rem}
  .metrics{grid-template-columns:repeat(2,1fr);gap:7px}.metric{padding:10px;border-radius:14px}.metric .value{font-size:1.35rem}
  .pro-card{grid-template-columns:96px minmax(0,1fr);min-height:158px;border-radius:16px}.cover{min-height:158px}.pro-body{padding:10px}.pro-name{font-size:1rem}.pro-actions button{padding:9px 10px}
  .date-grid{grid-template-columns:1fr}
  .reader-head{padding-left:6px;padding-right:6px}.reader-progress{width:78px}.pdf-zone{padding:3px}
  .point-sheet{max-height:88dvh}.point-sheet form{max-height:88dvh}
  .quantity-grid{grid-template-columns:repeat(2,1fr)}
}


/* V1.2 - polish */
body::before{
  content:"";position:fixed;inset:0 0 auto 0;height:320px;z-index:-1;
  background:
    radial-gradient(circle at 12% 18%,rgba(255,255,255,.85),transparent 26%),
    linear-gradient(180deg,#e8f2ff 0,#f2f5f9 100%);
}
.topbar{background:linear-gradient(115deg,#075db8 0%,#084987 68%,#f39a32 150%)}
.hero-actions{
  background:rgba(255,255,255,.82);backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.8);border-radius:20px;
  padding:15px 16px;box-shadow:0 8px 30px rgba(26,61,99,.08)
}
.hero-title h2{font-size:1.7rem;letter-spacing:-.025em}
.metrics{margin-top:2px}
.metric{border:0;box-shadow:0 10px 30px rgba(27,55,88,.08)}
.metric:nth-child(1){border-top:4px solid #075db8}
.metric:nth-child(2){border-top:4px solid #17834f}
.metric:nth-child(3){border-top:4px solid #f39a32}
.metric:nth-child(4){border-top:4px solid #7c5ce5}
.pro-card{
  border:0;box-shadow:0 12px 34px rgba(26,54,88,.10);
  transition:transform .16s ease,box-shadow .16s ease
}
.pro-card:hover{transform:translateY(-2px);box-shadow:0 16px 40px rgba(26,54,88,.14)}
.cover::after{
  content:"";position:absolute;inset:auto 0 0 0;height:42%;
  background:linear-gradient(transparent,rgba(10,28,48,.25));pointer-events:none
}
.pro-name{font-size:1.16rem}
.primary{box-shadow:0 5px 14px rgba(7,93,184,.20)}
.status{font-weight:900}
.status.RETRYING::before{content:"↻ ";font-weight:950}
.empty{background:rgba(255,255,255,.75);backdrop-filter:blur(8px)}
@media(max-width:430px){
  body::before{height:220px}
  .hero-actions{padding:11px 12px;border-radius:16px}
  .hero-title h2{font-size:1.22rem}
  .hero-title p{max-width:230px}
  .pro-card{grid-template-columns:88px minmax(0,1fr)}
}

.stage-pill{
  display:inline-block;border-radius:999px;padding:3px 7px;margin-right:4px;
  background:#e8f2ff;color:#075db8;font-size:.64rem;font-weight:950;
  letter-spacing:.035em;vertical-align:1px
}
.status.ANALYZING{animation:pulseStatus 1.6s ease-in-out infinite}
@keyframes pulseStatus{0%,100%{opacity:1}50%{opacity:.63}}

.report-actions{display:grid;grid-template-columns:1.35fr 1fr;gap:9px;margin-top:16px}
.user-create{background:#f6f9fc;border:1px solid var(--line);border-radius:15px;padding:12px;margin-top:12px}
.user-create h3{margin:0 0 7px}
.user-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.users-list{margin-top:12px;display:grid;gap:7px}
.user-row{display:flex;justify-content:space-between;align-items:center;gap:10px;border:1px solid var(--line);border-radius:13px;padding:10px;background:#fff}
@media(max-width:430px){
  .user-grid{grid-template-columns:1fr}
  .report-actions{grid-template-columns:1fr}
}


/* ==============================================================
   PROSPILOT V1.5 — IDENTITÉ LES CALLUNES
   ============================================================== */
.brand-v15{gap:13px}
.callunes-logo-shell{
  width:255px;height:48px;overflow:hidden;position:relative;flex:0 0 auto;
  display:flex;align-items:center
}
.callunes-logo{
  width:255px;height:auto;display:block;
  filter:invert(1) grayscale(1) contrast(1.5);
  mix-blend-mode:screen;
  transform:scale(1.28);
  transform-origin:center;
}
.app-signature{
  border-left:1px solid rgba(255,255,255,.30);
  padding-left:13px;min-width:0
}
.app-signature h1{font-size:1.25rem;margin:0;line-height:1.05;color:white}
.app-signature small{font-size:.70rem;opacity:.82;white-space:nowrap}
.cover{background:#e8eef5}
.cover img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  object-position:center top
}
.cover-fallback{position:absolute;inset:0}
.cover-badge{z-index:2}
@media(max-width:760px){
  .callunes-logo-shell{width:195px;height:43px}
  .callunes-logo{width:195px;transform:scale(1.35)}
  .app-signature{padding-left:9px}
  .app-signature h1{font-size:1.05rem}
  .app-signature small{font-size:.62rem}
}
@media(max-width:430px){
  .topbar-inner{gap:5px}
  .brand-v15{gap:5px}
  .callunes-logo-shell{width:150px;height:40px}
  .callunes-logo{width:150px;transform:scale(1.42)}
  .app-signature{padding-left:6px}
  .app-signature h1{font-size:.94rem}
  .app-signature small{font-size:.55rem}
  .top-actions{gap:4px}
  .top-btn{padding:7px 8px}
}


/* =========================================================
   V1.7 — POINTAGE VISUEL / LOGIN / CARTES MOBILE
   ========================================================= */

.login{
  background:
    radial-gradient(circle at 50% 0,#ddecff 0,transparent 42%),
    linear-gradient(180deg,#eef5fc,#f6f8fb 60%);
}
.login-card-v17{
  padding:24px 22px 22px;
  border:0;
  box-shadow:0 22px 55px rgba(18,50,86,.16);
}
.login-logo{
  display:block;
  width:100%;
  max-width:340px;
  height:auto;
  margin:0 auto 8px;
  border-radius:12px;
}
.login-subtitle{
  text-align:center;
  color:var(--muted);
  font-weight:700;
  margin:0 0 16px;
}

.brand-v17{gap:12px;min-width:0}
.top-logo{
  display:block;
  width:260px;
  max-height:50px;
  object-fit:contain;
  object-position:left center;
  background:white;
  border-radius:9px;
  padding:3px 6px;
}
.app-signature{border-left:1px solid rgba(255,255,255,.3);padding-left:11px}

.cover{
  background:#eef2f6;
  display:flex;
  align-items:center;
  justify-content:center;
}
.cover img{
  position:absolute;
  inset:6px;
  width:calc(100% - 12px);
  height:calc(100% - 12px);
  object-fit:contain !important;
  object-position:center center !important;
  background:white;
  border-radius:10px;
}

.status.COMPLETED{
  background:#daf5e5;
  color:#087744;
  border:1px solid #9fdfbd;
}
.report-ready{
  background:#e6f1ff !important;
  color:#075db8 !important;
  border:1px solid #9bc6f4;
}

/* Couleurs beaucoup plus lisibles */
.hotspot{
  border-width:3px;
  transition:.14s;
}
.hotspot.UNPOINTED{
  border-color:#1675d1;
  background:rgba(22,117,209,.10);
}
.hotspot.PRESENT_OK{
  border-color:#0b8f4d;
  background:rgba(11,143,77,.22);
  box-shadow:0 0 0 2px rgba(255,255,255,.45) inset;
}
.hotspot.PRESENT_WARNING{
  border-color:#f08a00;
  background:rgba(240,138,0,.28);
}
.hotspot.ABSENT_STORE{
  border-color:#d32929;
  background:rgba(211,41,41,.30);
}
.hotspot.ABSENT_EXTERNAL{
  border-color:#087dd7;
  background:rgba(8,125,215,.30);
  box-shadow:0 0 0 2px rgba(255,255,255,.35) inset;
}

.offer-item.UNPOINTED{border-left:7px solid #8aa1b8}
.offer-item.PRESENT_OK{border-left:7px solid #0b8f4d;background:#effaf4}
.offer-item.PRESENT_WARNING{border-left:7px solid #f08a00;background:#fff6e8}
.offer-item.ABSENT_STORE{border-left:7px solid #d32929;background:#fff0f0}
.offer-item.ABSENT_EXTERNAL{border-left:7px solid #087dd7;background:#edf7ff}

.completion-card{
  text-align:center;
  padding:24px;
}
.completion-icon{
  width:78px;height:78px;border-radius:50%;
  display:grid;place-items:center;
  margin:0 auto 12px;
  background:#e7f8ef;color:#0b8f4d;
  border:4px solid #0b8f4d;
  font-size:42px;font-weight:950;
}
.completion-card h2{font-size:1.8rem;margin:4px 0 8px}
.completion-text{font-size:1rem;font-weight:800;margin:6px 0}
.completion-score{
  font-size:3rem;font-weight:950;color:#0b8f4d;
  margin:4px 0 7px;
}

@media(max-width:430px){
  .top-logo{
    width:185px;
    max-height:43px;
    padding:2px 4px;
  }
  .app-signature{padding-left:6px}
  .app-signature h1{font-size:.94rem}
  .app-signature small{font-size:.55rem}

  .pro-card{
    grid-template-columns:112px minmax(0,1fr);
  }
  .cover{
    min-height:180px;
  }
  .cover img{
    inset:5px;
    width:calc(100% - 10px);
    height:calc(100% - 10px);
  }
}


/* V1.7.2 — traçabilité visuelle des pointages */
.hotspot{overflow:visible}
.point-mark{
  position:absolute;
  right:3px;
  bottom:3px;
  z-index:3;
  max-width:calc(100% - 6px);
  padding:2px 5px;
  border-radius:999px;
  background:rgba(17,31,48,.88);
  color:#fff;
  font-size:9px;
  line-height:1.2;
  font-weight:900;
  letter-spacing:.01em;
  white-space:nowrap;
  box-shadow:0 1px 4px rgba(0,0,0,.22);
  pointer-events:none;
}
.pointed-by{
  margin-top:4px;
  font-size:.68rem;
  color:#65778b;
  font-weight:800;
}
.offer-item.ABSENT_EXTERNAL .pointed-by{color:#0871be}
.offer-item.ABSENT_STORE .pointed-by{color:#b52626}
.offer-item.PRESENT_OK .pointed-by{color:#087744}
.offer-item.PRESENT_WARNING .pointed-by{color:#b96c00}

@media(max-width:430px){
  .point-mark{
    font-size:8px;
    padding:2px 4px;
    right:2px;
    bottom:2px;
  }
}


/* =========================================================
   V1.8 — ARCHIVES
   ========================================================= */
.metric-archive{
  appearance:none;
  text-align:left;
  font:inherit;
  color:inherit;
  cursor:pointer;
  border:0;
  border-top:4px solid #64748b !important;
  transition:transform .14s ease,box-shadow .14s ease;
}
.metric-archive:hover{
  transform:translateY(-2px);
  box-shadow:0 15px 34px rgba(27,55,88,.15);
}
.metric-hint{
  margin-top:3px;
  font-size:.62rem;
  color:var(--muted);
  font-weight:750;
}

.archives-modal{
  width:min(980px,calc(100vw - 20px));
}
.archives-card{
  width:100%;
  max-width:none;
  max-height:min(88vh,850px);
  overflow:auto;
}
.archive-intro{
  max-width:680px;
  margin:5px 0 0;
  line-height:1.35;
}
.archives-content{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:14px;
}
.archive-row{
  display:grid;
  grid-template-columns:92px minmax(0,1fr);
  min-height:142px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  overflow:hidden;
}
.archive-cover{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#eef2f6;
  padding:5px;
}
.archive-cover img{
  width:100%;
  height:100%;
  object-fit:contain;
  background:white;
  border-radius:8px;
}
.archive-body{
  padding:11px;
  min-width:0;
}
.archive-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:8px;
}
.archive-name{
  font-size:1rem;
  font-weight:950;
  line-height:1.1;
}
.archive-dates{
  margin-top:3px;
  color:var(--muted);
  font-size:.72rem;
}
.archive-stats{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:10px 0 6px;
  color:#596c81;
  font-size:.7rem;
  font-weight:800;
}
.archive-progress{
  height:6px;
}
.archive-actions{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:10px;
}
.archive-actions button{
  padding:8px 10px;
  font-size:.74rem;
}
.status.ARCHIVED_PENDING{
  background:#eef2f6;
  color:#58697c;
  border:1px solid #d8e0e8;
}
.archive-empty{
  grid-column:1/-1;
}

@media(max-width:850px){
  .metrics{grid-template-columns:repeat(2,1fr)}
  .metric-archive{grid-column:1/-1}
  .archives-content{grid-template-columns:1fr}
}
@media(max-width:430px){
  .metric-archive{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
  }
  .metric-archive .label{grid-column:1}
  .metric-archive .value{grid-column:2;grid-row:1/3;margin:0}
  .metric-archive .metric-hint{grid-column:1}
  .archives-modal{
    width:100%;
    max-width:100%;
  }
  .archives-card{
    border-radius:22px 22px 0 0;
    max-height:90dvh;
  }
  .archive-row{
    grid-template-columns:78px minmax(0,1fr);
  }
}


/* =========================================================
   V1.9 — ADMINISTRATION UTILISATEURS
   ========================================================= */
.user-admin-block{
  background:#f7f9fc;
  border:1px solid var(--line);
  border-radius:16px;
  padding:13px;
}
.user-admin-title{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px;
  margin-bottom:10px;
}
.user-admin-title h3{margin:0 0 3px;font-size:1rem}
.users-list-v19{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
}
.user-card-v19{
  background:white;
  border:1px solid var(--line);
  border-radius:14px;
  padding:11px;
}
.user-card-head{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:9px;
}
.user-avatar{
  width:42px;
  height:42px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#e6f1ff;
  color:#075db8;
  font-weight:950;
}
.user-main{min-width:0}
.user-main b{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.user-actions{
  display:flex;
  gap:7px;
  margin-top:10px;
}
.user-actions button{
  flex:1;
  min-height:38px;
}
.danger-soft{
  border:1px solid #f4c4c0;
  background:#fff0ee;
  color:#b92d25;
  border-radius:12px;
  font:inherit;
  font-weight:850;
  padding:8px 10px;
  cursor:pointer;
}
.password-change-box{
  margin-top:12px;
  padding:12px;
  background:#f7f9fc;
  border:1px dashed #cbd8e6;
  border-radius:14px;
}
.editor-actions{
  display:grid;
  grid-template-columns:1.4fr 1fr;
  gap:8px;
  margin-top:14px;
}
@media(max-width:700px){
  .users-list-v19{grid-template-columns:1fr}
}
@media(max-width:430px){
  .user-card-head{grid-template-columns:auto minmax(0,1fr)}
  .user-card-head .status{
    grid-column:1/-1;
    width:max-content;
  }
  .editor-actions{grid-template-columns:1fr}
}


/* V1.9.4 — configuration SMTP intégrée */
.report-settings-modal{width:min(720px,calc(100vw - 20px))}
.report-settings-card{width:100%;max-width:none}
.settings-section{
  margin-top:12px;padding:13px;border:1px solid var(--line);
  border-radius:15px;background:#f8fafc;
}
.settings-section h3{margin:0 0 4px;font-size:1rem}
.settings-section-head{
  display:flex;justify-content:space-between;gap:10px;align-items:flex-start;
}
.settings-source{
  font-size:.68rem;font-weight:850;color:#54708f;background:#eaf2fb;
  padding:5px 7px;border-radius:999px;white-space:nowrap;
}
.smtp-grid{
  display:grid;grid-template-columns:2fr 1fr;gap:9px;margin-top:10px;
}
.smtp-full{grid-column:1/-1}
.smtp-secure-label{
  grid-column:1/-1;
  display:flex !important;align-items:center;justify-content:space-between;
  border:1px solid #cbd8e6;border-radius:12px;padding:10px 12px;background:#fff;
}
.smtp-secure-label input{width:22px;height:22px;min-height:auto;margin:0}
.smtp-actions{display:flex;align-items:center;gap:10px;margin-top:10px}
.smtp-test-result{font-size:.76rem;font-weight:800}
.smtp-test-result.ok{color:#087744}
.smtp-test-result.error{color:#b52626}
@media(max-width:520px){
  .smtp-grid{grid-template-columns:1fr}
  .smtp-full,.smtp-secure-label{grid-column:1}
  .settings-section-head{display:block}
  .settings-source{display:inline-block;margin-top:6px}
  .smtp-actions{align-items:flex-start;flex-direction:column}
}


/* V1.9.9 — accueil compact : suppression du bloc intro + Nouveau dans les capsules */
.metrics-home{
  grid-template-columns:repeat(6,minmax(0,1fr));
  align-items:stretch;
}
.metric-action{
  cursor:pointer;
  appearance:none;
  text-align:left;
  font:inherit;
  color:inherit;
}
.metric-archive{
  min-height:82px;
  padding:12px 14px;
  border-top:4px solid #56697e !important;
}
.metric-archive .value{
  font-size:1.7rem;
  line-height:1;
}
.metric-archive .metric-hint{
  margin-top:3px;
  font-size:.65rem;
}
.metric-new{
  min-height:82px;
  border:0 !important;
  border-top:4px solid #0b66c3 !important;
  background:linear-gradient(145deg,#0d73df,#075ab1);
  color:#fff !important;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  text-align:center;
  box-shadow:0 8px 18px rgba(11,102,195,.18);
}
.metric-new .metric-new-plus{
  font-size:1.55rem;
  font-weight:950;
  line-height:1;
}
.metric-new .metric-new-label{
  font-size:1rem;
  font-weight:950;
}
.metric-new:hover{filter:brightness(1.03)}

@media(max-width:900px){
  .metrics-home{grid-template-columns:repeat(3,1fr)}
}

@media(max-width:560px){
  .metrics-home{
    grid-template-columns:repeat(2,1fr);
    gap:10px;
    margin-top:8px;
  }
  .metrics-home .metric{
    min-height:110px;
    padding:15px 16px;
    border-radius:18px;
  }
  .metrics-home .metric .label{
    font-size:.9rem;
  }
  .metrics-home .metric .value{
    font-size:2rem;
  }
  .metrics-home .metric-archive{
    min-height:78px;
    padding:10px 14px;
    display:grid;
    grid-template-columns:1fr auto;
    grid-template-rows:auto auto;
    align-items:center;
  }
  .metrics-home .metric-archive .label{
    grid-column:1;
    grid-row:1;
  }
  .metrics-home .metric-archive .value{
    grid-column:2;
    grid-row:1 / span 2;
    font-size:1.9rem;
    margin:0;
  }
  .metrics-home .metric-archive .metric-hint{
    grid-column:1;
    grid-row:2;
    margin-top:0;
  }
  .metrics-home .metric-new{
    min-height:78px;
    padding:10px 14px;
    display:flex;
    flex-direction:row;
    justify-content:center;
    gap:8px;
  }
  .metric-new .metric-new-plus{font-size:1.55rem}
  .metric-new .metric-new-label{font-size:1.05rem}
}


/* =========================================================
   V2.1 — accueil mobile réellement compact
   ========================================================= */

/* Header : le logo dit déjà ProsPilot, on supprime le doublon texte.
   La version vit sous les boutons, donc plus de collision sur iPhone. */
.topbar{
  padding:calc(8px + var(--safe-top)) 12px 8px;
}
.topbar-inner{
  align-items:center;
}
.brand-v21{
  min-width:0;
  flex:0 1 270px;
}
.brand-v21 .top-logo{
  width:min(260px,100%);
  max-height:58px;
  object-fit:contain;
}
.top-right-v21{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:4px;
  min-width:0;
}
.top-version{
  color:rgba(255,255,255,.82);
  font-size:.66rem;
  font-weight:800;
  letter-spacing:.02em;
  padding-right:2px;
}

/* Plus aucun bloc titre avant les compteurs. */
.hero-actions{display:none!important}

/* 6 capsules, Nouveau compris. */
.metrics-home{
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  margin-top:2px;
}
.metric-archive,
.metric-new{
  min-height:76px!important;
}
.metric-archive{
  padding:10px 12px!important;
}
.metric-new{
  padding:10px 12px!important;
}

/* Jaquette : aucune marge interne, elle remplit réellement son cadre. */
.cover{
  background:#d7e3ef;
  overflow:hidden;
}
.cover img{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center top!important;
  border-radius:0!important;
  transform:scale(1.015);
  transform-origin:center top;
}

/* Cartes légèrement plus compactes. */
.pro-card{
  grid-template-columns:122px minmax(0,1fr);
  min-height:176px;
}
.cover{min-height:176px}
.pro-body{padding:11px 12px}
.pro-actions{gap:7px}
.pro-actions button{padding:9px 11px}

@media(max-width:900px){
  .metrics-home{
    grid-template-columns:repeat(3,1fr)!important;
  }
}

@media(max-width:560px){
  main{padding:9px}
  .topbar-inner{
    gap:7px;
  }
  .brand-v21{
    flex:1 1 auto;
    max-width:188px;
  }
  .brand-v21 .top-logo{
    width:188px!important;
    max-height:48px!important;
    padding:2px 4px!important;
  }
  .top-right-v21{
    flex:0 0 auto;
  }
  .top-actions{
    gap:5px!important;
  }
  .top-btn{
    width:42px;
    min-width:42px;
    height:42px;
    padding:0!important;
    display:grid;
    place-items:center;
    border-radius:12px;
    font-size:1.05rem;
  }
  .top-btn span{display:none!important}
  .top-version{
    font-size:.58rem;
    white-space:nowrap;
  }

  .metrics-home{
    grid-template-columns:repeat(2,1fr)!important;
    gap:8px!important;
    margin-top:4px!important;
  }
  .metrics-home .metric{
    min-height:94px!important;
    padding:12px 14px!important;
    border-radius:17px!important;
  }
  .metrics-home .metric .label{font-size:.82rem!important}
  .metrics-home .metric .value{font-size:1.78rem!important}

  /* Dernière ligne compacte : Archives + Nouveau côte à côte. */
  .metrics-home .metric-archive,
  .metrics-home .metric-new{
    min-height:66px!important;
    height:66px!important;
    grid-column:auto!important;
  }
  .metrics-home .metric-archive{
    display:grid!important;
    grid-template-columns:1fr auto!important;
    grid-template-rows:auto auto!important;
    align-items:center!important;
    padding:8px 12px!important;
  }
  .metrics-home .metric-archive .label{
    grid-column:1!important;
    grid-row:1!important;
    font-size:.78rem!important;
  }
  .metrics-home .metric-archive .value{
    grid-column:2!important;
    grid-row:1 / span 2!important;
    font-size:1.55rem!important;
    margin:0!important;
  }
  .metrics-home .metric-archive .metric-hint{
    grid-column:1!important;
    grid-row:2!important;
    font-size:.62rem!important;
    margin:0!important;
  }
  .metrics-home .metric-new{
    display:flex!important;
    flex-direction:row!important;
    justify-content:center!important;
    align-items:center!important;
    gap:6px!important;
    padding:8px 10px!important;
  }
  .metric-new .metric-new-plus{font-size:1.35rem!important}
  .metric-new .metric-new-label{font-size:.95rem!important}

  /* Prospectus : moins massifs, couverture plein cadre. */
  .prospectus-grid{gap:9px}
  .pro-card{
    grid-template-columns:106px minmax(0,1fr)!important;
    min-height:164px!important;
    border-radius:18px;
  }
  .cover{
    min-height:164px!important;
  }
  .cover img{
    inset:0!important;
    width:100%!important;
    height:100%!important;
    transform:scale(1.025);
  }
  .cover-badge{
    left:6px;
    bottom:6px;
    padding:4px 7px;
    font-size:.62rem;
  }
  .pro-body{padding:10px!important}
  .pro-name{font-size:1rem!important}
  .pro-dates{font-size:.72rem!important}
  .pro-message{font-size:.72rem}
  .pro-actions{
    gap:6px!important;
    margin-top:8px;
  }
  .pro-actions button{
    padding:8px 9px!important;
    min-height:40px;
    font-size:.83rem;
  }
}

@media(max-width:380px){
  .brand-v21{max-width:160px}
  .brand-v21 .top-logo{width:160px!important}
  .top-btn{width:38px;min-width:38px;height:38px}
  .pro-card{grid-template-columns:98px minmax(0,1fr)!important}
}


/* V2.2 : accueil + bandeau + droits */
@media(min-width:901px){
  .topbar-inner{
    max-width:1160px;
    margin:0 auto;
    display:flex;
    align-items:center;
    gap:14px;
  }
  .brand-v22{
    display:flex;
    align-items:center;
    gap:12px;
    min-width:330px;
    background:rgba(255,255,255,.10);
    border:1px solid rgba(255,255,255,.18);
    border-radius:12px;
    padding:5px 10px;
  }
  .brand-v22 .top-logo{
    width:220px!important;
    height:45px!important;
    max-height:45px!important;
    object-fit:contain!important;
    background:#fff!important;
    padding:2px 5px!important;
    border-radius:8px!important;
  }
  .desktop-version{
    color:#fff;
    font-weight:850;
    font-size:.72rem;
    white-space:nowrap;
  }
  .top-right-v21{
    flex:1;
  }
  .mobile-version{display:none!important}
}
@media(max-width:900px){
  .desktop-version{display:none}
}

/* Nouveau bien visible dans la 6e case */
.metrics-home .metric-new{
  display:flex!important;
  visibility:visible!important;
}

/* Matrice droits */
.user-admin-title-row{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
}
.rights-scroll{overflow:auto;border:1px solid var(--line);border-radius:14px;margin:12px 0}
.rights-table{width:100%;min-width:720px;border-collapse:collapse;background:#fff}
.rights-table th,.rights-table td{padding:10px;border-bottom:1px solid #e6edf4;text-align:center;font-size:.78rem}
.rights-table th:first-child,.rights-table td:first-child{text-align:left;min-width:250px}
.rights-table thead th{background:#eef5fb;color:#29445f;font-weight:900}
.right-check{display:inline-grid;place-items:center;width:42px;height:32px;border-radius:999px;background:#edf1f5;border:1px solid #d5dee8;cursor:pointer}
.right-check input{position:absolute;opacity:0}
.right-check:has(input:checked){background:#e7f7ee;border-color:#8fd3ad;color:#087443}
.right-check span{font-weight:950}
.right-check.locked{opacity:.6;cursor:not-allowed}
.rights-security{padding:11px 12px;margin:10px 0;background:#fff4df;border-radius:12px;color:#704300;font-size:.76rem;font-weight:800}

/* Commentaires lecteur */
.comment-history{display:grid;gap:7px;margin:0 0 8px}
.comment-item{background:#f5f8fb;border:1px solid #dde7f1;border-radius:11px;padding:8px 10px}
.comment-item b{font-size:.75rem}
.comment-item span{float:right;color:#6d7d8f;font-size:.65rem}
.comment-item p{margin:5px 0 0;font-size:.78rem}
.comment-empty{font-size:.72rem}
.point-sheet.comment-only [data-presence],
.point-sheet.comment-only #locationBlock,
.point-sheet.comment-only #quantityBlock,
.point-sheet.comment-only #reason,
.point-sheet.comment-only #reasonHelp{
  opacity:.45;
}
@media(max-width:560px){
  .user-admin-title-row{align-items:stretch;flex-direction:column}
  .user-admin-title-row .secondary{width:100%}
}


/* V2.3 — finitions header + double tap + hors produit + jaquette plein écran */
html, body, button, input, select, textarea, img, .chip, .qty, .presence {
  touch-action: manipulation;
}
*{
  -webkit-tap-highlight-color: transparent;
}

/* Header desktop plus dense et harmonisé */
@media(min-width:901px){
  .topbar{
    background:linear-gradient(90deg,#075db8 0%,#0b67bf 55%,#496878 100%);
  }
  .topbar-inner{
    max-width:1180px;
    margin:0 auto;
    display:grid;
    grid-template-columns:300px 1fr;
    gap:18px;
    align-items:center;
    padding:0 8px;
  }
  .brand-v23{
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
  }
  .brand-v23 .top-logo{
    width:230px!important;
    height:52px!important;
    object-fit:contain!important;
    background:#fff!important;
    border-radius:11px!important;
    padding:4px 8px!important;
  }
  .desktop-version{
    color:#fff!important;
    font-size:.72rem!important;
    font-weight:900!important;
    white-space:nowrap;
    opacity:.94;
  }
  .top-right-v21{
    display:flex!important;
    justify-content:flex-end!important;
    align-items:center!important;
  }
  .top-actions{
    justify-content:flex-end!important;
    gap:8px!important;
  }
}

/* iPhone : logo + boutons sans collisions */
@media(max-width:560px){
  .brand-v23{
    flex:1 1 auto;
    max-width:190px;
  }
  .brand-v23 .top-logo{
    width:190px!important;
    height:48px!important;
    object-fit:contain!important;
    background:#fff!important;
    border-radius:10px!important;
    padding:3px 5px!important;
  }
}

/* 3e statut plus discret */
.presence.not-product{
  grid-column:1 / -1;
  justify-self:start;
  width:auto!important;
  min-height:42px!important;
  padding:8px 14px!important;
  font-size:.82rem!important;
  color:#596a7b;
  background:#f3f6f9;
  border:1px dashed #aebdca;
}
.presence.not-product.selected{
  background:#e8edf2;
  border-color:#64788c;
  color:#24384a;
}

/* Éléments hors produit : gris net, sans pollution visuelle */
.offer-item.NOT_PRODUCT,
.hotspot.NOT_PRODUCT{
  border-color:#7f8d9a!important;
  background:rgba(127,141,154,.14)!important;
}
.offer-item.NOT_PRODUCT .small{
  color:#596a7b!important;
}

/* Visionneuse jaquette */
.cover img[data-cover-open]{
  cursor:zoom-in;
}
.cover-viewer{
  width:min(92vw,760px);
  max-width:760px;
  height:min(90vh,1050px);
  padding:0;
  border:0;
  border-radius:20px;
  overflow:hidden;
  background:#111;
  box-shadow:0 25px 70px rgba(0,0,0,.38);
}
.cover-viewer::backdrop{
  background:rgba(7,18,31,.72);
  backdrop-filter:blur(6px);
}
.cover-viewer img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
  background:#111;
}
.cover-viewer-close{
  position:absolute;
  z-index:2;
  top:10px;
  right:10px;
  width:44px;
  height:44px;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,.92);
  color:#075db8;
  font-size:1.5rem;
  font-weight:900;
  box-shadow:0 4px 15px rgba(0,0,0,.18);
}


/* =========================================================
   V2.4 — matrice PC horizontale, double tap, jaquette
   ========================================================= */

html,body,button,a,input,select,textarea,img,.cover,.archive-cover,.metric,.pro-card{
  touch-action:manipulation;
}

/* Toute la jaquette est cliquable */
.cover[data-cover-open],
.archive-cover[data-cover-open]{
  cursor:zoom-in;
}

/* Visionneuse grand format */
.cover-viewer{
  width:min(96vw,900px)!important;
  height:min(94vh,1200px)!important;
  max-width:900px!important;
  padding:0!important;
  border:0!important;
  border-radius:18px!important;
  overflow:hidden!important;
  background:#111!important;
}
.cover-viewer::backdrop{
  background:rgba(8,18,31,.74)!important;
  backdrop-filter:blur(6px);
}
.cover-viewer img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  background:#111!important;
}

/* PC : fenêtre Utilisateurs / Droits pensée paysage */
@media(min-width:901px){
  #usersModal{
    width:min(96vw,1450px)!important;
    max-width:1450px!important;
  }
  #usersModal .modalbox,
  #usersModal .modal-box{
    width:min(96vw,1450px)!important;
    max-width:1450px!important;
    max-height:92vh!important;
  }
  #usersContent{
    width:100%!important;
  }
  .rights-scroll,
  .permissions-scroll{
    overflow-x:hidden!important;
    overflow-y:auto!important;
    max-height:67vh!important;
  }
  .rights-table,
  .permissions-table{
    width:100%!important;
    min-width:0!important;
    table-layout:fixed!important;
  }
  .rights-table th:first-child,
  .rights-table td:first-child,
  .permissions-table th:first-child,
  .permissions-table td:first-child{
    width:34%!important;
    min-width:0!important;
  }
  .rights-table th:not(:first-child),
  .rights-table td:not(:first-child),
  .permissions-table th:not(:first-child),
  .permissions-table td:not(:first-child){
    width:16.5%!important;
  }
  .rights-table th,
  .rights-table td,
  .permissions-table th,
  .permissions-table td{
    padding:11px 8px!important;
    font-size:.8rem!important;
  }
}

/* Mobile : la matrice reste naturellement scrollable horizontalement */
@media(max-width:900px){
  .rights-scroll,
  .permissions-scroll{
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch;
  }
}


/* =========================================================
   V2.5 FINAL — responsive en proportions d'écran
   Objectif : conserver le rendu sur iPhone / tablette / PC
   sans dépendre de dimensions figées.
   ========================================================= */

:root{
  --app-max-width: 92vw;
  --page-gutter: clamp(10px, 2vw, 28px);
  --section-gap: clamp(8px, 1.4vw, 18px);
  --card-radius: clamp(14px, 1.8vw, 22px);
  --header-height: clamp(70px, 8.5vw, 102px);
  --logo-box-w: clamp(240px, 26vw, 360px);
  --logo-box-h: clamp(58px, 6.5vw, 78px);
}

/* Conteneur général */
main,
.main-shell,
.dashboard-shell,
.page-shell{
  width:min(var(--app-max-width), 1480px)!important;
  max-width:min(var(--app-max-width), 1480px)!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Header fluide */
.topbar{
  min-height:var(--header-height);
}
.topbar-inner{
  width:min(94vw, 1480px)!important;
  max-width:min(94vw, 1480px)!important;
  margin:0 auto!important;
  padding-left:clamp(8px,1.3vw,20px)!important;
  padding-right:clamp(8px,1.3vw,20px)!important;
  box-sizing:border-box!important;
}

/* Cartouche logo : on utilise vraiment la place disponible */
.brand-v23{
  width:var(--logo-box-w)!important;
  min-width:var(--logo-box-w)!important;
  max-width:var(--logo-box-w)!important;
}
.brand-v23 .top-logo{
  width:100%!important;
  height:var(--logo-box-h)!important;
  max-height:var(--logo-box-h)!important;
  object-fit:contain!important;
  object-position:center center!important;
  padding:clamp(2px,.45vw,6px) clamp(4px,.75vw,10px)!important;
  box-sizing:border-box!important;
}

/* Un peu moins de blanc visuel dans la cartouche */
@media(min-width:901px){
  .brand-v23{
    padding:4px 7px!important;
    gap:8px!important;
  }
  .brand-v23 .top-logo{
    width:clamp(250px, 23vw, 330px)!important;
    height:clamp(52px, 5.6vw, 70px)!important;
  }
  .desktop-version{
    font-size:clamp(.66rem,.72vw,.8rem)!important;
  }
}

/* Capsules et cartes : tailles fluides */
.metrics-home{
  gap:var(--section-gap)!important;
}
.metrics-home .metric{
  min-height:clamp(74px, 8vw, 112px)!important;
  border-radius:var(--card-radius)!important;
  padding:clamp(10px,1.2vw,18px)!important;
}
.metrics-home .metric .label{
  font-size:clamp(.72rem,1vw,.95rem)!important;
}
.metrics-home .metric .value{
  font-size:clamp(1.5rem,2.6vw,2.8rem)!important;
}

/* Prospectus grid fluide */
.prospectus-grid{
  gap:var(--section-gap)!important;
}
.pro-card{
  border-radius:var(--card-radius)!important;
  min-height:clamp(160px, 18vw, 228px)!important;
}
.cover{
  min-height:clamp(160px, 18vw, 228px)!important;
}
.pro-body{
  padding:clamp(9px,1.2vw,16px)!important;
}
.pro-name{
  font-size:clamp(.95rem,1.35vw,1.35rem)!important;
}
.pro-dates,
.pro-message{
  font-size:clamp(.68rem,.9vw,.92rem)!important;
}
.pro-actions button{
  font-size:clamp(.78rem,.9vw,.98rem)!important;
  min-height:clamp(38px,4vw,48px)!important;
  padding:clamp(7px,.8vw,11px) clamp(8px,1vw,14px)!important;
}

/* Modal responsive */
dialog,
.modalbox,
.modal-box{
  max-width:min(94vw, 1200px)!important;
}
@media(min-width:901px){
  #usersModal,
  #usersModal .modalbox,
  #usersModal .modal-box{
    width:min(94vw, 1450px)!important;
    max-width:min(94vw, 1450px)!important;
  }
}

/* iPhone / petits écrans */
@media(max-width:560px){
  :root{
    --app-max-width: 96vw;
    --logo-box-w: 48vw;
    --logo-box-h: 12vw;
  }

  .topbar-inner{
    width:100%!important;
    max-width:100%!important;
    padding-left:2.5vw!important;
    padding-right:2.5vw!important;
  }

  .brand-v23{
    width:48vw!important;
    min-width:48vw!important;
    max-width:48vw!important;
  }
  .brand-v23 .top-logo{
    width:48vw!important;
    height:12vw!important;
    max-height:12vw!important;
    padding:.6vw 1vw!important;
  }

  .top-actions{
    gap:1vw!important;
  }
  .top-btn{
    width:10.5vw!important;
    min-width:10.5vw!important;
    height:10.5vw!important;
    border-radius:2.8vw!important;
    font-size:4.2vw!important;
  }
  .mobile-version{
    font-size:2.5vw!important;
  }

  .metrics-home{
    gap:2vw!important;
  }
  .metrics-home .metric{
    min-height:22vw!important;
    padding:3vw 3.5vw!important;
    border-radius:4.2vw!important;
  }
  .metrics-home .metric .label{
    font-size:3.4vw!important;
  }
  .metrics-home .metric .value{
    font-size:7.2vw!important;
  }

  .metrics-home .metric-archive,
  .metrics-home .metric-new{
    min-height:16vw!important;
    height:16vw!important;
  }

  .pro-card{
    grid-template-columns:29vw minmax(0,1fr)!important;
    min-height:44vw!important;
    border-radius:4.2vw!important;
  }
  .cover{
    min-height:44vw!important;
  }
  .pro-body{
    padding:2.6vw!important;
  }
  .pro-name{
    font-size:4.5vw!important;
  }
  .pro-dates,
  .pro-message{
    font-size:3.2vw!important;
  }
  .pro-actions{
    gap:1.6vw!important;
  }
  .pro-actions button{
    font-size:3.6vw!important;
    min-height:10.5vw!important;
    padding:2vw 2.4vw!important;
    border-radius:3vw!important;
  }
}

/* Tablette intermédiaire */
@media(min-width:561px) and (max-width:900px){
  :root{
    --app-max-width: 95vw;
    --logo-box-w: 34vw;
    --logo-box-h: 8vw;
  }
  .brand-v23{
    width:34vw!important;
    min-width:34vw!important;
    max-width:34vw!important;
  }
  .brand-v23 .top-logo{
    width:34vw!important;
    height:8vw!important;
    max-height:8vw!important;
  }
}

/* Eviter débordements horizontaux */
html, body{
  max-width:100%;
  overflow-x:hidden;
}
img{
  max-width:100%;
}