.chatbot-page { --chatbot-border: rgba(23,59,53,.15); --chatbot-panel: rgba(255,255,255,.76); --chatbot-muted: #576761; }
.chatbot-page[data-theme="dark"] { --chatbot-border: rgba(220,240,226,.16); --chatbot-panel: #15221e; --chatbot-muted: #a7b9b0; }
.chatbot-shell { width: min(100%, 660px); margin: 0 auto; padding: 18px 16px 40px; color: var(--player-text, inherit); }
.chatbot-heading { display:flex; align-items:center; gap:12px; margin-bottom:20px; }
.chatbot-mark { display:grid; place-items:center; width:44px; height:44px; flex-shrink:0; border:1px solid var(--chatbot-border); border-radius:14px; }
.chatbot-page svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
.chatbot-heading h1 { font-size:clamp(1.4rem,5vw,1.9rem); line-height:1.15; margin:0; letter-spacing:-.04em; }
.chatbot-eyebrow { font-size:.72rem; color:var(--chatbot-muted); margin:0 0 5px; }
.chatbot-command { font-size:clamp(1.15rem,4.8vw,1.5rem); font-weight:500; line-height:1.45; margin:0 0 22px; letter-spacing:-.025em; }
.chatbot-panel { background:var(--chatbot-panel); border:1px solid var(--chatbot-border); border-radius:18px; padding:20px; margin-bottom:12px; min-width:0; }
.chatbot-panel h2 { font-size:1rem; font-weight:650; margin:0 0 10px; }
.chatbot-panel p { font-size:.87rem; line-height:1.6; margin:0 0 14px; }
.chatbot-panel p:last-child { margin-bottom:0; }
.chatbot-panel label { display:block; font-size:.7rem; font-weight:650; margin-bottom:6px; }
.chatbot-copy-row { display:flex; gap:6px; min-width:0; }
.chatbot-copy-row input, .chatbot-help textarea, .chatbot-field input { width:100%; min-width:0; background:transparent; color:inherit; border:1px solid var(--chatbot-border); border-radius:10px; padding:12px; font-size:.84rem; }
.chatbot-copy-row input { flex:1; }
.chatbot-panel button, .chatbot-primary { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:44px; padding:10px 13px; border:1px solid var(--chatbot-border); border-radius:10px; background:transparent; color:inherit; font-size:.81rem; font-weight:600; text-decoration:none; }
.chatbot-primary { background:#235a45; border-color:#235a45; color:#fff; }
.chatbot-page button:focus-visible,.chatbot-page a:focus-visible,.chatbot-page input:focus-visible,.chatbot-page textarea:focus-visible,.chatbot-page summary:focus-visible { outline:2px solid #5baf85; outline-offset:3px; }
.chatbot-permission { display:flex; align-items:flex-start; gap:9px; margin-top:14px; font-size:.76rem; line-height:1.5; color:var(--chatbot-muted); }
.chatbot-muted,.chatbot-footnote { color:var(--chatbot-muted); }
.chatbot-help { padding-top:14px; margin-top:14px; border-top:1px solid var(--chatbot-border); font-size:.81rem; }
.chatbot-help summary { cursor:pointer; font-weight:600; min-height:32px; }
.chatbot-help[open] summary { margin-bottom:7px; }
.chatbot-help textarea { resize:vertical; min-height:132px; line-height:1.5; margin-bottom:8px; }
.chatbot-help a { color:inherit; }
.chatbot-help code { overflow-wrap:anywhere; }
.chatbot-panel .chatbot-agent-guide { margin-top:14px; color:var(--chatbot-muted); font-size:.74rem; }
.chatbot-agent-guide a { color:inherit; text-underline-offset:3px; }
.chatbot-advanced > summary { cursor:pointer; font-size:.85rem; font-weight:600; min-height:24px; }
.chatbot-advanced[open] > summary { margin-bottom:16px; }
.chatbot-panel .chatbot-connections-title { margin-top:22px; }
.chatbot-connections { list-style:none; padding:0; margin:0 0 12px; }
.chatbot-connections li { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 0; border-bottom:1px solid var(--chatbot-border); font-size:.87rem; }
.chatbot-connections li span { min-width:0; overflow-wrap:anywhere; }
.chatbot-connections form { flex-shrink:0; }
.chatbot-footnote { font-size:.74rem; line-height:1.6; padding:0 6px; }
.chatbot-copy-status { min-height:1.4em; font-size:.8rem; }
.chatbot-notice { padding-top:12px; color:var(--chatbot-muted); }
.chatbot-field { display:block; margin-bottom:14px; }
.chatbot-field span { display:block; font-size:.76rem; margin-bottom:5px; }
.chatbot-validation { font-size:.86rem; color:#b23a38; margin-bottom:16px; }
.chatbot-page[data-theme="dark"] .chatbot-validation { color:#f0a7a5; }
.chatbot-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin-top:16px; }
.chatbot-actions a:not(.chatbot-primary) { color:inherit; font-size:.86rem; }
@media(max-width:380px) { .chatbot-shell{padding-inline:10px;} .chatbot-panel{padding:16px;} .chatbot-copy-row button span{display:none;} }
@media(prefers-reduced-motion:no-preference) { .chatbot-panel button,.chatbot-primary { transition:background .18s ease, border-color .18s ease; } }
