/* ═══════════════════════════════════════════════════════
   J.A.R.V.I.S — identité « Verdant »
   vert forêt profond · glassmorphisme · gradient lime→teal
   Échelle 100 % fluide (clamp entre pôles 390px ↔ 1280px,
   en rem : le zoom navigateur reste fonctionnel).
   ═══════════════════════════════════════════════════════ */
:root{
  --bg:#070d07;
  --lime:#cdf463;
  --green:#7ce787;
  --teal:#35d9a4;
  --grad:linear-gradient(118deg,#e2ff7a,#9ef06e 48%,#35d9a4);
  --card:rgba(23,34,19,.55);
  --card2:rgba(11,18,10,.55);
  --field:rgba(8,14,8,.62);
  --line:rgba(205,244,99,.14);
  --line2:rgba(205,244,99,.07);
  --txt:#ecf6e3;
  --dim:#90a884;
  --bad:#ff6d7c;
  --warn:#ffc966;
  --ok:#62eea9;
  --ink:#0c1606;            /* texte sur gradient lime */
  --font:-apple-system,"SF Pro Display","SF Pro Text",Inter,"Segoe UI",Roboto,sans-serif;
  --mono:ui-monospace,"SF Mono","JetBrains Mono",Menlo,Consolas,monospace;

  /* ── échelle typographique fluide ── */
  --fs-2xs:clamp(.5625rem,.52rem + .17vw,.625rem);   /*  9 → 10 (a11y : plancher relevé) */
  --fs-xs:clamp(.625rem,.58rem + .17vw,.6875rem);    /* 10 → 11 */
  --fs-sm:clamp(.6875rem,.63rem + .22vw,.8125rem);   /* 11 → 13  */
  --fs-md:clamp(.8125rem,.76rem + .22vw,.9375rem);   /* 13 → 15  */
  --fs-base:clamp(.875rem,.82rem + .22vw,1rem);      /* 14 → 16  */
  --fs-lg:clamp(1rem,.92rem + .34vw,1.1875rem);      /* 16 → 19  */
  --fs-xl:clamp(1.0938rem,1rem + .39vw,1.3125rem);   /* 17.5 → 21 */
  --fs-2xl:clamp(1.3125rem,1.18rem + .56vw,1.625rem);/* 21 → 26  */

  /* ── échelle d'espacement fluide ── */
  --sp-1:clamp(.1875rem,.17rem + .11vw,.25rem);      /*  3 → 4  */
  --sp-2:clamp(.375rem,.32rem + .22vw,.5rem);        /*  6 → 8  */
  --sp-3:clamp(.5625rem,.48rem + .34vw,.75rem);      /*  9 → 12 */
  --sp-4:clamp(.75rem,.64rem + .45vw,1rem);          /* 12 → 16 */
  --sp-5:clamp(1rem,.84rem + .67vw,1.375rem);        /* 16 → 22 */
  --sp-6:clamp(1.375rem,1.16rem + .9vw,1.875rem);    /* 22 → 30 */

  /* ── rayons + contrôles fluides ── */
  --r-card:clamp(1.125rem,.96rem + .67vw,1.5rem);    /* 18 → 24 */
  --r-field:clamp(.875rem,.77rem + .45vw,1.125rem);  /* 14 → 18 */
  --r-item:clamp(1rem,.93rem + .3vw,1.25rem);        /* 16 → 20 */
  --ctl:clamp(2.75rem,2.65rem + .45vw,3rem);         /* 44 → 48 : cible tactile */
  --ctl-sm:clamp(2.375rem,2.3rem + .3vw,2.625rem);   /* 38 → 42 */
  --ico:clamp(1.3125rem,1.23rem + .34vw,1.5rem);     /* 21 → 24 */
  --nav-h:clamp(3.75rem,3.48rem + 1.12vw,4.375rem);  /* 60 → 70 */

  --sat:env(safe-area-inset-top,0px);
  --sab:env(safe-area-inset-bottom,0px);
}
*{box-sizing:border-box}
html{height:100%;background:var(--bg)}
body{
  margin:0;height:100dvh;min-height:100%;font-family:var(--font);color:var(--txt);
  font-size:var(--fs-base);
  background:
    radial-gradient(1100px 700px at 18% -12%, rgba(205,244,99,.13), transparent 62%),
    radial-gradient(900px 650px at 108% 8%, rgba(53,217,164,.10), transparent 60%),
    radial-gradient(1000px 800px at 50% 118%, rgba(124,231,135,.08), transparent 65%),
    var(--bg);
  background-attachment:fixed;
  overflow:hidden;
  -webkit-tap-highlight-color:transparent;
  -webkit-text-size-adjust:100%;
  -webkit-font-smoothing:antialiased;
}
.hidden{display:none!important}

/* a11y : anneau de focus visible au clavier seulement */
:focus{outline:none}
:focus-visible{outline:2px solid rgba(205,244,99,.65);outline-offset:2px;border-radius:6px}

/* barres de défilement discrètes, accordées au thème */
*{scrollbar-width:thin;scrollbar-color:rgba(205,244,99,.22) transparent}
*::-webkit-scrollbar{width:5px;height:5px}
*::-webkit-scrollbar-thumb{background:rgba(205,244,99,.22);border-radius:4px}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-corner{background:transparent}

/* ── aurore d'arrière-plan (halos doux qui dérivent) ── */
.aurora{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.aurora i{position:absolute;border-radius:50%;will-change:transform}
.aurora .a1{width:62vmax;height:62vmax;left:-18vmax;top:-26vmax;
  background:radial-gradient(circle,rgba(205,244,99,.12),transparent 62%);
  animation:drift1 26s ease-in-out infinite alternate}
.aurora .a2{width:50vmax;height:50vmax;right:-20vmax;top:16vmax;
  background:radial-gradient(circle,rgba(53,217,164,.10),transparent 62%);
  animation:drift2 32s ease-in-out infinite alternate}
.aurora .a3{width:46vmax;height:46vmax;left:14vmax;bottom:-24vmax;
  background:radial-gradient(circle,rgba(124,231,135,.09),transparent 62%);
  animation:drift1 38s ease-in-out infinite alternate-reverse}
@keyframes drift1{from{transform:translate3d(0,0,0)}to{transform:translate3d(7vmax,5vmax,0)}}
@keyframes drift2{from{transform:translate3d(0,0,0)}to{transform:translate3d(-6vmax,7vmax,0)}}

/* ═══ VERRE (carte de base) ═══ */
.card{
  position:relative;border-radius:var(--r-card);padding:var(--sp-5);margin-bottom:var(--sp-4);
  background:var(--card);border:1px solid var(--line);
  -webkit-backdrop-filter:blur(18px) saturate(1.35);backdrop-filter:blur(18px) saturate(1.35);
  box-shadow:0 18px 46px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.06);
  display:flex;flex-direction:column;min-height:0;flex:0 0 auto;
}
.card.grow{flex:1 1 auto;overflow:hidden}
.card.bare{background:none;border:none;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;padding:var(--sp-2) 0}
.card h2{
  margin:0 0 var(--sp-4);font-size:var(--fs-md);font-weight:650;letter-spacing:.01em;color:var(--txt);
  display:flex;align-items:center;gap:var(--sp-3);flex:0 0 auto;
}
.count{color:var(--dim);font-weight:500;font-size:var(--fs-sm)}
.filter-input{
  margin-left:auto;background:var(--field);border:1px solid var(--line2);border-radius:999px;
  padding:var(--sp-1) var(--sp-3);color:var(--txt);font-family:var(--font);
  font-size:max(1rem,16px);outline:none;width:9em;min-height:2.1rem;
  -webkit-appearance:none;appearance:none;font-weight:400;
}
.filter-input:focus{border-color:rgba(205,244,99,.45)}
.filter-input::placeholder{color:var(--dim)}
#wxChip{cursor:pointer}
#wxChip:active{transform:scale(.96)}
.dot{width:.5em;height:.5em;border-radius:50%;flex:0 0 auto}
.dot.bad{background:var(--bad);box-shadow:0 0 10px rgba(255,109,124,.7)}
.dot.dim{background:var(--dim);opacity:.6}

/* ═══ LOGIN ═══ */
.login{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:var(--sp-6)}
.login-box{
  width:min(24rem,100%);text-align:center;padding:var(--sp-6) var(--sp-6) var(--sp-5);
  border-radius:calc(var(--r-card) + var(--sp-2));background:var(--card);border:1px solid var(--line);
  -webkit-backdrop-filter:blur(22px) saturate(1.35);backdrop-filter:blur(22px) saturate(1.35);
  box-shadow:0 30px 80px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.07);
}
.login-core{width:clamp(6rem,5.5rem + 2vw,7.5rem);aspect-ratio:1;margin-bottom:var(--sp-4);
  filter:drop-shadow(0 0 26px rgba(205,244,99,.45))}
.spin-slow{animation:spin 20s linear infinite;transform-origin:60px 60px}
.pulse{animation:pulse 2.8s ease-in-out infinite}
.login h1{
  margin:0;font-size:var(--fs-2xl);letter-spacing:.34em;font-weight:700;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.login-sub{margin:var(--sp-2) 0 var(--sp-6);font-size:var(--fs-xs);letter-spacing:.24em;color:var(--dim);text-transform:uppercase}
.login input{
  width:100%;background:var(--field);border:1px solid var(--line2);border-radius:var(--r-field);
  padding:var(--sp-4);color:var(--txt);font-family:var(--font);
  font-size:max(1rem,16px);outline:none;text-align:center;
}
.login input:focus{border-color:rgba(205,244,99,.5);box-shadow:0 0 0 3px rgba(205,244,99,.13)}
.login-err{min-height:1em;margin:var(--sp-4) 0 0;font-size:var(--fs-sm);color:var(--bad)}

/* ═══ CTA (pilule gradient) ═══ */
.cta{
  width:100%;margin-top:var(--sp-4);border:none;border-radius:999px;cursor:pointer;
  background:var(--grad);color:var(--ink);font-family:var(--font);font-weight:700;
  letter-spacing:.02em;padding:var(--sp-4);font-size:var(--fs-base);min-height:var(--ctl);
  box-shadow:0 10px 28px rgba(158,240,110,.28), inset 0 1px 0 rgba(255,255,255,.35);
  transition:transform .12s ease, box-shadow .2s ease;
}
.cta:active{transform:scale(.975);box-shadow:0 6px 16px rgba(158,240,110,.2)}
.cta:disabled{opacity:.55}
.cta.wide{margin-top:var(--sp-1)}

/* ═══ SHELL ═══ */
.app{display:flex;flex-direction:column;height:100dvh;position:relative;z-index:1}
.topbar{
  display:flex;justify-content:space-between;align-items:center;gap:var(--sp-3);
  padding:calc(var(--sp-4) + var(--sat)) var(--sp-5) var(--sp-4);flex:0 0 auto;
}
.brand{display:flex;flex-direction:column;line-height:1.1;min-width:0}
.brand-name{
  font-size:var(--fs-xl);letter-spacing:.26em;font-weight:700;white-space:nowrap;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 14px rgba(205,244,99,.35));
}
.brand-sub{font-size:var(--fs-2xs);letter-spacing:.22em;color:var(--dim);text-transform:uppercase;margin-top:var(--sp-1);white-space:nowrap}
.topbar-right{display:flex;gap:var(--sp-2);flex:0 0 auto}
.chip{
  border-radius:var(--r-field);padding:var(--sp-2) var(--sp-4);background:var(--card2);border:1px solid var(--line2);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
}
.readout{text-align:right;display:flex;flex-direction:column}
.readout .big{font-size:var(--fs-lg);font-weight:650;color:var(--txt);font-variant-numeric:tabular-nums}
.readout label{
  font-size:var(--fs-2xs);letter-spacing:.14em;color:var(--dim);text-transform:uppercase;margin-top:2px;
  max-width:10em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}

/* bandeau réseau + toasts */
.net-bar{
  margin:0 auto var(--sp-2);padding:var(--sp-1) var(--sp-4);border-radius:999px;width:fit-content;
  background:rgba(255,109,124,.13);border:1px solid rgba(255,109,124,.45);color:#ffd6da;
  font-size:var(--fs-sm);font-weight:600;animation:rise .25s ease;flex:0 0 auto;
}
.toast{
  position:fixed;left:50%;transform:translateX(-50%) translateY(10px);z-index:80;
  bottom:calc(var(--nav-h) + var(--sab) + var(--sp-5) + var(--sp-3));
  max-width:min(88vw,30rem);padding:var(--sp-3) var(--sp-5);border-radius:999px;
  background:rgba(10,16,9,.94);border:1px solid rgba(255,109,124,.4);color:#ffd6da;
  font-size:var(--fs-sm);font-weight:600;text-align:center;
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  box-shadow:0 14px 40px rgba(0,0,0,.5);
  opacity:0;pointer-events:none;transition:opacity .25s ease,transform .25s ease;
}
.toast.show{opacity:1;transform:translateX(-50%)}

.content{flex:1 1 auto;min-height:0;position:relative}
.tab{
  position:absolute;inset:0;display:none;flex-direction:column;overflow:hidden;
  padding:var(--sp-2) var(--sp-4) calc(var(--nav-h) + var(--sab) + var(--sp-6));
}
.tab.active{display:flex;animation:tabIn .26s ease}
@keyframes tabIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}

/* ═══ NAV (dock flottant) ═══ */
.nav{
  position:fixed;left:var(--sp-4);right:var(--sp-4);bottom:calc(var(--sab) + var(--sp-3));z-index:60;
  margin:0 auto;max-width:32.5rem;height:var(--nav-h);display:flex;
  border-radius:calc(var(--nav-h)/2.4);background:rgba(10,16,9,.74);border:1px solid var(--line);
  -webkit-backdrop-filter:blur(24px) saturate(1.4);backdrop-filter:blur(24px) saturate(1.4);
  box-shadow:0 18px 50px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.06);
}
.nav-btn{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-1);
  background:none;border:none;color:var(--dim);font-family:var(--font);
  font-size:clamp(.5313rem,.5rem + .15vw,.6875rem);  /* 6 onglets : un cran plus petit */
  font-weight:600;letter-spacing:.04em;cursor:pointer;position:relative;min-height:var(--ctl);
  border-radius:calc(var(--nav-h)/2.9);transition:color .18s ease;padding:0 2px;
  white-space:nowrap;overflow:hidden;
}
.nav-btn .nav-ico{width:var(--ico);height:var(--ico);display:block}
.nav-btn .nav-ico svg{width:100%;height:100%;display:block}
.nav-btn.active{color:var(--lime)}
.nav-btn.active .nav-ico{filter:drop-shadow(0 0 9px rgba(205,244,99,.55))}
.nav-btn.active::before{
  content:"";position:absolute;inset:var(--sp-2) var(--sp-1);border-radius:calc(var(--nav-h)/3.2);z-index:-1;
  background:radial-gradient(80% 90% at 50% 18%,rgba(205,244,99,.16),rgba(205,244,99,.04) 70%,transparent);
  border:1px solid rgba(205,244,99,.16);
}
.nav-badge.warn{background:linear-gradient(118deg,#ffd98a,#ff9f43)}
.nav-badge.soft{background:rgba(205,244,99,.22);color:var(--lime);box-shadow:none}
#emailMeta.stale{color:var(--warn)}
.nav-badge{
  position:absolute;top:var(--sp-2);right:calc(50% - 2em);min-width:1.55em;height:1.55em;border-radius:1em;
  background:var(--grad);color:var(--ink);font-size:var(--fs-xs);font-weight:800;
  display:flex;align-items:center;justify-content:center;padding:0 .45em;
  box-shadow:0 2px 10px rgba(158,240,110,.45);
}

/* ═══ RÉACTEUR (le cœur) ═══ */
.reactor{position:relative;width:min(27dvh,56vw,15rem);aspect-ratio:1;margin:var(--sp-1) auto var(--sp-1);flex:0 0 auto}
.reactor-svg{width:100%;height:100%;filter:drop-shadow(0 0 22px rgba(205,244,99,.3))}
.ring{fill:none;stroke:url(#rg);stroke-width:1.4;opacity:.7;stroke-dasharray:6 10}
.ring-a{animation:spin 26s linear infinite;transform-origin:150px 150px}
.ring-b{stroke-dasharray:2 7;opacity:.5;animation:spin 17s linear infinite reverse;transform-origin:150px 150px}
.ring-c{stroke-dasharray:14 8;opacity:.6;animation:spin 9s linear infinite;transform-origin:150px 150px}
.ring-solid{fill:none;stroke:url(#rg);stroke-width:2;opacity:.9}
.core-fill{fill:url(#rgGlow);opacity:.5;animation:pulse 3.4s ease-in-out infinite}
.ticks line{stroke:var(--lime);stroke-width:1.4;opacity:.45}
.reactor.busy .core-fill{opacity:.85;animation:pulse 1s ease-in-out infinite}
.reactor.busy .ring-c{animation-duration:2.4s}
.reactor-state{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  font-size:var(--fs-xs);font-weight:700;letter-spacing:.22em;color:#f4ffe2;text-transform:uppercase;
  text-shadow:0 0 14px rgba(205,244,99,.8);max-width:78%;text-align:center;
}
.reactor.halted .ring,.reactor.halted .ring-solid{stroke:url(#rgBad)}
.reactor.halted .halo{fill:url(#rgGlowBad)}
.reactor.halted .core-fill{fill:url(#rgGlowBad)}
.reactor.halted .ticks line{stroke:var(--bad)}
.reactor.halted .reactor-state{color:#ffe2e5;text-shadow:0 0 14px rgba(255,109,124,.8)}
.reactor.halted .reactor-svg{filter:drop-shadow(0 0 22px rgba(255,109,124,.3))}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes pulse{0%,100%{opacity:.35}50%{opacity:.75}}

/* ═══ STAT STRIP (console) ═══ */
.stat-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-2);margin:0 0 var(--sp-3);flex:0 0 auto}
.stat-chip{
  text-align:center;border-radius:var(--r-field);padding:var(--sp-3) var(--sp-1) var(--sp-2);
  background:var(--card2);border:1px solid var(--line2);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
}
.stat-chip[role="button"]{cursor:pointer;transition:transform .12s ease,border-color .15s ease}
.stat-chip[role="button"]:active{transform:scale(.96);border-color:rgba(205,244,99,.35)}
.stat-chip span{font-size:var(--fs-lg);font-weight:700;color:var(--txt);font-variant-numeric:tabular-nums}
.stat-chip label{display:block;font-size:var(--fs-2xs);letter-spacing:.12em;color:var(--dim);text-transform:uppercase;margin-top:var(--sp-1)}

/* ═══ CHAT ═══ */
.chat{flex:1 1 auto;display:flex;flex-direction:column;min-height:0;margin-bottom:0;padding:var(--sp-4);position:relative}
.chat-clear{position:absolute;top:var(--sp-3);right:var(--sp-3);z-index:5;opacity:.55;transition:.15s}
.chat-clear:hover,.chat-clear:focus-visible{opacity:1}
.icon-sm.armed{background:var(--bad);color:#fff;border-color:transparent;opacity:1;
  box-shadow:0 4px 16px rgba(255,109,124,.35)}
.scroll-down{
  position:absolute;right:var(--sp-4);bottom:calc(var(--ctl) + var(--sp-5) + var(--sp-4));z-index:5;
  width:var(--ctl-sm);height:var(--ctl-sm);border-radius:50%;cursor:pointer;
  background:rgba(10,16,9,.85);border:1px solid var(--line);color:var(--dim);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 8px 24px rgba(0,0,0,.45);transition:.15s;
}
.scroll-down svg{width:1.1rem;height:1.1rem}
.scroll-down:active{transform:scale(.92)}
.scroll-down.new{color:var(--ink);background:var(--grad);border-color:transparent;
  box-shadow:0 8px 24px rgba(158,240,110,.35)}
.bubble.bot{padding-right:calc(var(--sp-4) + 1.9rem)}
.bcopy{
  position:absolute;top:var(--sp-2);right:var(--sp-2);width:1.8rem;height:1.8rem;border-radius:50%;
  border:none;background:rgba(205,244,99,.08);color:var(--dim);cursor:pointer;
  display:flex;align-items:center;justify-content:center;opacity:.45;transition:.15s;padding:0;
}
.bcopy svg{width:.95rem;height:.95rem}
.bcopy .i-ok{display:none}
.bcopy.ok{opacity:1;color:var(--ink);background:var(--grad)}
.bcopy.ok .i-copy{display:none}
.bcopy.ok .i-ok{display:block}
.bubble.bot:hover .bcopy,.bcopy:focus-visible{opacity:1}
.bubble.bot{position:relative}
.chat-log{
  flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:var(--sp-1);
  display:flex;flex-direction:column;gap:var(--sp-3);scrollbar-width:thin;
}
.bubble{
  max-width:min(88%,34rem);padding:var(--sp-3) var(--sp-4);
  border-radius:clamp(1.0625rem,1rem + .3vw,1.25rem);
  font-size:var(--fs-base);line-height:1.5;
  white-space:pre-wrap;overflow-wrap:break-word;word-break:break-word;animation:rise .25s ease;
}
.bubble.user{
  align-self:flex-end;border-bottom-right-radius:.4375rem;
  background:var(--grad);color:var(--ink);font-weight:550;
  box-shadow:0 8px 22px rgba(158,240,110,.22);
}
.bubble.bot{
  align-self:flex-start;border-bottom-left-radius:.4375rem;
  background:var(--card2);border:1px solid var(--line2);
}
.bubble.bot code{background:rgba(205,244,99,.13);color:#dff7a9;padding:.05em .4em;border-radius:.4em;font-family:var(--mono);font-size:.9em}
.bubble.bot strong{color:#fff}
/* markdown léger (chat + rapports de mission) */
.bubble.bot .md-h,.mission-result .md-h{margin:.4em 0 .15em;font-weight:700;color:#fff;line-height:1.3}
.bubble.bot h1.md-h,.mission-result h1.md-h{font-size:1.16em}
.bubble.bot h2.md-h,.mission-result h2.md-h{font-size:1.09em}
.bubble.bot h3.md-h,.mission-result h3.md-h{font-size:1.03em}
.bubble.bot h4.md-h,.mission-result h4.md-h{font-size:1em;color:#dff0d2}
.md-list{margin:.25em 0 .25em 1.25em;padding:0;white-space:normal}
.md-list li{margin:.14em 0;line-height:1.45}
.bubble.bot a,.mission-result a{color:var(--teal);text-decoration:underline;
  text-underline-offset:2px;overflow-wrap:anywhere}
.mission-result code{background:rgba(205,244,99,.13);color:#dff7a9;padding:.05em .4em;
  border-radius:.4em;font-family:var(--mono);font-size:.9em}
.mission-result strong{color:#fff}
.bubble.sys{align-self:center;background:none;border:none;color:var(--dim);font-size:var(--fs-sm)}
.bubble.bot.thinking{color:var(--lime)}
.bubble.bot.thinking .dots::after{content:"";animation:dots 1.4s steps(4,end) infinite}
@keyframes dots{0%{content:""}25%{content:"."}50%{content:".."}75%{content:"..."}}
.bubble.bot.err{border-color:rgba(255,109,124,.5);color:#ffd6da}
@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* quick-actions : rangée de puces défilante au-dessus du champ */
.qa-row{
  display:flex;gap:var(--sp-2);margin-top:var(--sp-3);flex:0 0 auto;
  overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;
  -webkit-mask-image:linear-gradient(90deg,#000 92%,transparent);
  mask-image:linear-gradient(90deg,#000 92%,transparent);
}
.qa-row::-webkit-scrollbar{display:none}
.qa-chip{
  flex:0 0 auto;border:1px solid var(--line2);border-radius:999px;cursor:pointer;
  background:rgba(205,244,99,.05);color:var(--dim);font-family:var(--font);
  font-size:var(--fs-sm);font-weight:600;padding:var(--sp-2) var(--sp-4);min-height:2.1rem;
  transition:.15s;white-space:nowrap;
}
.qa-chip:active{transform:scale(.95);color:var(--lime);border-color:rgba(205,244,99,.4)}

.chat-input{display:flex;gap:var(--sp-2);align-items:center;margin-top:var(--sp-3);flex:0 0 auto}
.chat-input textarea{
  flex:1 1 auto;min-width:0;background:var(--field);border:1px solid var(--line2);
  border-radius:1.45rem;padding:.7rem var(--sp-5);color:var(--txt);font-family:var(--font);
  font-size:max(1rem,16px);outline:none;min-height:var(--ctl);max-height:128px;
  resize:none;line-height:1.4;overflow-y:auto;
}
.chat-input textarea:focus{border-color:rgba(205,244,99,.45);box-shadow:0 0 0 3px rgba(205,244,99,.12)}
.chat-input{align-items:flex-end}  /* boutons ancrés en bas quand le champ grandit */
.icon-btn{
  background:var(--field);border:1px solid var(--line2);border-radius:50%;color:var(--dim);
  width:var(--ctl);height:var(--ctl);cursor:pointer;flex:0 0 auto;transition:.15s;
  display:flex;align-items:center;justify-content:center;padding:0;
}
.icon-btn svg{width:var(--ico);height:var(--ico)}
.icon-btn:active{transform:scale(.92)}
.icon-btn[aria-pressed="true"]{color:var(--lime);border-color:rgba(205,244,99,.45);box-shadow:0 0 14px rgba(205,244,99,.25)}
.icon-btn .wave{opacity:.35}
.icon-btn[aria-pressed="true"] .wave{opacity:1}
.icon-btn .ico-stop{display:none}
.icon-btn.listening{color:var(--bad);border-color:rgba(255,109,124,.55);animation:pulse 1.1s infinite}
.icon-btn.listening .ico-mic{display:none}
.icon-btn.listening .ico-stop{display:block}
.icon-btn.busy{color:var(--lime);pointer-events:none}
.send-btn{
  background:var(--grad);border:none;border-radius:50%;color:var(--ink);
  width:var(--ctl);height:var(--ctl);cursor:pointer;flex:0 0 auto;
  display:flex;align-items:center;justify-content:center;padding:0;
  box-shadow:0 8px 22px rgba(158,240,110,.3), inset 0 1px 0 rgba(255,255,255,.35);
  transition:transform .12s ease;
}
.send-btn svg{width:calc(var(--ico) - .0625rem);height:calc(var(--ico) - .0625rem);margin:1px 1px 0 0}
.send-btn:active{transform:scale(.92)}
.send-btn:disabled{opacity:.5;cursor:default}

/* ═══ FORMULAIRES ═══ */
.mission-form{display:flex;flex-direction:column;gap:var(--sp-3)}
.mission-form input,.mission-form textarea{
  background:var(--field);border:1px solid var(--line2);border-radius:var(--r-field);
  padding:var(--sp-3) var(--sp-4);color:var(--txt);font-family:var(--font);
  font-size:max(1rem,16px);outline:none;
  resize:vertical;min-height:0;width:100%;
}
.mission-form input:focus,.mission-form textarea:focus{border-color:rgba(205,244,99,.45);box-shadow:0 0 0 3px rgba(205,244,99,.12)}
.sched-row{display:flex;gap:var(--sp-3)}
.sched-row select,.sched-row input{
  flex:1;min-width:0;background:var(--field);border:1px solid var(--line2);border-radius:var(--r-field);
  padding:var(--sp-3) var(--sp-4);color:var(--txt);font-family:var(--font);
  font-size:max(1rem,16px);outline:none;min-height:var(--ctl);
  -webkit-appearance:none;appearance:none;
}
.sched-row select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%2390a884' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right var(--sp-4) center;padding-right:calc(var(--sp-4) + 1.5em);
}
.sched-row select:focus,.sched-row input:focus{border-color:rgba(205,244,99,.45)}

/* ═══ LISTES (missions / courriels / décisions) ═══ */
.missions{list-style:none;margin:0;padding:0;overflow-y:auto;-webkit-overflow-scrolling:touch;flex:1 1 auto;min-height:0}
.missions .empty{
  display:flex;flex-direction:column;align-items:center;gap:var(--sp-3);
  padding:var(--sp-6) var(--sp-4);text-align:center;
  color:var(--dim);font-size:var(--fs-sm);line-height:1.5;
}
.missions .empty::before{
  content:"";width:3.2rem;height:3.2rem;opacity:.55;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Ccircle cx='24' cy='24' r='20' fill='none' stroke='%23cdf463' stroke-width='1.4' opacity='.5' stroke-dasharray='3 5'/%3E%3Ccircle cx='24' cy='24' r='13' fill='none' stroke='%2390c46f' stroke-width='1.4' opacity='.7'/%3E%3Ccircle cx='24' cy='24' r='5.5' fill='%23a8d96a' opacity='.8'/%3E%3C/svg%3E") center/contain no-repeat;
}
.mission{
  border:1px solid var(--line2);border-radius:var(--r-item);padding:var(--sp-4);margin-bottom:var(--sp-3);
  background:var(--card2);
}
.mission-head{display:flex;align-items:center;gap:var(--sp-3)}
.mission-title{font-size:var(--fs-md);font-weight:600;color:var(--txt);flex:1 1 auto;min-width:0;overflow-wrap:break-word}
.badge{
  flex:0 0 auto;font-size:var(--fs-2xs);font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  padding:.4em 1em;border-radius:999px;border:none;
}
.badge.queued{color:#b9c9ae;background:rgba(144,168,132,.16)}
.badge.running{color:var(--ink);background:var(--grad);animation:pulse 1.6s infinite}
.badge.done{color:var(--ok);background:rgba(98,238,169,.13)}
.badge.failed{color:var(--bad);background:rgba(255,109,124,.13)}
.badge.cancelled{color:var(--warn);background:rgba(255,201,102,.13)}
.badge.action{color:var(--lime);background:rgba(205,244,99,.13)}
.mission-meta{font-size:var(--fs-xs);color:var(--dim);margin-top:var(--sp-2)}
.mission-live{font-size:var(--fs-xs);color:var(--teal);margin-top:var(--sp-1);font-style:italic;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mission-live:empty{display:none}
.mission-result{
  margin-top:var(--sp-3);font-size:var(--fs-sm);line-height:1.55;white-space:pre-wrap;overflow-wrap:break-word;
  border-top:1px solid var(--line2);padding-top:var(--sp-3);max-height:clamp(15rem,40dvh,22rem);overflow-y:auto;display:none;color:#cfe0c2;
}
.mission.open .mission-result{display:block}
.mission-btns{display:flex;gap:var(--sp-2);margin-top:var(--sp-3);flex-wrap:wrap}
.mini-btn{
  background:rgba(205,244,99,.07);border:1px solid var(--line);border-radius:999px;color:var(--txt);
  font-family:var(--font);font-weight:600;font-size:var(--fs-sm);padding:var(--sp-2) var(--sp-4);
  cursor:pointer;min-height:var(--ctl-sm);
  transition:transform .12s ease;
}
.mini-btn:active{transform:scale(.95)}
.mini-btn.danger{color:var(--bad);border-color:rgba(255,109,124,.35);background:rgba(255,109,124,.07)}
.mini-btn.armed{background:var(--bad);border-color:transparent;color:#fff;font-weight:700;
  box-shadow:0 4px 16px rgba(255,109,124,.35)}
#emailNoise .mission.swept{opacity:.35;text-decoration:line-through}
.mini-btn.accent{background:var(--grad);color:var(--ink);border:none;font-weight:700;
  box-shadow:0 6px 18px rgba(158,240,110,.22)}
.mini-btn:disabled{opacity:.55}
a.mini-btn{text-decoration:none;display:inline-flex;align-items:center}

/* ═══ CALENDRIER ═══ */
.cal-month{color:var(--dim);font-weight:500;font-size:var(--fs-sm);text-transform:capitalize}
.cal-nav{margin-left:auto;display:flex;gap:var(--sp-1)}
.mini-btn.icon{min-width:var(--ctl-sm);padding:0;display:inline-flex;align-items:center;justify-content:center;font-size:var(--fs-lg);line-height:1}
#calCard.closed .cal-body{display:none}
#calCard.closed #calPrev,#calCard.closed #calNext{display:none}  /* nav inutile repliée */
#calCard.closed #calToggle svg{transform:rotate(-90deg)}
#calToggle svg{transition:transform .2s ease}
.qa-chip{display:inline-flex;align-items:center;gap:.45em}
.qa-chip svg{width:1.05em;height:1.05em;flex:0 0 auto}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:var(--sp-1)}
.cal-dow{text-align:center;font-size:var(--fs-2xs);letter-spacing:.1em;color:var(--dim);text-transform:uppercase;padding:var(--sp-1) 0}
.cal-cell{
  position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:1px;min-height:2.3rem;padding:var(--sp-1) 0;border-radius:calc(var(--r-field)*.62);
  background:rgba(205,244,99,.035);border:1.5px solid transparent;cursor:pointer;
  font:inherit;font-size:var(--fs-sm);color:var(--txt);font-variant-numeric:tabular-nums;
  transition:background .15s ease;
}
.cal-cell:active{background:rgba(205,244,99,.14)}
.cal-cell.out{opacity:.3}
.cal-cell.sel{background:rgba(205,244,99,.13)}
.cal-cell.today{
  background:linear-gradient(rgba(11,18,10,.92),rgba(11,18,10,.92)) padding-box,var(--grad) border-box;
  font-weight:700;
}
.cal-dots{display:flex;gap:2px;height:4px}
.cal-dots i{width:4px;height:4px;border-radius:50%;background:var(--lime);box-shadow:0 0 4px rgba(205,244,99,.6)}
.cal-dots i.past{background:var(--dim);box-shadow:none}
.cal-dots i.fail{background:var(--bad);box-shadow:0 0 4px rgba(255,109,124,.6)}
.cal-dots i.perso{background:var(--teal);box-shadow:0 0 4px rgba(53,217,164,.6)}
.cal-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch}
.cal-legend{
  display:flex;flex-wrap:wrap;gap:var(--sp-2) var(--sp-4);margin-top:var(--sp-3);
  font-size:var(--fs-2xs);color:var(--dim);letter-spacing:.05em;text-transform:uppercase;
}
.cal-legend span{display:flex;align-items:center;gap:.45em}
.cal-legend i{width:.5em;height:.5em;border-radius:50%}
.cal-legend .lg-ev{background:var(--teal)}
.cal-legend .lg-rout{background:var(--lime)}
.cal-legend .lg-mis{background:var(--dim)}
.cal-day-head{display:flex;align-items:center;gap:var(--sp-3)}
.cal-day-head span{flex:1 1 auto}
.cal-add-day{flex:0 0 auto}
.cal-day-ev.editable{cursor:pointer;border-radius:8px;transition:background .15s ease}
.cal-day-ev.editable:active{background:rgba(53,217,164,.12)}
.cal-day-ev.perso i{background:var(--teal)}
.cal-day-ev.perso span{color:var(--txt)}
.ev-row{display:flex;gap:var(--sp-2)}
.ev-row input{flex:1;min-width:0;-webkit-appearance:none;appearance:none;min-height:var(--ctl)}
.ev-row input::-webkit-date-and-time-value{text-align:left}
.cal-day{font-size:var(--fs-sm)}
.cal-day:not(:empty){border-top:1px solid var(--line2);margin-top:var(--sp-3);padding-top:var(--sp-3)}
.cal-day-head{color:var(--txt);font-weight:650;text-transform:capitalize;margin-bottom:var(--sp-2)}
.cal-day-empty{color:var(--dim)}
.cal-day-ev{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-1) 0;color:var(--dim)}
.cal-day-ev i{width:5px;height:5px;border-radius:50%;background:var(--lime);flex:0 0 auto}
.cal-day-ev.past i{background:var(--dim)}
.cal-day-ev.fail i{background:var(--bad)}
.cal-day-ev b{color:var(--txt);font-weight:650;font-variant-numeric:tabular-nums;flex:0 0 auto}
.cal-day-ev span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cal-up{list-style:none;margin:var(--sp-3) 0 0;padding:var(--sp-3) 0 0;border-top:1px solid var(--line2);font-size:var(--fs-sm)}
.cal-up:empty{display:none}
.cal-up li{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-1) 0;color:var(--dim)}
.cal-up li i{color:var(--lime);font-style:normal;flex:0 0 auto}
.cal-up li b{font-variant-numeric:tabular-nums;color:var(--txt);font-weight:650;flex:0 0 auto}
.cal-up li .t{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ═══ DÉCISIONS (approbations) ═══ */
.appr-intro{color:var(--dim);font-size:var(--fs-sm)}
.kv{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--sp-1) var(--sp-4);margin:var(--sp-3) 0 0}
.kv dt{color:var(--dim);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.06em;padding-top:.2em;white-space:nowrap}
.kv dd{margin:0;color:var(--txt);font-size:var(--fs-sm);overflow-wrap:anywhere;white-space:pre-wrap}
.kv-raw{margin-top:var(--sp-2);font-family:var(--mono);font-size:var(--fs-sm);color:#cfe0c2;
  white-space:pre-wrap;overflow-wrap:anywhere}
.mission-btns.appr-btns{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-2)}
.appr-btn{
  border:none;border-radius:999px;min-height:var(--ctl);cursor:pointer;
  font-family:var(--font);font-weight:700;font-size:var(--fs-md);transition:transform .12s ease;
}
.appr-btn:active{transform:scale(.97)}
.appr-btn.approve{background:linear-gradient(118deg,#9ef06e,#35d9a4);color:var(--ink);
  box-shadow:0 8px 22px rgba(98,238,169,.25)}
.appr-btn.reject{background:rgba(255,109,124,.1);border:1px solid rgba(255,109,124,.45);color:var(--bad)}

/* ═══ BOÎTE DE RÉCEPTION ═══ */
.card.slim{padding:var(--sp-2);margin-bottom:var(--sp-3)}
.card.slim .seg{margin:0;border:none;background:none;padding:0}
.mail-search{
  display:flex;align-items:center;gap:var(--sp-2);margin-bottom:var(--sp-3);flex:0 0 auto;
  background:var(--field);border:1px solid var(--line2);border-radius:999px;
  padding:0 var(--sp-3) 0 var(--sp-4);min-height:var(--ctl-sm);
}
.mail-search:focus-within{border-color:rgba(205,244,99,.45)}
.mail-search>svg{width:1rem;height:1rem;color:var(--dim);flex:0 0 auto}
.mail-search input{
  flex:1 1 auto;min-width:0;background:none;border:none;outline:none;
  color:var(--txt);font-family:var(--font);font-size:max(1rem,16px);
  -webkit-appearance:none;appearance:none;
}
.mail-search input::placeholder{color:var(--dim)}
.mail-search button{
  border:none;background:rgba(205,244,99,.1);color:var(--dim);cursor:pointer;
  width:1.6rem;height:1.6rem;border-radius:50%;display:flex;align-items:center;justify-content:center;
  padding:0;flex:0 0 auto;
}
.mail-search button svg{width:.8rem;height:.8rem}
.mail-list{list-style:none;margin:0;padding:0;overflow-y:auto;-webkit-overflow-scrolling:touch;flex:1 1 auto;min-height:0}
.mail-list .empty{color:var(--dim);font-size:var(--fs-sm);padding:var(--sp-4)}
.mail-row{
  position:relative;overflow:hidden;border-radius:12px;margin-bottom:2px;
  transition:transform .23s ease,opacity .23s ease;
}
.mail-row.gone{transform:translateX(-100%);opacity:0;pointer-events:none}
.mail-inner{
  position:relative;z-index:1;display:flex;align-items:center;gap:var(--sp-3);
  padding:var(--sp-3) var(--sp-3);min-height:var(--ctl);cursor:pointer;
  background:#0f170d;border-radius:12px;
  transition:transform .22s ease,background .15s ease;will-change:transform;
}
.mail-inner:active{background:#141f10}
.mail-acts{position:absolute;top:0;bottom:0;right:0;display:flex;z-index:0;border-radius:0 12px 12px 0;overflow:hidden}
.mail-acts button{
  width:62px;border:none;display:flex;align-items:center;justify-content:center;
  cursor:pointer;color:#fff;padding:0;
}
.mail-acts svg{width:1.25rem;height:1.25rem}
.ma-arch{background:#2c7a52}
.ma-trash{background:#b03a47}
@media (hover:hover){
  .mail-acts{opacity:0;transition:opacity .15s ease;z-index:2;
    background:linear-gradient(90deg,transparent,#0f170d 18%)}
  .mail-acts button{width:48px;background:none}
  .ma-arch{color:var(--ok)}
  .ma-trash{color:var(--bad)}
  .mail-row:hover .mail-acts{opacity:1}
  /* écran tactile + souris (portable) : la rangée swipée doit montrer ses boutons */
  .mail-row.swiped .mail-acts{opacity:1;z-index:0;background:none}
  .mail-row.swiped .ma-arch{background:#2c7a52;color:#fff}
  .mail-row.swiped .ma-trash{background:#b03a47;color:#fff}
}
.mail-dot{width:.5rem;height:.5rem;border-radius:50%;flex:0 0 auto;background:transparent}
.mail-row.unread .mail-dot{background:var(--lime);box-shadow:0 0 8px rgba(205,244,99,.7)}
.mail-main{flex:1 1 auto;min-width:0}
.mail-from{font-size:var(--fs-md);color:var(--dim);font-weight:500;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mail-row.unread .mail-from{color:var(--txt);font-weight:700}
.mail-subj{font-size:var(--fs-sm);color:var(--dim);margin-top:1px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mail-row.unread .mail-subj{color:#cfe0c2}
.mail-date{flex:0 0 auto;font-size:var(--fs-xs);color:var(--dim);font-variant-numeric:tabular-nums}
.mail-clip{flex:0 0 auto;display:flex;align-items:center;color:var(--dim)}
.mail-clip svg{width:.85rem;height:.85rem}

.mail-more{list-style:none;text-align:center;color:var(--dim);font-size:var(--fs-sm);
  padding:var(--sp-4);letter-spacing:.06em}
.mail-more.end{opacity:.6}
.ptr{
  height:0;overflow:hidden;display:flex;align-items:center;justify-content:center;
  color:var(--dim);transition:height .22s ease;flex:0 0 auto;
}
.ptr svg{width:1.15rem;height:1.15rem;transition:transform .2s ease,color .2s ease}
.ptr.ready svg{transform:rotate(180deg);color:var(--lime)}
.ptr.busy svg{animation:spin 1s linear infinite;color:var(--lime)}

/* squelettes de chargement */
.sk{
  height:3.1rem;border-radius:12px;margin-bottom:6px;list-style:none;
  background:linear-gradient(90deg,rgba(205,244,99,.04) 25%,rgba(205,244,99,.1) 50%,rgba(205,244,99,.04) 75%);
  background-size:200% 100%;animation:shimmer 1.3s linear infinite;
}
@keyframes shimmer{from{background-position:200% 0}to{background-position:-200% 0}}

/* boutons icône (têtes de feuilles) + boutons avec icône+texte */
.icon-sm{
  width:var(--ctl-sm);height:var(--ctl-sm);border-radius:50%;flex:0 0 auto;
  border:1px solid var(--line2);background:rgba(205,244,99,.06);color:var(--txt);
  display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;
  transition:transform .12s ease;
}
.icon-sm:active{transform:scale(.92)}
.icon-sm svg{width:1.05rem;height:1.05rem}
.icon-sm.danger{color:var(--bad);border-color:rgba(255,109,124,.35)}
.has-ico{display:inline-flex;align-items:center;justify-content:center;gap:.45em}
.has-ico svg{width:1.05em;height:1.05em;flex:0 0 auto}
.mini-btn.icon svg{width:1rem;height:1rem}

/* rendu HTML sandboxé + liste de libellés */
.reader-frame{width:100%;border:none;border-radius:14px;background:#fff;min-height:8rem;display:block}
.folder-list{list-style:none;margin:0;padding:0}
.folder-list .empty{color:var(--dim);font-size:var(--fs-sm);padding:var(--sp-4)}
.folder-item{
  display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3);min-height:var(--ctl);
  border-bottom:1px solid var(--line2);cursor:pointer;font-size:var(--fs-md);color:var(--txt);
  border-radius:10px;transition:background .15s ease;
}
.folder-item:last-child{border-bottom:none}
.folder-item:active{background:rgba(205,244,99,.1)}
.folder-item svg{width:1.1rem;height:1.1rem;color:var(--dim);flex:0 0 auto}

/* ═══ FEUILLES (lecteur / compositeur) ═══ */
.sheet{
  position:fixed;inset:0;z-index:75;display:flex;align-items:flex-end;justify-content:center;
  background:rgba(4,8,4,.55);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  opacity:0;transition:opacity .24s ease;
}
.sheet.open{opacity:1}
.sheet-panel{
  width:min(100%,46rem);max-height:92dvh;display:flex;flex-direction:column;min-height:0;
  background:#0e160c;border:1px solid var(--line);border-bottom:none;
  border-radius:calc(var(--r-card) + var(--sp-2)) calc(var(--r-card) + var(--sp-2)) 0 0;
  box-shadow:0 -20px 70px rgba(0,0,0,.6);
  padding:var(--sp-4) var(--sp-5) calc(var(--sp-5) + var(--sab));
  transform:translateY(100%);transition:transform .28s cubic-bezier(.32,.72,.28,1);
  will-change:transform;
}
.sheet.open .sheet-panel{transform:translateY(0)}
.sheet-head{display:flex;align-items:center;gap:var(--sp-3);flex:0 0 auto;margin-bottom:var(--sp-3)}
.sheet-title{
  flex:1 1 auto;min-width:0;font-size:var(--fs-md);font-weight:650;color:var(--txt);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.sheet-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.sheet-actions{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-2);margin-top:var(--sp-4);flex:0 0 auto}
.sheet-actions.reader-actions{grid-template-columns:auto 1fr 1fr auto;align-items:center}
.icon-sm.nav-mail{width:var(--ctl);height:var(--ctl)}
.appr-btn.neutral{background:rgba(205,244,99,.08);border:1px solid var(--line);color:var(--txt)}
.reader-meta{border-bottom:1px solid var(--line2);padding-bottom:var(--sp-3);margin-bottom:var(--sp-3)}
.reader-meta-row{display:flex;gap:var(--sp-3);font-size:var(--fs-sm);padding:2px 0;min-width:0}
.reader-meta-row b{color:var(--dim);font-weight:600;flex:0 0 3em}
.reader-meta-row span{color:var(--txt);min-width:0;overflow-wrap:anywhere}
.reader-gmail{display:inline-block;margin-top:var(--sp-2);font-size:var(--fs-xs);color:var(--dim);
  text-decoration:underline;text-underline-offset:2px}
.reader-gmail:active{color:var(--lime)}
.bubble .mini-btn.retry{display:block;margin-top:var(--sp-2)}
.reader-atts{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
.reader-atts:not(:empty){margin-bottom:var(--sp-3)}
.att-chip{
  display:inline-flex;align-items:center;gap:var(--sp-2);max-width:100%;
  background:rgba(205,244,99,.08);border:1px solid var(--line2);border-radius:999px;
  padding:var(--sp-1) var(--sp-3);font-size:var(--fs-sm);color:var(--txt);
}
.att-chip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.att-chip button{border:none;background:none;color:var(--bad);cursor:pointer;font-size:1em;padding:0 2px}
a.att-chip.att-dl{text-decoration:none;cursor:pointer;color:var(--txt);transition:border-color .15s ease}
a.att-chip.att-dl:active{border-color:rgba(205,244,99,.45)}
a.att-chip.att-dl svg{width:.95rem;height:.95rem;color:var(--lime);flex:0 0 auto}
.reader-body{
  font-size:var(--fs-base);line-height:1.55;color:#dcebd0;white-space:pre-wrap;
  overflow-wrap:break-word;word-break:break-word;
}
.report-meta{font-size:var(--fs-xs);color:var(--dim);margin-bottom:var(--sp-3);
  padding-bottom:var(--sp-3);border-bottom:1px solid var(--line2)}
.report-body{font-size:var(--fs-sm);line-height:1.6;color:#cfe0c2;white-space:pre-wrap;
  overflow-wrap:break-word;word-break:break-word}
.report-body .md-h{color:#fff;font-weight:700;margin:.45em 0 .2em}
.report-body code{background:rgba(205,244,99,.13);color:#dff7a9;padding:.05em .4em;
  border-radius:.4em;font-family:var(--mono);font-size:.9em}
.report-body strong{color:#fff}
.report-body a{color:var(--teal);text-decoration:underline;text-underline-offset:2px;overflow-wrap:anywhere}

.cmp-form{display:flex;flex-direction:column;gap:var(--sp-2)}
.cmp-form input,.cmp-form textarea{
  background:var(--field);border:1px solid var(--line2);border-radius:var(--r-field);
  padding:var(--sp-3) var(--sp-4);color:var(--txt);font-family:var(--font);
  font-size:max(1rem,16px);outline:none;width:100%;resize:vertical;
}
.cmp-form input:focus,.cmp-form textarea:focus{border-color:rgba(205,244,99,.45);box-shadow:0 0 0 3px rgba(205,244,99,.12)}
.cmp-att-row{display:flex;align-items:center;gap:var(--sp-2)}
.cmp-atts{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
@media (min-width:900px){
  .sheet{align-items:center;padding:var(--sp-6)}
  .sheet-panel{max-height:84dvh;border-bottom:1px solid var(--line);
    border-radius:calc(var(--r-card) + var(--sp-2));
    transform:translateY(24px) scale(.98);opacity:0;
    transition:transform .24s ease,opacity .24s ease}
  .sheet.open .sheet-panel{transform:none;opacity:1}
}
@media (prefers-reduced-motion:reduce){
  .sheet,.sheet-panel{transition:none}
}

/* ═══ ARRÊT D'URGENCE ═══ */
.halt-btn{
  width:100%;padding:var(--sp-4);border-radius:999px;cursor:pointer;min-height:var(--ctl);
  background:rgba(255,109,124,.11);border:1px solid rgba(255,109,124,.5);
  color:var(--bad);font-family:var(--font);font-weight:800;letter-spacing:.08em;font-size:var(--fs-md);
}
.halt-btn:active{background:rgba(255,109,124,.26);transform:scale(.985)}
.halt-btn.resume{background:rgba(98,238,169,.1);border-color:rgba(98,238,169,.5);color:var(--ok)}

/* ═══ SYSTÈME ═══ */
.tab-system{overflow-y:auto;-webkit-overflow-scrolling:touch}
.tab-system.active{display:block}
.kpis{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-2);margin-bottom:var(--sp-4)}
.kpi{
  text-align:center;border:1px solid var(--line2);border-radius:var(--r-field);padding:var(--sp-3) var(--sp-1) var(--sp-3);
  background:var(--card2);
}
.kpi span{font-size:var(--fs-lg);font-weight:700;color:var(--txt);font-variant-numeric:tabular-nums}
.kpi label{display:block;font-size:var(--fs-2xs);letter-spacing:.12em;color:var(--dim);text-transform:uppercase;margin-top:var(--sp-1)}
.actions{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-2)}
.act{
  background:rgba(205,244,99,.06);border:1px solid var(--line);border-radius:999px;color:var(--txt);
  font-family:var(--font);font-weight:600;font-size:var(--fs-sm);padding:var(--sp-3) var(--sp-2);
  cursor:pointer;min-height:var(--ctl);
  transition:transform .12s ease;
}
.act:active{transform:scale(.97);border-color:rgba(205,244,99,.4)}
.act:disabled{opacity:.4}
.act-note{min-height:1.2em;font-size:var(--fs-sm);color:var(--dim);margin:var(--sp-3) 0 0;line-height:1.45}

/* anneaux de jauge (conic-gradient piloté par --pct) */
.uptime-inline{margin-left:auto}
.uptime-inline span{color:var(--txt);font-weight:600}
.gauges{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-2);margin-bottom:var(--sp-4)}
.gauge{--ga:#e2ff7a;--gb:#35d9a4;display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0}
.gauge.warn{--ga:#ffd98a;--gb:#ff9f43}
.gauge.bad{--ga:#ff9aa5;--gb:#ff5c6c}
.gauge .ring{
  width:min(100%,clamp(4.5rem,4rem + 2vw,6rem));aspect-ratio:1;border-radius:50%;padding:9.5%;
  background:conic-gradient(from 0deg,var(--ga),var(--gb) calc(var(--pct)*1%),rgba(236,246,227,.07) 0);
  transition:background .5s ease;
  filter:drop-shadow(0 0 10px rgba(205,244,99,.14));
}
.gauge.warn .ring{filter:drop-shadow(0 0 10px rgba(255,159,67,.18))}
.gauge.bad .ring{filter:drop-shadow(0 0 10px rgba(255,92,108,.22))}
.gauge .ring-in{
  width:100%;height:100%;border-radius:50%;background:rgba(10,16,9,.92);
  display:flex;align-items:center;justify-content:center;
}
.gauge-pct{font-size:var(--fs-md);font-weight:700;color:var(--txt);font-variant-numeric:tabular-nums}
.gauge label{font-size:var(--fs-2xs);letter-spacing:.12em;color:var(--dim);text-transform:uppercase;margin-top:var(--sp-2)}
.gauge-val{font-size:var(--fs-2xs);color:var(--dim);margin-top:2px;font-variant-numeric:tabular-nums;
  max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* tendance (graphe d'activité) */
.legend{margin-left:auto;display:flex;gap:var(--sp-4);font-weight:500}
.legend-item{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--fs-xs);color:var(--dim);text-transform:uppercase;letter-spacing:.06em}
.legend-item b{color:var(--txt);font-weight:700;font-variant-numeric:tabular-nums}
.legend-item i{width:1.1em;height:0;border-top:2.5px solid var(--lime);border-radius:2px}
.legend-item .lg-mem,.legend-item i.lg-mem{border-top:2.5px dashed var(--teal)}
.trend{height:clamp(8rem,10rem + 2dvh,10.625rem);border-radius:var(--r-field);overflow:hidden;position:relative}
.trend svg{width:100%;height:100%;display:block}
.trend-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  color:var(--dim);font-size:var(--fs-sm)}

/* services */
.services{list-style:none;margin:0;padding:0}
.services li{display:flex;align-items:center;gap:var(--sp-3);font-size:var(--fs-md);padding:var(--sp-2) var(--sp-1);
  border-bottom:1px solid var(--line2);min-height:2.25rem}
.services li:last-child{border-bottom:none}
.services li .led{width:.5625rem;height:.5625rem;border-radius:50%;background:var(--bad);box-shadow:0 0 9px rgba(255,109,124,.8);flex:0 0 auto}
.services li.up .led{background:var(--ok);box-shadow:0 0 9px rgba(98,238,169,.8)}
.services li .s-state{
  margin-left:auto;font-size:var(--fs-2xs);font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--dim);background:rgba(144,168,132,.12);border-radius:999px;padding:.4em 1em;
}
.services li.up .s-state{color:var(--ok);background:rgba(98,238,169,.1)}

/* segments (journaux) */
.seg{display:flex;gap:var(--sp-1);background:var(--field);border:1px solid var(--line2);
  border-radius:999px;padding:var(--sp-1);margin-bottom:var(--sp-3)}
.seg-btn{
  flex:1;border:none;border-radius:999px;background:none;color:var(--dim);cursor:pointer;
  font-family:var(--font);font-weight:600;font-size:var(--fs-sm);padding:var(--sp-2) var(--sp-1);
  min-height:var(--ctl-sm);transition:color .15s ease;white-space:nowrap;
}
.seg-btn.active{background:var(--grad);color:var(--ink);font-weight:700;
  box-shadow:0 4px 14px rgba(158,240,110,.25)}
.logbox{
  flex:1 1 auto;min-height:10rem;max-height:clamp(16rem,38dvh,24rem);overflow:auto;-webkit-overflow-scrolling:touch;
  background:rgba(5,9,5,.72);border:1px solid var(--line2);border-radius:var(--r-field);padding:var(--sp-4);
  font-family:var(--mono);font-size:clamp(.625rem,.6rem + .15vw,.6875rem);line-height:1.5;color:#b7d3a8;
  white-space:pre-wrap;overflow-wrap:break-word;margin:0;
}
.ghost-btn{
  background:none;border:1px solid rgba(255,109,124,.35);border-radius:999px;color:var(--bad);
  font-family:var(--font);font-weight:600;font-size:var(--fs-sm);padding:var(--sp-4);cursor:pointer;width:100%;
  min-height:var(--ctl);
}

/* ═══ RÉGLAGES D'AFFICHAGE ═══ */
.pref-row{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-2) 0;font-size:var(--fs-md)}
.pref-row>span{flex:1;color:var(--txt)}
.switch{
  width:3.2rem;height:1.9rem;border-radius:999px;border:1px solid var(--line);
  background:rgba(144,168,132,.15);position:relative;cursor:pointer;padding:0;
  flex:0 0 auto;transition:background .2s ease;
}
.switch i{position:absolute;top:50%;left:.2rem;transform:translateY(-50%);
  width:1.5rem;height:1.5rem;border-radius:50%;background:#8aa37e;transition:left .2s ease,background .2s ease}
.switch.on{background:var(--grad);border-color:transparent}
.switch.on i{left:calc(100% - 1.7rem);background:#fff}
.seg.seg-sm{margin:0;flex:0 0 auto;padding:3px}
#prefChatFs .seg-btn{min-height:2rem;min-width:2.4rem;padding:var(--sp-1) var(--sp-3);flex:0 0 auto}
#prefChatFs .seg-btn[data-v="s"]{font-size:.7rem}
#prefChatFs .seg-btn[data-v="m"]{font-size:.85rem}
#prefChatFs .seg-btn[data-v="l"]{font-size:1.02rem}
body.chat-s .bubble{font-size:calc(var(--fs-base)*.88)}
body.chat-l .bubble{font-size:calc(var(--fs-base)*1.15)}
body.no-aurora .aurora{display:none}
body.no-blur .card,body.no-blur .chip,body.no-blur .stat-chip,body.no-blur .nav,
body.no-blur .login-box,body.no-blur .scroll-down,body.no-blur .toast{
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important}
body.no-blur .card,body.no-blur .login-box{background:#131c10}
body.no-blur .nav{background:#0c130a}
body.no-blur .chip,body.no-blur .stat-chip{background:#0d150b}

/* ═══ DESKTOP (structure seulement — les tailles sont déjà fluides) ═══ */
@media (min-width:900px){
  .content{max-width:74rem;margin:0 auto;width:100%}
  .tab{padding-top:var(--sp-4);padding-bottom:calc(var(--nav-h) + var(--sp-6) + var(--sp-3))}
  .tab-console.active{display:grid;grid-template-columns:minmax(18.75rem,22.5rem) minmax(0,1fr);
    grid-template-rows:auto minmax(0,1fr);gap:var(--sp-4) var(--sp-5);align-items:stretch}
  .tab-console .stat-strip{grid-column:1/-1;grid-template-columns:repeat(3,13.75rem);margin:0}
  .tab-console .reactor{grid-row:2;grid-column:1;width:min(38dvh,24vw,20rem);margin:auto}
  .tab-console .chat{grid-row:2;grid-column:2;min-height:0}
  .tab-missions{flex-direction:row;gap:var(--sp-5);flex-wrap:wrap;align-content:flex-start}
  .tab-missions .card{flex:1 1 46%;margin-bottom:0}
  .tab-missions .card.grow{display:flex;min-height:24rem}
  .tab-emails{flex-direction:row;gap:var(--sp-5);flex-wrap:wrap;align-content:flex-start}
  .tab-emails .card:first-child{flex:0 0 100%}
  .tab-emails .card.grow{flex:1 1 46%;min-height:26rem}
  .tab-system.active{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:max-content;gap:var(--sp-5);align-content:start}
  .tab-system .card{margin-bottom:0}
  .tab-system .span2{grid-column:1/-1}
  .tab-system .card:first-child{grid-column:1/2}
  .tab-system .card:nth-child(2){grid-column:2/3}
  .gauges{grid-template-columns:repeat(4,minmax(0,9.5rem));justify-content:space-around}
  .ghost-btn{width:auto;padding:var(--sp-4) var(--sp-6);margin:0 auto}
  .kpis{grid-template-columns:repeat(4,1fr)}
}
@media (max-width:420px){
  .brand-sub{display:none}
  .topbar-right{gap:var(--sp-2)}
}
@media (max-height:620px){
  .reactor{display:none}
  .stat-strip{margin-top:var(--sp-1)}
}
@media (prefers-reduced-motion:reduce){
  .aurora i,.spin-slow,.pulse,.ring-a,.ring-b,.ring-c,.core-fill{animation:none!important}
  .tab.active{animation:none}
}
@media (prefers-reduced-transparency:reduce){
  .card,.login-box{background:#131c10;-webkit-backdrop-filter:none;backdrop-filter:none}
  .chip,.stat-chip,.mission,.kpi{background:#0d150b;-webkit-backdrop-filter:none;backdrop-filter:none}
  .nav{background:#0c130a;-webkit-backdrop-filter:none;backdrop-filter:none}
  .aurora{display:none}
}
