:root{--bg:#0b0b0a;--panel:#131311;--panel-2:#1c1c19;--border:#2a2a25;--text:#f3f1e8;--muted:#8d8a7d;--gold:#e8c547;--gold-2:#b8962a;--radius:22px;--sidebar-w:290px;--ease:cubic-bezier(.2,.8,.2,1)}
html,body{height:100%}
body{background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;overflow:hidden}
.app{height:100dvh}
/* Barre latérale */
.sidebar{background:var(--panel)!important;border-right:1px solid var(--border)}
@media(min-width:992px){.sidebar{width:var(--sidebar-w);flex-shrink:0;height:100dvh}.sidebar .offcanvas-body{height:100%;flex-grow:1}}
.btn-gold{background:var(--gold);color:#111;border:none;font-weight:600;border-radius:14px;padding:.65rem 1rem;transition:transform .2s var(--ease),box-shadow .2s}
.btn-gold:hover{background:var(--gold);color:#111;transform:translateY(-1px);box-shadow:0 6px 20px rgba(232,197,71,.35)}
.btn-icon{color:var(--gold);border:1px solid var(--border);border-radius:12px;width:40px;height:40px;display:grid;place-items:center;padding:0}
.btn-icon:disabled{opacity:.4}
.search-box{position:relative}
.search-box i{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--muted)}
.search-box input{background:var(--panel-2);border:1px solid var(--border);border-radius:999px;padding-left:40px}
.search-box input:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(232,197,71,.15)}
.history{overflow-y:auto;margin:0 -.5rem;padding:0 .5rem}
.history-group{font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:1rem 0 .4rem}
.history-item{display:flex;align-items:center;gap:.5rem;width:100%;background:none;border:1px solid transparent;color:var(--text);padding:.6rem .75rem;border-radius:12px;text-align:left;font-size:.9rem;transition:background .2s,border-color .2s;animation:fadeUp .3s var(--ease)}
.history-item:hover{background:var(--panel-2)}
.history-item.active{background:var(--panel-2);border-color:rgba(232,197,71,.35)}
.history-item .title-txt{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.history-item .del{opacity:0;color:var(--muted);background:none;border:none;padding:0 .25rem;transition:opacity .2s}
.history-item:hover .del{opacity:1}
.history-item .del:hover{color:#e5534b}
.history-empty{color:var(--muted);font-size:.9rem;text-align:center;margin-top:1rem}
.profile-btn{display:flex;align-items:center;gap:.75rem;width:100%;background:var(--panel-2);border:1px solid var(--border);color:var(--text);padding:.65rem .75rem;border-radius:16px;transition:border-color .2s}
.profile-btn:hover{border-color:var(--gold)}
.avatar{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--gold),var(--gold-2));color:#111;display:grid;place-items:center;font-size:1.1rem}
.profile-text{display:flex;flex-direction:column;text-align:left;line-height:1.2}
.profile-text small{color:var(--muted)}
/* Zone principale */
.chat-main{min-width:0;height:100dvh;background:radial-gradient(ellipse at 85% 70%,rgba(232,197,71,.14),transparent 55%),var(--bg)}
.topbar{padding:1rem 1.25rem}
.brand{display:flex;align-items:center;gap:.6rem;font-weight:700;font-size:1.1rem}
.logo{width:30px;height:30px;border-radius:9px;background:var(--gold);color:#111;display:grid;place-items:center;font-weight:800}
.chat-scroll{overflow-y:auto;scroll-behavior:smooth}
.chat-inner{max-width:820px;margin:0 auto;padding:0 1.25rem 1rem;min-height:100%;display:flex;flex-direction:column}
.welcome{margin:auto 0;text-align:center;padding:2rem 0;animation:fadeUp .6s var(--ease)}
.welcome.hidden{display:none}
.orb{width:120px;height:120px;margin:0 auto 1.5rem;border-radius:50%;background:radial-gradient(circle at 40% 35%,#fff6c2,var(--gold) 30%,#5a4a10 70%,#111);box-shadow:0 0 50px rgba(232,197,71,.55),inset 0 0 25px rgba(0,0,0,.6);animation:pulse 4s ease-in-out infinite}
.title{font-size:clamp(1.9rem,5vw,2.8rem);font-weight:700;background:linear-gradient(90deg,var(--gold-2),var(--gold),#fff3b0);-webkit-background-clip:text;background-clip:text;color:transparent}
.subtitle{color:var(--muted)}
.suggestions{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin-top:2rem}
.suggestion{display:flex;align-items:center;gap:.75rem;text-align:left;background:rgba(0,0,0,.55);border:1px solid var(--border);color:var(--text);padding:.9rem;border-radius:var(--radius);transition:border-color .2s,transform .2s var(--ease)}
.suggestion:hover{border-color:var(--gold);transform:translateY(-2px)}
.suggestion-icon{width:42px;height:42px;min-width:42px;border-radius:50%;background:var(--panel-2);color:var(--gold);display:grid;place-items:center;font-size:1.1rem}
.suggestion strong{display:block;color:var(--gold);font-size:.9rem}
.suggestion small{color:var(--muted);font-size:.78rem}
/* Messages */
.messages{display:flex;flex-direction:column;gap:1rem;padding-top:1rem}
.msg{max-width:85%;padding:.85rem 1.1rem;border-radius:18px;line-height:1.6;white-space:pre-wrap;word-wrap:break-word;animation:fadeUp .35s var(--ease)}
.msg.user{align-self:flex-end;background:var(--panel-2);border:1px solid var(--border);border-bottom-right-radius:6px}
.msg.bot{align-self:flex-start;background:rgba(232,197,71,.07);border:1px solid rgba(232,197,71,.22);border-bottom-left-radius:6px}
.typing{display:inline-flex;gap:5px}
.typing span{width:7px;height:7px;border-radius:50%;background:var(--gold);animation:blink 1.2s infinite}
.typing span:nth-child(2){animation-delay:.2s}.typing span:nth-child(3){animation-delay:.4s}
/* Zone de saisie */
.composer-wrap{padding:.5rem 1.25rem calc(.75rem + env(safe-area-inset-bottom));max-width:860px;width:100%;margin:0 auto}
.composer{background:#000;border:1px solid var(--border);border-radius:var(--radius);padding:.9rem 1rem .7rem;transition:border-color .2s,box-shadow .2s}
.composer:focus-within{border-color:rgba(232,197,71,.6);box-shadow:0 0 0 4px rgba(232,197,71,.1)}
.composer textarea{width:100%;background:none;border:none;color:var(--text);resize:none;outline:none;max-height:200px;line-height:1.5}
.composer-bar{display:flex;align-items:center;gap:.75rem;margin-top:.4rem}
.model-tag{color:var(--gold);font-size:.85rem}
.send-btn{margin-left:auto;width:40px;height:40px;border-radius:50%;border:none;background:var(--gold);color:#111;font-size:1.1rem;box-shadow:0 0 18px rgba(232,197,71,.45);transition:transform .2s var(--ease),opacity .2s}
.send-btn:hover{transform:scale(1.08)}
.send-btn:disabled{opacity:.45;transform:none}
.disclaimer{text-align:center;color:var(--muted);font-size:.75rem;margin:.5rem 0 0}
/* Modale */
.soon-modal{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius)}
.soon-icon{width:72px;height:72px;margin:0 auto;border-radius:50%;background:rgba(232,197,71,.12);color:var(--gold);display:grid;place-items:center;font-size:2rem;animation:pulse 3s ease-in-out infinite}
/* Barres de défilement */
::-webkit-scrollbar{width:8px}::-webkit-scrollbar-thumb{background:var(--border);border-radius:8px}
/* Animations */
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes pulse{50%{transform:scale(1.05)}}
@keyframes blink{0%,80%,100%{opacity:.25}40%{opacity:1}}
@media(max-width:768px){.suggestions{grid-template-columns:1fr}.msg{max-width:92%}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* Nom du modèle collé au bouton Envoyer */
.model-tag{margin-left:auto}
.send-btn{margin-left:0}
.model-tag{margin-left:auto;margin-right:-.25rem}
