:root{
  --tri-bg:#0b0f14; --tri-surface:#0f1720; --tri-text:#e6edf3; --tri-muted:#b2bdc6;
  --tri-border:rgba(255,255,255,.08); --tri-primary:#96b9ff; --tri-accent:#15315c;
  --tri-launcher-bg:#0b0f14; --tri-user-bubble:#142133; --tri-bot-bubble:#0f1720;
}
.tri-chat-launcher{ position:fixed; right:20px; bottom:20px; width:56px; height:56px; border-radius:999px; border:none; background:var(--tri-launcher-bg,#0b0f14); box-shadow:0 8px 24px rgba(0,0,0,.28); color:var(--tri-text,#e6edf3); cursor:pointer; display:grid; place-items:center; z-index:999999; transition:transform .16s ease, box-shadow .16s ease, background .16s ease; }
.tri-chat-launcher:hover{ transform:translateY(-1px); box-shadow:0 10px 28px rgba(0,0,0,.32); }
.tri-chat-launcher:active{ transform:translateY(0); }
.tri-chat-launcher .tri-chat-icon{ width:60%; height:60%; object-fit:contain; pointer-events:none; display:block; }
.tri-chat-panel{ position:fixed; right:20px; bottom:90px; width:360px; max-width:calc(100vw - 32px); max-height:min(70vh, 720px); background:var(--tri-bg,#0b0f14); color:var(--tri-text,#e6edf3); border:1px solid var(--tri-border,rgba(255,255,255,.08)); border-radius:16px; box-shadow:0 20px 48px rgba(0,0,0,.35); overflow:hidden; display:none; z-index:999998; }
.tri-chat-panel.open{ display:grid; grid-template-rows:auto auto 1fr auto; }
.tri-chat-header{ display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:10px; padding:12px 12px; background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0)); border-bottom:1px solid var(--tri-border,rgba(255,255,255,.08)); }
.tri-chat-avatar{ width:28px; height:28px; border-radius:8px; display:grid; place-items:center; background:#15202b; color:var(--tri-primary,#96b9ff); font-weight:700; font-size:12px; }
.tri-chat-title{ font-weight:700; font-size:14px; line-height:1.2; }
.tri-chat-sub{ font-size:12px; opacity:.7; margin-top:2px; }
.tri-chat-close,.tri-auth-btn{ background:transparent; color:var(--tri-text,#e6edf3); border:1px solid rgba(255,255,255,.18); border-radius:10px; padding:6px 10px; cursor:pointer; transition:background .15s ease, border-color .15s ease, opacity .15s ease; }
.tri-chat-close:hover,.tri-auth-btn:hover{ background:rgba(255,255,255,.06); }
.tri-chat-close{ font-weight:700; }
.tri-auth-panel{ background:rgba(255,255,255,.03); border-bottom:1px solid var(--tri-border,rgba(255,255,255,.08)); }
.tri-auth-row{ padding:10px 12px; }
.tri-auth-note{ padding:0 12px 8px; color:var(--tri-muted,#b2bdc6); }
.tri-chat-stream{ overflow:auto; -webkit-overflow-scrolling:touch; padding:12px; display:grid; gap:10px; }
.tri-msg{ padding:10px 12px; border-radius:12px; max-width:100%; word-wrap:break-word; }
.tri-msg.user{ background:var(--tri-user-bubble,#142133); color:var(--tri-text,#e6edf3); justify-self:end; border-top-right-radius:4px; }
.tri-msg.bot{ background:var(--tri-bot-bubble,#0f1720); color:var(--tri-text,#e6edf3); justify-self:start; border-top-left-radius:4px; border:1px solid var(--tri-border,rgba(255,255,255,.08)); }
.tri-msg.system{ background:transparent; color:#9fb1be; padding:4px 0; }
.tri-msg.bot p{ margin:0 0 .6em; }
.tri-msg.bot ul,.tri-msg.bot ol{ margin:0 0 .6em 1.2em; }
.tri-msg.bot code{ background:rgba(255,255,255,.06); padding:.12em .32em; border-radius:.35em; }
.tri-msg.bot pre{ background:rgba(255,255,255,.06); padding:.8em; border-radius:.6em; overflow:auto; }
.tri-chat-inputbar{ display:grid; grid-template-columns:1fr auto; gap:8px; padding:10px 12px; border-top:1px solid var(--tri-border,rgba(255,255,255,.08)); background:var(--tri-bg,#0b0f14); }
.tri-input{ width:100%; height:40px; padding:0 12px; border-radius:10px; border:1px solid rgba(255,255,255,.14); background:var(--tri-surface,#0f1720); color:var(--tri-text,#e6edf3); font-size:16px; outline:none; transition:border-color .15s ease, background .15s ease; }
.tri-input:focus{ border-color:rgba(150,185,255,.6); background:#0f1b2a; }
.tri-send{ height:40px; min-width:84px; padding:0 14px; border-radius:10px; border:1px solid rgba(150,185,255,.45); background:var(--tri-accent,#15315c); color:#e6f0ff; font-weight:600; cursor:pointer; transition:filter .15s ease, transform .05s ease; }
.tri-send:hover{ filter:brightness(1.08); }
.tri-send:active{ transform:translateY(1px); }
@media (max-width:480px){
  .tri-chat-launcher{ right:14px; bottom:14px; width:52px; height:52px; }
  .tri-chat-launcher .tri-chat-icon{ width:58%; height:58%; }
  .tri-chat-panel{ right:10px; bottom:calc(10px + env(safe-area-inset-bottom)); width:min(92vw, 360px); max-height:66vh; border-radius:14px; }
  .tri-chat-header{ padding:10px; }
  .tri-chat-stream{ padding:10px; }
  .tri-chat-inputbar{ padding:8px 10px; gap:6px; }
  .tri-input{ height:44px; font-size:16px; }
  .tri-send{ height:44px; min-width:92px; }
  .tri-auth-row{ grid-template-columns:1fr; gap:6px; }
}
.tri-chat-launcher:focus,.tri-chat-close:focus,.tri-auth-btn:focus,.tri-send:focus,.tri-input:focus{ outline:2px solid var(--tri-primary,#96b9ff); outline-offset:2px; }
@media (prefers-reduced-motion:reduce){ .tri-chat-launcher{ transition:none; } }
