:root{
  --bg:#E6E1DC; --paper:#F5F2EE; --white:#FFFFFF; --ink:#1F1A17; --muted:#5A524B; --line:#D3CBC2; --rule:#C9B9B2; --soft:#DDD5CC;
  --pourpre:#4A0612; --pourpre-2:#6B1E2C; --pourpre-3:#7A3340; --rose:#E9D3C9;
  --canard:#356268; --terracotta:#B96B4B; --terracotta-ink:#8F4A2E; --sauge:#838670; --sauge-ink:#5E614C; --sable:#D5C086; --sable-ink:#6B5717;
  --serif:'Cormorant Garamond', Georgia, serif; --text:'EB Garamond', Georgia, serif; --sans:Urbanist, system-ui, sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:14px}
a{color:var(--pourpre)} a:hover{color:#2E030A}
button,input,select,textarea{font:inherit;color:inherit}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--canard);outline-offset:2px}
.loading{padding:60px;font-family:var(--serif);font-size:28px;font-style:italic}

.app{display:flex;flex-wrap:wrap;min-height:100vh}
.side{flex:1 1 240px;background:var(--pourpre);color:#fff;padding:30px 22px;display:flex;flex-direction:column;gap:30px}
.logo{font-family:var(--serif);font-size:34px;font-weight:600;letter-spacing:3px;line-height:1;color:#fff;text-decoration:none}
.logo i{font-weight:500}
.logo-sub{font-size:10px;font-weight:600;letter-spacing:3px;color:var(--rose);margin-top:6px}
.nav{display:flex;flex-direction:column;gap:2px;font-size:12px;font-weight:600;letter-spacing:2px}
.nav a{color:var(--rose);text-decoration:none;padding:13px 14px;display:flex;align-items:center;gap:10px}
.nav a.on{color:#fff;background:var(--pourpre-2)}
.nav a:hover{color:#fff}
.nav .count{margin-left:auto;background:var(--sable);color:var(--pourpre);font-size:11px;font-weight:700;padding:2px 8px;letter-spacing:0}
.who{margin-top:auto;display:flex;align-items:center;gap:12px;border-top:1px solid var(--pourpre-3);padding-top:18px}
.who .av{width:38px;height:38px;background:var(--canard);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:18px;font-style:italic;font-weight:600}
.who button{background:none;border:0;color:var(--rose);font-size:12px;padding:0;cursor:pointer;text-decoration:underline}
.main{flex:999 1 560px;min-width:0;padding:34px 40px 60px;display:flex;flex-direction:column;gap:26px}
@media (max-width:820px){
  .side{flex-basis:100%;padding:18px 16px;gap:14px}
  .nav{flex-direction:row;flex-wrap:wrap}
  .nav a{padding:10px 12px}
  .who{margin-top:0;padding-top:12px}
  .main{padding:22px 16px 48px}
}

.eyebrow{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:11px;font-weight:700;letter-spacing:3px;color:var(--canard)}
.eyebrow a{color:var(--canard);text-decoration:none}
.eyebrow .rule{width:48px;height:1px;background:var(--canard)}
.eyebrow em{font-family:var(--text);font-size:16px;font-weight:400;letter-spacing:0;color:var(--muted)}
.title{margin:0;font-family:var(--serif);font-size:clamp(34px,5vw,52px);font-style:italic;font-weight:500;line-height:1.04}
.head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:18px}
.head-l{display:flex;flex-direction:column;gap:10px;min-width:0}
.sub{font-family:var(--text);font-size:18px;font-style:italic;color:var(--muted)}
.tags{display:flex;flex-wrap:wrap;gap:8px}
.tag{font-size:11px;font-weight:700;letter-spacing:1.5px;padding:5px 10px;border:1px solid currentColor;text-transform:uppercase}
.tag.fill{background:var(--canard);border-color:var(--canard);color:#fff}
.actions{display:flex;flex-wrap:wrap;gap:10px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 20px;border:1px solid var(--ink);background:transparent;color:var(--ink);font-size:12px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;text-decoration:none;cursor:pointer}
.btn:hover{background:rgba(0,0,0,.04)}
.btn.primary{background:var(--pourpre);border-color:var(--pourpre);color:#fff}
.btn.primary:hover{background:var(--pourpre-2)}
.btn.small{min-height:36px;padding:0 12px;font-size:11px}
.btn.link{border:0;padding:0;min-height:36px;text-decoration:underline}
.btn[disabled]{opacity:.5;cursor:default}
.pill{min-height:36px;padding:0 14px;border:1px solid var(--ink);background:transparent;font-size:11px;font-weight:700;letter-spacing:1.5px;cursor:pointer}
.pill[aria-pressed="true"]{background:var(--pourpre);border-color:var(--pourpre);color:#fff}
.seg{display:flex}
.seg .pill{min-height:46px;padding:0 22px;border-color:var(--pourpre);color:var(--pourpre);font-size:12px}
.seg .pill[aria-pressed="true"]{color:#fff}

.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(330px,1fr));gap:22px;align-items:start}
.col{display:flex;flex-direction:column;gap:22px;min-width:0}
.card{background:var(--paper);border:1px solid var(--line);padding:24px;display:flex;flex-direction:column;gap:14px;min-width:0}
.card-h{display:flex;align-items:center;gap:12px}
.card-h h2{margin:0;font-size:11px;font-weight:700;letter-spacing:3px;color:var(--pourpre);text-transform:uppercase;white-space:nowrap}
.card-h .line{flex:1 1 auto;height:1px;background:var(--rule)}
.card-h em{font-family:var(--text);font-size:15px;color:var(--muted)}
.kv{display:grid;grid-template-columns:120px minmax(0,1fr);row-gap:11px;column-gap:12px}
.kv dt{color:var(--muted)} .kv dd{margin:0;overflow-wrap:anywhere}
.note{margin:0;font-family:var(--text);font-size:15px;font-style:italic;color:var(--muted);line-height:1.45}
.prose{margin:0;font-family:var(--text);font-size:17px;line-height:1.5;white-space:pre-line}
.empty{margin:0;font-family:var(--text);font-size:16px;font-style:italic;color:var(--muted)}

.item{display:flex;align-items:center;gap:14px;padding:12px;min-height:44px;text-decoration:none;color:var(--ink);border:1px solid var(--line);background:var(--white)}
.item:hover{border-color:var(--pourpre)}
.item .txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.name{font-family:var(--serif);font-size:21px;font-weight:600;line-height:1.15}
.meta{font-size:12px;color:var(--muted)}
.badge{width:42px;height:42px;flex:0 0 42px;display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:19px;font-style:italic;font-weight:600;color:#fff;background:var(--canard)}
mark{background:#EDE2C2;color:var(--pourpre);padding:0 1px}

.media-row{display:flex;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid var(--soft);flex-wrap:wrap}
.media-row:last-of-type{border-bottom:0}
.sq{width:12px;height:12px;flex:0 0 12px}
.media-row .txt{flex:1 1 180px;display:flex;flex-direction:column;gap:2px}
.media-row select{min-height:36px;border:1px solid var(--ink);background:#fff;padding:0 8px;font-size:12px;font-weight:600;border-radius:0}
.status{padding:4px 9px;font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase}
.st-Proposé{background:#EDE2C2;color:#5C4A12}.st-Signé{background:#DCDFE0;color:#24474C}.st-Refusé{background:#E9D3C9;color:#6B1E2C}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;gap:8px;border:2px solid currentColor;padding:4px 8px;font-size:10px;font-weight:700;letter-spacing:1.5px;background:transparent}
button.chip{min-height:36px;padding:0 12px;font-size:11px;cursor:pointer}

.rem{display:flex;gap:14px;align-items:flex-start;padding:14px;border:1px solid var(--line);background:transparent}
.rem.late{border:2px solid var(--terracotta);background:#fff}
.rem input{width:18px;height:18px;margin-top:3px;accent-color:var(--pourpre);flex:0 0 18px}
.rem .t{font-family:var(--serif);font-size:20px;font-weight:600}
.rem .d{font-size:12px;color:var(--muted)} .rem.late .d{color:var(--terracotta-ink);font-weight:600}
.rem .txt{display:flex;flex-direction:column;gap:3px;min-width:0}

.hist{display:flex;flex-direction:column;gap:4px;padding:0 0 14px;border-bottom:1px solid var(--soft)}
.hist:last-child{border-bottom:0;padding-bottom:0}
.hist .k{font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase}
.k-email{color:var(--canard)}.k-courrier{color:var(--terracotta-ink)}.k-appel{color:var(--sauge-ink)}.k-note{color:var(--muted)}.k-in{color:var(--muted)}
.hist details summary{cursor:pointer;font-size:12px;color:var(--muted)}
.hist .body{margin:8px 0 0;font-family:var(--text);font-size:16px;line-height:1.5;white-space:pre-line}

.ai{background:var(--pourpre);color:#fff;padding:26px 24px;display:flex;flex-direction:column;gap:14px}
.ai .card-h h2{color:var(--sable)} .ai .card-h .line{background:var(--sable)}
.ai .big{font-family:var(--serif);font-size:28px;font-style:italic;font-weight:500;line-height:1.1}
.ai p{margin:0;font-family:var(--text);font-size:16px;color:var(--rose);line-height:1.45}
.ai .foot{padding-top:12px;border-top:1px solid var(--pourpre-3);font-family:var(--sans);font-size:12px}
.ai select{min-height:36px;background:transparent;color:#fff;border:1px solid var(--rose);padding:0 8px;border-radius:0}
.ai select option{color:#000}
.ai .btn{border-color:#fff;color:#fff}
.sugg{border:2px solid var(--sable)}

.search{display:flex;align-items:center;gap:14px;border-bottom:2px solid var(--pourpre);padding:6px 0}
.search input{flex:1 1 auto;min-width:0;min-height:60px;border:0;background:transparent;outline:none;font-family:var(--serif);font-size:clamp(28px,4vw,40px);font-style:italic;font-weight:500}
.summary{font-size:12px;font-weight:600;letter-spacing:1.5px;color:var(--muted);text-transform:uppercase}

.field{display:flex;flex-direction:column;gap:6px;font-size:11px;font-weight:700;letter-spacing:1.5px;color:var(--muted);text-transform:uppercase}
.field input,.field select,.field textarea{min-height:44px;border:1px solid var(--ink);border-radius:0;background:#fff;padding:0 12px;font-family:var(--sans);font-size:14px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--ink)}
.field textarea{padding:10px 12px;min-height:90px;resize:vertical}
.fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.check{display:flex;align-items:center;gap:12px;min-height:44px;cursor:pointer}
.check input{width:20px;height:20px;accent-color:var(--pourpre);flex:0 0 20px}
.check .txt{display:flex;flex-direction:column;gap:2px}

.compose-grid{display:grid;grid-template-columns:76px minmax(0,1fr);row-gap:10px;column-gap:12px;align-items:center}
.lbl{font-size:11px;font-weight:700;letter-spacing:1.5px;color:var(--muted)}
.uline{min-height:44px;border:0;border-bottom:1px solid var(--ink);background:transparent;padding:0 2px;width:100%}
.subject{font-family:var(--serif);font-size:22px;font-weight:600;min-height:48px}
.bodytxt{width:100%;min-height:300px;border:1px solid var(--line);border-radius:0;background:#fff;padding:18px;font-family:var(--text);font-size:18px;line-height:1.55;resize:vertical}
.letterbox{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;padding:18px;background:#fff;border:1px solid var(--line)}
.letterbox .v{font-family:var(--text);font-size:16px;line-height:1.45;white-space:pre-line}
.remind{border:2px solid var(--sable);background:#fff;padding:8px 14px}
.split{display:flex;flex-wrap:wrap;gap:22px;align-items:flex-start}
.split > .wide{flex:999 1 520px;min-width:0}
.split > .narrow{flex:1 1 320px;min-width:0;display:flex;flex-direction:column;gap:22px}

table.list{width:100%;border-collapse:collapse;min-width:560px}
table.list th{text-align:left;font-size:11px;letter-spacing:1.5px;color:var(--muted);font-weight:600;padding:8px 6px;border-bottom:1px solid var(--ink);text-transform:uppercase}
table.list td{padding:12px 6px;border-bottom:1px solid var(--soft);vertical-align:top}
table.list td .name{font-size:19px}
.scroll{overflow-x:auto}

.dlg{border:0;padding:0;max-width:640px;width:calc(100% - 32px);background:var(--paper);color:var(--ink)}
.dlg::backdrop{background:rgba(31,26,23,.55)}
.dlg form{padding:26px;display:flex;flex-direction:column;gap:18px}
.dlg h2{margin:0;font-family:var(--serif);font-size:32px;font-style:italic;font-weight:500}
.dlg .row{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.err{color:#8A1020;font-weight:600}

.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:14px 20px;font-weight:600;opacity:0;pointer-events:none;transition:.25s;max-width:calc(100% - 32px)}
.toast.on{opacity:1;transform:translateX(-50%) translateY(0)}

.login{min-height:100vh;width:100%;display:flex;align-items:center;justify-content:center;background:var(--pourpre);padding:16px}
.login form{background:var(--paper);padding:36px 32px;width:100%;max-width:420px;display:flex;flex-direction:column;gap:18px}
.login .logo{color:var(--pourpre)}

.print-only{display:none}
@media print{
  body{background:#fff}
  .app,.dlg,.toast{display:none!important}
  .print-only{display:block;font-family:var(--text);font-size:12pt;line-height:1.5;color:#000;padding:10mm 8mm}
  .print-only .lh{font-family:var(--serif);font-size:26pt;font-weight:600;letter-spacing:3px;color:var(--pourpre)}
  .print-only .addr{margin:14mm 0 10mm auto;width:75mm;white-space:pre-line}
  .print-only .date{text-align:right;margin-bottom:8mm}
  .print-only .obj{font-weight:600;margin-bottom:6mm}
  .print-only .txt{white-space:pre-line}
}
.ver{position:fixed;right:10px;bottom:6px;font-size:10px;letter-spacing:.5px;color:var(--muted);opacity:.75;pointer-events:none;z-index:5}
@media print{.ver{display:none}}
.side{padding-bottom:16px}
.side-ver{margin-top:-14px;font-size:10px;letter-spacing:1px;color:var(--rose);opacity:.6}
body.in-app .ver{display:none}
@media (max-width:820px){.side-ver{margin-top:-6px}}

/* Menu latéral réductible */
.side{transition:flex-basis .2s ease, padding .2s ease}
.side-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.logo .mini{display:none;font-size:40px}
.side-toggle{flex:0 0 36px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:transparent;border:1px solid var(--pourpre-3);color:var(--rose);cursor:pointer}
.side-toggle:hover{color:#fff;border-color:var(--rose)}
.logo-sub{margin-top:-24px}
.nav a{position:relative}
.nav a svg{flex:0 0 18px}
.logout-ic{display:none;background:none;border:0;color:var(--rose);cursor:pointer;width:38px;height:38px;align-items:center;justify-content:center}
.logout-ic:hover{color:#fff}
.app.collapsed .side{flex:0 0 84px;padding:24px 12px 16px;align-items:center}
.app.collapsed .side-top{flex-direction:column;gap:14px}
.app.collapsed .logo .full,.app.collapsed .logo-sub,.app.collapsed .nav .nl,.app.collapsed .who-txt{display:none}
.app.collapsed .logo .mini{display:inline}
.app.collapsed .nav{width:100%}
.app.collapsed .nav a{justify-content:center;padding:13px 0}
.app.collapsed .nav .count{position:absolute;top:4px;right:8px;margin:0;padding:1px 5px;font-size:10px}
.app.collapsed .who{flex-direction:column;gap:6px;width:100%}
.app.collapsed .logout-ic{display:flex}
.app.collapsed .side-ver{margin-top:-10px;font-size:8px;letter-spacing:0;text-align:center}
@media (max-width:820px){
  .side-toggle{display:none}
  .logo-sub{margin-top:-8px}
  .app.collapsed .side{flex:1 1 100%;padding:18px 16px;align-items:stretch}
  .app.collapsed .side-top{flex-direction:row}
  .app.collapsed .logo .full,.app.collapsed .logo-sub,.app.collapsed .who-txt{display:block}
  .app.collapsed .nav .nl{display:inline}
  .app.collapsed .logo .mini,.app.collapsed .logout-ic{display:none}
  .app.collapsed .nav a{justify-content:flex-start;padding:10px 12px}
  .app.collapsed .nav .count{position:static;margin-left:auto}
  .app.collapsed .who{flex-direction:row}
  .app.collapsed .side-ver{margin-top:-6px;font-size:10px;letter-spacing:1px;text-align:left}
}