:root{--spring:cubic-bezier(.22,1,.36,1)}
:root:not([data-theme=light]){--orange:#f1eb1c}
:root[data-theme=light]{--orange:#f4511e}
html.ai-open{overflow:hidden}
html.ai-open #chrome-bottom .sound-dock,html.ai-open #chrome-bottom .action-dock{opacity:0;pointer-events:none}
html.ai-open .ai-overlay{z-index:130}
html.ai-open .ai-drawer{z-index:140}
.ai-overlay{position:fixed;inset:0;z-index:85;background:#0000004d;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);opacity:0;transition:opacity .4s}
.ai-open .ai-overlay{opacity:1}
.ai-drawer{position:fixed;top:0;right:0;bottom:0;z-index:90;width:min(420px,100vw);display:flex;flex-direction:column;background:var(--paper);color:var(--ink);border-left:1px solid var(--line);box-shadow:-30px 0 80px -40px #000c;translate:100% 0;transition:translate .5s var(--spring)}
.ai-drawer.is-open{translate:0 0}
:root[data-theme=light] .ai-drawer{background:#fffefb;border-left-color:#dce4e8;box-shadow:-30px 0 80px -40px #183a5880}
.ai-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:22px 22px 18px;border-bottom:1px solid var(--line)}
.ai-badge{display:inline-flex;align-items:center;gap:6px;font:700 9px var(--mono);letter-spacing:1.2px;text-transform:uppercase;color:var(--orange)}
.ai-badge .ui-icon{width:11px;height:11px}
.ai-head h2{font:800 24px/1.1 var(--display);letter-spacing:-.02em;margin-top:8px}
.ai-close{display:grid;place-items:center;width:38px;height:38px;flex:none;border-radius:50%;border:1px solid var(--line);background:none;color:var(--ink);transition:background .2s,rotate .4s var(--spring)}
.ai-close .ui-icon{width:16px;height:16px}
.ai-close:hover{background:color-mix(in srgb,var(--ink) 8%,transparent);rotate:90deg}
.ai-log{flex:1;overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:12px;padding:20px 20px 12px}
.ai-msg{max-width:86%;padding:11px 14px;border-radius:16px;font-size:14px;line-height:1.55;animation:ai-in .4s var(--spring)}
.ai-msg p+p{margin-top:8px}
.ai-msg.is-bot{align-self:flex-start;background:color-mix(in srgb,var(--ink) 7%,transparent);border-bottom-left-radius:5px}
.ai-msg.is-user{align-self:flex-end;background:var(--orange);color:#060606;border-bottom-right-radius:5px}
:root[data-theme=light] .ai-msg.is-user{color:#fff}
.ai-links{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.ai-links a{font:700 11px var(--body);padding:6px 11px;border-radius:999px;border:1px solid color-mix(in srgb,var(--ink) 25%,transparent);transition:background .2s,border-color .2s}
.ai-links a:hover{background:var(--orange);border-color:var(--orange);color:#060606}
:root[data-theme=light] .ai-links a:hover{color:#fff}
.ai-msg.is-typing{display:flex;gap:4px;padding:14px 16px}
.ai-msg.is-typing span{width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.4;animation:ai-dot 1s infinite alternate}
.ai-msg.is-typing span:nth-child(2){animation-delay:.2s}.ai-msg.is-typing span:nth-child(3){animation-delay:.4s}
@keyframes ai-dot{to{opacity:1;translate:0 -3px}}
@keyframes ai-in{from{opacity:0;translate:0 8px}}
.ai-suggestions{display:flex;flex-wrap:wrap;gap:8px;padding:0 20px 14px}
.ai-suggestions button{font:500 12px var(--body);padding:8px 12px;border-radius:999px;border:1px solid var(--line);background:none;color:var(--ink);transition:border-color .2s,background .2s,scale .2s var(--spring)}
:root[data-theme=light] .ai-suggestions button{border-color:#d3dee5}
.ai-suggestions button:hover{border-color:var(--orange);background:color-mix(in srgb,var(--orange) 10%,transparent)}
.ai-suggestions button:active{scale:.96}
.ai-form{display:flex;align-items:flex-end;gap:8px;margin:0 16px;padding:6px 6px 6px 14px;border-radius:20px;border:1px solid var(--line);background:color-mix(in srgb,var(--ink) 5%,transparent);transition:border-color .2s}
:root[data-theme=light] .ai-form{border-color:#d3dee5}
.ai-form:focus-within{border-color:var(--orange)}
.ai-form textarea{flex:1;min-height:36px;max-height:140px;padding:8px 0;border:0;background:none;color:var(--ink);font:400 14px/1.45 var(--body);resize:none;outline:none}
.ai-form textarea::placeholder{color:var(--muted)}
.ai-form button{display:grid;place-items:center;width:36px;height:36px;flex:none;border:0;border-radius:50%;background:var(--orange);color:#060606;transition:scale .2s var(--spring),opacity .2s}
:root[data-theme=light] .ai-form button{color:#fff}
.ai-form button .ui-icon{width:16px;height:16px}
.ai-form button:disabled{opacity:.5}
.ai-form button:active{scale:.9}
.ai-note{padding:10px 20px 18px;font-size:11px;color:var(--muted)}
.ai-note a{text-decoration:underline;text-underline-offset:2px}
@media(max-width:600px){.action-dock{right:12px;bottom:12px;gap:8px}.ask-ai-button{height:42px;padding:0 14px 0 12px}.hire-button{width:42px;height:42px}}
@media(max-width:420px){.ask-ai-button{width:42px;padding:0;justify-content:center}.ask-ai-button span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}}
@media(prefers-reduced-motion:reduce){.ai-drawer,.ai-overlay,.ai-msg{transition:none;animation:none}}
.ai-drawer[hidden],.ai-overlay[hidden],.ai-suggestions[hidden]{display:none}


.ai-head-tools{display:flex;align-items:center;gap:8px;flex:none}
.ai-voice{display:flex;align-items:center;gap:7px;height:38px;padding:0 13px 0 11px;border-radius:999px;border:1px solid var(--line);background:none;color:var(--ink);font:700 10px var(--mono);letter-spacing:.8px;text-transform:uppercase;transition:background .2s,border-color .2s,color .2s,scale .2s var(--spring)}
:root[data-theme=light] .ai-voice{border-color:#d3dee5}
.ai-voice .ui-icon{width:16px;height:16px}
.ai-voice[aria-pressed=true]{border-color:var(--orange);color:var(--orange)}
.ai-voice[aria-pressed=true] .voice-off,.ai-voice[aria-pressed=false] .voice-on{display:none}
.ai-voice[aria-pressed=false]{color:var(--muted)}
.ai-voice:hover{background:color-mix(in srgb,var(--ink) 7%,transparent)}
.ai-voice:active{scale:.94}
.ai-msg.is-bot.is-speaking{box-shadow:0 0 0 2px color-mix(in srgb,var(--orange) 55%,transparent);animation:ai-speak 1.6s ease-in-out infinite alternate}
@keyframes ai-speak{to{box-shadow:0 0 0 5px color-mix(in srgb,var(--orange) 18%,transparent)}}
@media(max-width:420px){.ai-voice span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.ai-voice{padding:0 11px}}
@media(prefers-reduced-motion:reduce){.ai-msg.is-bot.is-speaking{animation:none}}