/* A self-contained, scripted preview. No live records or model calls. */
#agent-walkthrough-app { color:#edf5fc; text-align:left; }
#agent-walkthrough-app [hidden] { display:none!important; }
#agent-walkthrough-app * { box-sizing:border-box; }
#agent-walkthrough-app button, #agent-walkthrough-app a { -webkit-tap-highlight-color:transparent; }
#agent-walkthrough-app button { font:inherit; cursor:pointer; }
#agent-walkthrough-app button:focus-visible, #agent-walkthrough-app a:focus-visible, #agent-walkthrough-app summary:focus-visible, .aw-conversation:focus-visible { outline:3px solid #8af4e7; outline-offset:4px; }
.aw-app { border:1px solid #3a536a; border-radius:22px; overflow:hidden; background:#0d1827; box-shadow:0 26px 80px #0004; }
.aw-topline { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; padding:22px 26px; background:linear-gradient(110deg,#183b43,#18253c); border-bottom:1px solid #35495c; }
.aw-workspace { display:flex; align-items:center; flex-wrap:wrap; gap:10px; font-size:20px; font-weight:650; }
.aw-workspace img { width:30px; height:30px; }
.aw-workspace small { font-size:14px; color:#b9d0df; font-weight:400; }
.aw-illustration-label { border:1px solid #5c7388; border-radius:20px; padding:6px 12px; font-size:13px; color:#d1e1ed; }
.aw-shell { display:grid; grid-template-columns:230px minmax(0,1fr); }
.aw-sidebar { padding:24px 18px; border-right:1px solid #304255; background:#101e2e; }
.aw-kicker { display:block; margin:18px 0 10px; font-size:13px; font-weight:650; color:#a6c4da; letter-spacing:.04em; }
.aw-new, .aw-tool-toggle, .aw-context button, .aw-attachment button, .aw-playback button { min-height:44px; padding:10px 14px; border:1px solid #496279; border-radius:9px; background:#142b3a; color:#e3f7f7; font-size:14px!important; }
.aw-new { width:100%; background:#9af3e2; color:#082b30; border-color:#9af3e2; font-weight:650!important; }
.aw-sidebar nav { display:grid; gap:10px; }
.aw-sidebar nav button { width:100%; text-align:left; padding:14px 12px; min-height:64px; border:1px solid transparent; border-radius:10px; background:transparent; color:#bdd0e0; font-size:15px; line-height:1.5; }
.aw-sidebar nav button:hover { background:#1d3043; }
.aw-sidebar nav button[aria-pressed="true"] { background:#1d3b45; border-color:#3b7c7f; color:#c6fff3; }
.aw-scope { margin-top:32px; padding-top:22px; border-top:1px solid #31495d; font-size:14px; line-height:1.7; color:#a8bfd1; }
.aw-scope strong { color:#c8e0ed; font-size:14px; }
.aw-scope p { margin-top:8px; }
.aw-main { min-width:0; }
.aw-chat-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:24px; }
.aw-chat-heading h3 { margin:0 0 8px; font-size:21px; line-height:1.4; }
.aw-chat-heading p { color:#abc6dc; font-size:14px; line-height:1.7; }
.aw-tool-toggle { flex-shrink:0; }
.aw-stages { display:flex; gap:4px; margin:0 24px; border-bottom:1px solid #35495c; overflow-x:auto; }
.aw-stages button { display:flex; justify-content:space-between; align-items:center; gap:8px; flex:1 0 auto; padding:14px 5px; border:0; border-top:3px solid transparent; background:transparent; color:#b8cbdc; font-size:13px!important; }
.aw-stages button span { color:#78c3c8; }
.aw-stages button[aria-current="step"] { border-top-color:#82f3e3; color:#bbfff3; }
.aw-stage-hint { margin:16px 24px; padding:14px; border-left:3px solid #93ddec; background:#142a3c; color:#d3e3f1; font-size:15px; line-height:1.7; }
.aw-context { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin:20px 24px; padding:20px; background:#182b3c; border:1px solid #3d5369; border-radius:12px; font-size:15px; line-height:1.7; }
.aw-context strong { font-size:16px; color:#b2f3e8; }
.aw-context p { margin:8px 0; }
.aw-context small { display:block; color:#aec5d9; font-size:14px; }
.aw-context [role="status"] { display:block; color:#a5f0d5; margin-top:8px; font-size:14px; }
.aw-conversation { height:540px; min-height:340px; overflow-y:auto; padding:24px; scrollbar-width:thin; scrollbar-color:#577e92 #0d1827; }
.aw-message { margin:0 0 24px; padding:22px; border:1px solid #2d475a; border-radius:16px; background:#102232; font-size:16px; line-height:1.8; overflow-wrap:anywhere; }
.aw-message p { margin:10px 0; color:#deebf5; }
.aw-speaker { display:block; margin-bottom:12px; color:#a3f4e2; font-size:14px; font-weight:650; }
.aw-user { margin-left:auto; max-width:88%; background:#1c3c4b; border-color:#37647a; border-bottom-right-radius:4px; }
.aw-user .aw-speaker { color:#b6d4e8; }
.aw-message h4 { font-size:18px; line-height:1.5; margin:20px 0 6px; color:#f4f8fc; }
.aw-next { padding:14px 18px; margin-top:20px!important; border-left:3px solid #8df1df; background:#19383c; }
.aw-sources { margin-top:18px; border-top:1px solid #365268; padding-top:14px; font-size:14px; color:#bad0df; }
.aw-sources summary { cursor:pointer; min-height:32px; }
.aw-sources a { display:inline-block; margin:8px 16px 0 0; color:#a0ede2; text-decoration:underline; text-underline-offset:4px; }
.aw-empty { font-size:23px; color:#bdd4e5; padding:50px 15px; text-align:center; }
.aw-attachment { margin:0 24px 20px; padding:20px; border:1px solid #927943; border-radius:12px; background:#302c20; font-size:15px; line-height:1.7; }
.aw-attachment .aw-kicker { margin:0 0 8px; color:#f0d99c; }
.aw-attachment p { margin:10px 0; }
.aw-attachment button { margin:8px 0; }
.aw-attachment details { margin-top:12px; }
.aw-attachment summary { cursor:pointer; }
.aw-receipt { padding:16px; border:1px solid #5da583; background:#163c31; color:#cff8e4; border-radius:10px; }
.aw-composer { padding:20px 24px; border-top:1px solid #30495c; background:#112033; }
.aw-composer .aw-kicker { margin:0 0 10px; }
.aw-composer [data-questions] { display:flex; flex-wrap:wrap; gap:10px; }
.aw-composer [data-questions] button { padding:12px 16px; min-height:46px; text-align:left; line-height:1.6; border:1px solid #53748a; border-radius:12px; background:#1c3d49; color:#d4fff5; font-size:15px; }
.aw-composer button:hover, .aw-tool-toggle:hover { border-color:#94e6da; }
.aw-playback { display:flex; align-items:center; flex-wrap:wrap; gap:12px; padding-top:14px; }
.aw-playback [role="status"] { flex:1 1 200px; color:#a9c2d6; font-size:14px; line-height:1.6; }
.aw-playback button { background:transparent; }
#agent-walkthrough-app button:disabled { opacity:.6; cursor:default; }
.aw-footer { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:20px; padding:20px 26px; border-top:1px solid #3b5163; font-size:14px; line-height:1.7; color:#b4c9da; }
.aw-footer p { flex:1 1 440px; }
.aw-footer a { color:#a6f4e4; font-size:16px; text-decoration:underline; text-underline-offset:4px; }
@media(max-width:900px) {
 .aw-shell { grid-template-columns:185px minmax(0,1fr); }
 .aw-chat-heading { flex-wrap:wrap; }
 .aw-stages { gap:12px; }
 .aw-context { grid-template-columns:1fr; }
}
@media(max-width:700px) {
 .aw-shell { grid-template-columns:1fr; }
 .aw-sidebar { padding:18px; border-right:0; border-bottom:1px solid #304255; }
 .aw-sidebar nav { grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
 .aw-sidebar nav button { font-size:14px; padding:10px; }
 .aw-scope { display:none; }
 .aw-topline { padding:18px; }
 .aw-workspace small { flex-basis:100%; }
 .aw-chat-heading { padding:20px 18px; gap:12px; }
 .aw-chat-heading h3 { font-size:20px; }
 .aw-stages { margin-inline:18px; }
 .aw-conversation { height:480px; padding:18px; }
 .aw-message { padding:18px; }
 .aw-user { max-width:95%; }
 .aw-context, .aw-stage-hint, .aw-attachment { margin-inline:18px; }
 .aw-composer { padding:18px; }
 .aw-footer { padding:18px; }
}
@media(prefers-reduced-motion:reduce) { #agent-walkthrough-app * { scroll-behavior:auto!important; transition:none!important; animation:none!important; } }

.aw-answer-list { padding-left:22px; margin:12px 0 18px; color:#deebf5; }
.aw-answer-list li { padding-left:3px; margin:12px 0; }