/* Design system Financial Times.
   Les noms de variables du prototype sont conservés (app.js les référence),
   seules les valeurs changent : --gold porte le claret FT, --sage le jade,
   --wine le crimson. Fontes : substituts libres de Financier Display / Metric. */
:root{
  --ink:#003E74;         /* bleu marine du logo Jinqiao Partners — unifie titres et texte */
  --paper:#FFF1E5;
  --surface:#FFFFFF;
  --muted:#66605B;
  --muted-2:#8A827A;
  --line:#E0D5C9;
  --gold:#990F3D;        /* claret — accent principal FT */
  --gold-soft:#F5E0E7;
  --gold-deep:#70092C;
  --sage:#00994D;        /* jade — couverture haute / succès */
  --sage-soft:#DFF1E6;
  --wine:#C00000;        /* crimson — alertes, enregistrement */
  --wine-soft:#F9E1E1;
  --teal:#0D7680;        /* teal FT — boutons et éléments interactifs */
  --teal-deep:#08474D;
  --teal-soft:#DDEDEE;
  --oxford:#0F5499;      /* bleu FT — bannières d'information */
  --sky:#CCE6FF;
  --wheat:#F2DFCE;
  --slate:#262A33;
  --radius:0;
  --radius-sm:0;
  --serif:'Playfair Display', Georgia, serif;
  --sans:'Inter', 'Helvetica Neue', Arial, sans-serif;
  --mono:'IBM Plex Mono', monospace;
  --shadow: none;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}
@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.01ms !important; transition-duration:0.01ms !important;}
}
::selection{background:var(--sky); color:var(--ink);}

a{color:inherit;}
button{font-family:var(--sans); cursor:pointer;}
input, textarea, select{font-family:var(--sans);}

.app{max-width:1180px; margin:0 auto; padding:0 24px 80px;}
header.topbar{
  display:flex; align-items:center; justify-content:space-between;
  padding:28px 0 20px;
  border-bottom:3px double var(--ink); /* double filet du masthead FT */
  margin-bottom:28px;
}
.brand{display:flex; align-items:center; gap:14px;}
.brand-logo{height:32px; width:auto; flex:none; display:block;}
.brand-sep{width:1px; align-self:stretch; background:var(--line); flex:none;}
.brand h1{font-family:var(--serif); font-weight:700; font-size:24px; margin:0; letter-spacing:0.2px;}
.brand .tagline{font-size:12.5px; color:var(--muted); letter-spacing:0.3px;}
.topbar-actions{display:flex; gap:10px; align-items:center;}
.icon-btn{
  width:38px; height:38px; border:1px solid var(--line);
  background:var(--surface); display:flex; align-items:center; justify-content:center;
  transition:border-color .15s;
}
.icon-btn:hover{border-color:var(--teal);}
.icon-btn svg{width:17px; height:17px; stroke:var(--ink);}

.btn{
  border:none; padding:11px 20px; font-size:14px; font-weight:600;
  letter-spacing:0.2px; transition:background .15s, border-color .15s, color .15s;
  display:inline-flex; align-items:center; gap:8px;
}
.btn-primary{background:var(--teal); color:#fff;}
.btn-primary:hover{background:var(--teal-deep);}
.btn-primary:disabled{opacity:0.4; cursor:not-allowed;}
.btn-gold{background:var(--gold); color:#fff;}
.btn-gold:hover{background:var(--gold-deep);}
.btn-gold:disabled{opacity:0.4; cursor:not-allowed;}
.btn-ghost{background:transparent; color:var(--teal); border:1px solid var(--teal);}
.btn-ghost:hover{background:var(--teal-soft);}
.btn-wine{background:var(--wine); color:#fff;}
.btn-wine:hover{background:#990000;}
.btn-sm{padding:7px 14px; font-size:12.5px;}
.btn-block{width:100%; justify-content:center;}

.card{
  background:var(--surface); border:1px solid var(--line);
  border-top:2px solid var(--ink); /* filet supérieur des cartes FT */
}
.pad-lg{padding:32px;}
.pad-md{padding:22px;}

.eyebrow{
  font-size:11px; text-transform:uppercase; letter-spacing:1.6px; color:var(--gold);
  font-weight:700; margin-bottom:8px;
}
h2.section-title{font-family:var(--serif); font-size:26px; font-weight:700; margin:0 0 6px;}
p.lede{color:var(--muted); font-size:14.5px; line-height:1.6; margin:0 0 26px; max-width:60ch;}

label.field-label{display:block; font-size:12.5px; font-weight:600; color:var(--muted); margin-bottom:6px; letter-spacing:0.2px;}
input[type=text], input[type=password], textarea, select{
  width:100%; border:1px solid var(--line);
  padding:12px 14px; font-size:14.5px; color:var(--ink); background:var(--paper);
  transition:border-color .15s;
}
input[type=text]:focus, input[type=password]:focus, textarea:focus, select:focus{
  outline:none; border-color:var(--teal);
}
textarea{resize:vertical; font-family:var(--sans); line-height:1.55;}
.field{margin-bottom:18px;}
.field-row{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
@media (max-width:640px){ .field-row{grid-template-columns:1fr;} }
.helper{font-size:12px; color:var(--muted-2); margin-top:6px; line-height:1.5;}

/* ---- Home ---- */
.home-grid{display:grid; grid-template-columns:1.1fr 1.4fr; gap:24px; align-items:start;}
@media (max-width:900px){ .home-grid{grid-template-columns:1fr;} }

.history-item{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:16px 18px; border:1px solid var(--line);
  margin-bottom:10px; background:var(--surface); transition:border-color .15s;
}
.history-item:hover{border-color:var(--teal);}
.history-item .meta{cursor:pointer; flex:1; min-width:0;}
.history-item .client{font-weight:700; font-size:14.5px;}
.history-item .sub{font-size:12.5px; color:var(--muted); margin-top:2px;}
.chip{
  display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:700;
  padding:4px 9px; background:var(--sage-soft); color:var(--sage);
  letter-spacing:0.2px; flex:none;
}
.del-btn{
  background:none; border:none; color:var(--muted-2); font-size:18px; line-height:1; padding:4px 8px;
}
.del-btn:hover{color:var(--wine); background:var(--wine-soft);}
.empty-state{padding:36px 20px; text-align:center; color:var(--muted);}
.empty-state .glyph{font-size:26px; margin-bottom:8px; font-family:var(--serif); color:var(--gold);}

/* ---- Session ---- */
.session-head{display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:20px; flex-wrap:wrap;}
.session-title h2{font-family:var(--serif); font-size:24px; font-weight:700; margin:0 0 3px;}
.session-title .sub{font-size:13px; color:var(--muted);}
.rec-indicator{display:flex; align-items:center; gap:8px; font-size:12.5px; font-weight:600; color:var(--wine);}
.rec-dot{width:9px; height:9px; border-radius:50%; background:var(--wine); animation:pulse 1.6s infinite;}
@keyframes pulse{0%,100%{opacity:1;} 50%{opacity:0.25;}}
.rec-indicator.paused .rec-dot{background:var(--muted-2); animation:none;}
.rec-indicator.paused{color:var(--muted-2);}

.session-tabs{display:none; gap:8px; margin-bottom:16px;}
@media (max-width:860px){ .session-tabs{display:flex;} }
.session-tabs button{flex:1; padding:10px; border:1px solid var(--line); background:var(--surface); font-size:13px; font-weight:600;}
.session-tabs button.active{background:var(--ink); color:var(--paper); border-color:var(--ink);}

.session-grid{display:grid; grid-template-columns:1.5fr 1fr; gap:20px; align-items:start;}
@media (max-width:860px){ .session-grid{grid-template-columns:1fr;} }
@media (max-width:860px){ .panel{display:none;} .panel.active{display:block;} }

.transcript-box{height:440px; overflow-y:auto; padding:20px; display:flex; flex-direction:column; gap:10px;}
.bubble{max-width:82%; padding:10px 14px; font-size:14px; line-height:1.5;}
.bubble .who{font-size:10.5px; font-weight:700; letter-spacing:0.4px; text-transform:uppercase; opacity:0.6; margin-bottom:3px;}
.bubble.me{align-self:flex-end; background:var(--slate); color:var(--paper);}
.bubble.prospect{align-self:flex-start; background:var(--wheat); color:var(--ink);}
.bubble.interim{opacity:0.45; font-style:italic;}

.speaker-toggle{display:flex; gap:8px; padding:14px 20px; border-top:1px solid var(--line);}
.speaker-toggle button{flex:1; padding:10px; border:1px solid var(--line); background:var(--paper); font-size:13px; font-weight:600;}
.speaker-toggle button.active.auto{background:var(--teal); color:#fff; border-color:var(--teal);}
.speaker-toggle button.active.me{background:var(--ink); color:var(--paper); border-color:var(--ink);}
.speaker-toggle button.active.prospect{background:var(--gold); color:#fff; border-color:var(--gold);}

.rec-controls{display:flex; gap:10px; padding:14px 20px; border-top:1px solid var(--line); flex-wrap:wrap;}

.manual-add{padding:14px 20px; border-top:1px solid var(--line);}
.manual-add textarea{min-height:56px;}
.manual-add .row{display:flex; gap:8px; margin-top:8px;}
.manual-add .row select{max-width:140px;}

/* Coverage compass */
.compass-title{font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:1.2px; color:var(--muted); margin-bottom:14px;}
.compass-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:6px;}
.seal{text-align:center;}
.seal svg{width:100%; max-width:64px;}
.seal .pct{font-family:var(--serif); font-size:15px; font-weight:700;}
.seal .lbl{font-size:10px; color:var(--muted); margin-top:4px; line-height:1.3;}
.ai-status{font-size:12px; color:var(--muted-2); display:flex; align-items:center; gap:6px; margin-top:10px;}
.spinner{width:11px; height:11px; border-radius:50%; border:2px solid var(--gold-soft); border-top-color:var(--gold); animation:spin 0.8s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}

.questions-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px;}
.questions-list li{
  background:var(--paper); border:1px solid var(--line);
  padding:11px 13px; font-size:13.5px; line-height:1.5; cursor:pointer; transition:border-color .15s;
}
.questions-list li:hover{border-color:var(--teal);}

.divider-label{font-size:11px; text-transform:uppercase; letter-spacing:1.2px; color:var(--muted-2); font-weight:700; margin:20px 0 10px;}

.end-bar{
  display:flex; gap:12px; margin-top:20px; flex-wrap:wrap;
}
.end-bar .btn{flex:1; min-width:220px;}

/* ---- Files ---- */
.files-list{display:flex; flex-direction:column; gap:8px; margin-bottom:8px;}
.file-item{
  display:flex; align-items:center; gap:10px; padding:10px 14px;
  border:1px solid var(--line); background:var(--paper); font-size:13px;
}
.file-item .fname{font-weight:600; flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.file-item .fsize{color:var(--muted-2); font-size:12px; flex:none;}
.file-item a{color:var(--teal); font-weight:600; font-size:12px; text-decoration:none; flex:none;}
.file-item a:hover{text-decoration:underline;}
.files-empty{color:var(--muted-2); font-size:13px; padding:6px 0;}

/* ---- Results ---- */
.result-block{margin-bottom:22px;}
.result-block .head{display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; flex-wrap:wrap; gap:8px;}
.result-block h3{font-family:var(--serif); font-size:19px; margin:0; font-weight:700;}
.summary-text{font-size:14.5px; line-height:1.7; white-space:pre-wrap;}
.prompt-box{
  background:var(--slate); color:var(--wheat); padding:20px;
  font-family:var(--mono); font-size:12.8px; line-height:1.65; white-space:pre-wrap;
  max-height:480px; overflow-y:auto;
}
.mini-actions{display:flex; gap:8px; flex-wrap:wrap;}

.banner{
  padding:12px 16px; font-size:13px; margin-bottom:16px;
  display:flex; align-items:flex-start; gap:10px; line-height:1.5;
}
.banner.warn{background:var(--wine-soft); color:var(--wine); border-left:4px solid var(--wine);}
.banner.info{background:var(--sky); color:var(--oxford); border-left:4px solid var(--oxford);}

/* ---- Modal ---- */
.overlay{
  position:fixed; inset:0; background:rgba(51,48,46,0.5); display:none;
  align-items:flex-start; justify-content:center; padding:40px 20px; overflow-y:auto; z-index:50;
}
.overlay.open{display:flex;}
.modal{background:var(--surface); border-top:2px solid var(--ink); max-width:560px; width:100%; padding:30px; box-shadow:0 20px 60px rgba(0,0,0,0.25);}
.modal-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:18px;}
.modal-head h3{font-family:var(--serif); font-size:21px; font-weight:700; margin:0;}
.close-x{background:none; border:none; font-size:20px; color:var(--muted); line-height:1;}

.pw-wrap{position:relative;}
.pw-wrap button{position:absolute; right:10px; top:50%; transform:translateY(-50%); background:none; border:none; font-size:11.5px; font-weight:700; color:var(--teal);}

.screen{display:none;}
.screen.active{display:block;}

footer.foot{margin-top:50px; padding-top:20px; border-top:1px solid var(--line); font-size:11.5px; color:var(--muted-2); text-align:center;}

/* ---- Login ---- */
.login-wrap{
  min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px;
}
.login-card{
  background:var(--surface); border:1px solid var(--line); border-top:2px solid var(--ink);
  padding:40px; max-width:400px; width:100%; text-align:center;
}
.login-logo{height:52px; width:auto; margin:0 auto 16px; display:block;}
.login-card h1{font-family:var(--serif); font-size:26px; font-weight:700; margin:0 0 4px;}
.login-card .sub{font-size:13px; color:var(--muted); margin-bottom:26px;}
.login-error{color:var(--wine); font-size:13px; margin-top:12px; min-height:18px;}
