/* Owner-approved tokens, scoped to AI components and the standalone preview only. */
:where(.twkm-ai-surface,#twkm-ai-dialog,.towa-fab-ai[data-twkm-ai],.twkm-ai-preview){--twkm-ai-primary:#ffe24a;--twkm-ai-primary-hover:#ffd633;--twkm-ai-primary-soft:#fff8dc;--twkm-ai-secondary:#4fc3d7;--twkm-ai-secondary-hover:#23aeca;--twkm-ai-secondary-soft:#e8f7fa;--twkm-ai-success:#63b96c;--twkm-ai-success-soft:#eaf7ec;--twkm-ai-page:#f7fbfa;--twkm-ai-card:#ffffff;--twkm-ai-border:#dbe8e5;--twkm-ai-text:#172a22;--twkm-ai-muted:#50665f;--twkm-ai-focus:#167d96;--twkm-ai-brand-start:#20b8d2;--twkm-ai-brand-end:#17b897;--twkm-ai-input:#f1f5f9;--twkm-ai-brand-soft:var(--twkm-ai-success-soft);--twkm-ai-brand-gradient:linear-gradient(135deg,var(--twkm-ai-brand-start),var(--twkm-ai-brand-end));--twkm-ai-shadow:0 8px 24px color-mix(in srgb,var(--twkm-ai-text) 6%,transparent);--twkm-ai-overlay:color-mix(in srgb,var(--twkm-ai-text) 32%,transparent)}
.twkm-ai-surface{box-sizing:border-box;max-width:44rem;min-inline-size:0;padding:1.5rem;border:1px solid var(--twkm-ai-border);border-radius:20px;background:linear-gradient(var(--twkm-ai-secondary-soft),var(--twkm-ai-brand-soft)) top/100% 4.5rem no-repeat,var(--twkm-ai-card);box-shadow:var(--twkm-ai-shadow);color:var(--twkm-ai-text);font:inherit;overflow-wrap:anywhere}
.twkm-ai-surface *{box-sizing:border-box;min-inline-size:0}
.twkm-ai-name{display:flex;align-items:center;gap:.6rem;font-size:1.25rem;font-weight:700;line-height:1.5;margin:0 0 1rem;color:var(--twkm-ai-text)}
.twkm-ai-brand-mark{display:inline-flex;align-items:center;justify-content:center;flex:none;width:28px;height:28px;border-radius:50%;background:var(--twkm-ai-brand-gradient);color:var(--twkm-ai-card);font:900 12px/1 sans-serif;letter-spacing:.5px}
.twkm-ai-catch{margin-block:1rem .5rem;color:var(--twkm-ai-text);font-weight:700}
.twkm-ai-surface label{display:block;font-weight:700;margin-block-end:.5rem}
.twkm-ai-surface textarea{display:block;resize:vertical;width:100%;max-width:100%;min-height:6rem;font:inherit;color:var(--twkm-ai-text);background:var(--twkm-ai-input);border:1px solid var(--twkm-ai-border);padding:.75rem;border-radius:12px}
.twkm-ai-surface textarea::placeholder{color:var(--twkm-ai-muted);opacity:1}
.twkm-ai-surface button,#twkm-ai-dialog>button{font:inherit;min-height:44px;min-width:44px;max-inline-size:100%;padding:.6rem .85rem;background:var(--twkm-ai-secondary-soft);color:var(--twkm-ai-text);border:1px solid var(--twkm-ai-border);border-radius:10px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:.4rem;white-space:normal;overflow-wrap:anywhere}
.twkm-ai-surface button:hover,#twkm-ai-dialog>button:hover{background:var(--twkm-ai-secondary-soft);border-color:var(--twkm-ai-secondary)}
.twkm-ai-surface [data-ai-send]{background:var(--twkm-ai-primary);font-weight:700}
.twkm-ai-surface [data-ai-send]:hover{background:var(--twkm-ai-primary-hover)}
.twkm-ai-surface [data-ai-mic]{background:var(--twkm-ai-secondary)}
.twkm-ai-surface [data-ai-mic]:hover{background:var(--twkm-ai-secondary-hover)}
.twkm-ai-surface [data-ai-clear]{background:var(--twkm-ai-card);color:var(--twkm-ai-muted)}
.twkm-ai-surface [data-ai-clear]:hover{background:var(--twkm-ai-page);border-color:var(--twkm-ai-border)}
.twkm-ai-examples button{background:var(--twkm-ai-secondary-soft);border-color:color-mix(in srgb,var(--twkm-ai-secondary) 35%,var(--twkm-ai-card))}
.twkm-ai-surface button[aria-busy="true"],.towa-fab-ai[data-twkm-ai][aria-busy="true"]{cursor:progress;border-style:dashed}
.twkm-ai-surface button:disabled{opacity:1;cursor:wait;border-style:dashed}
.twkm-ai-actions,.twkm-ai-examples{display:flex;flex-wrap:wrap;gap:.75rem;margin:1rem 0}
.twkm-ai-surface [hidden]{display:none!important}
.twkm-ai-surface :focus-visible,#twkm-ai-dialog>button:focus-visible,.towa-fab-ai[data-twkm-ai]:focus-visible{outline:2px solid var(--twkm-ai-focus);outline-offset:3px}
.twkm-ai-surface a{color:var(--twkm-ai-focus);text-decoration:underline;text-underline-offset:.15em}
.twkm-ai-surface nav{display:flex;flex-wrap:wrap;gap:.5rem 1rem}
.twkm-ai-surface nav a{min-height:44px;display:inline-flex;align-items:center}
.twkm-ai-surface :is(button,a,textarea){scroll-margin-block:1rem 6rem}
.twkm-ai-icon{inline-size:18px;block-size:18px;flex:none;vertical-align:middle;pointer-events:none}
.towa-fab-ai[data-twkm-ai] .twkm-ai-icon{width:18px;height:18px}
.twkm-ai-result-heading,.twkm-ai-card-title{font-weight:700;color:var(--twkm-ai-text)}
.twkm-ai-result-heading{font-size:1.125rem;margin:1.25rem 0 .75rem}
.twkm-ai-related-heading{padding:.6rem .75rem;border-radius:10px;background:var(--twkm-ai-secondary-soft)}
.twkm-ai-article-link{display:inline-flex;align-items:center;gap:.35rem;min-height:44px}
.twkm-ai-note,.twkm-ai-card-meta{font-size:.875rem;line-height:1.7;color:var(--twkm-ai-muted)}
.twkm-ai-surface [data-ai-status]{min-height:1.5em}
.twkm-ai-surface [data-ai-status]:not(:empty){padding:.6rem .75rem;border-radius:10px;background:var(--twkm-ai-page);color:var(--twkm-ai-text)}
.twkm-ai-surface [data-ai-status][data-ai-tone="success"]:not(:empty){border-inline-start:3px solid var(--twkm-ai-success);background:var(--twkm-ai-success-soft)}
.twkm-ai-cards{list-style:none;margin:.75rem 0;padding:0;display:grid;gap:1rem}
.twkm-ai-cards li{display:flow-root;min-inline-size:0;padding:1rem;border:1px solid var(--twkm-ai-border);border-inline-start:3px solid var(--twkm-ai-secondary);border-radius:16px;background:var(--twkm-ai-card)}
.twkm-ai-cards a{font-weight:700}
.twkm-ai-cards img{width:96px;max-inline-size:35%;height:auto;aspect-ratio:3/2;object-fit:cover;float:inline-end;margin-inline-start:.75rem}
.twkm-ai-cards p{margin:.4rem 0}
.twkm-ai-surface[data-twkm-ai-surface="home"]{padding-block-end:calc(5.5rem + env(safe-area-inset-bottom))}
#twkm-ai-dialog{box-sizing:border-box;width:min(38rem,calc(100% - 1rem));max-height:calc(100dvh - 2rem);padding:1.25rem;border:1px solid var(--twkm-ai-border);border-radius:20px;overflow:auto;color:var(--twkm-ai-text);background:linear-gradient(var(--twkm-ai-secondary-soft),var(--twkm-ai-brand-soft)) top/100% 4rem no-repeat,var(--twkm-ai-card);box-shadow:var(--twkm-ai-shadow);overscroll-behavior:contain}
#twkm-ai-dialog::backdrop{background:var(--twkm-ai-overlay)}
#twkm-ai-dialog>button{display:block;margin-inline-start:auto;margin-bottom:1rem;background:var(--twkm-ai-secondary-soft)}
#twkm-ai-dialog .twkm-ai-surface{border:0;padding:0;background:none;box-shadow:none}
.towa-fab-ai[data-twkm-ai]{box-sizing:border-box;inline-size:60px;block-size:60px;min-height:44px;min-width:44px;height:60px;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:.1rem;padding:.5rem .35rem;border:1px solid var(--twkm-ai-border);border-radius:50%;background:var(--twkm-ai-brand-gradient);color:var(--twkm-ai-card);box-shadow:var(--twkm-ai-shadow);cursor:pointer}
.towa-fab-ai[data-twkm-ai]:hover{background:var(--twkm-ai-brand-gradient)}
.towa-fab-ai[data-twkm-ai] .towa-fab-ai-text{color:var(--twkm-ai-card);font-family:sans-serif;font-size:20px;font-weight:900;letter-spacing:.5px;line-height:1}
@media(max-width:767px){#twkm-ai-dialog{padding:1rem;margin:auto auto max(.5rem,env(safe-area-inset-bottom));max-height:calc(100dvh - 1rem - env(safe-area-inset-bottom))}.twkm-ai-surface{padding:1rem;border-radius:18px}}
@media(prefers-reduced-motion:reduce){.twkm-ai-surface *,#twkm-ai-dialog{animation:none!important;transition:none!important;scroll-behavior:auto}}
@media(forced-colors:active){.twkm-ai-surface button,.twkm-ai-surface textarea,.twkm-ai-cards li,#twkm-ai-dialog,.towa-fab-ai[data-twkm-ai]{border:1px solid ButtonText}.twkm-ai-surface :focus-visible,#twkm-ai-dialog>button:focus-visible,.towa-fab-ai[data-twkm-ai]:focus-visible{outline-color:Highlight}}

/* Popup controls retain the existing palette and wrap without horizontal scrolling. */
.twkm-ai-surface button:disabled{cursor:not-allowed;border-style:solid;opacity:.65}
.twkm-ai-surface button[aria-busy="true"]{cursor:wait;border-style:dashed}
.twkm-ai-examples-title{font-weight:700;margin:1rem 0 .5rem}
#twkm-ai-dialog{max-height:calc(100vh - 2rem);max-height:calc(100dvh - 2rem)}
@media(max-width:767px){#twkm-ai-dialog{max-height:calc(100vh - 1rem - env(safe-area-inset-bottom));max-height:calc(100dvh - 1rem - env(safe-area-inset-bottom))}}
