/* La Traversée — V3 émeraude. Charte « The Emerald ». */
:root{
  --ink:#07110C; --ink-2:#0C1812; --panel:#11211A; --panel-2:#17291F;
  --bone:#EFEBDA; --bone-soft:#CFD0BC; --bone-mute:#A9B6A4;
  --emerald:#37D49B; --emerald-deep:#1E9067; --terra:#E59264; --terra-deep:#C76A41;
  --line:rgba(239,235,218,.10); --line-2:rgba(239,235,218,.16);
  --title:"Cinzel",Georgia,serif; --serif:"Spectral",Georgia,serif; --ui:"Space Grotesk",system-ui,sans-serif;
  --ease:cubic-bezier(.16,1,.3,1); --spring:cubic-bezier(.32,.72,0,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:var(--serif);color:var(--bone);background:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
#app{height:100dvh;display:flex;flex-direction:column;position:relative}
.hidden{display:none!important}
.grain{position:fixed;inset:0;z-index:60;pointer-events:none;opacity:.06;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ---------- Seuil ---------- */
.seuil{flex:1;display:flex;align-items:center;justify-content:center;padding:32px 24px;position:relative;overflow:hidden;
  background:
    radial-gradient(115% 88% at 50% -16%,rgba(55,212,155,.12),transparent 52%),
    radial-gradient(90% 70% at 50% 126%,rgba(199,106,65,.10),transparent 56%),
    radial-gradient(135% 125% at 50% 46%,transparent 34%,rgba(0,0,0,.58) 100%),
    #040B07}
.seuil::before{content:"";position:absolute;inset:-25%;z-index:0;pointer-events:none;
  background:radial-gradient(38% 30% at 32% 38%,rgba(55,212,155,.07),transparent 70%),radial-gradient(34% 26% at 70% 62%,rgba(30,144,103,.06),transparent 70%);
  animation:fog 28s ease-in-out infinite alternate}
@keyframes fog{0%{transform:translate(0,0) scale(1)}100%{transform:translate(4%,-3%) scale(1.1)}}
.emblem{position:absolute;top:50%;left:50%;width:min(98vmin,780px);height:min(98vmin,780px);transform:translate(-50%,-54%);z-index:0;pointer-events:none;opacity:0;animation:emblemIn 2.6s var(--ease) .3s forwards;transition:transform .7s var(--ease)}
.emblem .ring-a{animation:spin 170s linear infinite;transform-origin:500px 500px}
.emblem .ring-b{animation:spin 230s linear infinite reverse;transform-origin:500px 500px}
.emblem .ring-c{animation:spin 120s linear infinite;transform-origin:500px 500px}
#emblem-needle{transition:transform .35s var(--ease)}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes emblemIn{to{opacity:.62}}
.seuil-inner{max-width:640px;text-align:center;position:relative;z-index:1;transform:translateY(-3vh)}
.seuil-kicker{font-family:var(--ui);font-size:12.5px;letter-spacing:.42em;text-transform:uppercase;color:var(--terra);margin-bottom:34px;opacity:0;animation:rise .9s var(--ease) .1s forwards}
.seuil-title{font-family:var(--title);font-weight:600;font-size:clamp(46px,9.5vw,92px);line-height:1.02;letter-spacing:.04em;text-transform:uppercase;margin-bottom:12px;color:var(--terra);opacity:0;animation:rise 1.1s var(--ease) .22s forwards}
.seuil-tag{font-family:var(--ui);font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--bone-mute);margin-bottom:28px;opacity:0;animation:rise 1s var(--ease) .3s forwards}
.seuil-lede{font-family:var(--serif);font-size:clamp(22px,3.6vw,30px);font-style:italic;font-weight:400;color:var(--bone);margin-bottom:22px;line-height:1.45;opacity:0;animation:rise 1.1s var(--ease) .36s forwards}
.seuil-sub{font-family:var(--serif);font-weight:400;color:var(--bone-soft);font-size:17px;letter-spacing:.01em;margin-bottom:38px;opacity:0;animation:rise 1.1s var(--ease) .48s forwards}
.seuil-cta-wrap,.consent,#enter-btn,.seuil-note,.seuil-poster{position:relative;z-index:1}
.access-input{display:block;width:220px;max-width:80%;margin:0 auto 20px;text-align:center;font-family:var(--ui);font-size:14px;letter-spacing:.12em;color:var(--bone);background:rgba(17,33,26,.7);border:1px solid var(--line-2);border-radius:999px;padding:12px 18px;opacity:0;animation:rise 1.1s var(--ease) .5s forwards}
.access-input::placeholder{color:var(--bone-mute);letter-spacing:.12em}
.access-input:focus{outline:none;border-color:var(--emerald)}
.consent{display:flex;align-items:flex-start;gap:10px;text-align:left;max-width:460px;margin:0 auto 24px;font-family:var(--ui);font-size:12.5px;color:var(--bone-mute);line-height:1.55;opacity:0;animation:rise 1.1s var(--ease) .56s forwards}
.consent input{margin-top:2px;flex:none;width:16px;height:16px;accent-color:var(--emerald);cursor:pointer}
.consent a{color:var(--emerald)}
.seuil-note{font-family:var(--ui);font-size:12px;color:var(--bone-mute);margin-top:20px;opacity:0;animation:rise 1.1s var(--ease) .7s forwards}
.seuil-voice{display:inline-flex;align-items:center;gap:8px;margin-top:16px;font-family:var(--ui);font-size:12.5px;letter-spacing:.02em;color:var(--emerald);text-decoration:none;border:1px solid var(--line-2);border-radius:999px;padding:9px 16px;opacity:0;animation:rise 1.1s var(--ease) .74s forwards;transition:border-color .3s ease}
.seuil-voice:hover{border-color:var(--emerald);background:rgba(55,212,155,.07)}
.seuil-poster{margin-top:18px;font-family:var(--serif);font-style:italic;font-size:18px;color:var(--emerald);opacity:0;animation:rise 1.1s var(--ease) .84s forwards}
@keyframes rise{from{opacity:0;transform:translateY(24px);filter:blur(8px)}to{opacity:1;transform:none;filter:blur(0)}}

.btn-primary{position:relative;font-family:var(--ui);font-size:15.5px;font-weight:500;letter-spacing:.02em;color:#0A140F;
  background:var(--terra);border:none;border-radius:999px;padding:14px 30px;cursor:pointer;display:inline-flex;align-items:center;gap:12px;
  box-shadow:0 12px 44px rgba(199,106,65,.3),inset 0 1px 0 rgba(255,255,255,.25);
  transition:transform .5s var(--spring),box-shadow .5s var(--spring),background .3s ease;will-change:transform}
.btn-primary:hover{background:var(--terra-deep)}
.btn-primary:active{transform:scale(.97)!important}
.btn-primary:disabled{background:var(--panel-2);color:var(--bone-mute);box-shadow:none;cursor:not-allowed}

/* ---------- Chat ---------- */
.chat{flex:1;display:flex;flex-direction:column;min-height:0;background:var(--ink)}
.chat-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;border-bottom:1px solid var(--line);background:rgba(7,17,12,.7);backdrop-filter:blur(10px);position:relative;z-index:2}
.chat-title-wrap{display:flex;flex-direction:column;gap:3px;min-width:0}
.chat-title{font-family:var(--title);font-size:19px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--terra)}
.save-status{font-family:var(--ui);font-size:10.5px;letter-spacing:.04em;color:var(--bone-mute);display:inline-flex;align-items:center;gap:5px;transition:color .5s var(--ease)}
.save-status::before{content:"✓";color:var(--emerald);font-size:11px;transition:transform .4s var(--spring)}
.save-status.saving{color:var(--emerald)}
.save-status.saving::before{transform:scale(1.3)}
.chat-actions{display:flex;gap:10px}
.btn-ghost{font-family:var(--ui);font-size:12px;color:var(--emerald);background:transparent;border:1px solid var(--line-2);border-radius:999px;padding:8px 16px;cursor:pointer;transition:all .3s var(--ease)}
.btn-ghost:hover{border-color:var(--emerald);background:rgba(55,212,155,.08)}
.btn-ghost:disabled{color:var(--bone-mute);cursor:not-allowed;opacity:.5}
.btn-ghost:disabled:hover{border-color:var(--line-2);background:transparent}
.chat-body{flex:1;display:flex;min-height:0}

/* Colonne serpent (gauche) */
.j-rail{position:relative;width:140px;flex:none;border-right:1px solid var(--line);overflow:hidden}
.j-snake{position:absolute;inset:0;width:100%;height:100%;opacity:.16;color:var(--emerald)}
.j-snake-img{position:absolute;left:50%;top:6%;width:150px;height:auto;transform:translate(-50%,-50%) rotate(-90deg);transform-origin:center center;mix-blend-mode:screen;filter:invert(1) sepia(1) saturate(600%) hue-rotate(98deg) brightness(.98) drop-shadow(0 0 7px rgba(55,212,155,.4));opacity:.8;pointer-events:none;z-index:2;transition:top 1s var(--ease)}
.j-nodes{position:absolute;left:50%;top:6%;bottom:6%;width:1px;transform:translateX(-50%);background:var(--line-2)}
.j-node{position:absolute;left:50%;width:8px;height:8px;border-radius:50%;transform:translate(-50%,-50%);background:var(--panel-2);border:1px solid var(--line-2);transition:all .6s var(--ease)}
.j-node.done{background:var(--emerald);border-color:var(--emerald);box-shadow:0 0 10px rgba(55,212,155,.7)}
.j-head{position:absolute;left:50%;top:6%;width:80px;height:100px;margin-left:-40px;margin-top:-50px;color:var(--emerald);filter:drop-shadow(0 0 12px rgba(55,212,155,.8));transition:top 1.3s var(--spring);z-index:2}
.j-head svg{animation:slither 3.4s ease-in-out infinite;transform-origin:50% 45%}
@keyframes slither{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}
.j-molt{position:absolute;left:50%;width:64px;height:64px;margin-left:-32px;margin-top:-32px;color:var(--emerald);opacity:.5;pointer-events:none;animation:moltFade 2s var(--ease) forwards}
@keyframes moltFade{0%{opacity:.5;transform:scale(1)}100%{opacity:0;transform:scale(.7) translateY(-10px)}}
.j-pulse{animation:jpulse .8s var(--ease)}
@keyframes jpulse{0%{transform:scale(1)}45%{transform:scale(1.22)}100%{transform:scale(1)}}

.chat-main{flex:1;display:flex;flex-direction:column;min-height:0}
.j-bar{display:flex;align-items:baseline;gap:10px;padding:16px 24px 0;font-family:var(--ui)}
.j-bar b{color:var(--emerald);font-weight:500;font-size:15px;letter-spacing:.03em}
.j-bar span{color:var(--bone-mute);font-size:14px}
.j-bar .time{margin-left:auto;font-size:12.5px;opacity:.7;letter-spacing:.04em}

.messages{flex:1;overflow-y:auto;padding:26px 24px 40px;display:flex;flex-direction:column;gap:26px;overflow-anchor:none}
.msg{width:100%;max-width:640px;margin:0 auto;display:flex;animation:msgIn .7s var(--ease) forwards}
@keyframes msgIn{from{opacity:0;transform:translateY(16px);filter:blur(5px)}to{opacity:1;transform:none;filter:blur(0)}}
.msg-bubble{white-space:pre-wrap;word-wrap:break-word;overflow-wrap:anywhere}
.msg.compagnon{justify-content:flex-start}
.msg.compagnon .msg-bubble{font-family:var(--serif);font-size:19.5px;line-height:1.56;font-weight:400;color:var(--bone);letter-spacing:.005em}
.msg.moi{justify-content:flex-end}
.msg.moi .msg-bubble{font-family:var(--ui);font-size:15px;background:var(--panel);color:var(--bone);padding:14px 18px;border-radius:20px 20px 5px 20px;max-width:80%;border:1px solid var(--line-2)}
.cursor::after{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--emerald);margin-left:5px;vertical-align:middle;animation:pulse 1.3s ease infinite;box-shadow:0 0 12px var(--emerald)}
@keyframes pulse{0%,100%{opacity:.4;transform:scale(.8)}50%{opacity:1;transform:scale(1.1)}}
.choix{width:100%;max-width:640px;margin:-12px auto 0;display:flex;flex-wrap:wrap;gap:9px;animation:msgIn .5s var(--ease) forwards}
.choix-chip{font-family:var(--ui);font-size:14px;color:var(--bone);background:rgba(17,33,26,.85);border:1px solid var(--line-2);border-radius:16px;padding:11px 16px;cursor:pointer;text-align:left;transition:all .3s var(--ease)}
.choix-chip:hover{border-color:var(--emerald);background:rgba(55,212,155,.1);transform:translateY(-1px)}
.typing{display:inline-flex;gap:6px;align-items:center}
.typing span{width:8px;height:8px;border-radius:50%;background:var(--emerald-deep);animation:tp 1.2s ease infinite}
.typing span:nth-child(2){animation-delay:.18s}.typing span:nth-child(3){animation-delay:.36s}
@keyframes tp{0%,100%{opacity:.3;transform:translateY(0)}50%{opacity:1;transform:translateY(-4px)}}
.msg-files{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.file-chip{display:inline-flex;align-items:center;gap:7px;font-family:var(--ui);font-size:12.5px;color:var(--bone-soft);background:rgba(17,33,26,.8);border:1px solid var(--line-2);border-radius:14px;padding:7px 12px}
.file-chip.removable{padding-right:6px}
.file-x{border:none;background:transparent;color:var(--bone-mute);font-size:16px;cursor:pointer;line-height:1;padding:0 2px}
.file-x:hover{color:var(--terra)}

/* Composer */
.composer-wrap{border-top:1px solid var(--line);background:rgba(7,17,12,.6)}
.attachments{display:flex;flex-wrap:wrap;gap:8px;max-width:700px;margin:0 auto;padding:10px 24px 0;width:100%}
.attachments:empty{display:none}
.composer{display:flex;gap:10px;align-items:flex-end;padding:16px 24px 20px;max-width:700px;margin:0 auto;width:100%}
.btn-attach{flex:none;width:48px;height:48px;border-radius:50%;background:var(--panel);color:var(--emerald);border:1px solid var(--line-2);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s var(--ease)}
.btn-attach:hover{border-color:var(--emerald);background:rgba(55,212,155,.08)}
.input{flex:1;font-family:var(--ui);font-size:15px;color:var(--bone);background:var(--panel);border:1px solid var(--line-2);border-radius:22px;padding:14px 18px;resize:none;line-height:1.5;max-height:180px}
.input::placeholder{color:var(--bone-mute)}
.input:disabled{opacity:.5}
.btn-send{flex:none;width:48px;height:48px;border-radius:50%;background:var(--emerald-deep);color:var(--bone);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .3s var(--spring)}
.btn-send:hover{transform:scale(1.06)}
.btn-send:disabled{background:var(--panel-2);color:var(--bone-mute);cursor:not-allowed;transform:none}

/* ---------- La Carte du Vivant (rendue dans le chat) ---------- */
.boussole{width:100%;max-width:480px;margin:6px auto 4px;animation:msgIn .8s var(--ease) forwards}
.card{width:100%;background:linear-gradient(180deg,#0e1c15,#091410);border:1px solid var(--line-2);border-radius:26px;overflow:hidden;
  box-shadow:0 40px 110px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.05);position:relative}
.card::before{content:"";position:absolute;inset:0;background:radial-gradient(70% 40% at 50% 0%,rgba(55,212,155,.14),transparent 60%);pointer-events:none}
.card-grain{position:absolute;inset:0;opacity:.04;mix-blend-mode:overlay;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.card-wm{position:absolute;top:46%;left:50%;width:130%;height:auto;transform:translate(-50%,-50%);opacity:.06;color:var(--emerald);pointer-events:none}
.card-in{position:relative;padding:34px 30px 30px}
.id{display:flex;align-items:center;gap:16px;margin-bottom:22px}
.avatar{width:66px;height:66px;border-radius:50%;flex:none;background:radial-gradient(circle at 35% 30%,#2b5246,#0e1c15);border:1px solid var(--emerald-deep);display:flex;align-items:center;justify-content:center;font-family:var(--title);font-size:24px;color:var(--emerald);box-shadow:0 0 24px rgba(55,212,155,.25);background-size:cover;background-position:center;cursor:pointer;position:relative;overflow:hidden}
.avatar.has-photo{color:transparent}
.avatar .cam{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(7,17,12,.45);opacity:0;transition:opacity .3s ease;color:var(--bone)}
.avatar:hover .cam{opacity:1}
.id-name{font-family:var(--title);font-size:24px;font-weight:600;letter-spacing:.04em;color:var(--bone);line-height:1.1}
.id-sub{font-family:var(--ui);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--terra);margin-top:5px}
.phrase{font-family:var(--serif);font-style:italic;font-weight:400;font-size:22px;line-height:1.42;color:var(--bone);text-align:center;margin:6px 0 22px;padding:0 4px}
.portrait{font-family:var(--serif);font-weight:400;font-style:italic;font-size:15.5px;line-height:1.62;color:var(--bone-soft);text-align:center;margin:0 2px 22px;padding:14px 16px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.toile-wrap{position:relative;margin:6px 0}
.toile-cap{text-align:center;font-family:var(--ui);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--bone-mute);margin-bottom:6px}
.web{display:block;width:100%;height:auto}
.toile-foot{text-align:center;font-family:var(--ui);font-size:11px;color:var(--bone-mute);margin-top:2px;opacity:.8}
.forces{margin:22px 0 2px}
.forces-h{font-family:var(--ui);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--terra);text-align:center;margin-bottom:12px}
.force{display:flex;gap:12px;padding:9px 0;border-bottom:1px solid var(--line)}
.force:last-child{border-bottom:none}
.force .fn{font-family:var(--title);font-size:13.5px;font-weight:500;letter-spacing:.03em;color:var(--emerald);flex:none;width:115px}
.force .fd{font-family:var(--serif);font-size:14px;color:var(--bone-soft);line-height:1.45}
.arch{text-align:center;margin:20px 0 22px}
.arch .lbl{font-family:var(--ui);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--terra)}
.arch .nm{font-family:var(--title);font-size:20px;font-weight:500;letter-spacing:.03em;color:var(--bone);margin-top:5px}
.arch .type{font-family:var(--ui);font-size:11px;letter-spacing:.05em;color:var(--bone-mute);margin-top:7px}
.vedic{font-family:var(--ui);font-size:11px;letter-spacing:.06em;color:var(--bone-mute);margin-top:12px}
.vedic b{color:var(--emerald);font-weight:500}
.ved-sens{font-family:var(--serif);font-style:italic;font-size:14px;line-height:1.55;color:var(--bone-soft);margin-top:8px;max-width:380px;margin-left:auto;margin-right:auto}
.synthese{font-family:var(--serif);font-style:italic;font-size:17px;line-height:1.5;color:var(--bone);text-align:center;margin:6px auto 20px;max-width:400px;padding:14px 18px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);position:relative}
.synthese::before{content:"✦";display:block;color:var(--emerald);font-style:normal;font-size:13px;margin-bottom:8px;opacity:.8}
.b-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:16px;overflow:hidden;margin:22px 0 2px}
.g-item{background:var(--ink-2);padding:15px 17px}
.g-l{font-family:var(--ui);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--terra);margin-bottom:6px}
.g-v{font-family:var(--serif);font-size:14.5px;line-height:1.5;color:var(--bone-soft)}
@media (max-width:430px){.b-grid{grid-template-columns:1fr}}
.blocks{display:flex;flex-direction:column;gap:1px;background:var(--line);border-radius:16px;overflow:hidden;border:1px solid var(--line)}
.block{background:var(--ink-2);padding:16px 18px}
.block .bl{font-family:var(--ui);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--emerald);margin-bottom:6px;display:flex;align-items:center;gap:7px}
.block .bv{font-family:var(--serif);font-size:15.5px;line-height:1.5;color:var(--bone-soft)}
.block.need .bl{color:var(--terra)}
.verbs{display:flex;justify-content:center;gap:10px;margin-top:22px;flex-wrap:wrap}
.verb{font-family:var(--ui);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--bone);border:1px solid var(--line-2);border-radius:999px;padding:7px 15px}
.card-foot{margin-top:24px;text-align:center;font-family:var(--title);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--emerald);opacity:.75;line-height:2}
.card-foot .copy{font-family:var(--ui);font-size:9.5px;letter-spacing:.08em;text-transform:none;color:var(--bone-mute)}
.citation{font-family:var(--serif);font-style:italic;font-size:15px;line-height:1.55;color:var(--bone-soft);text-align:center;margin:18px auto 0;max-width:380px;padding-top:16px;border-top:1px solid var(--line);position:relative}
.citation::before{content:"\201C";font-family:var(--title);font-size:30px;color:var(--terra);opacity:.6;display:block;line-height:.6;margin-bottom:6px}
/* Carte en cours de création */
.boussole-loader{width:100%;max-width:640px;margin:0 auto;display:flex;align-items:center;gap:14px;font-family:var(--serif);font-style:italic;font-size:19px;color:var(--bone-soft)}
.boussole-loader .orb{width:34px;height:34px;flex:none;border-radius:50%;border:2px solid var(--line-2);border-top-color:var(--emerald);animation:spin 1s linear infinite}
/* Fin de traversée */
.b-end{width:100%;max-width:480px;margin:22px auto 8px;text-align:center;animation:msgIn .8s var(--ease) forwards}
.b-end .badge{width:74px;height:74px;margin:0 auto 16px;border-radius:50%;border:1px solid var(--emerald-deep);display:flex;align-items:center;justify-content:center;color:var(--emerald);font-size:30px;box-shadow:0 0 30px rgba(55,212,155,.25);background:radial-gradient(circle at 40% 30%,rgba(55,212,155,.12),transparent)}
.b-end h3{font-family:var(--title);font-size:20px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--terra);margin-bottom:8px}
.b-end p{font-family:var(--serif);font-size:16px;line-height:1.55;color:var(--bone-soft);margin:0 auto 20px;max-width:400px}
.b-end .ctas{display:flex;flex-direction:column;gap:11px;max-width:340px;margin:0 auto}
.b-end .cta{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:var(--ui);font-size:14.5px;font-weight:500;padding:14px 22px;border-radius:999px;cursor:pointer;text-decoration:none;transition:all .3s var(--ease)}
.b-end .cta.primary{background:var(--terra);color:#0A140F;border:1px solid var(--terra)}
.b-end .cta.primary:hover{background:var(--terra-deep)}
.b-end .cta.ghost{background:transparent;color:var(--emerald);border:1px solid var(--line-2)}
.b-end .cta.ghost:hover{border-color:var(--emerald);background:rgba(55,212,155,.08)}
.crise-actions{display:flex;flex-direction:column;align-items:flex-start;gap:9px;margin:4px 0 14px}
.crise-btn{font-family:var(--ui);font-size:14px;font-weight:500;color:#0A140F;background:var(--terra);border:none;border-radius:999px;padding:11px 22px;cursor:pointer;transition:all .3s var(--ease)}
.crise-btn:hover{background:var(--terra-deep)}
.crise-btn.done{background:transparent;color:var(--emerald);border:1px solid var(--line-2);cursor:default}
.crise-btn:disabled{cursor:default}
.crise-mail{font-family:var(--ui);font-size:12.5px;color:var(--bone-mute);text-decoration:none}
.crise-mail:hover{color:var(--emerald)}
.crise-note{font-family:var(--ui);font-size:11.5px;line-height:1.5;color:var(--bone-mute);opacity:.8;margin:2px 0 0;max-width:300px}
.b-wipe{margin:26px auto 0;max-width:360px;padding-top:18px;border-top:1px solid var(--line)}
.b-wipe-q{font-family:var(--ui)!important;font-size:12.5px!important;color:var(--bone-mute)!important;margin:0 auto 10px!important}
.b-wipe-btn{font-family:var(--ui);font-size:12.5px;letter-spacing:.02em;color:var(--bone-mute);background:transparent;border:1px solid var(--line-2);border-radius:999px;padding:9px 18px;cursor:pointer;transition:all .3s var(--ease)}
.b-wipe-btn:hover{border-color:var(--terra-deep);color:var(--terra)}
.b-wipe-note{font-family:var(--ui)!important;font-size:11px!important;color:var(--bone-mute)!important;line-height:1.5!important;margin:10px auto 0!important;max-width:300px!important;opacity:.8}
.boussole-actions{display:flex;gap:12px;justify-content:center;margin-top:18px;flex-wrap:wrap}
.act-btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--ui);font-size:13.5px;font-weight:500;color:var(--bone);background:transparent;border:1px solid var(--line-2);border-radius:999px;padding:11px 20px;cursor:pointer;transition:all .3s var(--ease)}
.act-btn:hover{border-color:var(--emerald);color:var(--emerald)}
.act-btn.primary{background:var(--terra);color:#0A140F;border-color:var(--terra)}
.act-btn.primary:hover{background:var(--terra-deep);color:#0A140F;border-color:var(--terra-deep)}
@media (prefers-reduced-motion:no-preference){
  .toile-poly{stroke-dasharray:1400;stroke-dashoffset:1400;animation:draw 2.4s var(--ease) .3s forwards}
  @keyframes draw{to{stroke-dashoffset:0}}
  .toile-node{opacity:0;animation:pop .5s var(--ease) forwards}
  .toile-breathe{transform-origin:center;animation:breathe 9s ease-in-out infinite}
  @keyframes breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.015)}}
  @keyframes pop{to{opacity:1}}
}

/* ---------- Confidentialité ---------- */
.privacy-badge{position:fixed;right:16px;bottom:16px;z-index:50;display:inline-flex;align-items:center;gap:7px;font-family:var(--ui);font-size:12px;color:var(--emerald);background:rgba(12,24,18,.72);border:1px solid var(--line-2);border-radius:999px;padding:9px 15px;cursor:pointer;backdrop-filter:blur(10px);transition:border-color .3s ease}
.privacy-badge:hover{border-color:var(--emerald)}
.modal-overlay{position:fixed;inset:0;z-index:70;background:rgba(4,8,6,.72);backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;padding:20px}
.modal{position:relative;max-width:470px;width:100%;background:var(--ink-2);border:1px solid var(--line-2);border-radius:22px;padding:34px 30px;box-shadow:0 30px 90px rgba(0,0,0,.6)}
.modal-close{position:absolute;top:14px;right:16px;border:none;background:transparent;font-size:26px;color:var(--bone-mute);cursor:pointer}
.modal-title{font-family:var(--title);font-size:23px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--terra);margin-bottom:18px}
.modal-list{list-style:none;display:flex;flex-direction:column;gap:14px}
.modal-list li{font-family:var(--serif);font-size:15.5px;color:var(--bone-soft);line-height:1.55;padding-left:16px;position:relative}
.modal-list li::before{content:"";position:absolute;left:0;top:9px;width:6px;height:6px;border-radius:50%;background:var(--emerald)}
.modal-list strong{color:var(--bone);font-weight:500}
.modal-care{margin-top:18px;padding:13px 15px;border:1px solid var(--line-2);border-radius:12px;background:rgba(229,146,100,.06);font-family:var(--ui);font-size:12.5px;line-height:1.65;color:var(--bone-mute)}
.modal-care strong{color:var(--terra);font-weight:500}
.modal-foot{margin-top:18px;font-family:var(--ui);font-size:12.5px;color:var(--bone-mute);line-height:1.7}
.modal-foot a{color:var(--emerald)}
.modal-intro{font-family:var(--serif);font-size:14.5px;line-height:1.55;color:var(--bone-soft);margin-bottom:14px}
.modal-steps{list-style:none;counter-reset:s;display:flex;flex-direction:column;gap:9px;margin-bottom:14px}
.modal-steps li{counter-increment:s;position:relative;padding-left:30px;font-family:var(--serif);font-size:14.5px;line-height:1.5;color:var(--bone-soft)}
.modal-steps li::before{content:counter(s);position:absolute;left:0;top:0;width:21px;height:21px;border-radius:50%;background:rgba(55,212,155,.12);border:1px solid var(--emerald-deep);color:var(--emerald);font-family:var(--ui);font-size:11px;display:flex;align-items:center;justify-content:center}
.modal-steps b{color:var(--bone)}
.aiprompt-text{width:100%;height:220px;font-family:var(--ui);font-size:12px;line-height:1.5;color:var(--bone-soft);background:var(--ink);border:1px solid var(--line-2);border-radius:14px;padding:14px;resize:vertical}
.aiprompt-copy{margin-top:14px;width:100%;justify-content:center}

/* Recommencer — discret, guardé, à l'intérieur de la modale Confidentiel */
.modal-restart{display:block;width:100%;margin-top:22px;font-family:var(--ui);font-size:12px;letter-spacing:.02em;color:var(--bone-mute);background:transparent;border:1px solid var(--line);border-radius:999px;padding:10px 16px;cursor:pointer;transition:all .3s var(--ease)}
.modal-restart:hover{border-color:var(--terra-deep);color:var(--terra)}

/* Carte d'interruption — douce, dans l'univers émeraude (jamais de code brut) */
.seuil-error{max-width:520px;margin:14px auto;text-align:center;background:linear-gradient(180deg,var(--panel),var(--ink-2));border:1px solid var(--line-2);border-radius:20px;padding:26px 24px 22px;box-shadow:0 22px 60px rgba(0,0,0,.45)}
.seuil-error .se-glyph{font-size:22px;color:var(--terra);opacity:.85;margin-bottom:12px}
.seuil-error .se-msg{font-family:var(--serif);font-size:18px;font-style:italic;color:var(--bone);line-height:1.45;margin-bottom:8px}
.seuil-error .se-sub{font-family:var(--serif);font-size:14.5px;color:var(--bone-soft);line-height:1.55;margin-bottom:18px}
.seuil-error .se-btn{font-family:var(--ui);font-size:13px;font-weight:500;color:#0A140F;background:var(--terra);border:none;border-radius:999px;padding:11px 22px;cursor:pointer;transition:transform .4s var(--spring),background .3s ease}
.seuil-error .se-btn:hover{background:var(--terra-deep)}
.seuil-error .se-btn:active{transform:scale(.97)}
.seuil-error .se-btn:disabled{cursor:default}
.seuil-error .se-btn.done{background:transparent;color:var(--emerald);border:1px solid var(--emerald-deep)}
.seuil-error .se-note{font-family:var(--ui);font-size:11px;color:var(--bone-mute);margin-top:12px;opacity:.85}

/* Bandeau « ta Boussole rejoint le cercle » — auto, avec opt-out annoncé */
.cercle-bar{max-width:560px;margin:14px auto 0;display:flex;align-items:center;gap:14px;justify-content:space-between;flex-wrap:wrap;background:rgba(55,212,155,.06);border:1px solid var(--line-2);border-radius:14px;padding:12px 16px;transition:border-color .4s var(--ease)}
.cercle-txt{font-family:var(--ui);font-size:12.5px;color:var(--bone-soft);line-height:1.5;flex:1;min-width:200px;transition:color .4s var(--ease)}
.cercle-opt{font-family:var(--ui);font-size:11.5px;color:var(--bone-mute);background:transparent;border:1px solid var(--line-2);border-radius:999px;padding:7px 14px;cursor:pointer;white-space:nowrap;transition:all .3s var(--ease)}
.cercle-opt:hover{border-color:var(--terra-deep);color:var(--terra)}
.cercle-bar.done{border-color:var(--emerald-deep)}
.cercle-bar.done .cercle-txt{color:var(--emerald)}
.cercle-bar.opted-out .cercle-txt{color:var(--bone-mute)}

@media (max-width:760px){
  .j-rail{display:none}
  .messages{padding:22px 22px 18px}            /* marge confortable, le texte ne colle plus aux bords */
  .composer{padding:12px 18px 16px}
  .attachments{padding:10px 18px 0}
  .privacy-badge{display:none}                 /* ne chevauche plus la saisie */
  .j-bar{padding:12px 22px 0}
  .j-bar .time{display:none}                   /* évite le texte coupé */
  .msg.compagnon .msg-bubble{font-size:18px;line-height:1.5}
  .chat-header{padding:13px 18px}
  .chat-title{font-size:17px}
  .chat-actions{gap:6px}
  .btn-ghost{padding:7px 10px;font-size:10.5px}
  .seuil{padding:26px 20px}
  .boussole,.b-end{padding-left:4px;padding-right:4px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.seuil-kicker,.seuil-title,.seuil-tag,.seuil-lede,.seuil-sub,.consent,.seuil-note,.seuil-poster{opacity:1!important;transform:none!important;filter:none!important}.emblem{opacity:.6!important}}