/* AI chat = Community room look. Tokens, bubbles, tail, wall pattern, stamp, action pills and composer mirror
   public/community.html. Selectors use two IDs so they win over the legacy !important layers in the platform
   stylesheet and the runtime-injected AI skin. */
html[data-theme="light"]{--ai-c-bg:#eef2ef;--ai-c-surface:#fff;--ai-c-raised:#e4ebe6;--ai-c-ink:#15231d;--ai-c-muted:#4d6257;--ai-c-line:#bdcbc2;--ai-c-accent:#086344;--ai-c-accent-ink:#fff;--ai-c-tint:rgba(8,99,68,.12)}
html[data-theme="dark"]{--ai-c-bg:#191a18;--ai-c-surface:#242522;--ai-c-raised:#2c2d29;--ai-c-ink:#f5f4ef;--ai-c-muted:#b2b1a7;--ai-c-line:#44443f;--ai-c-accent:#45d99a;--ai-c-accent-ink:#092015;--ai-c-tint:rgba(69,217,154,.12)}
:root{--ai-r-md:12px;--ai-wall:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'%3E%3Cg fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 30v26M14 38h12v12H14z'/%3E%3Cpath d='M70 14v22M64 20h12v10H64z'/%3E%3Cpath d='M118 40v28M112 48h12v14h-12z'/%3E%3Cpath d='M22 108l14-12 12 8 16-20'/%3E%3Cpath d='M96 120l12-10 10 6 16-18'/%3E%3Ccircle cx='140' cy='100' r='5'/%3E%3Cpath d='M60 146h20M70 136v20'/%3E%3C/g%3E%3C/svg%3E")}

/* Canvas + wall */
html body #aaApp[data-panel="ai"],
html body #aaApp[data-panel="ai"] .aa-panel-page[data-panel-page="ai"].active,
html body #aaApp[data-panel="ai"] .aa-panel-page[data-panel-page="ai"].active .aa-ai-greeting{background:var(--ai-c-bg)!important;background-image:none!important}
html body #aaApp[data-panel="ai"] .aa-panel-page[data-panel-page="ai"].active{position:relative}
html body #aaApp[data-panel="ai"] .aa-panel-page[data-panel-page="ai"].active::before{content:"";position:absolute;inset:0;background:var(--ai-c-accent);opacity:.08;-webkit-mask-image:var(--ai-wall);mask-image:var(--ai-wall);pointer-events:none;z-index:0}
html body #aaApp[data-panel="ai"] .aa-panel-page[data-panel-page="ai"].active>*{position:relative;z-index:1}
html body #aaApp[data-panel="ai"] .aa-panel-page[data-panel-page="ai"].active>.aa-ai-float-btn{position:absolute}
html body #aaApp[data-panel="ai"] .aa-panel-page[data-panel-page="ai"].active>.aa-ai-drawer,
html body #aaApp[data-panel="ai"] .aa-panel-page[data-panel-page="ai"].active>.aa-ai-drawer-scrim{position:absolute}
html body #aaApp[data-panel="ai"] .aa-mobile-tabs{background:var(--ai-c-surface)!important}

/* Message list */
html body #aaApp #aaAiMessages{max-width:none!important;margin:0!important;width:auto!important;padding:10px 5% calc(18px + max(var(--aa-ai-overlap,0px),84px))!important;scroll-padding-bottom:calc(18px + max(var(--aa-ai-overlap,0px),84px))!important;scroll-behavior:auto!important;gap:0!important;display:flex!important;flex-direction:column!important;overflow-x:clip!important;overscroll-behavior:contain;background:transparent!important;color:var(--ai-c-ink)}
html body #aaApp #aaAiMessages .aa-msg-row,
html body #aaApp #aaAiMessages .aa-msg-row.user,
html body #aaApp #aaAiMessages .aa-msg-row.bot{display:flex!important;flex-direction:row!important;justify-content:flex-start!important;align-items:flex-start!important;gap:8px!important;width:100%!important;max-width:100%!important;align-self:stretch!important;margin:7px 0 0!important;padding:0!important;background:transparent!important;border-radius:0!important}
html body #aaApp #aaAiMessages .aa-msg-row.aa-cont{margin-top:2px!important}
html body #aaApp #aaAiMessages .aa-msg-row.aa-msg-in{animation:aaCommunityIn .28s cubic-bezier(.2,.7,.2,1) both!important}
@keyframes aaCommunityIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
html body #aaApp #aaAiMessages .aa-msg-avatar{display:block!important;flex:none!important;width:30px!important;min-width:30px!important;height:30px!important;border-radius:50%!important;border:1px solid var(--ai-c-line)!important;box-shadow:none!important;margin:0!important;padding:3px!important;box-sizing:border-box!important;background:#fff!important;object-fit:contain!important;object-position:center!important;overflow:hidden}
html body #aaApp #aaAiMessages .aa-msg-avatar.aa-av-spacer{background:transparent!important}
html body #aaApp #aaAiMessages .aa-msg-stack{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:0!important;flex:0 1 88%!important;width:88%!important;min-width:0!important;max-width:900px!important}
html body #aaApp #aaAiMessages .aa-msg-row.user .aa-msg-stack{flex-basis:100%!important;width:100%!important;max-width:100%!important;justify-items:stretch!important}
@media(max-width:560px){html body #aaApp #aaAiMessages .aa-msg-row.bot .aa-msg-stack{flex-basis:calc(100% - 38px)!important;width:calc(100% - 38px)!important;max-width:calc(100% - 38px)!important}}

/* Thread line + nodes (Community .thread-children): AI replies nest under the message they answer */
html body #aaApp #aaAiMessages .aa-thread-children{display:flex;flex-direction:column;align-self:stretch;margin:5px 0 8px 12px;padding:2px 0 2px 12px;border-left:2px solid color-mix(in srgb,var(--ai-c-accent) 34%,var(--ai-c-line));min-width:0}
html body #aaApp #aaAiMessages .aa-thread-children:empty{display:none}
html body #aaApp #aaAiMessages .aa-thread-children>.aa-msg-row{position:relative!important;margin-top:5px!important}
html body #aaApp #aaAiMessages .aa-thread-children>.aa-msg-row.aa-cont{margin-top:2px!important}
html body #aaApp #aaAiMessages .aa-thread-children>.aa-msg-row:not(.aa-cont)::before{content:"";position:absolute;left:-13px;top:13px;width:12px;height:2px;background:color-mix(in srgb,var(--ai-c-accent) 34%,var(--ai-c-line));pointer-events:none}
html body #aaApp #aaAiMessages .aa-thread-children>.aa-msg-row:not(.aa-cont)::after{content:"";position:absolute;left:-18px;top:10px;width:8px;height:8px;border-radius:50%;background:var(--ai-c-accent);box-shadow:0 0 0 2px var(--ai-c-bg);pointer-events:none}

/* Bubble */
html body #aaApp #aaAiMessages .aa-msg,
html body #aaApp #aaAiMessages .aa-msg-row.bot .aa-msg,
html body #aaApp #aaAiMessages .aa-msg-row.user .aa-msg{--bb:var(--ai-c-surface);position:relative!important;width:fit-content!important;min-width:56px!important;max-width:100%!important;padding:5px 8px!important;border:1px solid color-mix(in srgb,var(--ai-c-line) 72%,transparent)!important;border-radius:var(--ai-r-md)!important;background:var(--bb)!important;color:var(--ai-c-ink)!important;box-shadow:0 2px 5px color-mix(in srgb,var(--ai-c-ink) 10%,transparent)!important;font-size:14px!important;line-height:1.34!important}
html body #aaApp #aaAiMessages .aa-msg-row.user .aa-msg{--bb:color-mix(in srgb,var(--ai-c-accent) 16%,var(--ai-c-surface))}
html body #aaApp #aaAiMessages .aa-msg.aa-tail{border-top-left-radius:0!important}
html body #aaApp #aaAiMessages .aa-msg.aa-tail::before{content:"";position:absolute;top:0;left:-8px;width:9px;height:13px;background:var(--bb);clip-path:polygon(100% 0,100% 100%,0 0)}
html body #aaApp #aaAiMessages .aa-msg.aa-msg-media{padding:0!important;overflow:hidden}

/* Sender, text, stamp */
html body #aaApp #aaAiMessages .aa-msg-sender{margin:0 0 1px;padding:0 3px;font-size:12px;font-weight:700;line-height:1.25;color:var(--ai-c-accent)}
html body #aaApp #aaAiMessages .aa-msg-text{display:flow-root;margin:0!important;padding:0 3px!important;font-size:14px!important;line-height:1.34!important;white-space:pre-wrap;overflow-wrap:anywhere;color:inherit!important}
html body #aaApp #aaAiMessages .aa-msg-stamp{float:right;display:inline-flex;align-items:center;margin:5px 0 -3px 8px;font-size:10px;line-height:1;color:var(--ai-c-muted);white-space:nowrap}
html body #aaApp #aaAiMessages .aa-msg-row.bot .aa-msg strong{color:inherit!important}
html body #aaApp #aaAiMessages .aa-msg-reply{margin:1px 0 4px!important;padding:2px 6px!important;border-left:3px solid var(--ai-c-accent)!important;border-radius:6px!important;background:var(--ai-c-tint)!important}
html body #aaApp #aaAiMessages .aa-msg-reply b{color:var(--ai-c-accent)!important;font-size:11px!important;text-transform:none!important;letter-spacing:0!important}
html body #aaApp #aaAiMessages .aa-msg-reply span{color:var(--ai-c-muted)!important;font-size:12px!important}
html body #aaApp #aaAiMessages .aa-msg code{background:var(--ai-c-raised)!important}

/* Action pills (like Community's Like / Reply) */
html body #aaApp #aaAiMessages .aa-msg-actions{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:4px!important;margin:4px 2px 0!important;padding:0!important}
html body #aaApp #aaAiMessages .aa-msg-actions button{min-height:24px!important;padding:3px 7px!important;border:1px solid transparent!important;border-radius:999px!important;background:transparent!important;color:var(--ai-c-muted)!important;font:600 10px/1.2 "Space Grotesk",ui-sans-serif,system-ui,sans-serif!important;text-decoration:none!important;cursor:pointer}
html body #aaApp #aaAiMessages .aa-msg-actions button:hover,
html body #aaApp #aaAiMessages .aa-msg-actions button:focus-visible{border-color:var(--ai-c-line)!important;background:var(--ai-c-raised)!important;color:var(--ai-c-ink)!important;text-decoration:none!important}

/* Composer */
html body #aaApp .aa-panel-page[data-panel-page="ai"] #aaAiForm{max-width:none!important;width:100%!important;margin:0!important;padding:8px 10px calc(10px + env(safe-area-inset-bottom,0px))!important;border:0!important;border-top:1px solid var(--ai-c-line)!important;background:var(--ai-c-surface)!important}
html body #aaApp #aaAiForm .aa-ai-input-shell{display:flex!important;align-items:flex-end!important;gap:2px!important;padding:2px 4px!important;border:1px solid var(--ai-c-line)!important;border-radius:24px!important;background:var(--ai-c-bg)!important;box-shadow:none!important}
html body #aaApp #aaAiForm .aa-ai-input-shell:focus-within{border-color:var(--ai-c-accent)!important}
html body #aaApp #aaAiForm #aaAiInput{flex:1!important;min-width:0!important;min-height:40px!important;padding:10px 4px!important;border:0!important;background:transparent!important;color:var(--ai-c-ink)!important;font:inherit!important;font-size:16px!important;line-height:1.4!important;outline:none!important}
html body #aaApp #aaAiForm .aa-attach-icon{flex:none!important;width:40px!important;height:40px!important;border:0!important;border-radius:50%!important;background:transparent!important;color:var(--ai-c-muted)!important}
html body #aaApp #aaAiForm .aa-send-icon{flex:none!important;width:40px!important;height:40px!important;border:0!important;border-radius:50%!important;background:var(--ai-c-accent)!important;color:var(--ai-c-accent-ink)!important;box-shadow:none!important}
html body #aaApp #aaAiForm .aa-send-icon:disabled{opacity:.45}
html body #aaApp #aaAiForm .aa-reply-preview{border-left:4px solid var(--ai-c-accent)!important;border-radius:var(--ai-r-md)!important;background:var(--ai-c-raised)!important}

@media(prefers-reduced-motion:reduce){html body #aaApp #aaAiMessages .aa-msg-row.aa-msg-in{animation:none!important}}

/* Chat-room header (mirrors Community .room-top) — only when AI chat is opened from Community talks */
#aaAiRoomHead{display:none}
body.aa-ai-from-community .aa-panel-page[data-panel-page="ai"].active{padding:0!important;gap:0!important}
body.aa-ai-from-community .aa-panel-page[data-panel-page="ai"] #aaAiRoomHead{display:flex;flex:none;align-items:center;gap:6px;padding:calc(8px + env(safe-area-inset-top,0px)) 12px 8px 6px;border-bottom:1px solid var(--ai-c-line);background:var(--ai-c-surface);color:var(--ai-c-ink);position:relative;z-index:40}
#aaAiRoomHead .aa-ai-room-back{flex:none;width:44px;height:44px;display:grid;place-items:center;border:0;border-radius:50%;background:transparent;color:var(--ai-c-ink);cursor:pointer}
#aaAiRoomHead .aa-ai-room-back:hover{background:var(--ai-c-raised)}
#aaAiRoomHead .aa-ai-room-id{display:flex;align-items:center;gap:12px;flex:1;min-width:0;padding:4px 8px 4px 4px}
#aaAiRoomHead .aa-ai-room-cover{flex:none;width:42px;height:42px;border-radius:50%;overflow:hidden;background:#fff;border:1px solid var(--ai-c-line);box-sizing:border-box}
#aaAiRoomHead .aa-ai-room-cover img{display:block;width:100%;height:100%;object-fit:contain;transform:scale(1.4);transform-origin:50% 48%}
#aaAiRoomHead .aa-ai-room-name{display:block;min-width:0}
#aaAiRoomHead .aa-ai-room-name strong{display:block;font-size:16px;line-height:1.2;letter-spacing:-.01em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#aaAiRoomHead .aa-ai-room-name small{display:block;font-size:12.5px;color:var(--ai-c-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* floating chat buttons sit inside the header: "+" becomes Back on the left, the chat menu on the right */
body.aa-ai-from-community .aa-panel-page[data-panel-page="ai"]>.aa-ai-float-btn{top:calc(8px + env(safe-area-inset-top,0px))!important;z-index:50;width:44px!important;height:44px!important;display:grid!important;place-items:center;padding:0!important;border:0!important;border-radius:50%!important;background:transparent!important;box-shadow:none!important;color:var(--ai-c-ink)!important;cursor:pointer}
body.aa-ai-from-community .aa-panel-page[data-panel-page="ai"]>.aa-ai-float-btn:hover,
body.aa-ai-from-community .aa-panel-page[data-panel-page="ai"]>.aa-ai-float-btn:focus-visible{background:var(--ai-c-raised)!important}
body.aa-ai-from-community .aa-panel-page[data-panel-page="ai"]>.aa-ai-float-btn svg{width:22px;height:22px}
body.aa-ai-from-community .aa-panel-page[data-panel-page="ai"]>.aa-ai-float-new{left:6px!important;right:auto!important}
body.aa-ai-from-community .aa-panel-page[data-panel-page="ai"]>.aa-ai-float-menu{right:8px!important;left:auto!important}
.aa-ai-float-new .aa-ai-ico-back{display:none}
body.aa-ai-from-community .aa-ai-float-new .aa-ai-ico-plus{display:none}
body.aa-ai-from-community .aa-ai-float-new .aa-ai-ico-back{display:block}
body.aa-ai-from-community #aaAiRoomHead .aa-ai-room-back{visibility:hidden}
.aa-ai-desktop-back{display:none!important}
@media(min-width:761px){
  html body:not(.aa-ai-from-community) #aaApp[data-panel="ai"] .aa-panel-page[data-panel-page="ai"]>.aa-ai-desktop-back,
  html body:not(.aa-ai-from-community) #aiMain .aa-panel-page[data-panel-page="ai"]>.aa-ai-desktop-back{display:inline-flex!important;top:12px!important;left:16px!important;right:auto!important;z-index:52!important}
  html body:not(.aa-ai-from-community) #aaApp[data-panel="ai"] .aa-panel-page[data-panel-page="ai"]>.aa-ai-float-new,
  html body:not(.aa-ai-from-community) #aiMain .aa-panel-page[data-panel-page="ai"]>.aa-ai-float-new{left:64px!important;right:auto!important}
}
@media(max-width:760px){.aa-ai-desktop-back{display:none!important}}
@media(max-width:560px){
  #aaAiRoomHead .aa-ai-room-back{width:40px;height:40px}
  #aaAiRoomHead .aa-ai-room-cover{width:38px;height:38px}
  #aaAiRoomHead .aa-ai-room-name strong{font-size:15px}
  #aaAiRoomHead .aa-ai-room-name small{font-size:11px}
  #aaAiRoomHead .aa-ai-room-id{padding-right:52px}
  body.aa-ai-from-community .aa-panel-page[data-panel-page="ai"]>.aa-ai-float-btn{width:40px!important;height:40px!important;top:calc(10px + env(safe-area-inset-top,0px))!important}
}

/* Composer sits in the flow under the list (never overlaid) and the list ends clear of it. The terminal skin
   relocates the AI page into #aiMain and positions the form absolutely, which hid the newest message. */
html body #aaMacroTerminal #aiMain .aa-panel-page[data-panel-page="ai"] #aaAiForm{position:relative!important;inset:auto!important;flex:0 0 auto!important}
html body #aaMacroTerminal #aiMain .aa-panel-page[data-panel-page="ai"] #aaAiMessages{padding-bottom:16px!important;scroll-padding-bottom:16px!important}
/* Outside Community there is no header: clear the status bar and the floating buttons so the first message is never underneath. */
html body:not(.aa-ai-from-community) #aaMacroTerminal #aiMain .aa-panel-page[data-panel-page="ai"] #aaAiMessages{padding-top:calc(64px + env(safe-area-inset-top,0px))!important}
/* With the room header present the list no longer reserves room for floating buttons. */
html body.aa-ai-from-community #aaMacroTerminal #aiMain .aa-panel-page[data-panel-page="ai"] #aaAiMessages{padding-top:12px!important}
html body.aa-ai-from-community #aaMacroTerminal #aiMain .aa-panel-page[data-panel-page="ai"] .aa-ai-greeting{padding-top:24px!important}
body.aa-ai-from-community.aa-keyboard-open .aa-panel-page[data-panel-page="ai"].active,
body.aa-ai-from-community.aa-ai-keyboard-glued .aa-panel-page[data-panel-page="ai"].active{grid-template-rows:auto minmax(0,1fr) auto!important}

/* Chat-history menu and its scrim must paint above the composer and header (the page-wide `>*{z-index:1}`
   rule otherwise flattens them to the composer's level, hiding old chats behind it). */
html body .aa-panel-page[data-panel-page="ai"] .aa-ai-drawer-scrim{position:absolute!important;z-index:90!important}
html body .aa-panel-page[data-panel-page="ai"] .aa-ai-drawer{position:absolute!important;z-index:91!important}
html body .aa-panel-page[data-panel-page="ai"] #aaAiForm{z-index:1!important}
html body .aa-panel-page[data-panel-page="ai"].aa-ai-drawer-open>.aa-ai-float-btn{z-index:50!important}
