/* Carnetio — direction « registre »
   Papier chaud, encre noire, un seul rouge de tampon. Serif éditorial pour les titres et les chiffres clés,
   grotesque pour l'interface, chasse fixe pour les références. Filets fins plutôt que cartes, angles quasi droits,
   aucune ombre décorative, aucun dégradé. */
:root{
  --bg:#F4F1EA; --surface:#FBFAF6; --surface-2:#EFEBE1; --surface-3:#E7E2D5;
  --border:#E0DBCD; --border-2:#C9C3B1;
  --fg:#16140F; --fg-2:#3A372E; --muted:#74705F;
  --accent:#2B3F8C; --accent-soft:rgba(43,63,140,.08); --accent-line:rgba(43,63,140,.38);
  --mark:#C8401F;
  --btn:#16140F; --btn-hover:#38342B; --on-btn:#FBFAF6;
  --ok:#2F6B4F; --ok-soft:rgba(47,107,79,.10); --warn:#8A5A0B; --warn-soft:rgba(138,90,11,.10); --err:#A93226; --err-soft:rgba(169,50,38,.08);
  --sidebar:#EDE9DE; --sidebar-line:#DAD4C4;
  --c1:#CDC6B1; --c2:#16140F;
  --paper:#FFFEFA; --paper-fg:#16140F; --paper-muted:#76725F; --paper-line:#E6E1D2; --stamp:#C8401F;
  --shadow-paper:0 1px 0 rgba(22,20,15,.06),0 18px 40px -24px rgba(22,20,15,.32);
  --display:"Newsreader","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --font:"Hanken Grotesk",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --r:3px; --r-sm:3px; --r-lg:4px;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#12110F; --surface:#191815; --surface-2:#151411; --surface-3:#24221D;
  --border:#2A2823; --border-2:#3D3A32;
  --fg:#ECE8DC; --fg-2:#C4BFAF; --muted:#8D8875;
  --accent:#93A6F2; --accent-soft:rgba(147,166,242,.12); --accent-line:rgba(147,166,242,.42);
  --mark:#F0643B;
  --btn:#ECE8DC; --btn-hover:#FFFFFF; --on-btn:#12110F;
  --ok:#68C093; --ok-soft:rgba(104,192,147,.12); --warn:#E2A94E; --warn-soft:rgba(226,169,78,.12); --err:#F28C79; --err-soft:rgba(242,140,121,.12);
  --sidebar:#0E0D0B; --sidebar-line:#24221D;
  --c1:#4B473B; --c2:#ECE8DC;
  --shadow-paper:0 1px 0 rgba(0,0,0,.4),0 18px 40px -24px rgba(0,0,0,.9);
  color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#12110F; --surface:#191815; --surface-2:#151411; --surface-3:#24221D;
  --border:#2A2823; --border-2:#3D3A32;
  --fg:#ECE8DC; --fg-2:#C4BFAF; --muted:#8D8875;
  --accent:#93A6F2; --accent-soft:rgba(147,166,242,.12); --accent-line:rgba(147,166,242,.42);
  --mark:#F0643B;
  --btn:#ECE8DC; --btn-hover:#FFFFFF; --on-btn:#12110F;
  --ok:#68C093; --ok-soft:rgba(104,192,147,.12); --warn:#E2A94E; --warn-soft:rgba(226,169,78,.12); --err:#F28C79; --err-soft:rgba(242,140,121,.12);
  --sidebar:#0E0D0B; --sidebar-line:#24221D;
  --c1:#4B473B; --c2:#ECE8DC;
  --shadow-paper:0 1px 0 rgba(0,0,0,.4),0 18px 40px -24px rgba(0,0,0,.9);
  color-scheme:dark}

*{box-sizing:border-box}
html,body{height:100%}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font);font-size:14.5px;line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
h1,h2,h3,h4{margin:0;font-family:var(--display);font-weight:500;line-height:1.1;letter-spacing:-.012em;text-wrap:balance}
p{margin:0}
a{color:inherit}
button{font-family:inherit}
.mono{font-family:var(--mono)}
.num{font-variant-numeric:tabular-nums lining-nums}
.muted{color:var(--muted)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:2px}
::selection{background:var(--accent-line)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
.hide-sm{display:table-cell}
@media (max-width:760px){.hide-sm{display:none}}

/* Boutons et champs */
.btn{font-family:var(--font);display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:36px;padding:0 15px;border-radius:var(--r);font-size:14px;font-weight:600;letter-spacing:.005em;border:1px solid var(--border-2);background:var(--surface);color:var(--fg);cursor:pointer;text-decoration:none;white-space:nowrap;transition:background .12s,border-color .12s,color .12s}
.btn:hover{background:var(--surface-3);border-color:var(--muted)}
.btn svg{stroke-width:1.75}
.btn-primary{background:var(--btn);border-color:var(--btn);color:var(--on-btn)}
.btn-primary:hover{background:var(--btn-hover);border-color:var(--btn-hover)}
.btn-ghost{background:transparent;border-color:transparent}
.btn-ghost:hover{background:var(--surface-3);border-color:transparent}
.btn-danger{color:var(--err);border-color:color-mix(in srgb,var(--err) 40%,var(--border-2))}
.btn-danger:hover{background:var(--err-soft);border-color:var(--err)}
.btn-sm{min-height:30px;padding:0 11px;font-size:13px}
.btn-lg{min-height:48px;padding:0 24px;font-size:15.5px}
.btn:disabled{opacity:.45;cursor:not-allowed}
.icon-btn{width:34px;height:34px;border-radius:var(--r);border:1px solid transparent;background:transparent;color:var(--fg-2);display:inline-grid;place-items:center;cursor:pointer}
.icon-btn:hover{color:var(--fg);background:var(--surface-3)}
.icon-btn svg{stroke-width:1.6}
.kbd{font:500 11px var(--mono);padding:1px 6px;border-radius:2px;border:1px solid var(--border-2);color:var(--muted);background:var(--surface)}
.field{margin-bottom:14px;min-width:0}
.field label{display:block;font-size:12.5px;font-weight:600;color:var(--fg-2);margin-bottom:5px;letter-spacing:.01em}
.hint{font-size:12.5px;color:var(--muted);margin-top:5px}
.ferr{font-size:12.5px;color:var(--err);margin-top:5px}
input,select,textarea{width:100%;font:14.5px var(--font);color:var(--fg);background:var(--surface);border:1px solid var(--border-2);border-radius:var(--r-sm);padding:0 11px;min-height:38px;transition:border-color .12s,box-shadow .12s}
textarea{padding:9px 11px;resize:vertical}
input:hover,select:hover,textarea:hover{border-color:var(--muted)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--fg);box-shadow:0 0 0 3px var(--accent-soft)}
input[type=checkbox]{width:auto;min-height:0;accent-color:var(--fg)}
input::placeholder,textarea::placeholder{color:var(--muted);opacity:.8}
select option{background:var(--surface);color:var(--fg)}
.code-area{font:12px/1.6 var(--mono);background:var(--surface-2)}
.row2{display:grid;grid-template-columns:1fr 1fr;column-gap:12px;row-gap:0}
.row3{display:grid;grid-template-columns:repeat(3,1fr);column-gap:12px;row-gap:0}
@media (max-width:600px){.row2,.row3{grid-template-columns:1fr}}
.check{display:flex;gap:10px;align-items:flex-start;font-size:14px;cursor:pointer;margin-bottom:14px}
.search{display:flex;align-items:center;gap:8px;padding:0 11px;border:1px solid var(--border-2);border-radius:var(--r-sm);background:var(--surface);min-height:34px;color:var(--muted);min-width:0}
.search:focus-within{border-color:var(--fg);box-shadow:0 0 0 3px var(--accent-soft)}
.search input{border:0;background:transparent;box-shadow:none!important;padding:0;min-height:32px;min-width:0}

/* États : un repère carré et le mot, rien d'autre */
.pill{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:550;color:var(--fg-2);white-space:nowrap}
.pill::before{content:"";width:7px;height:7px;border-radius:1px;background:var(--muted);flex:none}
.p-ok::before{background:var(--ok)}.p-warn::before{background:var(--warn)}.p-err::before{background:var(--err)}
.p-info::before{background:var(--accent)}.p-mute::before{background:transparent;box-shadow:inset 0 0 0 1.5px var(--muted)}
.p-err{color:var(--err)}

/* Tableaux : registre */
.table-wrap{overflow-x:auto}
.tbl{width:100%;border-collapse:collapse;font-size:13.5px}
.tbl th{text-align:left;font:600 11px var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--muted);padding:10px 16px;border-bottom:1px solid var(--fg);white-space:nowrap}
.tbl th.r,.tbl td.r{text-align:right}
.tbl td{padding:12px 16px;border-bottom:1px solid var(--border);white-space:nowrap;vertical-align:middle}
.tbl td.num{font-family:var(--mono);font-size:13px}
.tbl tr:last-child td{border-bottom:0}
.tbl tr.clickable{cursor:pointer}
.tbl tr.clickable:hover td{background:var(--surface-2)}
.th-btn{background:none;border:0;color:inherit;font:inherit;letter-spacing:inherit;text-transform:inherit;cursor:pointer;display:inline-flex;align-items:center;gap:4px;padding:0}
.th-btn:hover{color:var(--fg)}
.ref{font-family:var(--mono);font-size:12.5px;color:var(--accent);font-weight:500;letter-spacing:.01em}
.cell-main{font-weight:600}
.cell-sub{font-size:12.5px;color:var(--muted)}

/* Panneaux : un filet, pas une carte */
.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);min-width:0}
.panel-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:15px 16px 13px;border-bottom:1px solid var(--border);flex-wrap:wrap}
.panel-h h3{font-size:18px}
.panel-b{padding:16px}
.grid{display:grid;gap:16px}
.g2{grid-template-columns:1fr 1fr}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
.g-main{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)}
@media (max-width:1100px){.g4{grid-template-columns:1fr 1fr}.g-main{grid-template-columns:1fr}}
@media (max-width:760px){.g2,.g3{grid-template-columns:1fr}}
/* Bandeau de chiffres : une surface, des filets verticaux */
.strip,.kpi-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:0;background:var(--surface);border:1px solid var(--border);border-top:2px solid var(--fg);border-radius:0 0 var(--r-lg) var(--r-lg);margin-bottom:16px}
.kpi-strip.g3,.strip.s3{grid-template-columns:repeat(3,1fr)}
.strip>div,.kpi-strip>.kpi{padding:18px 20px 17px;border-right:1px solid var(--border);display:flex;flex-direction:column;gap:6px;min-width:0}
.strip>div:last-child,.kpi-strip>.kpi:last-child{border-right:0}
.strip .lbl,.kpi .k{font:600 11px var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.strip b,.kpi .v{font-family:var(--display);font-size:32px;font-weight:400;letter-spacing:-.02em;line-height:1.05;font-variant-numeric:tabular-nums lining-nums}
.kpi .t{font-size:12.5px;color:var(--muted)}
.kpi .k i{display:none}
@media (max-width:900px){.strip b,.kpi .v{font-size:27px}.strip,.kpi-strip,.kpi-strip.g3{grid-template-columns:1fr 1fr}.strip>div:nth-child(2n),.kpi-strip>.kpi:nth-child(2n){border-right:0}.strip>div:nth-child(-n+2),.kpi-strip>.kpi:nth-child(-n+2){border-bottom:1px solid var(--border)}}
@media (max-width:480px){.strip b,.kpi .v{font-size:22px}.strip>div,.kpi-strip>.kpi,.panel.kpi{padding:15px 14px}.strip .lbl{min-height:0}}
.panel.kpi{padding:18px 20px 17px;display:flex;flex-direction:column;gap:6px}
.kpi-strip>.panel.kpi{border:0;border-right:1px solid var(--border);border-radius:0;background:none}
.kpi-strip>.panel.kpi:last-child{border-right:0}
.chart svg{width:100%;height:auto;display:block}
.chart text{fill:var(--muted);font:10.5px var(--mono)}
.chart .grid{stroke:var(--border)}
.chart .tip-bg{fill:var(--surface);stroke:var(--fg)}
.chart text.tip-t{fill:var(--fg);font-weight:600}
.chart text.tip-v{fill:var(--fg-2)}
.legend{display:flex;gap:6px 20px;font-size:12.5px;color:var(--muted);padding:8px 0 0 46px;flex-wrap:wrap}
.legend span{display:inline-flex;align-items:center;gap:7px}
.legend i{width:9px;height:9px;border-radius:0}
@media (max-width:560px){.legend{padding-left:0}}
/* Journal des opérations */
.feed-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 16px;border-bottom:1px solid var(--border);font-size:13.5px}
.feed-row:last-child{border-bottom:0}
.feed-ic{width:7px;height:7px;border-radius:1px;flex:none;background:var(--muted)}
.feed-ic.k-pay{background:var(--ok)}.feed-ic.k-inv{background:var(--accent)}.feed-ic.k-late{background:var(--err)}.feed-ic.k-quote{background:var(--warn)}
.feed-t{min-width:0}.feed-t b{display:block;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.feed-t span{font-size:12.5px;color:var(--muted)}
.meter{margin-bottom:14px}.meter-h{display:flex;justify-content:space-between;font-size:13px;margin-bottom:6px;color:var(--fg-2)}
.meter-bar{height:4px;background:var(--surface-3);overflow:hidden}.meter-fill{height:100%;background:var(--fg)}.meter-fill.full{background:var(--err)}
.empty{text-align:center;padding:48px 20px;display:flex;flex-direction:column;align-items:center;gap:8px}
.empty h4{font-size:20px}
.empty-ic{width:40px;height:40px;border-radius:var(--r);border:1px solid var(--border-2);display:grid;place-items:center;color:var(--muted)}
.empty p{color:var(--muted);max-width:360px;margin-bottom:8px}
.callout{display:flex;gap:10px;padding:12px 14px;border-radius:0 var(--r) var(--r) 0;font-size:13.5px;border:1px solid var(--border);border-left:2px solid var(--muted);background:var(--surface);color:var(--fg-2)}
.callout.warn{background:var(--warn-soft);border-color:color-mix(in srgb,var(--warn) 25%,transparent);border-left-color:var(--warn);color:var(--fg)}
.callout.err{background:var(--err-soft);border-color:color-mix(in srgb,var(--err) 25%,transparent);border-left-color:var(--err);color:var(--fg)}
.callout.info{background:var(--surface);border-left-color:var(--fg);color:var(--fg)}
.callout svg{flex:none;margin-top:2px}
.callout ul{margin:6px 0 0;padding-left:18px}
.panel>.tabs{padding:0 16px}
.tabs{display:flex;gap:22px;border-bottom:1px solid var(--border);overflow-x:auto}
.tab{background:none;border:0;border-bottom:2px solid transparent;color:var(--muted);padding:9px 0;font-size:14px;font-weight:600;cursor:pointer;white-space:nowrap;margin-bottom:-1px}
.tab:hover{color:var(--fg)}.tab.on{color:var(--fg);border-color:var(--fg)}
.tab-n{margin-left:6px;font:500 11.5px var(--mono);color:var(--muted)}

/* Radar */
.habit{padding:14px 16px;border-bottom:1px solid var(--border)}
.habit:last-child{border-bottom:0}
.habit-top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.habit-nums{display:flex;gap:16px;font-size:13px;color:var(--fg-2);margin-top:5px;flex-wrap:wrap}
.habit p{font-size:13px;color:var(--muted);margin-top:5px}
.mail{border:1px solid var(--border-2);border-radius:var(--r);margin:14px 0 8px;background:var(--paper)}
.mail-subject{padding:10px 14px;border-bottom:1px solid var(--border);font-weight:600;font-size:14px}
.mail pre{margin:0;padding:14px;white-space:pre-wrap;font:13px/1.6 var(--mono);color:var(--fg)}

/* Modale / toasts */
.modal-bg{position:fixed;inset:0;z-index:200;background:rgba(18,16,12,.5);display:grid;place-items:center;padding:16px;overflow-y:auto}
.modal{width:min(480px,100%);background:var(--surface);border:1px solid var(--fg);border-radius:var(--r-lg);box-shadow:0 30px 60px -30px rgba(0,0,0,.55);max-height:calc(100dvh - 32px);display:flex;flex-direction:column}
.modal-wide{width:min(720px,100%)}
.modal-h{display:flex;align-items:center;justify-content:space-between;padding:15px 18px;border-bottom:1px solid var(--border)}
.modal-h h3{font-size:21px}
.modal-b{padding:18px;overflow-y:auto}
.modal-f{padding:12px 18px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;background:var(--surface-2)}
.toasts{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:300;display:grid;gap:8px;max-width:min(380px,calc(100vw - 32px))}
.toast{display:flex;gap:10px;align-items:flex-start;padding:11px 14px;border-radius:var(--r);background:var(--fg);color:var(--bg);font-size:13.5px;animation:tin .18s ease-out}
.toast svg{margin-top:2px;flex:none}
@keyframes tin{from{transform:translateY(6px);opacity:0}to{transform:none;opacity:1}}

/* Application */
.shell{display:grid;grid-template-columns:240px minmax(0,1fr);height:100dvh}
.side{background:var(--sidebar);border-right:1px solid var(--sidebar-line);color:var(--fg-2);display:flex;flex-direction:column;padding:18px 12px;gap:1px;overflow-y:auto}
.brand{display:flex;align-items:center;gap:9px;font-family:var(--display);font-weight:500;letter-spacing:-.01em;font-size:23px;color:var(--fg);padding:0 8px 18px;text-decoration:none}
.brand-mark{display:inline-grid;place-items:center;color:var(--fg);flex:none}
.side-group{font:600 10.5px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding:20px 10px 7px}
.nav-item{position:relative;display:flex;align-items:center;gap:11px;padding:7px 10px;border-radius:var(--r);font-size:14px;font-weight:500;color:var(--fg-2);text-decoration:none;border:0;background:none;width:100%;text-align:left;cursor:pointer}
.nav-item svg{stroke-width:1.5;color:var(--muted);flex:none}
.nav-item:hover{background:rgba(22,20,15,.05);color:var(--fg)}
:root[data-theme="dark"] .nav-item:hover{background:rgba(255,255,255,.05)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .nav-item:hover{background:rgba(255,255,255,.05)}}
.nav-item.on{background:var(--surface);color:var(--fg);font-weight:600;box-shadow:inset 0 0 0 1px var(--border)}
.nav-item.on svg{color:var(--fg)}
.nav-item.on::before{content:"";position:absolute;left:-12px;top:7px;bottom:7px;width:2px;background:var(--mark)}
.nav-new{margin-left:auto;font:600 10px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mark)}
.side-foot{margin-top:auto;padding-top:12px}
.user-chip{display:flex;gap:10px;align-items:center;padding:12px 8px 4px;border-top:1px solid var(--sidebar-line);color:var(--fg);font-size:13px;min-width:0;margin-top:8px}
.avatar{width:28px;height:28px;border-radius:var(--r);background:var(--fg);display:grid;place-items:center;color:var(--bg);font:600 12px var(--mono);flex:none}
.user-chip>div{min-width:0}.user-chip>div b{display:block;color:var(--fg);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}.user-chip>div span{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}
.main{min-width:0;display:flex;flex-direction:column;overflow:hidden}
.topbar{display:flex;align-items:center;gap:10px;height:56px;padding:0 32px;border-bottom:1px solid var(--border);background:var(--bg);flex:none}
.cmd-trigger{display:flex;align-items:center;gap:10px;min-height:34px;padding:0 10px;border-radius:var(--r-sm);border:1px solid var(--border-2);background:var(--surface);color:var(--muted);cursor:pointer;font-size:13.5px;width:min(360px,100%);text-align:left}
.cmd-trigger:hover{border-color:var(--muted)}
.cmd-trigger svg{stroke-width:1.6}
.cmd-trigger .kbd{margin-left:auto;white-space:nowrap}
.cmd-trigger{white-space:nowrap;overflow:hidden}
.cmd-trigger span.t{overflow:hidden;text-overflow:ellipsis}
.top-right{margin-left:auto;display:flex;gap:6px;align-items:center}
.content{flex:1;overflow-y:auto;padding:34px 32px 64px}
.content-in{max-width:1220px;margin:0 auto}
.menu-btn{display:none}
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:26px;flex-wrap:wrap;padding-bottom:20px;border-bottom:1px solid var(--border)}
.page-head h1{font-size:38px;font-weight:400;letter-spacing:-.022em}
.page-head .sub{color:var(--muted);margin-top:8px;max-width:620px;font-size:14.5px}
.crumb{display:none}
.page-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:12px 16px;border-bottom:1px solid var(--border)}
.toolbar .search{flex:1;min-width:180px;max-width:340px}
@media (max-width:980px){
  .shell{grid-template-columns:1fr}
  .side{position:fixed;inset:0 auto 0 0;width:268px;z-index:150;transform:translateX(-102%);transition:transform .18s}
  .side.open{transform:none}
  .scrim{position:fixed;inset:0;background:rgba(18,16,12,.5);z-index:140}
  .menu-btn{display:inline-grid}
  .content{padding:22px 16px 44px}
  .topbar{padding:0 14px}
  .cmd-trigger span.t{display:none}
  .cmd-trigger{width:auto}
  .page-head h1{font-size:31px}
}
.cmdk-bg{position:fixed;inset:0;z-index:250;background:rgba(18,16,12,.5);display:flex;justify-content:center;align-items:flex-start;padding:12vh 16px 0}
.cmdk{width:min(560px,100%);background:var(--surface);border:1px solid var(--fg);border-radius:var(--r-lg);box-shadow:0 30px 60px -30px rgba(0,0,0,.55);overflow:hidden}
.cmdk input{border:0;border-bottom:1px solid var(--border);border-radius:0;background:transparent;min-height:52px;padding:0 18px;font-size:15.5px;box-shadow:none!important}
.cmdk-list{max-height:min(360px,50dvh);overflow-y:auto;padding:6px}
.cmdk-sec{font:600 10.5px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding:12px 12px 4px}
.cmdk-item{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:var(--r);cursor:pointer;font-size:14px;color:var(--fg-2)}
.cmdk-item.on{background:var(--surface-3);color:var(--fg)}
.cmdk-item .kbd{margin-left:auto}
.cmdk-foot{display:flex;gap:14px;padding:9px 14px;border-top:1px solid var(--border);font-size:12px;color:var(--muted);background:var(--surface-2)}

/* Éditeur de document */
.editor{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:start}
@media (max-width:1180px){.editor{grid-template-columns:1fr}}
.lines-h,.line{display:grid;grid-template-columns:minmax(0,1fr) 62px 96px 78px 32px;gap:6px;align-items:center}
.lines-h{font:600 10.5px var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin-bottom:6px;padding:0 2px}
.lines-h span:first-child{padding-left:11px}.lines-h span:nth-child(2),.lines-h span:nth-child(3){padding-right:9px}.lines-h span:nth-child(4){padding-left:9px}
.add-line+.field{margin-top:18px}
.line{margin-bottom:6px}.line input,.line select{min-height:34px;padding:0 8px;font-size:13.5px}
.line input.n{text-align:right;font-family:var(--mono);font-size:13px}
.line .del{width:32px;height:34px;border:0;background:none;color:var(--muted);cursor:pointer;border-radius:var(--r);display:grid;place-items:center}
.line .del:hover{color:var(--err);background:var(--err-soft)}
@media (max-width:560px){.lines-h{display:none}.line{grid-template-columns:1fr 1fr;padding:10px;border:1px solid var(--border);border-radius:var(--r);margin-bottom:10px}.line>:first-child{grid-column:1/-1}.line .del{justify-self:end}}
.add-line{width:100%;min-height:36px;border:1px dashed var(--border-2);border-radius:var(--r-sm);background:none;color:var(--fg);font-weight:600;font-size:13.5px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px}
.add-line:hover{background:var(--surface-2);border-color:var(--muted)}
.sticky-prev{position:sticky;top:0}
.paper-wrap{background:var(--surface-3);padding:22px;border-radius:var(--r);overflow-x:auto}
.paper{background:var(--paper);color:var(--paper-fg);border-radius:1px;padding:34px 34px 30px;font-size:12px;box-shadow:var(--shadow-paper);min-width:420px;color-scheme:light;position:relative}
.paper .top{display:flex;justify-content:space-between;gap:16px}
.paper .who b{display:block;font-size:13.5px}.paper .who span{display:block;color:var(--paper-muted)}
.paper .tt{text-align:right}.paper .tt h4{font-size:32px;font-weight:400;letter-spacing:-.02em;line-height:1}.paper .tt .mono{color:var(--paper-fg);font-size:12px;margin-top:6px}
.paper .badge-draft{display:inline-block;margin-top:8px;padding:2px 8px;border:1px solid #A9801F;color:#8A6410;font:600 10px var(--mono);letter-spacing:.12em}
.paper .meta{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:24px;padding:11px 0;border-block:1px solid var(--paper-fg)}
.paper .meta span{display:block;color:var(--paper-muted);font:500 10px var(--mono);letter-spacing:.08em;text-transform:uppercase;margin-bottom:2px}
.paper .parties{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:20px}
.paper .parties h5{margin:0 0 4px;font:600 10px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--paper-muted)}
.paper table{width:100%;border-collapse:collapse;margin-top:20px;font-size:11.5px}
.paper th{text-align:left;color:var(--paper-muted);font:600 10px var(--mono);letter-spacing:.08em;text-transform:uppercase;padding:7px 4px;border-bottom:1px solid var(--paper-fg)}
.paper td{padding:9px 4px;border-bottom:1px solid var(--paper-line);vertical-align:top}
.paper td.num,.paper .tots{font-family:var(--mono);font-size:11px}
.paper .r{text-align:right}
.paper table,.paper td{color:var(--paper-fg)}
.paper .tots{margin:14px 0 0 auto;width:min(290px,100%)}
.paper .tots div{display:flex;justify-content:space-between;padding:4px 0}
.paper .tots .grand{border-top:1px solid var(--paper-fg);margin-top:5px;padding-top:9px;font-weight:600;font-size:13px}
.paper .legal{margin-top:22px;padding-top:12px;border-top:1px solid var(--paper-line);color:var(--paper-muted);font-size:10px;line-height:1.55}
.stamp,.paper .paid-stamp{display:inline-block;border:2px solid var(--stamp);color:var(--stamp);padding:3px 11px;border-radius:2px;font:600 14px var(--mono);letter-spacing:.2em;text-transform:uppercase;transform:rotate(-6deg);opacity:.9;mix-blend-mode:multiply}
.paper .paid-stamp{margin-top:10px;position:absolute;right:36px;top:84px}
.stat-row{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--border);font-size:14px}.stat-row:last-child{border-bottom:0}
.code-block{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r);padding:12px 14px;font:12px/1.7 var(--mono);color:var(--fg-2);overflow-x:auto;white-space:pre}
.wizard-steps{display:flex;gap:6px;margin-bottom:18px}.wizard-steps i{height:2px;flex:1;background:var(--border-2)}.wizard-steps i.on{background:var(--fg)}

/* ---------- Site public ---------- */
.site{min-height:100%;background:var(--bg)}
.wrap{max-width:1160px;margin:0 auto;padding-inline:24px}
.s-header{position:sticky;top:env(safe-area-inset-top,0px);z-index:60;background:var(--bg);border-bottom:1px solid var(--border)}
.s-nav{display:flex;align-items:center;gap:22px;height:64px}
.s-links{display:flex;gap:2px;margin-left:18px}
.s-links a{padding:7px 11px;color:var(--fg-2);font-size:14.5px;font-weight:500;text-decoration:none;border-radius:var(--r)}
.s-links a:hover{color:var(--fg);background:var(--surface-3)}
.s-actions{margin-left:auto;display:flex;gap:8px;align-items:center}
.s-brand{display:flex;align-items:center;gap:9px;font-family:var(--display);font-weight:500;font-size:25px;letter-spacing:-.012em;text-decoration:none;color:var(--fg);line-height:1}
.s-menu{display:none}.s-mobile{display:none;border-top:1px solid var(--border);padding:10px 24px 16px}
.s-mobile a,.s-mobile button.link{display:block;padding:13px 0;border-bottom:1px solid var(--border);text-decoration:none;font-weight:500;background:none;border-left:0;border-right:0;border-top:0;color:var(--fg);width:100%;text-align:left;font-size:15px;cursor:pointer}
@media (max-width:900px){.s-links,.s-actions .hide-m{display:none}.s-menu{display:inline-grid}.s-mobile.open{display:block}}

.hero{padding:80px 0 84px;border-bottom:1px solid var(--border)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:72px;align-items:start}
@media (max-width:980px){.hero-grid{grid-template-columns:1fr;gap:48px}.hero{padding:44px 0 56px}}
.hero h1{font-size:clamp(42px,6vw,80px);font-weight:400;letter-spacing:-.03em;line-height:1.01}
.hero h1 em{font-style:italic;font-weight:300;color:var(--mark)}
.hero .lead{font-size:clamp(17px,1.7vw,19.5px);color:var(--fg-2);max-width:500px;margin-top:26px;line-height:1.55}
.hero-cta{display:flex;gap:10px;margin-top:34px;flex-wrap:wrap}
.hero-note{margin-top:18px;font:500 12px var(--mono);letter-spacing:.02em;color:var(--muted)}
.sheet-wrap{position:relative;padding-top:6px}
.sheet .paper{min-width:0;font-size:11.5px;padding:26px}
.sheet .paper-wrap{background:none;padding:0;overflow:visible}
.note{margin-top:22px;border-left:2px solid var(--mark);padding:1px 0 1px 16px;max-width:380px}
.note .lbl{display:block;font:600 10.5px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:5px}
.note p{font-family:var(--display);font-size:19px;line-height:1.35;color:var(--fg)}

.facts-bar{border-bottom:1px solid var(--border)}
.facts{display:grid;grid-template-columns:repeat(4,1fr)}
.facts>div{padding:26px 24px 26px 0;border-right:1px solid var(--border);padding-left:24px}
.facts>div:first-child{padding-left:0}
.facts>div:last-child{border-right:0}
.facts b{display:block;font-family:var(--display);font-size:20px;font-weight:500;letter-spacing:-.01em;margin-bottom:4px}
.facts span{color:var(--muted);font-size:14px}
@media (max-width:860px){.facts{grid-template-columns:1fr 1fr}.facts>div{padding:20px 18px;border-bottom:1px solid var(--border)}.facts>div:nth-child(odd){padding-left:0}.facts>div:nth-child(2n){border-right:0}.facts>div:nth-last-child(-n+2){border-bottom:0}}
@media (max-width:480px){.facts{grid-template-columns:1fr}.facts>div{border-right:0;padding-left:0!important;border-bottom:1px solid var(--border)!important}.facts>div:last-child{border-bottom:0!important}}

.block{padding:104px 0;border-bottom:1px solid var(--border)}
.block.tint{background:var(--surface-2)}
@media (max-width:760px){.block{padding:68px 0}}
.block-head{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:64px;margin-bottom:56px;align-items:end}
@media (max-width:860px){.block-head{grid-template-columns:1fr;gap:18px;margin-bottom:40px}}
.block-head h2{font-size:clamp(32px,4.4vw,54px);font-weight:400;letter-spacing:-.025em;line-height:1.04}
.block-head p{color:var(--fg-2);font-size:17px;max-width:520px}
.eyebrow{display:flex;align-items:center;gap:10px;font:600 11.5px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:18px}
.eyebrow::before{content:"";width:7px;height:7px;background:var(--mark);flex:none}

.feat-list{display:grid;grid-template-columns:1fr 1fr;column-gap:72px;counter-reset:f}
@media (max-width:760px){.feat-list{grid-template-columns:1fr}}
.feat-list>div{counter-increment:f;border-top:1px solid var(--fg);padding:20px 0 40px}
.feat-list h3{font-size:25px;font-weight:500}
.feat-list h3::before{content:counter(f,decimal-leading-zero);display:block;font:500 11.5px var(--mono);letter-spacing:.1em;color:var(--muted);margin-bottom:14px}
.feat-list p{color:var(--fg-2);margin-top:10px;max-width:440px;font-size:15.5px}
.steps-list{display:grid;gap:0;max-width:820px}
.steps-list>div{display:grid;grid-template-columns:84px 1fr;gap:12px;padding:26px 0;border-top:1px solid var(--border-2)}
.steps-list>div:last-child{border-bottom:1px solid var(--border-2)}
.steps-list .n{font-family:var(--display);font-size:54px;font-weight:300;color:var(--mark);line-height:.9;font-style:italic}
.steps-list h3{font-size:24px}.steps-list p{color:var(--fg-2);margin-top:8px;font-size:15.5px}

.frame{border:1px solid var(--border-2);border-radius:var(--r-lg);background:var(--bg);overflow:hidden}
.frame-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 16px;border-bottom:1px solid var(--border-2);background:var(--surface);font:600 11px var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.frame-bar span.mono{font-size:11px}
.shot-body{height:520px;overflow:hidden;pointer-events:none;user-select:none;position:relative}
.shot-body::after{content:"";position:absolute;left:0;right:0;bottom:0;height:90px;background:linear-gradient(transparent,var(--bg))}
.shot-inner{width:1240px;transform-origin:0 0}
.radar-demo{padding:22px;pointer-events:none;user-select:none}

.road{width:100%;border-collapse:collapse;font-size:15px}
.road td{padding:18px 16px 18px 0;border-top:1px solid var(--border-2);vertical-align:top}
.road tr:last-child td{border-bottom:1px solid var(--border-2)}
.road td:last-child{text-align:right;white-space:nowrap;padding-right:0}
.road b{display:block;margin-bottom:3px;font-family:var(--display);font-size:20px;font-weight:500;letter-spacing:-.008em}.road span{color:var(--muted);font-size:14px}
.road .pill{font-size:13px}

.price-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--fg);border-bottom:1px solid var(--border-2)}
@media (max-width:900px){.price-grid{grid-template-columns:1fr;max-width:520px}}
.price-col{padding:34px 30px 34px;display:flex;flex-direction:column;border-right:1px solid var(--border)}
.price-col:first-child{padding-left:0}
.price-col:last-child{border-right:0;padding-right:0}
@media (max-width:900px){.price-col,.price-col:first-child,.price-col:last-child{border-right:0;border-bottom:1px solid var(--border);padding:30px 0}.price-col:last-child{border-bottom:0}}
.price-col.rec{background:var(--surface);box-shadow:inset 0 3px 0 var(--mark)}
@media (min-width:901px){.price-col.rec{margin-top:-1px}}
.price-col .tagline{font:600 10.5px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mark);height:18px;margin-bottom:10px}
.price-col h3{font-size:28px}
.price-col .desc{color:var(--muted);margin-top:6px;min-height:46px}
.price-col .amount{font-family:var(--display);font-size:64px;font-weight:300;letter-spacing:-.035em;margin-top:20px;line-height:1;font-variant-numeric:lining-nums}
.price-col .amount small{font:500 13px var(--mono);color:var(--muted);letter-spacing:0}
.price-col ul{list-style:none;padding:0;margin:26px 0 30px;display:grid;gap:11px}
.price-col li{padding-left:22px;position:relative;color:var(--fg-2);font-size:14.5px}
.price-col li::before{content:"";position:absolute;left:0;top:.78em;width:10px;height:1px;background:var(--fg)}
.price-col .btn{margin-top:auto}
.fine{color:var(--muted);font-size:13px;margin-top:20px;max-width:720px}
.faq{max-width:820px;display:grid}
details{border-top:1px solid var(--border-2)}
details:last-child{border-bottom:1px solid var(--border-2)}
summary{list-style:none;cursor:pointer;padding:22px 0;font-family:var(--display);font-weight:500;font-size:22px;letter-spacing:-.01em;display:flex;justify-content:space-between;gap:16px;align-items:center}
summary::-webkit-details-marker{display:none}
summary svg{transition:transform .2s;color:var(--muted);flex:none;stroke-width:1.5}details[open] summary svg{transform:rotate(45deg);color:var(--mark)}
details p{padding:0 0 24px;color:var(--fg-2);max-width:660px;font-size:15.5px}
.contact{display:grid;grid-template-columns:1fr 1.1fr;gap:72px;align-items:start}
@media (max-width:900px){.contact{grid-template-columns:1fr;gap:32px}}
.contact h2{font-size:clamp(32px,4vw,48px);font-weight:400;letter-spacing:-.025em;margin:0 0 16px}
.closing{padding:104px 0 56px;display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap}
.closing h2{font-size:clamp(36px,5.6vw,72px);font-weight:400;letter-spacing:-.03em;line-height:1.02;max-width:780px}
.closing h2 em{font-style:italic;font-weight:300}
.s-foot{border-top:1px solid var(--fg);padding:44px 0 30px;margin-top:24px}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:28px}
@media (max-width:760px){.foot-grid{grid-template-columns:1fr 1fr}}
.foot-grid h4{font:600 10.5px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:12px}
.foot-grid a{display:block;padding:3px 0;font-size:14.5px;color:var(--fg-2);text-decoration:none}.foot-grid a.s-brand{display:flex;font-size:25px;color:var(--fg);padding:0}.foot-grid a:hover{color:var(--fg);text-decoration:underline;text-underline-offset:3px}
.foot-bottom{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:34px;padding-top:18px;border-top:1px solid var(--border);font:500 12px var(--mono);color:var(--muted)}

/* Auth et pages légales */
.auth{min-height:100dvh;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
@media (max-width:900px){.auth{grid-template-columns:minmax(0,1fr)}.auth-side{display:none}}
.auth-form{display:flex;flex-direction:column;justify-content:center;padding:36px;max-width:460px;width:100%;margin:0 auto}
.auth-form h1{font-size:46px;font-weight:400;letter-spacing:-.025em;margin:36px 0 10px}
.auth-form a:not(.s-brand){color:var(--fg);text-underline-offset:3px}
.auth-side{background:var(--surface-3);border-left:1px solid var(--border-2);display:grid;place-items:center;padding:48px;position:relative}
.auth-side .sheet{width:min(440px,100%)}
.legal{max-width:760px;margin:0 auto;padding:64px 24px 0}
.legal h1{font-size:50px;font-weight:400;letter-spacing:-.025em;margin:20px 0 20px}.legal h2{font-size:25px;margin:34px 0 8px}.legal p{color:var(--fg-2);margin-bottom:10px;font-size:15.5px}

.boot{min-height:100vh;display:grid;place-content:center;justify-items:center;gap:14px;color:var(--muted);font:500 14px var(--font)}
.boot-dot{width:10px;height:10px;background:var(--mark);animation:bootp 1s ease-in-out infinite}
@keyframes bootp{0%,100%{opacity:.25;transform:scale(.8)}50%{opacity:1;transform:scale(1.1)}}
@media (prefers-reduced-motion:reduce){.boot-dot{animation:none}}

.sync{font:500 11.5px var(--mono);color:var(--muted);display:inline-flex;align-items:center;gap:7px;margin-right:6px}
.sync::before{content:"";width:6px;height:6px;border-radius:1px;background:var(--ok)}
.sync[data-s="saving"]::before{background:var(--warn)}
.sync[data-s="error"]::before{background:var(--err)}
@media (max-width:640px){.sync{display:none}}

/* Offres dans l'application */
.plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@media (max-width:900px){.plans{grid-template-columns:1fr}}
.plan{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:24px}
.plan.best{border-color:var(--fg);box-shadow:inset 0 3px 0 var(--mark)}
.plan h3{font-size:24px}
.plan .price{display:flex;align-items:baseline;gap:6px;margin:12px 0 18px}
.plan .price b{font-family:var(--display);font-size:46px;font-weight:300;letter-spacing:-.03em;line-height:1}
.plan .price span{color:var(--muted);font:500 12.5px var(--mono)}
.plan ul{list-style:none;padding:0;margin:0 0 22px;display:grid;gap:10px;flex:1}
.plan li{display:flex;gap:9px;align-items:flex-start;color:var(--fg-2);font-size:14px}
.plan li svg{flex:none;color:var(--fg);margin-top:3px;stroke-width:1.75}
.plan .btn{width:100%;justify-content:center}

/* Mise en route */
.start{background:var(--surface);border:1px solid var(--border);border-top:2px solid var(--fg);border-radius:0 0 var(--r-lg) var(--r-lg);padding:24px 26px;margin-bottom:22px}
.start-head{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin-bottom:12px}
.start-head h2{font-size:25px}
.start-bar{flex:0 1 260px;width:100%;height:3px;background:var(--surface-3);overflow:hidden}
.start-bar i{display:block;height:100%;background:var(--fg);transition:width .4s ease}
.start-steps{list-style:none;margin:0;padding:0}
.start-steps li{display:flex;align-items:center;gap:16px;padding:14px 0;border-top:1px solid var(--border)}
.start-steps li > div{flex:1;min-width:0;display:grid;gap:2px}
.start-steps li span:not(.start-n){color:var(--muted);font-size:13.5px}
.start-steps li.done b{color:var(--muted);text-decoration:line-through;text-decoration-color:var(--border-2)}
.start-n{flex:none;width:26px;height:26px;border-radius:var(--r);display:grid;place-items:center;font:600 12px var(--mono);border:1px solid var(--border-2);color:var(--muted)}
.start-steps li.now .start-n{border-color:var(--fg);background:var(--fg);color:var(--bg)}
.start-steps li.done .start-n{background:transparent;border-color:var(--ok);color:var(--ok)}
.start-foot{display:flex;align-items:center;gap:12px;flex-wrap:wrap;border-top:1px solid var(--border);padding-top:14px;margin-top:2px;font-size:13.5px}
@media (max-width:640px){.start{padding:18px 16px}.start-steps li{flex-wrap:wrap}.start-steps li .btn{margin-left:42px}}

/* ===== Passe « application » : composants et densité ===== */
:root{--r:6px;--r-sm:6px;--r-lg:9px}
.panel{box-shadow:0 1px 0 rgba(22,20,15,.03)}
:root[data-theme="dark"] .panel{box-shadow:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .panel{box-shadow:none}}

/* Titres de l'interface en grotesque : le serif reste pour la marque et les documents */
.page-head{align-items:center;margin-bottom:22px;padding-bottom:0;border-bottom:0}
.page-head h1{font:650 24px/1.2 var(--font);letter-spacing:-.02em}
.page-head .sub{margin-top:4px;font-size:13.5px;max-width:640px}
.panel-h{align-items:center;padding:13px 16px}
.panel-h h3,.modal-h h3{font:650 14.5px/1.3 var(--font);letter-spacing:-.005em}
.modal-h h3{font-size:16px}
.empty h4{font:650 16px/1.3 var(--font)}
.content{padding:26px 32px 64px}
@media (max-width:980px){.page-head h1{font-size:22px}.content{padding:18px 16px 44px}}

/* Chiffres clés */
.strip,.kpi-strip{border-top:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden}
.strip .lbl,.kpi .k{font:550 12.5px var(--font);letter-spacing:0;text-transform:none;color:var(--muted)}
.strip b,.kpi .v{font:650 26px/1.15 var(--font);letter-spacing:-.025em}
.kpi .t{font-size:12.5px}
.strip>div,.kpi-strip>.kpi,.panel.kpi{padding:16px 20px 15px;gap:5px}
@media (max-width:900px){.strip b,.kpi .v{font-size:23px}}
@media (max-width:480px){.strip b,.kpi .v{font-size:19px}}

/* Tableaux */
.tbl th{font:600 12px var(--font);letter-spacing:0;text-transform:none;color:var(--muted);background:var(--surface-2);border-bottom:1px solid var(--border);padding:9px 16px;position:sticky;top:0;z-index:1}
.panel>.table-wrap>.tbl th:first-child,.panel>.tbl th:first-child{border-top-left-radius:0}
.tbl td{padding:11px 16px;font-size:13.5px}
.tbl td.num{font:500 13.5px var(--font);font-variant-numeric:tabular-nums lining-nums}
.tbl th.r{text-align:right}
.tbl tr.clickable:hover td{background:var(--surface-2)}
.ref{font:500 12.5px var(--mono);color:var(--fg);letter-spacing:0}
.tbl tr.clickable:hover .ref{color:var(--accent)}
.tabs{gap:20px}
.tab{padding:10px 0;font-size:13.5px}
.tab-n{font:550 11.5px var(--font);background:var(--surface-3);color:var(--fg-2);padding:1px 7px;border-radius:99px;margin-left:7px}
.tab.on .tab-n{background:var(--fg);color:var(--bg)}

/* États : pastilles */
.pill{gap:6px;padding:2px 10px 2px 8px;border-radius:99px;background:var(--surface-3);font-size:12.5px;font-weight:600;line-height:1.5}
.pill::before{width:6px;height:6px;border-radius:50%}
.p-ok{background:var(--ok-soft);color:var(--ok)}
.p-warn{background:var(--warn-soft);color:var(--warn)}
.p-err{background:var(--err-soft);color:var(--err)}
.p-info{background:var(--accent-soft);color:var(--accent)}
.p-mute{background:var(--surface-3);color:var(--fg-2)}
.p-mute::before{box-shadow:inset 0 0 0 1.5px var(--muted)}

/* Champs : plus de contrôles natifs */
input,select,textarea{min-height:36px;font-size:14px}
select{appearance:none;-webkit-appearance:none;padding-right:34px;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2374705F' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:12px}
input[type=date]{padding-right:8px;font-variant-numeric:tabular-nums}
input[type=date]::-webkit-calendar-picker-indicator{opacity:.55;cursor:pointer;margin-left:2px}
input[type=date]::-webkit-calendar-picker-indicator:hover{opacity:1}
.field label{font-size:12.5px;font-weight:600;color:var(--fg-2)}

/* Boutons */
.btn{min-height:34px;padding:0 13px;font-size:13.5px;font-weight:600;box-shadow:0 1px 0 rgba(22,20,15,.04)}
.btn-primary{box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 1px 2px rgba(22,20,15,.25)}
.btn-ghost{box-shadow:none}
.btn-sm{min-height:28px;padding:0 10px;font-size:12.5px}
.btn-lg{min-height:44px}

/* Navigation */
.side{padding:14px 10px}
.brand{font-size:21px;padding:2px 10px 14px}
.side-group{font:600 11px var(--font);letter-spacing:.05em;padding:18px 10px 6px}
.nav-item{padding:6px 10px;font-size:13.5px;border-radius:var(--r)}
.nav-item.on{background:var(--surface);box-shadow:0 0 0 1px var(--border),0 1px 2px rgba(22,20,15,.06)}
.nav-item.on::before{left:-10px}
.nav-new{font:600 10.5px var(--font);letter-spacing:.02em;text-transform:none;background:var(--mark);color:#fff;padding:1px 7px;border-radius:99px}
.nav-count{margin-left:auto;min-width:20px;text-align:center;font:650 11.5px var(--font);background:var(--err);color:#fff;padding:1px 6px;border-radius:99px}
:root[data-theme="dark"] .nav-count,:root[data-theme="dark"] .nav-new{color:#12110F}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .nav-count,:root:not([data-theme="light"]) .nav-new{color:#12110F}}
.topbar{height:52px;padding:0 24px}
.cmd-trigger{border-radius:var(--r);min-height:32px;background:var(--surface-2);border-color:transparent}
.cmd-trigger:hover{background:var(--surface-3);border-color:transparent}
.toolbar{padding:10px 16px}
.feed-row{padding:11px 16px}
.avatar{border-radius:50%}
.modal,.cmdk{border-color:var(--border-2);box-shadow:0 24px 60px -20px rgba(0,0,0,.45)}
.callout{border-radius:var(--r)}
.meter-bar{border-radius:99px}.meter-fill{border-radius:99px}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:var(--border-2);border-radius:99px;border:2px solid var(--bg)}::-webkit-scrollbar-track{background:transparent}
.content .num.mono,.content .panel-h .mono,.content .stat-row .mono{font-family:var(--font);font-variant-numeric:tabular-nums lining-nums}
.content .panel-h .mono{font-size:12px!important}
.paper .mono{font-family:var(--mono)}
.page-head .sub{display:none}
.lines-h{font:600 12px var(--font);letter-spacing:0;text-transform:none}
.mail pre{font-family:var(--font);font-size:13.5px}

/* ===== Site public, même langage visuel que l'application ===== */
.s-header{background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:saturate(1.4) blur(10px)}
.s-nav{height:60px}
.s-brand,.foot-grid a.s-brand{font:650 19px var(--font);letter-spacing:-.02em}
.s-links a{font-size:14px;font-weight:550}
.hero{padding:76px 0 80px}
.hero h1{font:650 clamp(38px,5.2vw,64px)/1.04 var(--font);letter-spacing:-.035em}
.hero h1 em{font-style:normal;font-weight:650;color:var(--mark)}
.hero .lead{font-size:clamp(16.5px,1.5vw,18.5px);max-width:520px}
.hero-note{font:500 13px var(--font);letter-spacing:0}
.note{border-left:0;padding:14px 16px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);max-width:400px}
.note .lbl{font:600 12px var(--font);letter-spacing:0;text-transform:none}
.note p{font:500 15px/1.45 var(--font)}
.facts b{font:650 16px var(--font);letter-spacing:-.01em}
.facts span{font-size:13.5px}
.eyebrow{font:600 12.5px var(--font);letter-spacing:0;text-transform:none;color:var(--fg-2);background:var(--surface-3);border-radius:99px;padding:4px 12px 4px 10px;gap:8px;width:max-content;max-width:100%;margin-bottom:20px}
.eyebrow::before{width:6px;height:6px;border-radius:50%}
.block{padding:92px 0}
@media (max-width:760px){.block{padding:60px 0}}
.block-head{margin-bottom:44px}
.block-head h2,.contact h2{font:650 clamp(28px,3.8vw,44px)/1.08 var(--font);letter-spacing:-.03em}
.block-head p{font-size:16.5px}
.frame{border-color:var(--border);box-shadow:0 24px 50px -30px rgba(22,20,15,.35)}
.frame-bar{font:600 12.5px var(--font);letter-spacing:0;text-transform:none;border-bottom-color:var(--border)}
.frame-bar span.mono{font:500 12px var(--font)}

/* Fonctionnalités : cartes */
.feat-list{column-gap:16px;row-gap:16px}
.feat-list>div{border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface);padding:24px 24px 26px}
.feat-list h3{font:650 18px/1.3 var(--font);letter-spacing:-.015em}
.feat-list h3::before{display:grid;place-items:center;width:30px;height:30px;border-radius:var(--r);background:var(--surface-3);font:600 12px var(--font);letter-spacing:0;color:var(--fg-2);margin-bottom:16px}
.feat-list p{font-size:15px}

/* Étapes */
.steps-list{gap:12px;max-width:860px}
.steps-list>div,.steps-list>div:last-child{grid-template-columns:56px 1fr;gap:16px;padding:22px 24px;border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface)}
.steps-list .n{font:650 20px var(--font);font-style:normal;color:var(--bg);background:var(--fg);width:40px;height:40px;border-radius:50%;display:grid;place-items:center;line-height:1}
.steps-list h3{font:650 18px/1.3 var(--font);letter-spacing:-.015em}
.steps-list p{font-size:15px;margin-top:6px}

/* État du produit */
.road{border-collapse:separate;border-spacing:0;border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;background:var(--surface)}
.road td{padding:16px 20px;border-top:1px solid var(--border)}
.road tr:first-child td{border-top:0}
.road tr:last-child td{border-bottom:0}
.road td:last-child{padding-right:20px}
.road b{font:650 15.5px var(--font);letter-spacing:-.01em}
.road span{font-size:13.5px}

/* Tarifs : trois cartes */
.price-grid{gap:16px;border:0}
.price-col,.price-col:first-child,.price-col:last-child{border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface);padding:28px}
.price-col.rec{border-color:var(--fg);box-shadow:0 0 0 1px var(--fg),0 24px 50px -30px rgba(22,20,15,.4)}
@media (min-width:901px){.price-col.rec{margin-top:0}}
.price-col .tagline{font:600 11.5px var(--font);letter-spacing:0;text-transform:none;color:var(--bg);background:var(--mark);width:max-content;padding:0 10px;border-radius:99px;height:22px;line-height:22px;margin-bottom:12px}
.price-col:not(.rec) .tagline{visibility:hidden}
.price-col h3{font:650 22px var(--font);letter-spacing:-.02em}
.price-col .desc{min-height:44px;font-size:14.5px}
.price-col .amount{font:650 44px/1 var(--font);letter-spacing:-.04em;margin-top:18px}
.price-col .amount small{font:500 14px var(--font);margin-left:4px}
.price-col ul{margin:24px 0 28px}
.price-col li{padding-left:24px}
.price-col li::before{width:14px;height:14px;top:.35em;border-radius:50%;background:var(--ok-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232F6B4F' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E") center/9px no-repeat}
@media (max-width:900px){.price-col,.price-col:first-child,.price-col:last-child{padding:26px;border-bottom:1px solid var(--border)}.price-col.rec{border-bottom-color:var(--fg)}}
.plan .price b{font:650 36px/1 var(--font);letter-spacing:-.035em}
.plan .price span{font:500 13px var(--font)}

/* FAQ */
.faq{gap:10px;max-width:860px}
details,details:last-child{border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface);padding:0 22px}
summary{font:650 16px/1.4 var(--font);letter-spacing:-.01em;padding:18px 0}
details p{font-size:15px;padding-bottom:20px}
details[open] summary svg{color:var(--fg)}

/* Appel final, pied de page */
.closing{padding:88px 24px 48px}
.contact .mono{font:600 15px var(--font)}
.closing h2{font:650 clamp(32px,4.8vw,56px)/1.05 var(--font);letter-spacing:-.035em}
.closing h2 em{font-style:normal;font-weight:650;color:var(--mark)}
.s-foot{border-top:1px solid var(--border)}
.foot-grid h4{font:600 12px var(--font);letter-spacing:0;text-transform:none}
.foot-bottom{font:500 12.5px var(--font)}

/* Connexion, pages légales */
.auth-form h1{font:650 32px/1.15 var(--font);letter-spacing:-.03em;margin:32px 0 8px}
.auth-side{background:var(--surface-2)}
.legal h1{font:650 34px/1.15 var(--font);letter-spacing:-.03em}
.legal h2{font:650 18px var(--font);letter-spacing:-.01em}

/* ---------- Page publique (lien client) et nouvelles pages ---------- */
.pub{max-width:860px;margin:0 auto;padding:20px 16px 40px;display:grid;gap:14px}
.pub-top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:6px 2px}
.pub-from b{font-weight:600}
.pub-act{padding:14px 16px}
.pub-row{display:flex;justify-content:space-between;gap:14px;align-items:center;flex-wrap:wrap}
.pub-paper{overflow-x:auto}
.pub-foot{font-size:12.5px;color:var(--muted);text-align:center;padding-top:6px}
.pub-box{max-width:420px;margin:12vh auto 0;display:grid;gap:10px;justify-items:start}
.pub-box h1{font:600 24px var(--display);margin:6px 0 0}
.panel-b h3,.pub-box h1{font-family:var(--font);font-weight:650;letter-spacing:-.005em}
.pub-box h1{font-size:22px}
@media (max-width:600px){.pub .paper{min-width:0;padding:22px 14px 20px;font-size:11px}.pub .paper .tt h4{font-size:24px}.pub .paper table{table-layout:auto}}
.mail .mail-edit{width:100%;border:0;border-top:1px solid var(--border);border-radius:0;padding:14px;font:13.5px/1.6 var(--font);background:transparent;resize:vertical}
.tbl-more{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;border-top:1px solid var(--line);font-size:12.5px}

/* ---------- Responsive : petits écrans ---------- */
.t-short{display:none}
@media (max-width:420px){
  .wrap{padding-inline:16px}.s-mobile{padding-inline:16px}
  .s-nav{gap:10px}.s-brand{font-size:22px}.s-actions{gap:6px}
  .t-long{display:none}.t-short{display:inline}
  .auth-form{padding:24px 16px}
}
.callout,.auth-form .muted,.legal p{overflow-wrap:anywhere}
@media (max-width:980px){.hero-grid{grid-template-columns:minmax(0,1fr)}}
.hero-grid>*,.sheet,.sheet-wrap{min-width:0}
@media (max-width:900px){.auth-side{display:none}}
@media (max-width:480px){.sheet .paper{padding:16px 12px;font-size:10px}.sheet .paper .tt h4{font-size:22px}.sheet .paper table{table-layout:auto}}
.modal-bg{grid-template-columns:minmax(0,1fr)}.modal,.modal-b{min-width:0}.modal-b{overflow-wrap:anywhere}

/* ===== Affinage : mêmes formes, finitions plus soignées ===== */
:root{--ease:cubic-bezier(.2,.7,.2,1);--sh-1:0 1px 1px rgba(22,20,15,.04),0 1px 2px rgba(22,20,15,.04);--sh-2:0 1px 2px rgba(22,20,15,.05),0 10px 26px -14px rgba(22,20,15,.22);--hover:rgba(22,20,15,.035)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--sh-1:0 1px 0 rgba(0,0,0,.35);--sh-2:0 12px 30px -16px rgba(0,0,0,.8);--hover:rgba(255,255,255,.04)}}
:root[data-theme="dark"]{--sh-1:0 1px 0 rgba(0,0,0,.35);--sh-2:0 12px 30px -16px rgba(0,0,0,.8);--hover:rgba(255,255,255,.04)}

/* Focus clavier net et homogène, sans anneau au clic souris */
:focus{outline:none}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--r)}
.btn:focus-visible,.icon-btn:focus-visible,.nav-item:focus-visible,.cmd-trigger:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:none}
.tbl tr.clickable:focus-visible{outline:none}
.tbl tr.clickable:focus-visible td{background:var(--accent-soft)}
.tbl tr.clickable:focus-visible td:first-child{box-shadow:inset 2px 0 0 var(--accent)}

/* Boutons : retour tactile discret */
.btn,.icon-btn,.nav-item{transition:background-color .14s var(--ease),border-color .14s var(--ease),color .14s var(--ease),box-shadow .14s var(--ease),transform .14s var(--ease)}
.btn:active:not(:disabled),.icon-btn:active{transform:translateY(.5px) scale(.985)}
.btn-primary{box-shadow:var(--sh-1)}
.btn-primary:hover{box-shadow:var(--sh-2)}
.btn:disabled{filter:saturate(.6)}
.nav-item:hover{background:var(--hover)}

/* Surfaces : un relief très léger, des rayons un peu plus doux */
.panel,.kpi-strip,.strip{box-shadow:var(--sh-1)}
.panel-h{padding:14px 18px 12px}
.panel-b{padding:18px}
.modal{animation:mpop .18s var(--ease)}
.modal-bg{animation:mfade .16s ease-out}
@keyframes mpop{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}
@keyframes mfade{from{opacity:0}to{opacity:1}}
.cmdk{animation:mpop .16s var(--ease)}

/* Chiffres et tableaux plus lisibles */
.kpi .v,.strip b{letter-spacing:-.03em}
.kpi .k,.strip .lbl{font:600 11.5px var(--font);letter-spacing:.04em}
.tbl th{font:600 11.5px var(--font);letter-spacing:.05em;padding:11px 16px;border-bottom:1px solid var(--border-2);background:var(--surface-2);color:var(--muted)}
.tbl td{padding:13px 16px}
.tbl td.num,.tbl td.r{font-family:var(--font);font-variant-numeric:tabular-nums lining-nums;font-size:13.5px}
.tbl tbody tr{transition:background-color .1s}
.tbl tr.clickable:hover td{background:var(--hover)}
.tbl tr.clickable:active td{background:var(--accent-soft)}
.tbl-more{background:var(--surface-2)}
.ref{font:600 12.5px var(--mono);letter-spacing:0}

/* Listes et états vides */
.feed-row{transition:background-color .12s}
a.feed-row:hover,.feed-row.clickable:hover{background:var(--hover)}
.empty{padding:56px 20px}
.empty-ic{background:var(--surface-2);border-color:transparent;width:44px;height:44px;border-radius:12px}

/* Site : cartes qui réagissent au survol (souris uniquement) */
@media (hover:hover){
  .feat-list>div,.price-col,.steps-list>div{transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s var(--ease)}
  .feat-list>div:hover,.steps-list>div:hover{transform:translateY(-2px);box-shadow:var(--sh-2);border-color:var(--border-2)}
  .price-col:not(.rec):hover{transform:translateY(-2px);box-shadow:var(--sh-2)}
}
details{transition:border-color .15s,box-shadow .15s}
details[open]{box-shadow:var(--sh-1);border-color:var(--border-2)}
summary{cursor:pointer}

/* Défilement, sélection, barres */
@media (min-width:900px){html{scrollbar-gutter:stable}}
.content{scrollbar-width:thin;scrollbar-color:var(--border-2) transparent}
.content,.table-wrap,.modal-b{overscroll-behavior:contain}
.table-wrap{scrollbar-width:thin;scrollbar-color:var(--border-2) transparent}
.toast{box-shadow:var(--sh-2)}

/* Petits écrans : zones tactiles confortables, raccourci clavier masqué */
@media (max-width:760px){
  .cmd-trigger .kbd{display:none}
  .cmd-trigger{width:auto;flex:1;min-width:0}
  .btn{min-height:40px}.btn-sm{min-height:34px}
  .icon-btn{width:40px;height:40px}.s-actions .icon-btn{width:36px;height:36px}
  input,select,textarea{min-height:42px;font-size:16px}
  .content{padding-inline:16px}
}
@media (pointer:coarse){.tbl td{padding-block:14px}.nav-item{padding-block:10px}}
@media (max-width:900px){.kpi-strip>.panel.kpi:nth-child(2n){border-right:0}}
@media (max-width:760px){
  .tbl th,.tbl td{padding-inline:12px}
  .tbl td:not(:first-child):not(.r){white-space:normal;min-width:84px}
}
.only-sm{display:none}
@media (max-width:760px){.only-sm{display:block;margin-top:5px}}
@media (max-width:760px){.tbl td:first-child:has(.cell-main){white-space:normal;min-width:120px}}
@media (max-width:1100px){.hide-sm{display:none}}
@media (max-width:480px){.tbl th,.tbl td{padding-inline:10px}.tbl td:not(:first-child):not(.r){min-width:0}.ref{font-size:12px}.tbl-more{padding-inline:12px}}
