@layer components {
  .chat-launcher { position:fixed; z-index:200; right:24px; bottom:24px; display:flex; align-items:center; gap:12px; min-height:56px; padding:12px 20px; border:1px solid var(--blue); border-radius:var(--radius); background:var(--blue); color:var(--white); font:inherit; font-weight:600; box-shadow:0 4px 20px #181b2424; cursor:pointer; }
  .chat-launcher[hidden],.demo-chat [hidden] { display:none; }
  .chat-launcher:hover,.chat-send:hover:not(:disabled) { background:var(--blue-hover); }
  .chat-launcher:active,.chat-send:active:not(:disabled) { transform:translateY(1px); }
  .chat-launcher span { font-size:24px; line-height:1; }
  html.chat-open { overflow:hidden; }
  .demo-chat { inset:auto 24px 24px auto; margin:0; width:min(440px,calc(100vw - 48px)); height:min(760px,calc(100dvh - 48px)); max-height:none; max-width:none; padding:0; overflow:hidden; border:1px solid var(--line); border-radius:16px; background:var(--white); color:var(--ink); box-shadow:0 16px 64px #181b2429; }
  .demo-chat::backdrop { background:#181b2438; }
  .chat-shell { display:flex; flex-direction:column; height:100%; min-height:0; overflow:hidden; }
  .chat-conversation { display:flex; flex-direction:column; flex:1; min-height:0; }
  .chat-header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:20px 20px 12px 24px; flex-shrink:0; }
  .chat-header h2 { font-size:1.25rem; line-height:1.2; letter-spacing:-.025em; }
  .chat-header p { color:var(--muted); font-size:.875rem; margin:4px 0 0; }
  .chat-close { width:44px; height:44px; border:0; border-radius:var(--radius); font:inherit; font-size:28px; color:var(--ink); background:var(--paper); cursor:pointer; flex-shrink:0; }
  .chat-close:hover { background:var(--blue-light); }
  .chat-header-actions { display:flex; gap:4px; align-items:center; flex-shrink:0; }
  .chat-menu { position:relative; }
  .chat-menu summary { display:grid; place-items:center; width:44px; height:44px; border-radius:var(--radius); font-size:24px; line-height:1; cursor:pointer; list-style:none; }
  .chat-menu summary::-webkit-details-marker { display:none; }
  .chat-menu summary:hover,.chat-menu[open] summary { background:var(--paper); }
  .chat-menu-items { position:absolute; top:48px; right:0; z-index:2; width:224px; padding:8px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius); box-shadow:0 8px 24px #181b2424; }
  .chat-menu-items button,.chat-menu-items a { display:flex; width:100%; min-height:44px; align-items:center; padding:10px 12px; border:0; background:transparent; font:inherit; font-size:.875rem; color:var(--ink); text-decoration:none; text-align:left; cursor:pointer; }
  .chat-menu-items button:hover,.chat-menu-items a:hover { background:var(--paper); }
  .chat-scroll { flex:1; min-height:0; overflow-y:auto; overflow-x:hidden; scrollbar-gutter:stable; overscroll-behavior:contain; padding:8px 24px 16px; }
  .chat-intro { font-size:.875rem; color:var(--muted); line-height:1.5; margin:0 0 20px; }
  .chat-message { margin:0 0 20px; }
  .chat-message-label { display:block; font-size:.75rem; color:var(--muted); margin-bottom:6px; }
  .chat-message p { font-size:1rem; line-height:1.5; white-space:pre-wrap; overflow-wrap:anywhere; margin:0; }
  .chat-message-user { background:var(--blue-light); padding:12px 16px; border-radius:var(--radius); margin-left:24px; }
  .chat-suggestions { display:flex; flex-wrap:wrap; gap:8px; }
  .chat-suggestions button { min-height:44px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:8px 12px; font:inherit; font-size:.875rem; color:var(--blue); text-align:left; cursor:pointer; }
  .chat-suggestions button:hover { background:var(--blue-light); border-color:var(--blue); }
  .chat-composer { flex-shrink:0; padding:12px 24px 16px; border-top:1px solid var(--line); background:var(--paper); }
  .chat-composer label[for="chat-message"] { display:block; font-size:.875rem; margin-bottom:6px; }
  .chat-composer textarea { display:block; width:100%; height:76px; min-height:76px; max-height:76px; resize:none; overflow-y:auto; border:1px solid #929bab; border-radius:var(--radius); padding:10px 12px; background:var(--white); color:var(--ink); font:inherit; font-size:1rem; line-height:1.4; }
  .chat-composer textarea:focus,.chat-lead-form textarea:focus,.chat-lead-form input:not([type=checkbox]):focus { outline:none; border-color:var(--blue); box-shadow:0 0 0 1px var(--blue); }
  .demo-chat button:focus-visible,.demo-chat a:focus-visible,.chat-menu summary:focus-visible,.chat-agree input:focus-visible { outline:2px solid var(--blue); outline-offset:2px; }
  .chat-message p+p { margin-top:10px; }
  .chat-message-notice { color:var(--muted); padding:8px 0; }
  .chat-message-notice p { font-size:.875rem; }
  .chat-message-pending p { display:flex; align-items:center; gap:8px; color:var(--muted); font-size:.875rem; min-height:24px; }
  .chat-wait-dots { display:inline-flex; gap:4px; }
  .chat-wait-dots i { width:4px; height:4px; border-radius:50%; background:currentColor; animation:chat-wait 1.2s ease-in-out infinite; }
  .chat-wait-dots i:nth-child(2) { animation-delay:.15s; }
  .chat-wait-dots i:nth-child(3) { animation-delay:.3s; }
  @keyframes chat-wait { 0%,80%,100% { opacity:.35; } 40% { opacity:1; } }
  .chat-composer textarea::placeholder { color:var(--muted); }
  .chat-agree { display:flex; align-items:start; gap:8px; margin:10px 0; min-height:44px; font-size:.75rem; line-height:1.5; color:var(--muted); cursor:pointer; }
  .chat-agree input { appearance:auto; width:18px; height:18px; min-height:0; margin:2px 0 0; padding:0; flex-shrink:0; accent-color:var(--blue); }
  .chat-agree a { text-decoration:underline; }
  .chat-actions { display:flex; align-items:center; justify-content:flex-end; gap:12px; min-height:44px; }
  .chat-send { min-height:44px; padding:10px 16px; border:0; border-radius:var(--radius); background:var(--blue); color:var(--white); font:inherit; font-weight:600; cursor:pointer; }
  .chat-actions button { white-space:nowrap; flex-shrink:0; }
  .demo-chat button:disabled { opacity:.55; cursor:default; }
  .chat-stop,.chat-back { min-height:44px; border:0; background:transparent; padding:8px 0; font:inherit; font-size:.875rem; color:var(--blue); cursor:pointer; }
  .chat-stop:hover,.chat-back:hover { text-decoration:underline; }
  .chat-handoff { border-top:1px solid var(--line); padding:20px 0 4px; margin:4px 0 12px; }
  .chat-handoff h3,.chat-lead-form h3,.chat-success h3 { font-size:1.125rem; font-weight:600; line-height:1.4; margin:0 0 12px; }
  .chat-brief { font-size:1rem; line-height:1.5; white-space:pre-wrap; overflow-wrap:anywhere; margin:0 0 16px; }
  .chat-meeting-note { font-size:.875rem; line-height:1.5; color:var(--muted); margin:0 0 16px; }
  .chat-primary { display:block; width:100%; min-height:48px; border:1px solid var(--blue); border-radius:var(--radius); padding:12px 16px; font:inherit; font-weight:600; background:var(--blue); color:var(--white); cursor:pointer; }
  .chat-primary:hover:not(:disabled) { background:var(--blue-hover); }
  .chat-primary:active:not(:disabled) { transform:translateY(1px); }
  .chat-lead-view,.chat-success { flex:1; min-height:0; overflow-y:auto; overscroll-behavior:contain; scrollbar-gutter:stable; padding:0 24px 24px; }
  .chat-back { margin:0 0 12px; }
  .chat-lead-intro,.chat-success p { font-size:1rem; line-height:1.5; margin:0 0 20px; }
  .chat-lead-form>label:not(.chat-agree) { display:block; font-size:.875rem; margin:16px 0 8px; }
  .chat-lead-form textarea,.chat-lead-form input:not([type=checkbox]) { width:100%; min-height:48px; padding:12px; font:inherit; font-size:1rem; line-height:1.5; border:1px solid #929bab; background:var(--white); border-radius:var(--radius); }
  .chat-lead-form textarea { height:144px; resize:none; }
  .chat-field-note { font-size:.75rem; line-height:1.5; color:var(--muted); margin:8px 0 16px; }
  .chat-lead-form .chat-agree { margin:20px 0; }
  .chat-lead-status { font-size:.875rem; line-height:1.5; margin:16px 0 0; color:var(--ink); }
  .chat-lead-status:empty { display:none; }
  .chat-success { padding-top:24px; }
}
@layer responsive {
  @media(prefers-reduced-motion:reduce) { .chat-wait-dots i { animation:none; opacity:.7; } }
  @media(max-width:480px) {
    .chat-launcher { right:16px; bottom:max(16px,env(safe-area-inset-bottom)); min-height:48px; padding:10px 16px; font-size:.875rem; }
    .demo-chat { inset:auto 8px max(8px,env(safe-area-inset-bottom)) 8px; width:auto; height:calc(100dvh - 16px - env(safe-area-inset-bottom)); border-radius:12px; }
    .chat-header { padding:12px 12px 8px 16px; }
    .chat-scroll { padding:8px 16px 12px; }
    .chat-composer { padding:10px 16px; }
    .chat-actions { gap:8px; }
    .chat-send { font-size:.875rem; padding:10px 12px; }
    .chat-lead-view,.chat-success { padding-left:16px; padding-right:16px; }
    .chat-intro { margin-bottom:16px; }
  }
}