/* Avenue 404 — styles communs du back-office et de l’espace client. Mêmes couleurs et typographies que le site public (packages/core/src/brand.ts). */
:root{
  --black:#080808; --graphite:#121212; --anthracite:#202020; --line:#2a2a2a; --grey:#858585; --soft:#9a9a9a; --light:#d8d8d8; --white:#ffffff;
  --sans:Geist,Inter,system-ui,-apple-system,"Segoe UI",sans-serif; --mono:"Geist Mono",ui-monospace,Menlo,monospace;
  --ease:cubic-bezier(.2,.7,.2,1); --side:232px;
}
*{box-sizing:border-box}
html{background:var(--black)}
body{margin:0;background:var(--black);color:var(--light);font-family:var(--sans);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
h1,h2,h3,p,ul,dl,dd{margin:0}
ul{padding:0;list-style:none}
a{color:var(--white)}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--white);outline-offset:2px}
[hidden]{display:none!important}
.mono{font-family:var(--mono)}
.muted{color:var(--soft)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ── Connexion ── */
.login{min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:24px}
.login form{width:min(400px,100%);display:flex;flex-direction:column;gap:20px}
.login .mark{display:flex;align-items:center;gap:12px;font-size:14px;letter-spacing:.18em;color:var(--white);margin-bottom:12px}
.login h1{font-size:34px;font-weight:500;letter-spacing:-.03em;color:var(--white)}

/* ── Structure ── */
.shell{display:grid;grid-template-columns:var(--side) minmax(0,1fr);min-height:100vh;min-height:100dvh}
.side{position:sticky;top:0;height:100vh;height:100dvh;display:flex;flex-direction:column;gap:28px;padding:22px 14px;border-right:1px solid var(--line);background:var(--graphite)}
.side .mark{display:flex;align-items:center;gap:10px;padding:0 10px;font-size:13px;letter-spacing:.18em;color:var(--white)}
.side .mark b{font-weight:600}.side .mark span{font-weight:300;color:var(--light)}
.nav{display:flex;flex-direction:column;gap:2px;flex:1}
.nav a{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:42px;padding:0 10px;border-radius:2px;color:var(--soft);text-decoration:none;font-size:15px;transition:background .2s,color .2s}
.nav a:hover{color:var(--white)}
.nav a[aria-current="page"]{background:var(--white);color:var(--black)}
.nav .count{font-family:var(--mono);font-size:12px;padding:1px 7px;border:1px solid currentColor;border-radius:20px}
.who{display:flex;flex-direction:column;gap:8px;padding:14px 10px 0;border-top:1px solid var(--line);font-size:14px}
.who strong{color:var(--white);font-weight:500}
.who small{font-family:var(--mono);font-size:11px;letter-spacing:.12em;color:var(--soft);text-transform:uppercase}
main{min-width:0;padding:36px clamp(18px,4vw,56px) 80px}
.head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:28px}
.head h1{font-size:clamp(30px,3.4vw,44px);line-height:1.05;font-weight:500;letter-spacing:-.035em;color:var(--white)}
.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:var(--soft);text-transform:uppercase;margin-bottom:8px}
.back{display:inline-flex;align-items:center;gap:8px;min-height:40px;margin-bottom:10px;color:var(--soft);text-decoration:none;font-size:14px}
.back:hover{color:var(--white)}
h2{font-size:13px;font-family:var(--mono);font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--soft);margin:36px 0 12px}

/* ── Boutons et champs ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 20px;border-radius:2px;border:1px solid var(--white);background:var(--white);color:var(--black);font-weight:500;font-size:15px;text-decoration:none;white-space:nowrap;transition:opacity .2s,border-color .2s}
.btn:hover{opacity:.86}
.btn.ghost{background:transparent;color:var(--white);border-color:var(--grey)}
.btn.ghost:hover{opacity:1;border-color:var(--white)}
.btn.small{min-height:36px;padding:0 14px;font-size:14px}
.btn[disabled]{opacity:.45;cursor:default}
.linkbtn{background:none;border:0;padding:0;color:var(--soft);text-decoration:underline;text-underline-offset:3px;font-size:14px}
.linkbtn:hover{color:var(--white)}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field label{font-size:14px;color:var(--light)}
.field small{font-size:13px;color:var(--soft)}
input,select,textarea{width:100%;min-height:44px;padding:9px 12px;border:1px solid var(--grey);border-radius:2px;background:var(--black);color:var(--white)}
textarea{resize:vertical;min-height:88px}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--light) 50%),linear-gradient(135deg,var(--light) 50%,transparent 50%);background-position:calc(100% - 17px) 50%,calc(100% - 12px) 50%;background-size:5px 5px;background-repeat:no-repeat;padding-right:34px}
.two{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}
.tools{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:16px}
.tools input{flex:1 1 220px}.tools select{flex:0 1 200px}
.row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}

/* ── Tableau de bord ── */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}
.tile{display:flex;flex-direction:column;gap:6px;padding:20px;background:var(--black);color:inherit;text-decoration:none;min-height:124px;min-width:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
a.tile:hover{background:var(--graphite)}
.tile span{font-size:14px;color:var(--soft)}
.tile b{font-size:clamp(26px,2.4vw,38px);line-height:1.05;font-weight:500;letter-spacing:-.03em;color:var(--white);margin-top:auto;overflow-wrap:anywhere}
.tile small{font-size:13px;color:var(--soft)}
.alerts{display:flex;flex-direction:column;gap:8px;margin-bottom:20px}
.alert{padding:12px 16px;border:1px solid var(--white);border-radius:2px;color:var(--white);font-size:15px}

/* ── Listes ── */
.list{border-top:1px solid var(--line)}
.item{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:60px;padding:12px 4px;border-bottom:1px solid var(--line);color:inherit;text-decoration:none;width:100%;background:none;border-left:0;border-right:0;border-top:0;text-align:left}
a.item:hover,button.item:hover{background:var(--graphite)}
.item .main{display:flex;flex-direction:column;gap:2px;min-width:0}
.item .main strong{color:var(--white);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.item .main span{font-size:14px;color:var(--soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.item .meta{display:flex;align-items:center;gap:14px;flex:none;font-size:14px;color:var(--soft)}
.item .meta b{font-family:var(--mono);font-weight:400;color:var(--white)}
.pill{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--soft);white-space:nowrap}
.pill::before{content:"";width:7px;height:7px;border-radius:50%;border:1px solid var(--grey)}
.pill.on{color:var(--white)}.pill.on::before{background:var(--white);border-color:var(--white)}
.pill.half::before{background:var(--grey)}
.empty{padding:36px 20px;border:1px dashed var(--line);border-radius:2px;text-align:center;color:var(--soft)}
.empty strong{display:block;color:var(--white);font-weight:500;margin-bottom:4px}
.skeleton{height:60px;border-bottom:1px solid var(--line);background:linear-gradient(90deg,transparent,var(--graphite),transparent);background-size:200% 100%;animation:sk 1.2s linear infinite}
@keyframes sk{to{background-position:-200% 0}}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.facts div{padding:14px 16px;background:var(--black);min-width:0}
.facts dt{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--soft);margin-bottom:4px}
.facts dd{color:var(--white);overflow-wrap:anywhere}
.note{padding:12px 0;border-bottom:1px solid var(--line)}
.note p{white-space:pre-wrap;color:var(--light)}
.note small{font-size:13px;color:var(--soft)}
pre.code{margin:0;padding:16px;border:1px solid var(--line);background:var(--graphite);color:var(--light);font-family:var(--mono);font-size:13px;line-height:1.55;overflow:auto;max-height:60vh;white-space:pre}
pre.code .add{color:var(--white)}pre.code .del{color:var(--grey);text-decoration:line-through}pre.code .hunk{color:var(--soft)}

/* ── Fenêtres ── */
dialog{width:min(640px,100vw - 20px);max-height:calc(100dvh - 20px);padding:0;border:1px solid var(--grey);border-radius:2px;background:var(--graphite);color:var(--light);overflow:auto}
dialog.wide{width:min(900px,100vw - 20px)}
dialog::backdrop{background:rgba(8,8,8,.8)}
.dhead{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px;background:var(--graphite);border-bottom:1px solid var(--line)}
.dhead h3{font-size:20px;font-weight:500;letter-spacing:-.02em;color:var(--white)}
.x{width:40px;height:40px;flex:none;display:flex;align-items:center;justify-content:center;background:transparent;border:1px solid var(--line);border-radius:2px;color:var(--white)}
.x:hover{border-color:var(--white)}
.dbody{display:flex;flex-direction:column;gap:18px;padding:20px}
.dfoot{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px;padding-top:6px}
.err{padding:10px 14px;border:1px solid var(--white);border-radius:2px;color:var(--white);font-size:14px}
#toasts{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:50;display:flex;flex-direction:column;gap:8px;width:min(440px,100vw - 24px);pointer-events:none}
.toast{padding:12px 16px;border-radius:2px;background:var(--white);color:var(--black);font-size:15px;box-shadow:0 10px 40px rgba(0,0,0,.6);animation:up .3s var(--ease)}
@keyframes up{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* ── Mobile ── */
@media (max-width:820px){
  .shell{grid-template-columns:minmax(0,1fr)}
  .side{position:fixed;inset:auto 0 0 0;top:auto;z-index:20;height:auto;flex-direction:row;gap:0;padding:6px 6px calc(6px + env(safe-area-inset-bottom));border-right:0;border-top:1px solid var(--line)}
  .side .mark,.who{display:none}
  .nav{flex-direction:row;gap:2px}
  .nav a{flex:1;flex-direction:column;justify-content:center;gap:2px;min-height:50px;padding:0 2px;font-size:12px;position:relative}
  .nav .count{position:absolute;top:4px;right:calc(50% - 26px);font-size:10px;padding:0 5px;background:var(--white);color:var(--black);border-color:var(--white)}
  .nav a[aria-current="page"] .count{background:var(--black);color:var(--white);border-color:var(--black)}
  main{padding:20px 16px calc(96px + env(safe-area-inset-bottom))}
  .mobiletop{display:flex!important}
  .item .meta .hide-s{display:none}
  .tile{min-height:104px;padding:16px}.tile b{font-size:32px}
  #toasts{bottom:calc(76px + env(safe-area-inset-bottom))}
}
.mobiletop{display:none;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px;font-size:12px;letter-spacing:.18em;color:var(--white)}
.mobiletop div{display:flex;align-items:center;gap:10px}
@media (prefers-reduced-motion:reduce){.skeleton,.toast{animation:none}}

/* ── Onglets ── */
.tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);margin:-8px 0 24px;overflow-x:auto;scrollbar-width:none}
.tabs a{display:flex;align-items:center;min-height:44px;padding:0 14px;color:var(--soft);text-decoration:none;font-size:15px;border-bottom:2px solid transparent;white-space:nowrap}
.tabs a:hover{color:var(--white)}
.tabs a[aria-current="page"]{color:var(--white);border-bottom-color:var(--white)}

/* ── Lignes d'un devis ou d'une facture (édition) ── */
.lines{display:flex;flex-direction:column;gap:8px}
.lhead,.lrow{display:grid;grid-template-columns:minmax(0,1fr) 76px 128px 44px;gap:8px;align-items:center}
.lhead{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--soft)}
.lrow .x{width:44px;height:44px}
.sum{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px 18px;font-family:var(--mono);font-size:14px;color:var(--soft)}
.sum b{color:var(--white);font-weight:400}
@media (max-width:600px){.lhead,.lrow{grid-template-columns:minmax(0,1fr) 58px 96px 44px}}

/* ── Document (devis, facture) : écran et impression ── */
.doc{background:#fff;color:#111;padding:clamp(18px,4vw,44px);border-radius:2px;font-size:14px;line-height:1.5;overflow-x:auto}
.doc a{color:#111}
.doc .dtop{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px;margin-bottom:28px}
.doc .issuer strong{font-size:16px}
.doc .dtitle{text-align:right}
.doc .dtitle h3{font-size:24px;font-weight:600;letter-spacing:-.02em;margin-bottom:4px}
.doc .to{margin:0 0 20px auto;width:min(320px,100%);padding:12px 14px;border:1px solid #ddd}
.doc .label{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#666;margin-bottom:4px}
.doc table{width:100%;border-collapse:collapse;margin:16px 0}
.doc th{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#666;font-weight:500;text-align:left;padding:8px 6px;border-bottom:2px solid #111}
.doc td{padding:9px 6px;border-bottom:1px solid #e3e3e3;vertical-align:top}
.doc .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.doc .totals{margin-left:auto;width:min(320px,100%)}
.doc .totals div{display:flex;justify-content:space-between;gap:16px;padding:4px 0}
.doc .totals .grand{border-top:2px solid #111;margin-top:4px;padding-top:8px;font-weight:600;font-size:16px}
.doc .small{font-size:12px;color:#444;white-space:pre-wrap;margin-top:18px}
.doc .pre{white-space:pre-wrap}
.warn{padding:10px 14px;border:1px dashed var(--grey);border-radius:2px;color:var(--light);font-size:14px}
#print{display:none}
@media print{
  @page{margin:14mm}
  html,body{background:#fff!important;color:#111}
  body>*:not(#print){display:none!important}
  #print{display:block!important}
  #print .doc{padding:0;overflow:visible}
}

/* ── Fil d'échanges ── */
.thread{display:flex;flex-direction:column;gap:10px}
.msg{max-width:min(560px,92%);padding:10px 14px;border:1px solid var(--line);border-radius:2px;background:var(--graphite)}
.msg.mine{align-self:flex-end;border-color:var(--grey);background:var(--anthracite)}
.msg p{white-space:pre-wrap;color:var(--light);overflow-wrap:anywhere}
.msg small{display:block;margin-top:4px;font-size:12px;color:var(--soft)}
.reply{display:flex;flex-direction:column;gap:10px;align-items:flex-start;margin-top:14px}

/* ── Éditeur de fichiers et panneau Claude ── */
textarea.code{font-family:var(--mono);font-size:13px;line-height:1.55;min-height:52vh;white-space:pre;overflow-wrap:normal;overflow-x:auto;tab-size:2}
.chat{display:flex;flex-direction:column;gap:10px;margin-bottom:12px}
.chat .msg.ai{border-color:var(--line)}
.chat .props{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}

/* ── Divers ── */
.secret{font-family:var(--mono);font-size:16px;padding:12px 14px;border:1px solid var(--white);border-radius:2px;color:var(--white);user-select:all;overflow-wrap:anywhere}
.check{display:flex;align-items:center;gap:10px;font-size:15px}
.check input{width:20px;min-height:20px;height:20px;accent-color:#fff}
.who .linkbtn{text-align:left}
@media (max-width:820px){
  .nav{overflow-x:auto;scrollbar-width:none}
  .nav a{flex:1 0 52px;font-size:11px;padding:0 1px}
  .tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tile span{font-size:13px}
  .tile b{font-size:clamp(20px,6vw,32px);overflow-wrap:anywhere}
}
.mobiletop a,.mobiletop .linkbtn{letter-spacing:normal}
.mobiletop>div:last-child{gap:16px}

/* ══════════ Studio (back-office) ══════════ */
kbd{display:inline-block;min-width:18px;padding:0 5px;border:1px solid var(--grey);border-radius:2px;font-family:var(--mono);font-size:11px;line-height:17px;text-align:center;color:inherit}
.studio{display:grid;grid-template-columns:64px minmax(0,1fr);height:100vh;height:100dvh;overflow:hidden}
.toolbar{display:flex;flex-direction:column;align-items:center;gap:10px;padding:12px 0;border-right:1px solid var(--line);background:var(--graphite);z-index:30;min-height:0}
.toolbar .brand{display:flex;justify-content:center;padding:4px 0 6px}
.toolbar .tgroup{display:flex;flex-direction:column;gap:2px;align-items:center}
.toolbar .tgroup.end{margin-top:auto}
.tool{position:relative;display:flex;align-items:center;justify-content:center;width:44px;height:44px;flex:none;border-radius:2px;color:var(--soft);background:none;border:1px solid transparent;text-decoration:none;padding:0}
.tool svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.tool:hover{color:var(--white);border-color:var(--line)}
.tool[aria-current="page"],.tool[aria-pressed="true"]{color:var(--black);background:var(--white);border-color:var(--white)}
.tool.small{width:32px;height:32px}.tool.small svg{width:16px;height:16px}
.tool-label{position:absolute;left:calc(100% + 12px);top:50%;transform:translateY(-50%);display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:2px;background:var(--white);color:var(--black);font-size:13px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .15s;z-index:40}
.tool-label kbd{border-color:var(--black)}
.tool:hover .tool-label,.tool:focus-visible .tool-label{opacity:1}
.tool .count{position:absolute;top:1px;right:1px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--white);color:var(--black);font:500 10px/17px var(--mono);text-align:center}
.tool[aria-current="page"] .count{background:var(--black);color:var(--white)}
.panes{display:grid;grid-template-columns:minmax(0,1fr);min-width:0;min-height:0;height:100%}
.panes.split{grid-template-columns:minmax(0,calc(var(--r,.5) * (100% - 9px))) 9px minmax(0,1fr)}
.pane{overflow:auto;min-width:0;height:100%;position:relative;container-type:inline-size;overscroll-behavior:contain}
.pane-head{position:sticky;top:0;z-index:12;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:5px 10px 5px 18px;border-bottom:1px solid var(--line);background:rgba(8,8,8,.94);font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--soft)}
.pane.active .pane-head{color:var(--white);box-shadow:inset 0 -1px 0 var(--white)}
.divider{position:relative;cursor:col-resize;background:var(--black);border-left:1px solid var(--line);border-right:1px solid var(--line);touch-action:none}
.divider::after{content:"";position:absolute;top:50%;left:3px;width:1px;height:44px;transform:translateY(-50%);background:var(--grey)}
.divider:hover,.divider.drag,.divider:focus-visible{background:var(--graphite)}
.divider:hover::after,.divider.drag::after{background:var(--white)}

/* Accueil : sphère et zones en orbite */
.home-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:6px}
.home-head h1{font-size:clamp(30px,3.4vw,44px);line-height:1.05;font-weight:500;letter-spacing:-.035em;color:var(--white)}
.orbit-stage{position:relative;height:clamp(440px,70vh,780px);overflow:hidden;margin:0 calc(-1 * clamp(18px,4vw,56px))}
.orbit-canvas{position:absolute;inset:0;width:100%;height:100%;transition:transform .38s var(--ease),opacity .38s}
.orbit-stage.leaving .orbit-canvas{transform:scale(1.22);opacity:0}
.orbit-stage.leaving .orbit-node,.orbit-stage.leaving .orbit-figure{opacity:0;transition:opacity .25s}
.orbit-node{position:absolute;left:0;top:0;z-index:3;display:flex;flex-direction:column;align-items:center;gap:1px;min-height:44px;padding:8px 16px;border:1px solid var(--grey);border-radius:2px;background:rgba(8,8,8,.74);color:var(--white);font-size:15px;white-space:nowrap;backdrop-filter:blur(4px);will-change:transform;transition:opacity .3s,background .2s,color .2s}
.orbit-node small{font-family:var(--mono);font-size:10px;color:var(--soft)}
.orbit-node:hover,.orbit-node:focus-visible{background:var(--white);color:var(--black);border-color:var(--white)}
.orbit-node:hover small,.orbit-node:focus-visible small{color:var(--black)}
.orbit-node.back{opacity:.5;z-index:2}
.orbit-figure{position:absolute;z-index:4;display:flex;flex-direction:column;gap:2px;padding:12px 16px;border-left:1px solid var(--white);color:var(--soft);text-decoration:none;font-size:13px;max-width:44%}
.orbit-figure b{font-size:clamp(24px,2.4vw,34px);font-weight:500;letter-spacing:-.03em;color:var(--white);line-height:1.1}
.orbit-figure:hover b{text-decoration:underline;text-underline-offset:4px}
.orbit-figure.f1{left:clamp(18px,4vw,56px);top:16px}
.orbit-figure.f2{right:clamp(18px,4vw,56px);top:16px;border-left:0;border-right:1px solid var(--white);text-align:right;align-items:flex-end}
.orbit-figure.f3{left:50%;bottom:14px;transform:translateX(-50%);border-left:0;border-top:1px solid var(--white);align-items:center;text-align:center}
.orbit-stage.lite::before{content:"";position:absolute;left:50%;top:50%;width:min(30%,220px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle at 36% 30%,#fff 0,#858585 30%,#202020 70%,#121212 100%)}
.orbit-stage.lite::after{content:"";position:absolute;left:50%;top:50%;width:min(76%,620px);height:min(22%,170px);transform:translate(-50%,-50%) rotate(-12deg);border:1px solid rgba(255,255,255,.55);border-radius:50%}

/* Plan de travail avec panneau latéral repliable */
.plan{display:grid;grid-template-columns:300px minmax(0,1fr);gap:28px;align-items:start}
.plan.collapsed{grid-template-columns:46px minmax(0,1fr)}
.plan-side{position:sticky;top:12px;display:flex;flex-direction:column;gap:14px;padding:14px;border:1px solid var(--line);background:var(--graphite);max-height:calc(100dvh - 48px);overflow:auto}
.plan.collapsed .plan-side{padding:6px}
.plan.collapsed .plan-side>:not(.plan-side-head),.plan.collapsed .plan-side-head .eyebrow{display:none}
.plan.collapsed .aside-toggle span{display:inline-block;transform:scaleX(-1)}
.plan-side-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.plan-side .facts{grid-template-columns:1fr}
.plan-main>.list:first-child,.plan-main>:first-child{margin-top:0}
.tiles.compact .tile{min-height:92px;padding:14px 16px}
.tiles.compact .tile b{font-size:clamp(22px,2vw,30px)}
@container (max-width:760px){
  .plan,.plan.collapsed{grid-template-columns:minmax(0,1fr)}
  .plan-side{position:static;max-height:none}
  .orbit-figure{max-width:40%}
}

/* Recherche globale */
dialog.search{align-self:start;margin-top:12vh}
.search-results{display:flex;flex-direction:column;max-height:55vh;overflow:auto;border-top:1px solid var(--line)}
.search-results a{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding:8px;border-bottom:1px solid var(--line);color:var(--light);text-decoration:none}
.search-results a[aria-selected="true"],.search-results a:hover{background:var(--white);color:var(--black)}
.search-results a[aria-selected="true"] .muted,.search-results a:hover .muted,.search-results a[aria-selected="true"] .type{color:var(--black)}
.search-results .type{flex:none;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--soft)}

@media (max-width:820px){
  .studio{display:block;height:auto;overflow:visible}
  .toolbar{position:fixed;inset:auto 0 0 0;flex-direction:row;gap:0;padding:6px 6px calc(6px + env(safe-area-inset-bottom));overflow-x:auto;border-right:0;border-top:1px solid var(--line);scrollbar-width:none}
  .toolbar .brand,.tool[data-tool="split"],.tool[data-tool="search"]{display:none}
  .toolbar .tgroup{flex-direction:row}
  .toolbar .tgroup.end{margin-top:0}
  .tool{width:58px;height:52px;flex-direction:column;gap:3px}
  .tool svg{width:20px;height:20px}
  .tool-label{position:static;transform:none;opacity:1;padding:0;background:none;color:inherit;font-size:10px}
  .tool-label kbd{display:none}
  .panes,.panes.split{display:block;height:auto}
  .pane{height:auto;overflow:visible}
  .pane+.pane{border-top:1px solid var(--white)}
  .divider,.pane-head .tool[aria-label="Échanger les deux plans"]{display:none}
  .plan,.plan.collapsed{grid-template-columns:minmax(0,1fr)}
  .plan-side{position:static;max-height:none}
  .orbit-stage{height:clamp(380px,62vh,560px)}
  .orbit-stage.lite{height:auto;display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:150px 16px 16px;margin:0}
  .orbit-stage.lite::before{top:70px;width:110px}
  .orbit-stage.lite::after{top:70px;width:240px;height:60px}
  .orbit-stage.lite .orbit-node{position:static;transform:none!important;opacity:1}
  .orbit-stage.lite .orbit-figure{position:static;transform:none;max-width:none;grid-column:span 1;border:0;border-left:1px solid var(--white);text-align:left;align-items:flex-start}
  .orbit-stage.lite .orbit-figure.f3{grid-column:1/-1}
}
@media (max-width:820px){
  .kbd-hint,.orbit-stage.lite .orbit-node small{display:none}
  .tool-label{max-width:56px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}

/* Carte de réglages (Notifications…) */
.card{display:flex;flex-direction:column;gap:16px;padding:20px;margin-top:20px;border:1px solid var(--line);background:var(--graphite);max-width:820px}
.card h2{margin:0}
.card .facts{grid-template-columns:repeat(2,minmax(0,1fr))}
/* Notifications : une ligne par destinataire Telegram (case, nom, type ; état ; Retirer). */
.item.rcp{flex-wrap:wrap;row-gap:4px}
.item.rcp .check{flex:1 1 auto;min-width:0}
.item.rcp small{order:3;flex:1 1 100%;padding-left:34px}