:root{
  --bg:#000000;--panel:#0d0d0d;--ink:#f5f3f0;--muted:#98a2b3;--line:#262626;
  --brand:#4A1C22;--brand-light:#c9a9a6;
  --graph-bg:#000000;
  --leaf-bg:#161616;--leaf-dot:#e8e8e8;--leaf-text:#d8d8d8;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--ink);overflow:hidden}
button,input{font:inherit}
.app{height:100vh;display:flex;flex-direction:column;overflow:hidden}

.header{height:72px;flex:none;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:20px;padding:0 24px;background:#111;color:#fff;border-bottom:1px solid #282828;position:relative;z-index:20}
.brand-wrap{white-space:nowrap;cursor:pointer;grid-column:1}
.brand{font-size:17px;font-weight:700;letter-spacing:-.03em}
.tag{margin-top:3px;font-size:9px;letter-spacing:.16em;color:#c9bcae;text-transform:uppercase}
.search-wrap{grid-column:2;position:relative;display:flex;align-items:center;max-width:640px;width:100%;margin:0 auto}
.search-wrap[hidden]{display:none}
.search-icon{position:absolute;left:14px;color:#7a7a7a;font-size:14px;pointer-events:none}
#searchInput{width:100%;height:36px;border:1px solid #3a3a3a;border-radius:10px;background:#1a1a1a;color:#fff;padding:0 40px 0 34px;font-size:12.5px;outline:none;transition:border-color .2s,background .2s}
#searchInput::placeholder{color:#8a8a8a}
#searchInput:focus{border-color:var(--brand-light);background:#1f1f1f}
.search-count{position:absolute;right:12px;font-size:10.5px;color:#8a8a8a;white-space:nowrap}
.header-actions{grid-column:3;justify-self:end;white-space:nowrap;display:flex;align-items:center;gap:10px}
.lang{border:1px solid #4b4b4b;border-radius:10px;background:transparent;color:#fff;padding:8px 12px;font-size:10px;font-weight:700;letter-spacing:.03em;cursor:pointer;transition:border-color .2s,background .2s}
.lang:hover{border-color:var(--brand-light);background:rgba(201,169,166,.12)}
.lang[hidden]{display:none}
/* Bouton mode nuit/jour AGRANDI (demande explicite) : cercle 46px, plus visible */
.theme-toggle{width:46px;height:46px;border-radius:50%;border:1.5px solid #5a5a5a;background:#1a1a1a;color:#fff;font-size:19px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:border-color .2s,background .2s,transform .2s;flex:none}
.theme-toggle:hover{border-color:var(--brand-light);background:rgba(201,169,166,.14);transform:scale(1.06)}

.home{position:fixed;z-index:20;inset:72px 0 0;background:#050505;color:#fff;overflow:auto}
.home[hidden]{display:none}
.hero{min-height:520px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;padding:60px 6vw;border-bottom:1px solid #282828}
.hero h1{font-size:clamp(34px,4vw,58px);line-height:1.08;letter-spacing:-.05em;margin:16px 0}
.hero p{color:#bbb;line-height:1.7;max-width:680px}
.eyebrow,.section-kicker{font-size:9px;letter-spacing:.25em;color:var(--brand-light);font-weight:700}
.hero-actions{display:flex;gap:10px;margin-top:26px}
.hero-btn{border:1px solid #666;border-radius:10px;background:transparent;color:#fff;padding:13px 18px;font-size:10px;font-weight:700;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.hero-btn.primary{background:var(--brand);border-color:var(--brand)}
.hero-btn:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 10px 24px rgba(0,0,0,.35)}
.hero-btn.primary:hover{box-shadow:0 10px 26px rgba(74,28,34,.55)}
.orbit-stage{height:380px;position:relative}
#reactOrbitLogo{width:min(300px,86%);aspect-ratio:1;display:grid;place-items:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
.simple-orbit-logo{width:100%;height:100%;overflow:visible;color:#fff;will-change:transform}
.simple-orbit-logo .orbit-ring{fill:none;stroke:currentColor;vector-effect:non-scaling-stroke}
.simple-orbit-logo .ring-outer{opacity:.12;stroke-width:1}
.simple-orbit-logo .ring-middle{opacity:.20;stroke-width:1}
.simple-orbit-logo .ring-inner{opacity:.34;stroke-width:1.15}
.simple-orbit-logo .ring-core{opacity:.62;stroke-width:1.25}
.simple-orbit-logo .focus{fill:var(--brand-light)}
.simple-orbit-logo .focus-main{filter:drop-shadow(0 0 8px rgba(201,169,166,.9))}
.simple-orbit-logo .satellite{filter:drop-shadow(0 0 2px rgba(201,169,166,.5))}
.home-section{padding:50px 6vw;background:#090909}
.home-section h2{font-size:28px}
.cards{display:grid;gap:14px}
.cards.steps{grid-template-columns:repeat(4,1fr)}
.cards.actions{grid-template-columns:repeat(1,1fr);max-width:520px}
.cards article{min-height:140px;border:1px solid #303030;border-radius:14px;padding:20px;background:#111;transition:.18s;position:relative}
.cards article:hover{transform:translateY(-5px);border-color:var(--brand);box-shadow:0 18px 40px rgba(74,28,34,.2)}
.cards article b{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--brand);color:#fff;font-size:11px}
.cards article h3{margin:10px 0 6px;font-size:15px}
.cards article p{color:#999;font-size:12px;margin:0}
.cards.actions article{cursor:pointer}
.cards.actions span{position:absolute;right:20px;font-size:18px;color:var(--brand-light)}
.access{margin-top:50px}
.home .site-footer{background:#050505;border-color:#262626;color:#666}
@media(max-width:900px){.hero{grid-template-columns:1fr}.cards.steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.cards.steps,.cards.actions{grid-template-columns:1fr}.hero{padding:40px 22px}.orbit-stage{height:260px}}

.mind-body{flex:1;display:flex;min-height:0}

.mind-sidebar,.mind-sidebar-right{width:250px;flex:none;background:#0a0a0a;padding:16px 14px;overflow-y:auto;display:flex;flex-direction:column;gap:4px}
.mind-sidebar{border-right:1px solid #232323}
.mind-sidebar-right{border-left:1px solid #232323}

.mind-back-home{display:flex;align-items:center;gap:6px;border:1px solid #2a2a2a;border-radius:9px;background:transparent;color:#c8c8c8;padding:8px 10px;font-size:11px;font-weight:700;cursor:pointer;margin-bottom:14px;text-align:left}
.mind-back-home:hover{border-color:var(--brand-light);background:rgba(201,169,166,.08)}

.side-title{font-size:9.5px;font-weight:700;letter-spacing:.16em;color:#7a7a7a;margin:14px 8px 10px;text-transform:uppercase}
.side-title:first-child{margin-top:6px}

.theme-btn{width:100%;display:flex;align-items:center;gap:10px;border:1px solid transparent;background:transparent;padding:10px 10px;cursor:pointer;text-align:left;border-radius:9px;margin-bottom:2px;color:#cfcfcf;transition:background .16s,border-color .16s}
.theme-btn:hover{background:rgba(255,255,255,.05)}
.theme-btn.active{background:rgba(201,169,166,.10);border-color:#3a3a3a;color:#fff}
.theme-dot{width:9px;height:9px;border-radius:50%;flex:none;background:#9a9a9a}
.theme-dot-all{background:linear-gradient(135deg,#fff,#555)}
.theme-name{font-size:12.5px;font-weight:600;flex:1}
.theme-count{font-size:10px;color:#7a7a7a}

.notions-section{margin-top:6px;border-top:1px solid #232323;padding-top:6px}
.notions-empty-hint{margin:14px 8px 4px;font-size:11px;color:#5f5f5f;line-height:1.6}
.notions-empty-hint[hidden]{display:none}
.notions-list{display:flex;flex-direction:column;gap:2px}

.notion-block{border-bottom:1px solid #1c1c1c}
.notion-header{width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;border:0;background:transparent;padding:10px 8px;cursor:pointer;text-align:left;font-size:12.5px;font-weight:600;color:#dcdcdc;border-radius:6px;transition:background .15s}
.notion-header:hover{background:rgba(255,255,255,.05)}
.notion-block.open>.notion-header{color:#fff;border-left:2px solid var(--brand-light);padding-left:6px}
.notion-chevron{font-size:10px;color:#7a7a7a;transition:transform .18s;flex:none}
.notion-block.open .notion-chevron{transform:rotate(90deg);color:var(--brand-light)}

.notion-panel{display:none;flex-direction:column;gap:10px;padding:4px 8px 12px 12px}
.notion-block.open .notion-panel{display:flex}

.notion-subgroup{display:flex;flex-direction:column;gap:5px}
.notion-subheader{font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#7a7a7a;margin:2px 2px 0}

.notion-leaf{display:flex;align-items:flex-start;gap:9px;padding:9px 11px;border-radius:10px;background:var(--leaf-bg);color:var(--leaf-text);font-size:11.5px;line-height:1.5;cursor:pointer;transition:background .15s}
.notion-leaf:hover{background:#202020}
.notion-leaf i{width:6px;height:6px;border-radius:50%;background:var(--leaf-dot);flex:none;margin-top:5px}
.notion-leaf-empty{padding:6px 6px;font-size:11px;color:#5f5f5f;font-style:italic}

.node-count-badge{margin:14px 8px 4px;font-size:10.5px;color:#8a8a8a;padding:8px 10px;border:1px solid #232323;border-radius:8px;background:#0f0f0f;text-align:center;letter-spacing:.02em}

.side-legend{margin-top:16px;padding-top:14px;border-top:1px solid #232323}
.legend-row{display:flex;align-items:center;gap:9px;font-size:11px;color:#a9a9a9;padding:4px 8px}
.legend-dot{width:9px;height:9px;border-radius:50%;flex:none;background:#9a9a9a}
.legend-dot-theme{background:#f2f2f2}
.legend-dot-sp{background:#b0b0b0}
.legend-dot-leaf{background:#787878}
.legend-shape{width:9px;height:9px;flex:none;background:var(--leaf-dot)}
.legend-shape-diamond{transform:rotate(45deg);border-radius:1px}
.legend-shape-square{border-radius:2px}

.side-hint{margin-top:auto;padding-top:16px;font-size:10px;color:#5f5f5f;line-height:1.9;padding:16px 8px 4px;border-top:1px solid #1c1c1c}

/* ================= ZONE GRAPHE ================= */
.mind-main{flex:1;position:relative;background:var(--graph-bg);min-width:0;overflow:hidden}
.graph3d-canvas{position:absolute;inset:0;z-index:2}
.graph3d-canvas canvas{display:block}

.graph-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#8a8a8a;font-size:13px;letter-spacing:.05em;background:var(--graph-bg);z-index:6;pointer-events:none}
.graph-loading[hidden]{display:none}

.mode-link-btn{width:100%;text-align:left;border:1px solid #262626;border-radius:9px;background:#111;color:#e4e4e4;padding:10px 12px;font-size:12.5px;font-weight:600;cursor:pointer;margin-bottom:6px;transition:background .15s,border-color .15s}
.mode-link-btn:hover{background:#1a1a1a;border-color:#3a3a3a}

.mode-radio-row{display:flex;align-items:center;gap:10px;padding:9px 10px;border:1px solid #232323;border-radius:9px;margin-bottom:6px;cursor:pointer;font-size:12px;color:#cfcfcf;transition:background .15s,border-color .15s}
.mode-radio-row:hover{background:rgba(255,255,255,.04)}
.mode-radio-row input{accent-color:var(--brand-light);flex:none;margin:0}
.mode-radio-row:has(input:checked){border-color:var(--brand-light);background:rgba(201,169,166,.08);color:#fff}

.mode-radio-dot{width:8px;height:8px;flex:none;background:var(--leaf-dot);border-radius:50%}
.mode-dot-navigate,.mode-dot-select{border-radius:50%}
.mode-shape-diamond{border-radius:2px;transform:rotate(45deg)}
.mode-shape-square{border-radius:2px}

.active-theme-chip{margin:0 8px;font-size:11.5px;font-weight:700;color:#fff;padding:9px 12px;border-radius:9px;background:#151515;border:1px solid #262626;text-align:center}

/* ================= PANNEAU DE DETAIL : ancre a DROITE, NON BLOQUANT ================= */
/* Aucun backdrop/overlay : le canvas reste cliquable et navigable en permanence,
   meme quand ce panneau est ouvert. Glisser pour naviguer ne le ferme JAMAIS.
   Seul le bouton (x) le ferme. Cliquer un nouveau noeud remplace son contenu. */
.detail-panel{
  position:absolute; top:16px; right:16px; bottom:16px;
  width:440px; max-width:92%;
  background:#141414; color:#f2efe9;
  border:1px solid #2a2a2a; border-radius:16px;
  box-shadow:-14px 0 36px rgba(0,0,0,.5);
  overflow-y:auto; padding:20px 24px 26px;
  z-index:10;
  /* Apparition HORIZONTALE (glissement gauche -> droite) + fondu, jamais de translation verticale */
  transform:translateX(-26px); opacity:0;
  transition:transform .32s cubic-bezier(.22,.9,.3,1), opacity .28s ease;
  pointer-events:none;
}
.detail-panel.open{ transform:translateX(0); opacity:1; pointer-events:auto; }

.drawer-close{position:absolute;top:14px;right:16px;border:0;background:none;font-size:22px;cursor:pointer;color:#8a8a8a;z-index:2}
.drawer-close:hover{color:#fff}

.drawer-pagination{display:flex;align-items:center;justify-content:space-between;padding:2px 30px 12px 2px;border-bottom:1px solid #262626;margin-bottom:16px}
.drawer-pager-label{font-size:10px;font-weight:700;letter-spacing:.14em;color:#8a8a8a;text-transform:uppercase}
.drawer-pager-count{font-size:13px;font-weight:700;color:#e4e4e4}

.mind-breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:5px;margin-bottom:16px;font-size:11px;color:#8a8a8a}
.mind-breadcrumb button{border:0;background:none;color:#c8c8c8;font-size:11px;font-weight:700;cursor:pointer;padding:0}
.mind-breadcrumb button:hover{text-decoration:underline}
.mind-breadcrumb .crumb-sep{color:#5a5a5a}
.mind-breadcrumb .crumb-current{color:#e4e4e4;font-weight:700}

.mind-kicker{display:flex;align-items:center;gap:8px;font-size:10.5px;letter-spacing:.12em;color:#a9a9a9;text-transform:uppercase;margin-bottom:10px}
.mind-type-badge{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:999px;font-size:9px;font-weight:700;color:#fff;letter-spacing:.02em;background:#2a2a2a}
.mind-type-badge i{width:8px;height:8px;border-radius:50%;flex:none;background:#fff}
.mind-title{font-size:23px;line-height:1.22;margin:0 0 14px;letter-spacing:-.01em;font-weight:800}
.mind-desc{font-size:13.5px;line-height:1.7;color:#c7c7c7;margin:0 0 20px}

.mind-section{margin-top:20px}
.mind-section-title{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin-bottom:10px;display:flex;align-items:center;gap:8px;color:#9a9a9a}
.mind-item-list{display:flex;flex-direction:column;gap:8px}
.mind-item{display:flex;gap:10px;align-items:flex-start;padding:11px 13px;border-radius:10px;background:#1c1c1c;border:1px solid #292929;font-size:12.5px;line-height:1.55;color:#e4e4e4;cursor:pointer;transition:background .15s,border-color .15s}
.mind-item:hover{background:#222;border-color:#3a3a3a}
.mind-item i{width:6px;height:6px;border-radius:50%;background:var(--leaf-dot);flex:none;margin-top:6px}

.mind-subprocess-list{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.mind-sp-chip{border:1px solid #292929;border-radius:9px;background:#1a1a1a;color:#ddd;padding:9px 12px;font-size:12px;cursor:pointer;transition:background .15s,border-color .15s}
.mind-sp-chip:hover{background:#222;border-color:#3a3a3a}

.drawer-nav{display:flex;gap:10px;margin-top:26px;border-top:1px solid #262626;padding-top:16px}
.drawer-nav-btn{flex:1;display:flex;align-items:center;gap:10px;border:1px solid #292929;border-radius:12px;background:#1a1a1a;color:#e4e4e4;padding:10px 14px;cursor:pointer;text-align:left;transition:background .15s,border-color .15s}
.drawer-nav-btn:hover{background:#222;border-color:#3a3a3a}
.drawer-nav-btn:disabled{opacity:.35;cursor:default}
.drawer-nav-btn:disabled:hover{background:#1a1a1a;border-color:#292929}
.drawer-nav-next{justify-content:flex-end;text-align:right}
.drawer-nav-arrow{font-size:20px;color:#8a8a8a;flex:none}
.drawer-nav-text{display:flex;flex-direction:column;gap:2px;overflow:hidden}
.drawer-nav-text small{font-size:8.5px;letter-spacing:.14em;color:#7a7a7a;text-transform:uppercase}
.drawer-nav-text b{font-size:12px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.site-footer{height:32px;flex:none;display:flex;align-items:center;justify-content:center;border-top:1px solid #1c1c1c;font-size:9px;color:#5f5f5f;background:#050505}

/* ================= MODE JOUR : fond GRIS chaud, jamais blanc pur ================= */
body.mind-light{
  --bg:#eceae7;--graph-bg:#e7e5e1;
  --leaf-bg:#e2e0dc;--leaf-dot:#9aa0a8;--leaf-text:#3a3f47;
}
body.mind-light .header{background:#f4f3f0;color:#1c1c1a;border-color:#dcdad5}
body.mind-light .brand,body.mind-light .tag{color:#1c1c1a}
body.mind-light .tag{color:#6b6b68}
body.mind-light .lang{border-color:#c7c4bd;color:#1c1c1a}
body.mind-light .lang:hover{border-color:var(--brand);background:rgba(74,28,34,.06)}
body.mind-light .theme-toggle{background:#efeeea;border-color:#c7c4bd;color:#1c1c1a}
body.mind-light .theme-toggle:hover{border-color:var(--brand);background:rgba(74,28,34,.08)}
body.mind-light #searchInput{background:#efeeea;color:#1c1c1a;border-color:#d5d2cb}
body.mind-light #searchInput::placeholder{color:#8a8a86}
body.mind-light .mind-sidebar,body.mind-light .mind-sidebar-right{background:#f4f3f0;border-color:#dcdad5}
body.mind-light .theme-btn{color:#3a3a37}
body.mind-light .theme-btn:hover{background:#eae8e3}
body.mind-light .theme-btn.active{background:#e2e0da;border-color:#c7c4bd;color:#1c1c1a}
body.mind-light .theme-dot{background:#6b6b68}
body.mind-light .theme-dot-all{background:linear-gradient(135deg,#2a2a28,#8a8a86)}
body.mind-light .notions-section{border-color:#dcdad5}
body.mind-light .notion-block{border-color:#e2e0da}
body.mind-light .notion-header{color:#2c2c29}
body.mind-light .notion-header:hover{background:#eae8e3}
body.mind-light .notion-block.open>.notion-header{color:#111;border-left-color:var(--brand)}
body.mind-light .notion-subheader{color:#8a8a86}
body.mind-light .notions-empty-hint{color:#8a8a86}
body.mind-light .side-legend,body.mind-light .side-hint,body.mind-light .node-count-badge{border-color:#dcdad5}
body.mind-light .legend-row,body.mind-light .side-title,body.mind-light .side-hint,body.mind-light .node-count-badge{color:#6b6b68}
body.mind-light .legend-dot-theme{background:#2a2a28}
body.mind-light .legend-dot-sp{background:#6b6b68}
body.mind-light .legend-dot-leaf{background:#a8a8a4}
body.mind-light .node-count-badge{background:#efeeea}
body.mind-light .graph-loading{color:#6b6b68}
body.mind-light .detail-panel{background:#f4f3f0;color:#1c1c1a;border-color:#dcdad5;box-shadow:-14px 0 36px rgba(0,0,0,.18)}
body.mind-light .drawer-pagination{border-color:#dcdad5}
body.mind-light .drawer-pager-label,body.mind-light .drawer-pager-count{color:#3a3a37}
body.mind-light .mind-desc{color:#4a4a47}
body.mind-light .mind-item{background:#eae8e3;border-color:#dcdad5;color:#2c2c29}
body.mind-light .mind-item:hover{background:#e2e0da}
body.mind-light .mind-section-title{color:#6b6b68}
body.mind-light .mind-type-badge{background:#dcdad5;color:#2c2c29}
body.mind-light .mind-type-badge i{background:#2c2c29}
body.mind-light .drawer-close{color:#8a8a86}
body.mind-light .drawer-close:hover{color:#111}
body.mind-light .site-footer{background:#f4f3f0;border-color:#dcdad5;color:#9a9a96}
body.mind-light .mind-back-home{color:var(--brand);border-color:#d9cdcd}
body.mind-light .mind-breadcrumb{color:#8a8a86}
body.mind-light .mind-breadcrumb .crumb-current{color:#111}
body.mind-light .mode-link-btn{background:#efeeea;color:#2c2c29;border-color:#dcdad5}
body.mind-light .mode-link-btn:hover{background:#e6e4df}
body.mind-light .mode-radio-row{border-color:#dcdad5;color:#3a3a37}
body.mind-light .mode-radio-row:hover{background:#eae8e3}
body.mind-light .mode-radio-row:has(input:checked){border-color:var(--brand);background:#f6eeee;color:#111}
body.mind-light .active-theme-chip{background:#efeeea;border-color:#dcdad5;color:#1c1c1a}
body.mind-light .mind-sp-chip{background:#efeeea;border-color:#dcdad5;color:#2c2c29}
body.mind-light .mind-sp-chip:hover{background:#e6e4df}
body.mind-light .drawer-nav-btn{background:#efeeea;border-color:#dcdad5;color:#2c2c29}
body.mind-light .drawer-nav-btn:hover{background:#e6e4df}
body.mind-light .drawer-nav-text small{color:#8a8a86}

@media(max-width:1100px){.mind-sidebar-right{display:none}}
@media(max-width:900px){.header{grid-template-columns:1fr auto;row-gap:8px}.search-wrap{display:none!important}.mind-sidebar{width:210px}.detail-panel{width:92%;right:4%;left:4%}}
