/* t3411: real-text, visual-only workflow; image keeps the 3D scene. */
html:root body#ag-unified-site #main .al-demo{container:al / inline-size;width:100%;max-width:100%;min-width:0;font-family:Inter,'Noto Sans Bengali',sans-serif;color:#14244a}
html:root body#ag-unified-site #main .al-demo :is(div,span,b,strong){font-size:16px!important;line-height:1.35!important;box-sizing:border-box}
html:root body#ag-unified-site #main .al-meta{display:flex;justify-content:space-between;align-items:center;min-height:32px;margin-bottom:8px;color:#31496c}
html:root body#ag-unified-site #main .al-live{display:inline-flex;gap:8px;align-items:center;padding:4px 10px;border:1px solid #a6dfbe;border-radius:99px;background:#effff4;color:#126336;font-weight:700}
.al-live i{width:9px;height:9px;background:#12a75a;border-radius:50%;animation:al-live 1.8s ease-in-out infinite}
html:root body#ag-unified-site #main .al-stage{--al-u:calc(100cqw / 660);position:relative;width:100%;aspect-ratio:5/3;isolation:isolate}
html:root body#ag-unified-site #main .al-stage>img.al-bg{display:block;width:100%!important;max-width:none!important;height:100%!important;margin:0!important;object-fit:contain}
.al-flow,.al-ui{position:absolute;inset:0;width:100%;height:100%}.al-flow{z-index:1;pointer-events:none;overflow:visible}.al-ui{z-index:2}
.al-track,.al-pulse{fill:none;stroke-linecap:round}.al-track{stroke:#26b8fb55;stroke-width:2}.al-pulse{stroke:#c8ffff;stroke-width:3;stroke-dasharray:12 200;animation:al-flow 2.4s linear infinite;animation-delay:var(--delay);filter:drop-shadow(0 0 3px #12aaff)}
html:root body#ag-unified-site #main .al-panel{position:absolute;background:#f8fbff;border:1px solid #d5e4fa;border-radius:11px;box-shadow:0 3px 10px #16479715;padding:10px;color:#14244a}
html:root body#ag-unified-site #main .al-channel-panel{left:0;top:calc(38 * var(--al-u));width:calc(132 * var(--al-u));height:calc(276 * var(--al-u))}
.al-channel-list{display:grid;gap:5px;margin-top:9px}.al-channel{display:flex;align-items:center;gap:5px;min-width:0;min-height:35px;padding:3px 2px;border:1px solid transparent;border-radius:7px;transition:background-color .2s,border-color .2s}.al-channel.is-active{background:#e0f3ff;border-color:#73bcf5;color:#0b377b}
.al-channel-icon{width:20px;height:22px;display:grid;place-items:center;flex:0 0 20px;color:#1687df}.al-channel-icon svg{width:20px;height:20px}.al-icon-facebook{background:#1676e9;color:#fff;border-radius:4px}.al-icon-facebook b,.al-icon-google b{font-weight:800}.al-icon-google{color:#1679d3}.al-icon-instagram{color:#bd277d}
html:root body#ag-unified-site #main .al-incoming{left:calc(136 * var(--al-u));top:calc(6 * var(--al-u));width:calc(240 * var(--al-u));height:calc(112 * var(--al-u))}
.al-panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:6px}.al-incoming-age{white-space:nowrap;color:#435b79}.al-copy{margin-top:9px}
html:root body#ag-unified-site #main .al-hub{position:absolute;left:calc(185 * var(--al-u));top:calc(254 * var(--al-u));width:calc(151 * var(--al-u));height:calc(54 * var(--al-u));background:#f8fbff;border-radius:0 0 9px 9px;text-align:center;padding:3px 2px;color:#14244a}.al-hub strong{font-weight:800}.al-hub-state{margin-top:2px}.al-brand{display:none!important}
html:root body#ag-unified-site #main [data-auto-live=bn] .al-hub{top:calc(249 * var(--al-u));height:calc(52 * var(--al-u))}
html:root body#ag-unified-site #main .al-reply{left:calc(402 * var(--al-u));top:calc(16 * var(--al-u));width:calc(226 * var(--al-u));height:calc(170 * var(--al-u))}
.al-reply-body{min-height:79px;padding-top:10px}.al-typing{display:flex;align-items:center;gap:10px;padding-top:10px}.al-dots{display:flex;gap:4px}.al-dots i{display:block;width:6px;height:6px;border-radius:50%;background:#2a78d2;animation:al-type 1.2s ease-in-out infinite}.al-dots i:nth-child(2){animation-delay:.15s}.al-dots i:nth-child(3){animation-delay:.3s}.al-reply-copy{display:none}.al-stage[data-state=sent] .al-typing{display:none}.al-stage[data-state=sent] .al-reply-copy{display:block}.al-reply-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#435b79}.al-sent-check,.al-tick{display:grid;place-items:center;width:21px;height:21px;flex:0 0 21px;color:#0c9450;opacity:0;transition:opacity .2s}.al-sent-check svg,.al-tick svg{width:19px;height:19px}.al-stage[data-state=sent] .al-sent-check{opacity:1}
html:root body#ag-unified-site #main .al-actions{position:absolute;left:calc(416 * var(--al-u));top:calc(190 * var(--al-u));width:calc(215 * var(--al-u));display:grid;gap:8px}
html:root body#ag-unified-site #main .al-action{position:relative;display:flex;align-items:center;gap:6px;min-height:49px;padding:8px;white-space:nowrap}.al-action-icon{display:grid;place-items:center;width:23px;height:25px;flex:0 0 23px;border-radius:6px;color:#fff;background:#0c90dd}.al-action .al-tick{margin-left:auto}.al-action[data-done=true]{background:#f1fff6!important;border-color:#a7dbbd!important}.al-action[data-done=true] .al-tick{opacity:1}.al-mobile-arrow{display:none}.al-caption{margin-top:9px;text-align:center;color:#435879}
.al-demo[data-paused=true] *,.al-demo[data-paused=true] *::after{animation-play-state:paused!important}
@keyframes al-flow{from{stroke-dashoffset:212}to{stroke-dashoffset:0}}@keyframes al-live{50%{opacity:.5;transform:scale(.82)}}@keyframes al-type{0%,70%,100%{transform:translateY(0);opacity:.45}35%{transform:translateY(-4px);opacity:1}}
@container al (max-width:649px){
 html:root body#ag-unified-site #main .al-stage{aspect-ratio:auto;height:auto}html:root body#ag-unified-site #main .al-demo .al-stage>img.al-bg{display:none!important}.al-flow{display:none!important}.al-ui{position:relative;inset:auto;display:flex;flex-direction:column;gap:10px;height:auto}
 html:root body#ag-unified-site #main .al-ui :is(.al-channel-panel,.al-incoming,.al-hub,.al-reply,.al-actions){position:relative;inset:auto;width:100%;height:auto;margin:0}
 html:root body#ag-unified-site #main .al-panel{padding:12px}.al-channel-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px 8px;margin-top:8px}.al-channel{min-height:34px;padding:3px 6px;gap:8px}
 html:root body#ag-unified-site #main .al-hub{display:flex;align-items:center;justify-content:space-around;gap:12px;padding:14px 12px;border:1px solid #526baf;border-radius:12px;background:#101b4b;color:#fff;text-align:left;min-height:82px}
 html:root body#ag-unified-site #main .al-hub img.al-brand{display:block!important;width:112px!important;max-width:112px!important;height:30px!important;margin:0!important;object-fit:contain}
 .al-reply-body{min-height:65px}.al-actions{gap:8px}.al-action{min-height:48px}.al-mobile-arrow{display:block;position:relative;align-self:center;width:3px;height:17px;background:#76baff;border-radius:9px;overflow:hidden}.al-mobile-arrow::after{content:'';position:absolute;inset:0;background:#065bc8;transform:translateY(-100%);animation:al-mobile-flow 1.2s linear infinite}.al-caption{text-align:left}.al-incoming{min-height:98px}.al-reply{min-height:145px}
}
@keyframes al-mobile-flow{to{transform:translateY(100%)}}
@media(prefers-reduced-motion:reduce){.al-demo *,.al-demo *::after{animation:none!important;transition:none!important}.al-pulse{display:none}.al-mobile-arrow::after{transform:none}}

.al-action-icon svg{width:20px;height:20px}.al-stage[data-state=sent] .al-reply-copy{animation:al-message .25s ease-out both}@keyframes al-message{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}
@container al (max-width:649px){html:root body#ag-unified-site #main .al-caption{padding-right:64px}}
@media(prefers-reduced-motion:reduce){.al-stage[data-state=sent] .al-reply-copy{animation:none!important}}
