:root{--bg:#04060d;--panel:#0a1326;--line:#1b2d55;--line2:#142449;--blue:#3d9bff;--cyan:#7fd4ff;--ice:#bfe9ff;--txt:#e8f1ff;--mute:#9fb4d4;--ok:#3ddc97;--warn:#ffb547;--bad:#ff5a6e}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:radial-gradient(ellipse at 50% 18%,#0c1d42 0%,#050913 55%,#04060d 100%) fixed;color:var(--txt);font-family:Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
button{font-family:inherit;color:inherit}
input,textarea{font-family:inherit}
input::placeholder,textarea::placeholder{color:#7d93b8}
a{color:var(--cyan)}

/* Fond animé */
.bg-grid,.bg-stars,.bg-sweep,.bg-lines{position:fixed;inset:0;pointer-events:none}
.bg-grid{z-index:-3;background-image:linear-gradient(rgba(61,155,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(61,155,255,.08) 1px,transparent 1px);background-size:40px 40px;animation:jgrid 4s linear infinite;-webkit-mask-image:radial-gradient(ellipse at 50% 25%,#000 0%,transparent 70%);mask-image:radial-gradient(ellipse at 50% 25%,#000 0%,transparent 70%)}
.bg-stars{z-index:-2;background-image:radial-gradient(2px 2px at 10% 14%,#bfe9ff,transparent),radial-gradient(3px 3px at 82% 9%,#7fd4ff,transparent),radial-gradient(2px 2px at 68% 34%,#bfe9ff,transparent),radial-gradient(2px 2px at 22% 46%,#7fd4ff,transparent),radial-gradient(2px 2px at 90% 58%,#bfe9ff,transparent),radial-gradient(3px 3px at 6% 72%,#7fd4ff,transparent),radial-gradient(2px 2px at 48% 6%,#bfe9ff,transparent),radial-gradient(2px 2px at 36% 88%,#7fd4ff,transparent);animation:jblink 3s ease-in-out infinite}
.bg-sweep{z-index:-1;overflow:hidden}
.bg-sweep::after{content:"";position:absolute;left:0;right:0;height:80px;background:linear-gradient(180deg,rgba(127,212,255,0),rgba(127,212,255,.06),rgba(127,212,255,0));animation:jsweep 7s linear infinite}
.bg-lines{z-index:50;background:repeating-linear-gradient(180deg,rgba(255,255,255,.022) 0,rgba(255,255,255,.022) 1px,transparent 1px,transparent 3px)}

@keyframes jspin{to{transform:rotate(360deg)}}
@keyframes jspinr{to{transform:rotate(-360deg)}}
@keyframes jpulse{0%,100%{opacity:.8;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}
@keyframes jscan{0%{transform:translateY(-100%)}100%{transform:translateY(260%)}}
@keyframes jblink{0%,100%{opacity:.3}50%{opacity:1}}
@keyframes jgrid{to{background-position:0 40px}}
@keyframes jfade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes jwave{0%,100%{transform:scaleY(.25)}50%{transform:scaleY(1)}}
@keyframes jglow{0%,100%{box-shadow:0 0 6px rgba(61,155,255,.3)}50%{box-shadow:0 0 26px rgba(61,155,255,.8)}}
@keyframes jholo{to{background-position:200% 0,200% 0}}
@keyframes jload{from{width:0}to{width:100%}}
@keyframes jsweep{0%{top:-10%}100%{top:110%}}
@keyframes jflick{0%,92%,94%,97%,100%{opacity:1}93%{opacity:.35}96%{opacity:.5}}
@keyframes jglitch{0%,86%,92%,100%{text-shadow:0 0 14px rgba(127,212,255,.85);transform:none}88%{text-shadow:-3px 0 #ff4fd8,3px 0 #3df5ff;transform:translateX(2px)}90%{text-shadow:3px 0 #ff4fd8,-3px 0 #3df5ff;transform:translateX(-2px)}}
@keyframes jripple{0%{box-shadow:0 0 0 0 rgba(92,200,255,.55)}100%{box-shadow:0 0 0 18px rgba(92,200,255,0)}}
@keyframes jrise{0%{transform:translateY(0);opacity:0}15%{opacity:1}100%{transform:translateY(-250px);opacity:0}}
@keyframes jbeam{0%,100%{opacity:.55}50%{opacity:1}}
@keyframes jplat{0%{transform:scale(.55);opacity:.9}100%{transform:scale(1.25);opacity:0}}
@keyframes jletter{from{opacity:0;transform:translateY(14px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@keyframes jhudin{from{opacity:0;transform:translateX(var(--dx,0))}to{opacity:1;transform:none}}
@keyframes jalert{0%,100%{box-shadow:0 0 0 rgba(255,90,110,0);border-color:#7a2433}50%{box-shadow:0 0 20px rgba(255,90,110,.55);border-color:#ff5a6e}}
@keyframes jshimmer{to{background-position:-200% 0}}
.in{animation:jfade .45s ease-out both}
.dot{animation:jblink 1.6s ease-in-out infinite}
.glow{animation:jglow 2.8s ease-in-out infinite}
.flick{animation:jflick 5s linear infinite}
.glitch{animation:jglitch 4.5s linear infinite}
.ripple{animation:jripple 2s ease-out infinite}
.holo{border:1px solid transparent!important;background:linear-gradient(#0a1326,#0a1326) padding-box,linear-gradient(110deg,#1b2d55 0%,#1b2d55 35%,#5cc8ff 50%,#1b2d55 65%,#1b2d55 100%) border-box;background-size:100% 100%,200% 100%;animation:jholo 4s linear infinite}
.card{transition:box-shadow .25s,transform .25s,border-color .25s}
.card:hover{box-shadow:0 0 22px rgba(61,155,255,.35);transform:translateY(-2px);border-color:var(--blue)!important}
.card:active{transform:scale(.97)}
.shim{background:linear-gradient(90deg,#10203f 0%,#1d3a70 50%,#10203f 100%);background-size:200% 100%;animation:jshimmer 1.8s linear infinite}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.letter,.hud,.line{opacity:1!important}}

/* Mise en page */
.shell{min-height:100dvh;display:flex;flex-direction:column;max-width:1100px;margin:0 auto;padding:env(safe-area-inset-top) 18px calc(env(safe-area-inset-bottom) + 16px)}
.top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 0 10px}
.top .left{display:flex;align-items:center;gap:6px}
.iconbtn{width:44px;height:44px;border:none;background:transparent;color:var(--cyan);cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:12px}
.logo{background:transparent;border:none;padding:0;cursor:pointer;font-family:Orbitron,sans-serif;font-weight:700;font-size:11px;letter-spacing:3px;color:var(--cyan);min-height:20px;display:block}
.logo:hover{color:#fff;text-shadow:0 0 10px var(--cyan)}
.title{font-size:19px;font-weight:600}
.pill{display:flex;align-items:center;gap:8px;padding:6px 12px;border:1px solid #1f3566;border-radius:999px;font-size:12px;color:#b9cbe6;background:var(--panel)}
.pill .d{width:8px;height:8px;border-radius:50%}
main{flex:1}
.stack{display:flex;flex-direction:column;gap:14px}
.narrow{max-width:560px;width:100%;margin:0 auto}
.panel{padding:14px 16px;border:1px solid var(--line);border-radius:16px;background:var(--panel)}
.label{font-family:Orbitron,sans-serif;font-size:11px;letter-spacing:2px;color:var(--cyan)}
.mute{color:var(--mute)}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.grid4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
@media (min-width:760px){.grid2.wide{grid-template-columns:repeat(4,minmax(0,1fr))}}
.tile{padding:14px;border-radius:14px}
.tile .v{margin-top:4px;font-family:Orbitron,sans-serif;font-size:22px;font-weight:700}
.tile .k{font-size:12px;color:var(--mute)}
.tile .s{font-size:12px;color:var(--cyan)}
.quick{display:flex;flex-direction:column;align-items:center;gap:6px;min-height:76px;padding:10px 4px;border:1px solid var(--line);border-radius:14px;background:var(--panel);font-size:11px;cursor:pointer}
.row{display:flex;align-items:center;gap:12px;min-height:64px;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--panel);text-align:left;cursor:pointer;width:100%}
.ava{flex:none;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:1px solid var(--blue);background:#0d2350;font-family:Orbitron,sans-serif;font-size:12px;font-weight:700}
.grow{flex:1;min-width:0}
.b{display:block}
.name{font-size:15px;font-weight:600}
.sub{font-size:12px;color:var(--mute)}
.btn{min-height:44px;padding:0 18px;border-radius:12px;border:1px solid var(--blue);background:#0d2350;color:#fff;font-size:14px;font-weight:600;cursor:pointer}
.btn.ok{border-color:var(--ok);background:#0b2a22}
.btn.no{border-color:#ff8a9a;background:#2a0f18}
.empty{padding:36px 16px;text-align:center;color:var(--mute);font-size:14px}

/* Accueil */
.scene{position:relative;height:380px;margin-top:-4px}
.beam{position:absolute;left:50%;top:0;bottom:46px;width:64px;margin-left:-32px;background:linear-gradient(180deg,rgba(61,155,255,0) 0%,rgba(61,155,255,.16) 40%,rgba(92,200,255,.3) 88%,rgba(61,155,255,0) 100%);filter:blur(8px);animation:jbeam 2.4s ease-in-out infinite}
.beam2{position:absolute;left:50%;top:0;bottom:46px;width:2px;margin-left:-1px;background:linear-gradient(180deg,rgba(127,212,255,0),#bfe9ff 45%,#7fd4ff 90%,rgba(127,212,255,0));box-shadow:0 0 12px #5cc8ff;animation:jbeam 2.4s ease-in-out infinite}
.rise{position:absolute;bottom:64px;width:3px;height:3px;border-radius:50%;background:#bfe9ff;box-shadow:0 0 6px #7fd4ff;animation:jrise 3.6s linear infinite}
.wave{animation:jplat 3s ease-out infinite;inset:0;border:2px solid #7fd4ff}
.tilt{position:absolute;inset:0;transform:perspective(500px) rotateX(72deg)}
.tilt2{position:absolute;inset:26px;transform:perspective(500px) rotateX(72deg) rotateY(28deg)}
.core{left:50%;top:50%;width:52px;height:52px;margin:-26px 0 0 -26px;background:radial-gradient(circle,#ecf8ff 0%,#5cc8ff 38%,rgba(61,155,255,0) 72%);box-shadow:0 0 46px 12px rgba(61,155,255,.45);animation:jpulse 3.2s ease-in-out infinite}
.hud{position:absolute;opacity:0;animation:jhudin .8s ease-out forwards}
.hud .ln{width:46px;height:1px;background:var(--blue);box-shadow:0 0 6px var(--blue)}
.hud .k{margin-top:5px;font-family:Orbitron,sans-serif;font-size:9px;letter-spacing:2px;color:var(--cyan)}
.hud .v{font-family:Orbitron,sans-serif;font-size:11px;letter-spacing:1px}
.letter{display:inline-block;opacity:0;animation:jletter .6s cubic-bezier(.2,.8,.2,1) forwards}
.alert{display:flex;align-items:center;gap:10px;padding:8px 8px 8px 14px;border:1px solid #7a2433;border-radius:14px;background:#1c0a12;animation:jalert 1.6s ease-in-out infinite}
.sep{display:flex;align-items:center;gap:10px}
.sep span.l{flex:1;height:1px;background:linear-gradient(90deg,rgba(61,155,255,0),var(--blue))}
.sep span.r{flex:1;height:1px;background:linear-gradient(90deg,var(--blue),rgba(61,155,255,0))}

/* Démarrage */
.boot{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;padding:40px 14px;min-height:80dvh}
.radar{position:relative;width:200px;height:200px}
.radar>*{position:absolute;border-radius:50%}
.line{opacity:0;animation:jfade .4s ease-out forwards}
.load{height:4px;border-radius:2px;overflow:hidden;background:var(--line2);width:100%;max-width:360px}
.load>div{height:100%;width:0;background:linear-gradient(90deg,var(--blue),var(--cyan));box-shadow:0 0 12px #5cc8ff;animation:jload 3.2s ease-out forwards}

/* Chat */
.chat{display:flex;flex-direction:column;gap:12px;padding-bottom:110px}
.bubble{max-width:82%;padding:10px 14px;border-radius:16px;font-size:14px;line-height:1.45;white-space:pre-wrap;word-break:break-word}
.me{align-self:flex-end;background:#1a5fc4;border:1px solid #2f7be0}
.ag{align-self:flex-start;background:#0d1830;border:1px solid #1f3566}
.composer{position:fixed;left:0;right:0;bottom:0;padding:10px max(14px,calc((100% - 1100px)/2 + 18px)) calc(env(safe-area-inset-bottom) + 10px);border-top:1px solid var(--line2);background:#060b18;z-index:20}
.composer .rowc{display:flex;align-items:center;gap:8px}
.composer input[type=text]{flex:1;min-width:0;height:44px;padding:0 14px;border-radius:22px;border:1px solid #1f3566;background:var(--panel);color:var(--txt);font-size:16px;outline:none}
.round{flex:none;width:44px;height:44px;border-radius:50%;border:1px solid #1f3566;background:var(--panel);color:var(--cyan);cursor:pointer;display:flex;align-items:center;justify-content:center}
.round.send{border:none;background:#1a5fc4;color:#fff}

/* Kanban */
.kb{display:flex;gap:12px;overflow-x:auto;padding-bottom:8px}
.kb .col{flex:none;width:260px;display:flex;flex-direction:column;gap:10px}
.kcard{display:flex;flex-direction:column;gap:6px;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--panel);text-align:left;cursor:pointer;width:100%}

/* Interrupteur */
.sw{position:relative;flex:none;width:46px;height:28px;border-radius:999px;cursor:pointer;transition:background .25s;border:1px solid}
.sw span{position:absolute;top:3px;width:20px;height:20px;border-radius:50%;transition:left .25s}

/* Connexion */
.login{max-width:360px;margin:12vh auto 0;display:flex;flex-direction:column;gap:14px}
.field{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--mute)}
.field input{height:48px;padding:0 14px;border-radius:12px;border:1px solid #1f3566;background:var(--panel);color:var(--txt);font-size:16px;outline:none}
.field input:focus{border-color:var(--blue)}

#toast{position:fixed;left:50%;top:calc(env(safe-area-inset-top) + 14px);transform:translateX(-50%);z-index:60;max-width:90vw;padding:10px 14px;border:1px solid var(--blue);border-radius:12px;background:#0d2350;font-size:13px;box-shadow:0 0 18px rgba(61,155,255,.4);opacity:0;pointer-events:none;transition:opacity .25s}
#toast.on{opacity:1}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ===== LOT A — iPhone : fond, zoom, encoche ===== */
html,body{background-color:#04060d;-webkit-text-size-adjust:100%;touch-action:manipulation}
body{min-height:100dvh;background-image:radial-gradient(ellipse at 50% 18%,#0c1d42 0%,#050913 55%,#04060d 100%);background-repeat:no-repeat;background-attachment:scroll;background-position:center top;background-size:100% 100dvh}
:root{--sat:env(safe-area-inset-top,0px);--sab:env(safe-area-inset-bottom,0px)}
.shell.home{padding-top:0}
.home .scene{margin-top:calc(var(--sat) + 24px)}
.home main{padding-bottom:calc(var(--sab) + 64px)}
button,input,label,a{touch-action:manipulation}

/* ===== LOT B — accueil façon maquette ===== */
.floor{position:fixed;left:-50%;right:-50%;bottom:0;height:300px;pointer-events:none;z-index:0;perspective:320px;overflow:hidden;-webkit-mask-image:linear-gradient(0deg,#000 30%,transparent);mask-image:linear-gradient(0deg,#000 30%,transparent)}
.floor i{position:absolute;inset:0 0 -200px 0;transform:rotateX(62deg);transform-origin:50% 100%;background-image:linear-gradient(rgba(61,155,255,.45) 1px,transparent 1px),linear-gradient(90deg,rgba(61,155,255,.45) 1px,transparent 1px);background-size:44px 44px;animation:floorrun 2.4s linear infinite}
@keyframes floorrun{to{background-position:0 44px}}
.floor b{position:absolute;left:50%;bottom:-40px;width:520px;height:160px;margin-left:-260px;border-radius:50%;background:radial-gradient(ellipse,rgba(92,200,255,.35),transparent 70%);animation:pulseb 3s ease-in-out infinite}
@keyframes pulseb{50%{opacity:.4;transform:scale(.9)}}
.spark{position:fixed;bottom:0;width:2px;height:2px;border-radius:50%;background:#bfe9ff;box-shadow:0 0 8px #5cc8ff;z-index:0;animation:sparkup 6s linear infinite;pointer-events:none}
@keyframes sparkup{0%{transform:translateY(0);opacity:0}15%{opacity:1}100%{transform:translateY(-70vh);opacity:0}}
.shell{position:relative;z-index:1}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.kpi{position:relative;overflow:hidden;border:1px solid #1f3a73;border-radius:16px;padding:12px 10px;background:linear-gradient(160deg,rgba(13,35,80,.7),rgba(6,12,28,.6));text-align:center}
.kpi:before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(127,212,255,.18) 50%,transparent 70%);transform:translateX(-100%);animation:kshine 4s ease-in-out infinite}
.kpi:nth-child(2):before{animation-delay:1.3s}.kpi:nth-child(3):before{animation-delay:2.6s}
@keyframes kshine{60%,100%{transform:translateX(100%)}}
.kpi .k{font-family:Orbitron,sans-serif;font-size:8px;letter-spacing:2px;color:#7fa6d9}
.kpi .v{font-family:Orbitron,sans-serif;font-size:22px;font-weight:700;margin-top:6px;color:#ecf8ff;text-shadow:0 0 14px rgba(92,200,255,.7)}
.kpi .d{font-size:11px;margin-top:4px;color:var(--ok)}
.kpi svg{display:block;margin:6px auto 0}
.live{display:flex;align-items:center;gap:8px;font-family:Orbitron,sans-serif;font-size:9px;letter-spacing:3px;color:var(--cyan)}
.live:before{content:"";width:7px;height:7px;border-radius:50%;background:#ff4d6a;box-shadow:0 0 10px #ff4d6a;animation:pulseb 1.2s infinite}

.ask{position:relative;border:1px solid #ff4d6a;border-radius:18px;padding:12px 14px;background:linear-gradient(160deg,rgba(80,10,25,.75),rgba(20,6,14,.7));box-shadow:0 0 24px rgba(255,77,106,.35),inset 0 0 18px rgba(255,77,106,.15);animation:askglow 1.8s ease-in-out infinite}
@keyframes askglow{50%{box-shadow:0 0 38px rgba(255,77,106,.6),inset 0 0 24px rgba(255,77,106,.25)}}
.askhead{display:flex;align-items:center;gap:8px;font-family:Orbitron,sans-serif;font-size:8.5px;letter-spacing:1.6px;color:#ff8a9a}
.askhead span:nth-child(2){flex:1}
.askdot{width:8px;height:8px;border-radius:50%;background:#ff4d6a;box-shadow:0 0 10px #ff4d6a;animation:pulseb 1s infinite}
.spk{border:1px solid #ff8a9a;background:transparent;border-radius:999px;width:34px;height:34px;font-size:15px}
.askq{margin:8px 0 10px;font-size:14px;line-height:1.4;color:#ffe3e8}
.askbtns{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.askbtns button{min-height:44px;border-radius:12px;font-weight:600;font-size:14px;color:#fff;border:1px solid}
.okb{background:rgba(31,180,120,.25);border-color:#2fd58f!important}
.nob{background:rgba(255,77,106,.18);border-color:#ff4d6a!important}
.hexes{position:fixed;inset:0;pointer-events:none;z-index:0;background-image:radial-gradient(circle,rgba(92,200,255,.18) 1px,transparent 1.5px);background-size:22px 22px;-webkit-mask-image:radial-gradient(ellipse at 50% 30%,transparent 30%,#000 75%);mask-image:radial-gradient(ellipse at 50% 30%,transparent 30%,#000 75%);animation:hexdrift 20s linear infinite}
@keyframes hexdrift{to{background-position:22px 220px}}
.scanline{position:fixed;left:0;right:0;height:120px;top:-120px;pointer-events:none;z-index:0;background:linear-gradient(180deg,transparent,rgba(92,200,255,.08),transparent);animation:scanv 6s linear infinite}
@keyframes scanv{to{top:110%}}
/* cadrage : tout l'accueil tient dans un écran d'iPhone */
.scene{transform:scale(.74);transform-origin:50% 0;margin-bottom:-99px}
.shell .stack{gap:10px}
.ask{padding:9px 12px}.askq{margin:5px 0 8px;font-size:13px}.askbtns button{min-height:38px}.spk{width:30px;height:30px;font-size:13px}
.kpi{padding:8px 6px}.kpi .v{font-size:19px;margin-top:3px}.kpi svg{margin-top:3px}
.card[data-act=biz]{min-height:66px!important}
h1.orb-font{font-size:19px!important}

.ask{border-color:#ffa53d;background:linear-gradient(160deg,rgba(80,45,5,.75),rgba(24,14,4,.7));box-shadow:0 0 24px rgba(255,165,61,.35),inset 0 0 18px rgba(255,165,61,.15);animation:askglowo 1.8s ease-in-out infinite}
@keyframes askglowo{50%{box-shadow:0 0 38px rgba(255,165,61,.6),inset 0 0 24px rgba(255,165,61,.25)}}
.askhead{color:#ffc27a}.askdot{background:#ffa53d;box-shadow:0 0 10px #ffa53d}.spk{border-color:#ffc27a}.askq{color:#fff1de}
/* bandeau ROUGE = vrai problème urgent */
.ask.red{border-color:#ff4d6a;background:linear-gradient(160deg,rgba(80,10,25,.8),rgba(20,6,14,.75));box-shadow:0 0 24px rgba(255,77,106,.45),inset 0 0 18px rgba(255,77,106,.2);animation:askglow 1.4s ease-in-out infinite}
.ask.red .askhead{color:#ff8a9a}.ask.red .askdot{background:#ff4d6a;box-shadow:0 0 10px #ff4d6a}.ask.red .askq{color:#ffe3e8}
.done{display:flex;align-items:center;gap:10px;border:1px solid #2fd58f;border-radius:14px;padding:9px 12px;font-size:13px;color:#dcffef;background:linear-gradient(160deg,rgba(8,60,40,.6),rgba(4,20,14,.6));box-shadow:0 0 16px rgba(47,213,143,.25)}
.ddot{width:8px;height:8px;border-radius:50%;background:#2fd58f;box-shadow:0 0 10px #2fd58f}
.chev{font-size:20px;color:#2fd58f}

.feed{display:flex;align-items:flex-start;justify-content:center;gap:8px;margin:8px auto 0;max-width:340px;height:36px;overflow:hidden;font-size:13px;color:#bfe9ff;cursor:pointer}
.fdot{flex:none;width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px var(--cyan);animation:pulseb 1.2s infinite}
.type{white-space:normal;line-height:1.35;border-right:2px solid var(--cyan);animation:caret .8s step-end infinite}
@keyframes caret{50%{border-color:transparent}}
.fx{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.ringbg{position:absolute;left:50%;top:62%;border-radius:50%;border:1px solid rgba(61,155,255,.18)}
.r1{width:700px;height:700px;margin:-350px 0 0 -350px;border-style:dashed;animation:jspin 60s linear infinite}
.r2{width:980px;height:980px;margin:-490px 0 0 -490px;border-top-color:rgba(127,212,255,.5);animation:jspinr 40s linear infinite}
.r3{width:520px;height:520px;margin:-260px 0 0 -260px;border-left-color:rgba(127,212,255,.45);border-right-color:rgba(127,212,255,.45);animation:jspin 25s linear infinite}
.rain{position:absolute;top:-30%;font:9px/1.5 ui-monospace,monospace;color:rgba(92,200,255,.35);text-shadow:0 0 6px rgba(92,200,255,.5);animation:rainfall linear infinite}
@keyframes rainfall{to{top:110%}}
.vu{flex:none;border:1px solid #2fd58f;background:rgba(47,213,143,.15);color:#dcffef;border-radius:999px;padding:6px 12px;font-weight:600;font-size:12px}
.voice{position:absolute;left:0;right:0;bottom:calc(var(--sab) + 10px);height:90px}
.voice svg{position:absolute;left:0;right:0;top:0;width:100%;height:64px;overflow:visible;-webkit-mask-image:linear-gradient(90deg,transparent,#000 20%,#000 80%,transparent);mask-image:linear-gradient(90deg,transparent,#000 20%,#000 80%);transition:transform .4s}
.voice path{fill:none;stroke:url(#vg);stroke-linecap:round;filter:drop-shadow(0 0 6px #5cc8ff)}
.voice .w0{stroke-width:2.2;animation:wmove 3.2s linear infinite,wamp 2.4s ease-in-out infinite}
.voice .w1{stroke-width:1.6;opacity:.8;animation:wmove 2.1s linear infinite reverse,wamp 1.7s ease-in-out infinite}
.voice .w2{stroke-width:1.2;opacity:.6;animation:wmove 1.5s linear infinite,wamp 1.3s ease-in-out infinite .4s}
.voice .w3{stroke-width:1;opacity:.45;animation:wmove 4.5s linear infinite reverse,wamp 3s ease-in-out infinite .8s}
.voice path{transform-box:view-box;transform-origin:50% 50%}
@keyframes wmove{from{translate:0 0}to{translate:-220px 0}}
@keyframes wamp{0%,100%{scale:1 .35}50%{scale:1 1}}
.vglow{position:absolute;left:50%;top:12px;width:260px;height:44px;margin-left:-130px;border-radius:50%;background:radial-gradient(ellipse,rgba(127,212,255,.45),rgba(180,124,255,.15) 50%,transparent 72%);filter:blur(6px);animation:pulseb 2.4s ease-in-out infinite}
.vlabel{position:absolute;left:0;right:0;bottom:2px;text-align:center;font-family:Orbitron,sans-serif;font-size:8px;letter-spacing:4px;color:rgba(191,233,255,.7)}
.speaking .voice svg{transform:scaleY(1.9);transition:transform .3s}
.speaking .voice .vglow{opacity:1;transform:scale(1.25)}
.speaking .core{filter:brightness(1.5) drop-shadow(0 0 24px #5cc8ff)}
@media (prefers-reduced-motion:reduce){
  .floor i,.spark,.rain,.ringbg,.scanline,.hexes,.kpi:before,.voice path,.vglow,.ask,.done,.live:before{animation:none!important}
  .scene{transform:none;margin-bottom:0}
}

/* Écran court (iPhone SE et similaires) : on compacte au lieu de rapetisser l'orbe */
.home.compact main{gap:8px;padding-bottom:calc(var(--sab) + 40px)}
.home.compact .liveSum{display:none}
.home.compact .ask{padding:7px 10px}
.home.compact .askq{font-size:12px;margin:4px 0 6px}
.home.compact .askbtns button{min-height:34px;font-size:13px}
.home.compact .kpi{padding:6px 5px}
.home.compact .kpi .v{font-size:17px}
.home.compact .feed{font-size:12px;height:34px;margin-top:4px}
.home.compact .card[data-act=biz]{min-height:58px!important}
.home.compact .live{font-size:8px}

/* Ajustements de cadrage (mesurés en 390x844 et 375x667) */
.home main{gap:8px;padding-bottom:calc(var(--sab) + 40px)}
.home .feed{height:38px;margin-top:6px}
.home .ask{padding:8px 12px}
.home .askq{margin:4px 0 6px;font-size:13px}
.home .kpi{padding:7px 6px}
.home .card[data-act=biz]{min-height:60px!important}

/* Bandeau : compteur 1/2 + flèches + glissement */
.asknav{display:flex;align-items:center;gap:2px;margin-left:auto}
.askcnt{font-family:Orbitron,sans-serif;font-size:10px;letter-spacing:1px;color:#ffc27a;padding:0 2px;min-width:22px;text-align:center}
.arw{width:30px;height:30px;border-radius:999px;border:1px solid #ffc27a;background:transparent;color:#ffc27a;font-size:15px;line-height:1;display:grid;place-items:center;padding:0}
.arw:active{background:rgba(255,165,61,.25)}
.askswipe{margin-top:3px;text-align:center;font-size:9px;color:rgba(255,194,122,.65);letter-spacing:.4px}
.askq{min-height:38px}
.home.compact .askq{min-height:32px}

/* Petits écrans : on récupère les derniers pixels sans rapetisser l'orbe sous 50 % */
.home.compact .askq{min-height:28px}
.home.compact .askswipe{display:none}
.home.compact .feed{height:30px}
.home.compact .arw{width:26px;height:26px;font-size:14px}
.home.compact .askq{min-height:24px}

/* Cloche de notifications */
.liverow{display:flex;align-items:center;justify-content:space-between;gap:8px}
.bell{position:relative;border:1px solid #1f3566;background:rgba(9,20,45,.7);color:var(--cyan);border-radius:999px;width:34px;height:26px;font-size:12px;line-height:1;display:grid;place-items:center;padding:0}
.belln{position:absolute;top:-6px;right:-6px;min-width:16px;height:16px;border-radius:999px;background:#ffa53d;color:#241000;font-family:Orbitron,sans-serif;font-size:9px;font-weight:700;display:grid;place-items:center;padding:0 3px;box-shadow:0 0 8px rgba(255,165,61,.8)}

/* ---- Retour toujours accessible : barre du haut collée ---- */
.shell:not(.home){padding-top:0}
.top{position:sticky;top:0;z-index:30;padding:calc(var(--sat,0px) + 8px) 0 8px;background:linear-gradient(180deg,rgba(4,6,13,.98) 72%,rgba(4,6,13,.72));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.top .iconbtn{background:rgba(13,35,80,.7);border:1px solid #24406e}

/* ---- Cloche bien visible ---- */
.bell{width:auto;height:26px;padding:0 10px;gap:6px;display:inline-flex;align-items:center;font-size:11px;letter-spacing:.3px;color:var(--cyan)}
.bell .belln{position:static;margin-left:4px}

/* ---- Croix pour retirer une demande ---- */
.askx{flex:none;width:26px;height:26px;border-radius:999px;border:1px solid rgba(255,194,122,.45);background:transparent;color:#ffc27a;font-size:12px;line-height:1;display:grid;place-items:center;padding:0;margin-left:6px}
.askx:active{background:rgba(255,165,61,.2)}
.name .askx{display:inline-grid;vertical-align:middle;margin-left:8px;width:22px;height:22px;border-color:#2f5aa8;color:#9fb4d6}
.askd{display:block;margin-top:6px;font-size:12px;line-height:1.35;color:rgba(255,241,222,.72)}
.askx{width:30px;height:30px;font-size:13px}
.asknav{gap:6px}
.done.flash{padding:14px;font-size:14px;animation:jfade .25s ease-out both}
.done.flash{min-height:88px;align-items:center}
.home.compact .done.flash{min-height:78px}

/* 4 cases dans EN DIRECT (Google / Abonnés / Clics / Commission) */
.kpis{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.kpi{padding:8px 4px}
.kpi .k{font-size:7px;letter-spacing:1.1px}
.kpi .v{font-size:15px;margin-top:4px}
.kpi .d{font-size:10px;line-height:1.2}
.kpi-com .v{color:#ffd9a0;text-shadow:0 0 12px rgba(255,180,80,.7)}
.home.compact .kpi{padding:6px 3px}
.home.compact .kpi .v{font-size:13px}
.home.compact .kpi .k{font-size:6.5px;letter-spacing:.8px}
/* Commission : en vert */
.kpi-com .v{color:#3ddc97;text-shadow:0 0 12px rgba(61,220,151,.75)}
.kpi-com .d{color:#8ff0c8}
.kpi-com{border-color:rgba(47,213,143,.45)}
.kpi-com .k{color:#7fe0b8}
/* Bandeau vert de J.A.R.V.I.S : compact pour ne pas casser le cadrage */
.home .done{padding:7px 10px;font-size:12px;line-height:1.35;gap:8px}
.home .done .vu{padding:4px 9px;font-size:11px}
.home.compact .done{padding:5px 8px;font-size:11px}
.home.compact .liveSum{max-height:27px;overflow:hidden}

/* ===== Lot D — tableau de bord business (maquette validée) ===== */
.bhero{position:relative;overflow:hidden;border-radius:18px;padding:14px;border:1px solid #2f5aa8}
.bscan{position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(127,212,255,.16),transparent);transform:translateX(-100%);animation:kshine 3.5s ease-in-out infinite}
.bh1{display:flex;justify-content:space-between;align-items:center;gap:8px}
.bsum{margin-top:10px;font-size:14px;line-height:1.5;color:#dbe9ff}
.bsum b{color:#fff}
.hint{margin:-6px 0 0;text-align:center;font-size:11px}
.tline{position:relative;display:flex;justify-content:space-between;padding:6px 2px 0}
.tbar{position:absolute;left:10px;right:10px;top:13px;height:2px;background:#1f3566}
.tfill{position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,#2fd58f,#5cc8ff);box-shadow:0 0 10px #5cc8ff;animation:tfill 1.6s ease-out .5s forwards}
@keyframes tfill{to{width:var(--fill,56%)}}
.tstep{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;flex:1;min-width:0;opacity:0;animation:fadeup .5s ease-out forwards}
@keyframes fadeup{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.tdot{width:12px;height:12px;border-radius:50%;border:2px solid #4a6aa8;background:#04060d}
.tstep.ok .tdot{background:#2fd58f;border-color:#2fd58f;box-shadow:0 0 8px #2fd58f}
.tstep.now .tdot{background:#5cc8ff;border-color:#bfe9ff;box-shadow:0 0 12px #5cc8ff;animation:pulseb 1s infinite}
.th{font-size:10px;color:#bfe9ff;font-family:Orbitron,sans-serif}
.tt{font-size:9.5px;color:#8fa6c9;text-align:center;line-height:1.2}
.tstep.now .tt{color:#fff}
.agrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.atile{display:flex;flex-direction:column;align-items:center;text-align:center;gap:3px;padding:12px 6px 10px;border-radius:16px;border:1px solid #1f3a73;background:linear-gradient(160deg,rgba(13,35,80,.6),rgba(6,12,28,.6));opacity:0;animation:fadeup .5s ease-out forwards}
.aring{position:relative;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;margin-bottom:4px}
.aring:before{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--c);border-top-color:transparent;opacity:.9}
.atile.work .aring:before{animation:jspin 1.6s linear infinite;box-shadow:0 0 12px var(--c)}
.atile.fin .aring:before{border-top-color:var(--c)}
.aava{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-family:Orbitron,sans-serif;font-size:11px;font-weight:700;color:#ecf8ff;background:radial-gradient(circle,rgba(61,155,255,.35),rgba(4,6,13,.9))}
.aname{font-size:12.5px;font-weight:600;color:#ecf8ff}
.ast{font-family:Orbitron,sans-serif;font-size:7.5px;letter-spacing:1.5px;color:var(--c)}
.atxt{font-size:10.5px;line-height:1.3;color:#9fb4d6}
.gauge{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:18px;border:1px solid #1f3a73}
.garc{animation:garc 1.4s ease-out}
@keyframes garc{from{stroke-dasharray:0 300}}
.qx{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;border:1px solid #1f3a73;background:rgba(9,20,45,.6);text-align:left;color:inherit;width:100%}
.qi{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;border:1px solid #2f5aa8;color:var(--cyan);background:rgba(13,35,80,.6);flex:none}

/* Tirer vers le bas pour actualiser */
#pull{position:fixed;left:50%;top:0;transform:translateY(-60px);margin-left:-110px;width:220px;text-align:center;font-family:Orbitron,sans-serif;font-size:9.5px;letter-spacing:1.6px;color:#bfe9ff;background:rgba(9,20,45,.92);border:1px solid #2f5aa8;border-radius:0 0 14px 14px;padding:8px 10px;opacity:0;transition:transform .18s ease,opacity .18s ease;z-index:60;pointer-events:none}

/* ===== Mode voix (parler à J.A.R.V.I.S sans passer par le chat) ===== */
.vm{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 40%,#08122b 0%,#04060d 65%);z-index:40}
.vmclose{position:absolute;top:calc(env(safe-area-inset-top) + 14px);right:14px;width:38px;height:38px;font-size:16px;z-index:2}
.vmwrap{display:flex;flex-direction:column;align-items:center;gap:14px;padding:0 22px;width:100%;max-width:420px}
.vmorb{position:relative;width:190px;height:190px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(92,200,255,.35);background:radial-gradient(circle,rgba(61,155,255,.18) 0%,rgba(4,6,13,0) 70%);animation:vbreath 3.4s ease-in-out infinite}
.vmorb:before{content:"";position:absolute;inset:-10px;border-radius:50%;border:2px dashed rgba(92,200,255,.45);animation:jspin 24s linear infinite}
.vmorb:after{content:"";position:absolute;inset:16px;border-radius:50%;border:1px solid rgba(180,124,255,.35);animation:jspinr 16s linear infinite}
.vmcore{width:96px;height:96px;border-radius:50%;background:radial-gradient(circle,#ecf8ff 0%,rgba(92,200,255,.75) 40%,rgba(61,155,255,0) 72%);filter:blur(.4px);box-shadow:0 0 44px rgba(92,200,255,.75)}
.vmorb.listen{animation:vpulse 1.1s ease-in-out infinite;border-color:rgba(92,200,255,.9)}
.vmorb.think:before{animation-duration:2.4s}
.vmorb.speak{border-color:rgba(47,213,143,.8)}
.vmorb.speak .vmcore{background:radial-gradient(circle,#dcffef 0%,rgba(47,213,143,.7) 45%,rgba(47,213,143,0) 72%);box-shadow:0 0 48px rgba(47,213,143,.7)}
@keyframes vbreath{50%{transform:scale(1.04)}}
@keyframes vpulse{50%{transform:scale(1.1);box-shadow:0 0 60px rgba(92,200,255,.5)}}
.vmlabel{font-family:Orbitron,sans-serif;font-size:10px;letter-spacing:3px;color:#bfe9ff;text-align:center}
.vmtext{min-height:96px;text-align:center}
.vmme{font-size:14px;color:#8fa6c9;font-style:italic;margin-bottom:8px}
.vmrep{font-size:15px;line-height:1.5;color:#eaf6ff}
.vmhint{font-size:12.5px;color:#7f93b3;line-height:1.6}
.vmic{width:84px;height:84px;border-radius:50%;font-size:30px;border:2px solid var(--cyan);background:radial-gradient(circle,rgba(13,35,80,.9),rgba(4,10,24,.9));color:#fff;box-shadow:0 0 26px rgba(92,200,255,.45)}
.vmic.listen{border-color:#ffa53d;box-shadow:0 0 34px rgba(255,165,61,.6);animation:vpulse 1s ease-in-out infinite}
.vmlink{border:none;background:none;color:#7fa6d9;font-size:12.5px;text-decoration:underline;padding:6px}
.vmic{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;line-height:1}
.vmiconlbl{font-family:Orbitron,sans-serif;font-size:7.5px;letter-spacing:2px;color:#fff;opacity:.9}

/* ========== MODE VOIX : habillage After Effects ========== */
.vm{overflow:hidden}
.vfx{position:absolute;inset:0;pointer-events:none;z-index:0}
.vgrid{position:absolute;inset:-10%;background-image:radial-gradient(circle,rgba(92,200,255,.16) 1px,transparent 1.6px);background-size:26px 26px;-webkit-mask-image:radial-gradient(ellipse at 50% 42%,transparent 18%,#000 72%);mask-image:radial-gradient(ellipse at 50% 42%,transparent 18%,#000 72%);animation:vgriddrift 26s linear infinite}
@keyframes vgriddrift{to{background-position:26px 340px}}
.vscan{position:absolute;left:0;right:0;height:150px;top:-150px;background:linear-gradient(180deg,transparent,rgba(92,200,255,.10),transparent);animation:vscanrun 5.5s linear infinite}
@keyframes vscanrun{to{top:110%}}
.vripple{position:absolute;left:50%;top:44%;width:230px;height:230px;margin:-115px 0 0 -115px;border-radius:50%;border:1px solid rgba(92,200,255,.5);animation:vrip 3.4s ease-out infinite}
.vripple.d1{animation-delay:1.1s}.vripple.d2{animation-delay:2.2s}
@keyframes vrip{0%{transform:scale(.55);opacity:.85}70%{opacity:.12}100%{transform:scale(1.9);opacity:0}}
.vparts span{position:absolute;bottom:-10px;width:2px;height:2px;border-radius:50%;background:#bfe9ff;box-shadow:0 0 8px #5cc8ff;animation:vpartup linear infinite}
@keyframes vpartup{0%{transform:translateY(0);opacity:0}15%{opacity:1}100%{transform:translateY(-92vh);opacity:0}}
.vbeam{position:absolute;left:50%;top:44%;width:2px;height:0;margin-left:-1px;background:linear-gradient(180deg,rgba(92,200,255,.85),transparent);transform-origin:top center;animation:vbeam 4s ease-in-out infinite}
.vbeam.d1{transform:rotate(180deg);animation-delay:2s}
@keyframes vbeam{0%,100%{height:0;opacity:0}40%{height:120px;opacity:.8}70%{height:70px;opacity:.25}}
.vtop{position:absolute;top:calc(env(safe-area-inset-top) + 16px);left:18px;right:60px;display:flex;align-items:center;gap:10px;font-size:9px;letter-spacing:3px;color:#7fa6d9;z-index:2}
.vtop .vorbfont{font-family:Orbitron,sans-serif;color:#bfe9ff}
.vstat{margin-left:auto;display:flex;align-items:center;gap:6px;font-family:Orbitron,sans-serif;font-size:8px;color:#5ce0a8}
.vdot{width:6px;height:6px;border-radius:50%;background:#2fd58f;box-shadow:0 0 10px #2fd58f;animation:vbreath 1.6s ease-in-out infinite}
.vorbwrap{position:relative;width:250px;height:250px;display:grid;place-items:center;animation:vin .8s cubic-bezier(.2,.8,.2,1) both}
@keyframes vin{from{opacity:0;transform:scale(.82)}to{opacity:1;transform:none}}
.vtick{position:absolute;inset:0;border-radius:50%;background:repeating-conic-gradient(rgba(92,200,255,.55) 0deg .8deg,transparent .8deg 6deg);-webkit-mask-image:radial-gradient(circle,transparent 62%,#000 63%,#000 66%,transparent 67%);mask-image:radial-gradient(circle,transparent 62%,#000 63%,#000 66%,transparent 67%);animation:jspin 34s linear infinite}
.vtick.t2{inset:16px;background:repeating-conic-gradient(rgba(180,124,255,.5) 0deg 1.4deg,transparent 1.4deg 14deg);animation:jspinr 22s linear infinite}
.vtick.t3{inset:34px;background:none;border:1px dashed rgba(92,200,255,.28);animation:jspin 46s linear infinite}
.vbars{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}
.vbars i{position:absolute;width:2px;height:var(--h);border-radius:2px;background:linear-gradient(180deg,#ecf8ff,rgba(92,200,255,.15));transform:rotate(var(--r)) translateY(-92px);transform-origin:center;animation:vbarp 1.1s ease-in-out infinite alternate;opacity:.75}
@keyframes vbarp{from{transform:rotate(var(--r)) translateY(-92px) scaleY(.45)}to{transform:rotate(var(--r)) translateY(-92px) scaleY(1.5)}}
.vm-listen .vbars i{background:linear-gradient(180deg,#fff3e0,rgba(255,165,61,.2));animation-duration:.48s;opacity:.95}
.vm-think .vbars i{background:linear-gradient(180deg,#e8dcff,rgba(180,124,255,.2));animation-duration:1.7s}
.vm-speak .vbars i{background:linear-gradient(180deg,#dcffef,rgba(47,213,143,.2));animation-duration:.62s}
.vm-listen .vripple{border-color:rgba(255,165,61,.55);animation-duration:1.5s}
.vm-speak .vripple{border-color:rgba(47,213,143,.55);animation-duration:2s}
.vglare{position:absolute;left:14%;top:10%;width:46%;height:30%;border-radius:50%;background:radial-gradient(ellipse,rgba(236,248,255,.75),transparent 70%);filter:blur(6px);opacity:.7;animation:vbreath 3.2s ease-in-out infinite}
.vmlabel{display:flex;flex-direction:column;align-items:center;gap:6px}
.vdots{display:flex;gap:4px;opacity:0;transition:opacity .3s}
.vm-listen .vdots,.vm-think .vdots{opacity:1}
.vdots i{width:5px;height:5px;border-radius:50%;background:var(--cyan);animation:vdotjump .9s ease-in-out infinite}
.vdots i:nth-child(2){animation-delay:.15s}.vdots i:nth-child(3){animation-delay:.3s}
@keyframes vdotjump{50%{transform:translateY(-6px);opacity:.5}}
.vmic{transition:transform .18s ease,box-shadow .3s ease}
.vmic:active{transform:scale(.94)}
.vmic.listen{border-color:#ffa53d;box-shadow:0 0 40px rgba(255,165,61,.65);animation:vmicbeat 1.1s ease-in-out infinite}
@keyframes vmicbeat{50%{transform:scale(1.06)}}
.vhud{position:absolute;bottom:calc(env(safe-area-inset-bottom) + 14px);display:flex;align-items:center;gap:8px;font-family:Orbitron,sans-serif;font-size:7.5px;letter-spacing:2px;color:#5f7ba6}
.vhud.bl{left:16px}.vhud.br{right:16px}
.vhud .ln{width:26px;height:1px;background:linear-gradient(90deg,transparent,#2f5aa8)}
.vhud.br .ln{background:linear-gradient(90deg,#2f5aa8,transparent)}
.vmme,.vmrep,.vmhint{animation:vfade .5s ease-out both}
@keyframes vfade{from{opacity:0;transform:translateY(8px);filter:blur(3px)}to{opacity:1;transform:none;filter:none}}
@media (prefers-reduced-motion: reduce){
  .vtick,.vbars i,.vripple,.vbeam,.vscan,.vgrid,.vparts span,.vglare,.vmorb,.vmorb:before,.vmorb:after,.vdot,.vdots i,.vmic.listen,.vdot:before{animation:none!important}
}
/* profondeur + callouts techniques */
.vm:after{content:"";position:absolute;inset:0;pointer-events:none;z-index:3;background:radial-gradient(ellipse at 50% 45%,transparent 45%,rgba(0,0,0,.55) 100%)}
.vm:before{content:"";position:absolute;inset:0;pointer-events:none;z-index:3;opacity:.05;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/></filter><rect width='120' height='120' filter='url(%23n)'/></svg>");mix-blend-mode:overlay;animation:vgrain 1.2s steps(3) infinite}
@keyframes vgrain{0%{transform:translate(0,0)}33%{transform:translate(-1px,1px)}66%{transform:translate(1px,-1px)}100%{transform:translate(0,0)}}
.vcall{position:absolute;font-family:Orbitron,sans-serif;font-size:6.5px;letter-spacing:1.6px;color:rgba(191,233,255,.55);white-space:nowrap;animation:vfade .9s ease-out both}
.vcall.c1{left:-6px;top:26px}.vcall.c2{right:-10px;top:64px}.vcall.c3{left:-2px;bottom:58px}.vcall.c4{right:0;bottom:22px}
.vbars i{animation-name:vbarp,vbarshim;animation-duration:1.1s,3.4s;animation-timing-function:ease-in-out,linear;animation-iteration-count:infinite,infinite;animation-direction:alternate,normal}
@keyframes vbarshim{50%{opacity:.35}}
.vm-listen .vbars i{animation-name:vbarp,vbarshim;animation-duration:.48s,1.2s}
.vm-speak .vbars i{animation-duration:.62s,1.6s}
.vm-speak .vmcore{animation:vspeakcore .5s ease-in-out infinite alternate}
@keyframes vspeakcore{from{transform:scale(1)}to{transform:scale(1.13)}}
.vmlabel .vtxt{animation:vflick 6s linear infinite}
@keyframes vflick{0%,96%,100%{opacity:1}97%{opacity:.55}98%{opacity:1}99%{opacity:.7}}
@media (prefers-reduced-motion: reduce){.vm:before,.vcall{animation:none!important}}
.vcall.c1{left:-16px;top:18px}.vcall.c2{right:-22px;top:58px}.vcall.c3{left:-12px;bottom:52px}.vcall.c4{right:-4px;bottom:14px}
.vcall{font-size:7px;color:rgba(191,233,255,.62)}
.vm-listen .vmhint,.vm-think .vmhint,.vm-speak .vmhint{display:none}
.vm-listen .vstat{color:#ffc27a}.vm-listen .vdot{background:#ffa53d;box-shadow:0 0 10px #ffa53d}
.vm-speak .vstat{color:#8ff0c8}.vm-speak .vdot{background:#2fd58f;box-shadow:0 0 10px #2fd58f}
/* --- allègement GPU (chauffe iPhone) --- */
.vm:before{animation:none}                 /* grain statique, plus de rafraîchissement */
.vglare{filter:none;opacity:.45}
.vscan{animation-duration:9s}
body.asleep *,body.asleep *:before,body.asleep *:after{animation-play-state:paused!important}
.vreplay{border:1px solid var(--cyan);background:rgba(13,35,80,.7);color:#dff2ff;border-radius:999px;padding:8px 16px;font-size:13px;font-weight:600}
.vreplay:active{transform:scale(.96)}
.vmreplayhint{display:block;margin-top:8px;font-size:10px;letter-spacing:1.4px;color:#5f7ba6;font-family:Orbitron,sans-serif}
.tokline{display:flex;align-items:center;justify-content:center;gap:6px;font-size:10.5px;color:#9fb4d6;margin-top:-4px}
.toki{font-size:10px;filter:drop-shadow(0 0 6px rgba(255,200,80,.8))}

/* ===== MODE LÉGER (économie CPU / chauffe iPhone) ===== */
html.anim-light .hexes,html.anim-light .fx,html.anim-light .scanline,
html.anim-light .floor,html.anim-light .spark,html.anim-light .ringbg,
html.anim-light .vparts,html.anim-light .vbeam{display:none!important}
/* (règle globale retirée : elle tuait aussi les animations d'ouverture) */
html.anim-light .voice path:nth-of-type(n+2){animation:none!important;opacity:.35}
html.anim-light .kpi:before,html.anim-light .bscan,html.anim-light .vglow{display:none!important}
html.anim-light .voice path,html.anim-light .vmcore,html.anim-light .vmorb,
html.anim-light .vmorb:before,html.anim-light .vmorb:after,html.anim-light .vtick{filter:none!important;box-shadow:none!important}
html.anim-light .km,.anim-light .voice path{filter:none!important}
/* pause : appli en arrière-plan ou 20 s sans toucher */
html.idle *,html.idle *:before,html.idle *:after,
body.asleep *,body.asleep *:before,body.asleep *:after{animation-play-state:paused!important}
/* « Réduire les animations » de l'iPhone ne coupe plus l'ouverture : on garde l'effet voulu */
@media (prefers-reduced-motion: reduce){
  .rain,.hexes,.scanline,.floor,.spark,.ringbg,.vparts,.vbeam{display:none!important}
}

/* ===== Page business (maquette validée) ===== */
.day{border-radius:4px;padding:12px;border:1px solid #1f3a73;clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px);background:linear-gradient(160deg,rgba(14,36,82,.72),rgba(5,10,24,.78))}
.dbar{position:relative;height:4px;border-radius:3px;background:repeating-linear-gradient(90deg,#1b3366 0 6px,transparent 6px 9px);margin:18px 6px 0}
.dpast{position:absolute;left:0;top:0;bottom:0;border-radius:3px;background:linear-gradient(90deg,#2fd58f,#5cc8ff)}
.pdot{position:absolute;top:50%;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:#04060d;border:2px solid var(--c)}
.pdot.ok,.pdot.ko{background:var(--c)}
.dnow{position:absolute;top:-16px;bottom:-10px;width:0}
.dnow i{position:absolute;left:-1px;top:10px;bottom:0;width:2px;background:#bfe9ff;box-shadow:0 0 10px #5cc8ff;animation:pulseb 1.2s infinite}
.dnow b{position:absolute;left:50%;top:-6px;transform:translateX(-50%);font:700 9px Orbitron,sans-serif;color:#05101f;background:#bfe9ff;border-radius:6px;padding:2px 5px}
.dticks{display:flex;justify-content:space-between;margin:10px 0 0;font-size:9px;color:#6f87ad;font-family:Orbitron,sans-serif}
.okhero{display:flex;align-items:center;gap:14px;padding:10px 12px;clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px);border-left:2px solid #2fd58f;background:linear-gradient(160deg,rgba(8,50,36,.55),rgba(6,12,28,.6))}
.okring{position:relative;width:52px;height:52px;flex:none}
.okring b{position:absolute;inset:0;display:grid;place-items:center;font:700 13px Orbitron,sans-serif;color:#dcffef}
.oktitle{font:700 14px Orbitron,sans-serif;letter-spacing:1px;color:#2fd58f}
.oktxt{margin-top:4px;font-size:12px;line-height:1.4;color:#cfe3f7}
.cnt{display:flex;gap:6px;margin-top:6px}
.cnt .k{font-size:10.5px;padding:3px 7px;border-radius:6px;border:1px solid}
.cnt .k b{font:700 11px Orbitron,sans-serif;margin-right:3px}
.cnt .ok{color:#bfeedd;border-color:rgba(47,213,143,.45);background:rgba(47,213,143,.1)}
.cnt .todo{color:#ffe0b8;border-color:rgba(255,165,61,.45);background:rgba(255,165,61,.1)}
.cnt .ko{color:#ffd0d8;border-color:rgba(255,77,106,.5);background:rgba(255,77,106,.12)}
.dlist{display:flex;flex-direction:column;gap:4px}
.grp{display:flex;justify-content:space-between;align-items:center;margin:8px 0 2px}
.gt{font:700 8.5px Orbitron,sans-serif;letter-spacing:2.5px;color:#7fa6d9}
.gt.ko{color:#ff8a9a}.gt.ok{color:#2fd58f}.gt.todo{color:#ffc27a}
.gmore{font-size:11px;color:#5cc8ff}
.mrow{display:flex;align-items:center;gap:8px;min-height:36px;padding:0 8px;font-size:12.5px;color:#c9d9f2;border-left:2px solid #2f5aa8;background:rgba(13,35,80,.3);clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px)}
.mrow b{color:#fff;font-weight:600}
.mrow .dd{width:7px;height:7px;border-radius:50%;border:2px solid #4a6aa8;flex:none}
.mrow .dh{font:700 10px Orbitron,sans-serif;color:#bfe9ff;width:38px;flex:none}
.mrow.ko{border-left-color:#ff4d6a;background:rgba(255,77,106,.1)}
.mrow.ko .dd{background:#ff4d6a;border-color:#ff4d6a}
.mrow.ok{border-left-color:#2fd58f;background:rgba(47,213,143,.07)}
.mrow.ok .dd{background:#2fd58f;border-color:#2fd58f}
.mrow.soon{border-left-color:#ffa53d;background:rgba(255,165,61,.08)}
.mrow.soon .dd{border-color:#ffa53d}
.act{flex:none;width:28px;height:28px;display:grid;place-items:center;border-radius:50%;border:1px solid #ff8a9a;font-size:13px;color:#fff;background:rgba(255,77,106,.18)}
.act.talk{border-color:#ffc27a;background:rgba(255,165,61,.18)}
.bub{position:relative;margin:2px 0 4px 18px;padding:9px 10px;border:1px solid rgba(255,194,122,.6);background:rgba(40,16,6,.92);border-radius:10px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.bub .bt{flex:1 1 100%;font-size:11.5px;line-height:1.4;color:#ffe6cc}
.prep{font-size:11.5px;line-height:1.4;color:#d9e6f7;padding:8px 9px;border-radius:8px;background:rgba(4,10,24,.75);border:1px dashed rgba(92,200,255,.45);margin-top:6px}
.plab{display:block;margin-bottom:4px;font:700 7.5px Orbitron,sans-serif;letter-spacing:2px;color:#5cc8ff}
.mini{min-height:30px;padding:0 10px;border-radius:7px;font-size:11.5px;font-weight:600;color:#fff;border:1px solid #ffc27a;background:rgba(255,165,61,.22)}
.mini.ghost{background:transparent;border-color:rgba(255,194,122,.45);color:#ffe0b8}
.mini.talk{margin-left:auto}
html.anim-light .pdot,html.anim-light .dnow i{animation:none!important}
.grpbtn{width:100%;background:none;border:none;padding:6px 0;text-align:left;color:inherit}
.garr{font-size:11px;color:#7fa6d9}
.dhours{display:flex;justify-content:space-between;margin:6px 4px 0;height:6px}
.dhours span{width:1px;background:#2a4a8a;height:4px}
.dhours span.big{height:6px;background:#3f6bb0}
.dhours2{position:relative;height:24px;margin:12px 2px 0}
.dhours2 span{position:absolute;transform:translateX(-50%);font:700 7.5px Orbitron,sans-serif;color:#6f87ad;white-space:nowrap}
.dhours2 span.even{top:0}
.dhours2 span.odd{top:11px;color:#5a729a}
.dhours2 span:before{content:"";position:absolute;left:50%;top:-8px;width:1px;height:4px;background:#2a4a8a}
.wgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.wcard{position:relative;padding:9px 10px;clip-path:polygon(9px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 9px);background:linear-gradient(160deg,rgba(14,36,82,.72),rgba(5,10,24,.8));border-left:2px solid #2f5aa8}
.wcard .k{font:700 7px Orbitron,sans-serif;letter-spacing:1.6px;color:#7fa6d9}
.wcard .v{font:700 17px Orbitron,sans-serif;color:#fff;margin-top:3px}
.wcard .s{font-size:10.5px;color:#9fb4d6;margin-top:2px;line-height:1.25}
.wcard .wt{position:absolute;right:6px;top:6px;font:700 6.5px Orbitron,sans-serif;letter-spacing:1px;padding:2px 4px;border-radius:4px;background:rgba(92,200,255,.14);color:#5cc8ff}
.wx{position:absolute;left:-5px;top:-5px;width:20px;height:20px;border-radius:50%;background:#2a3550;color:#fff;border:1px solid #5a6a8a;font-size:11px;z-index:2}
.roomhead{padding:12px;border:1px solid #2f5aa8;border-radius:12px;background:linear-gradient(160deg,rgba(14,36,82,.7),rgba(5,10,24,.8));margin-bottom:10px}
.rtitle{font:700 8.5px Orbitron,sans-serif;letter-spacing:3px;color:#5cc8ff}
.ragents{display:flex;gap:4px;margin:8px 0;flex-wrap:wrap}
.rava{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font:700 9px Orbitron,sans-serif;color:#ecf8ff;background:radial-gradient(circle,rgba(61,155,255,.35),rgba(4,6,13,.9));border:1px solid #2f5aa8}
.rsub{font-size:11.5px;color:#9fb4d6;line-height:1.4}

/* Ouverture animée même en mode léger (une seule fois, puis plus rien : coût nul) */
@keyframes jarvisIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes jarvisZoom{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}
html.anim-light .shell.home>main,html.anim-light .shell>main{animation:jarvisZoom .55s ease-out both!important}
html.anim-light .letter,html.anim-light .in,html.anim-light .tstep,html.anim-light .atile,html.anim-light .c2,html.anim-light .pdot{
  animation-name:jarvisIn!important;animation-duration:.5s!important;animation-timing-function:ease-out!important;
  animation-iteration-count:1!important;animation-fill-mode:both!important
}
html.anim-light .orb div{animation-iteration-count:infinite!important}
/* une fois l'ouverture jouée, on ne la rejoue plus (fini le clignotement) */
body.booted .letter,body.booted .in,body.booted .shell.home>main,body.booted .shell>main{animation:none!important}
/* flash d'ouverture futuriste (une seule fois, 0,9 s) */
body:not(.booted) .shell.home>main:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(circle at 50% 38%,rgba(127,212,255,.35),rgba(61,155,255,.12) 40%,transparent 70%);
  animation:bootflash .9s ease-out both}
@keyframes bootflash{0%{opacity:0;transform:scale(.6)}40%{opacity:1}100%{opacity:0;transform:scale(1.15)}}

/* Le nom J.A.R.V.I.S bien plus lisible en haut */
.logo{font-size:20px!important;letter-spacing:2px!important;min-height:26px!important;line-height:1.1}
.top{gap:8px}
.top .title{font-size:15px!important;opacity:.9}

/* Le nom J.A.R.V.I.S écrit DANS l'orbe de l'accueil : bien plus grand */

/* Lisibilité de l'accueil : le nom et les infos du HUD bien plus grands */
.hud .k{font-size:10px!important;letter-spacing:1.6px!important}
.hud .v{font-size:15px!important;margin-top:1px!important}
.hud{opacity:.95}

/* J.A.R.V.I.S parfaitement centré dans le cercle, quelle que soit sa taille */

/* le nom tient DANS le cercle, et le cercle est agrandi */

/* (bloc retiré : il décalait l'orbe hors écran) */

/* Restauration du cercle (règles perdues) */
.orb{position:relative;width:220px;height:220px;margin:0 auto;border-radius:50%;flex:none}
.orb>div{position:absolute;border-radius:50%}
.orb .core{width:110px;height:110px;left:50%;top:50%;margin:-55px 0 0 -55px;border-radius:50%;
  background:radial-gradient(circle,#ecf8ff 0%,rgba(92,200,255,.7) 35%,rgba(61,155,255,.25) 60%,rgba(61,155,255,0) 72%);
  box-shadow:0 0 60px rgba(92,200,255,.55)}
.orb .glitch{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);text-align:center;
  font-family:Orbitron,sans-serif;font-weight:700;font-size:20px;letter-spacing:4px;color:#ecf8ff;
  text-shadow:0 0 16px rgba(127,212,255,.8)}
.orb{width:250px!important;height:250px!important}
.orb .glitch{font-size:23px!important}

/* Agents en cases carrées (grille 2 colonnes) */
.agrid2{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:8px 0 4px}
.acard{position:relative;aspect-ratio:1/1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:6px;padding:10px 8px;border-radius:16px;cursor:pointer;text-align:center;
  background:linear-gradient(160deg,rgba(20,34,60,.92),rgba(10,18,34,.92));
  border:1px solid rgba(92,200,255,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 6px 18px rgba(0,0,0,.35);
  animation:jarvisIn .45s ease-out both;transition:transform .16s,border-color .16s}
.acard:active{transform:scale(.97);border-color:rgba(92,200,255,.6)}
.acav{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:15px;color:#eaf6ff;
  background:linear-gradient(160deg,rgba(92,200,255,.35),rgba(61,155,255,.12));border:1px solid rgba(92,200,255,.45)}
.acname{font-size:13px;font-weight:700;color:#eaf6ff;line-height:1.15}
.acrole{font-size:10.5px;color:#8fa9c8;line-height:1.2;max-height:2.4em;overflow:hidden}
.acdot{position:absolute;top:9px;right:9px;width:7px;height:7px;border-radius:50%;background:#7f93b3}
.acdot.on{background:#3ddc97;box-shadow:0 0 8px rgba(61,220,151,.8)}