/* Bot Lisner — interface d'accueil. Feuille unique, aucune dépendance externe. */
:root{
  --ink:#15202b; --ink-soft:#4a5b6b; --line:#dbe3ea; --bg:#f6f8fa;
  --card:#fff; --accent:#0b4f8a; --accent-soft:#e8f0f8;
  --warn:#8a5a00; --warn-bg:#fff5e0; --radius:14px;
  --font:system-ui,-apple-system,"Segoe UI",Roboto,"Hiragino Sans","Noto Sans JP",sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:var(--font);color:var(--ink);background:var(--bg);
  -webkit-font-smoothing:antialiased;line-height:1.55}
.shell{max-width:46rem;margin:0 auto;padding:1rem 1rem 0;display:flex;flex-direction:column;min-height:100dvh}

.topbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:.5rem 0 .9rem;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:.8rem}
.mark{display:grid;place-items:center;width:2.6rem;height:2.6rem;border-radius:50%;
  background:var(--accent);color:#fff;font-size:.78rem;font-weight:600;letter-spacing:.02em}
.topbar h1{font-size:1.02rem;margin:0;font-weight:600}
.topbar p{margin:0;font-size:.8rem;color:var(--ink-soft)}
.badge{font-size:.72rem;font-weight:600;color:var(--warn);background:var(--warn-bg);
  border:1px solid #f0dcae;padding:.25rem .55rem;border-radius:999px;white-space:nowrap}

.notice{font-size:.82rem;color:var(--ink-soft);background:var(--card);
  border:1px solid var(--line);border-left:3px solid var(--accent);
  border-radius:var(--radius);padding:.7rem .85rem;margin:.9rem 0}

.thread{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:.7rem;
  padding:.4rem .1rem 1rem;scroll-behavior:smooth}
.msg{max-width:88%;padding:.65rem .85rem;border-radius:var(--radius);
  font-size:.95rem;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:anywhere}
.msg.agent{align-self:flex-start;background:var(--card);border:1px solid var(--line);
  border-bottom-left-radius:4px}
.msg.user{align-self:flex-end;background:var(--accent);color:#fff;border-bottom-right-radius:4px}
.msg.sys{align-self:center;background:transparent;border:1px dashed var(--line);
  color:var(--ink-soft);font-size:.82rem;max-width:100%}
.typing{display:inline-flex;gap:.25rem;align-items:center;height:1.2em}
.typing i{width:.42rem;height:.42rem;border-radius:50%;background:var(--ink-soft);
  opacity:.35;animation:blink 1.2s infinite}
.typing i:nth-child(2){animation-delay:.18s}
.typing i:nth-child(3){animation-delay:.36s}
@keyframes blink{0%,60%,100%{opacity:.25}30%{opacity:.9}}

#dossier-slot{border:1px solid var(--line);border-radius:var(--radius);background:var(--card);
  padding:.85rem;margin:.2rem 0 .8rem}
#dossier-slot h2{font-size:.92rem;margin:0 0 .5rem}
#dossier-slot table{width:100%;border-collapse:collapse;font-size:.86rem}
#dossier-slot th{text-align:left;font-weight:500;color:var(--ink-soft);width:42%;
  padding:.3rem .5rem .3rem 0;vertical-align:top;border-bottom:1px solid var(--line)}
#dossier-slot td{padding:.3rem 0;vertical-align:top;border-bottom:1px solid var(--line)}
#dossier-slot .missing{color:var(--ink-soft);font-style:italic}

.composer{display:flex;gap:.5rem;align-items:flex-end;padding:.7rem 0;
  position:sticky;bottom:0;background:linear-gradient(to top,var(--bg) 75%,transparent)}
textarea{flex:1;resize:none;font:inherit;font-size:.95rem;color:var(--ink);
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:.7rem .85rem;max-height:9rem}
textarea:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:var(--accent)}
.composer button{font:inherit;font-size:.9rem;font-weight:600;color:#fff;background:var(--accent);
  border:0;border-radius:var(--radius);padding:0 1.1rem;height:2.9rem;cursor:pointer}
.composer button:disabled{opacity:.45;cursor:progress}
.composer button:focus-visible{outline:2px solid var(--ink);outline-offset:2px}

.foot{display:flex;gap:.5rem;align-items:center;font-size:.75rem;color:var(--ink-soft);
  padding:.3rem 0 .9rem;border-top:1px solid var(--line)}
.foot .dot{opacity:.5}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}

dialog{border:1px solid var(--line);border-radius:var(--radius);padding:0;
  max-width:26rem;width:calc(100% - 2rem);box-shadow:0 12px 40px rgba(21,32,43,.14)}
dialog::backdrop{background:rgba(21,32,43,.45)}
dialog form{padding:1.3rem}
dialog h2{font-size:1.05rem;margin:0 0 .5rem}
dialog p{font-size:.88rem;color:var(--ink-soft);margin:0 0 1rem}
dialog label{display:block;font-size:.85rem;font-weight:600;margin-bottom:.35rem}
dialog input{width:100%;font:inherit;font-size:.95rem;padding:.6rem .7rem;
  border:1px solid var(--line);border-radius:10px}
dialog input:focus{outline:2px solid var(--accent);outline-offset:1px}
dialog .hint{font-size:.78rem;color:var(--ink-soft);margin:.4rem 0 1rem}
dialog button{width:100%;font:inherit;font-weight:600;color:#fff;background:var(--accent);
  border:0;border-radius:10px;padding:.7rem;cursor:pointer}

@media (max-width:32rem){
  .msg{max-width:94%}
  .topbar{flex-wrap:wrap}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;scroll-behavior:auto!important}
}