/* Editorial finishing for the five local product demonstrations.
   A single application surface, generous result typography and quiet feedback. */
#ai-stack .stack-panel,
#ai-stack .stack-panel[data-mode="knowledge"] {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  gap: 18px 36px;
}
#ai-stack .stack-rail { box-shadow: none; margin-bottom: 30px; }
#ai-stack .stack-step {
  border-color: transparent;
  border-radius: 10px;
  background: transparent;
  color: #526f79;
  box-shadow: none;
  transition: background .24s ease, color .24s ease, border-color .24s ease;
}
#ai-stack .stack-step.active {
  background: #e1f1f2;
  border-color: #b7dadd;
  color: #12697e;
  box-shadow: inset 0 1px 0 #ffffffb3;
}
#ai-stack .stack-step b { opacity: .65; }
#ai-stack .stack-step.active b { opacity: 1; }
#ai-stack .stack-panel .stack-copy > p { color: #52717d; font-size: 14px; line-height: 1.9; }
#ai-stack .stack-tags { gap: 7px; }
#ai-stack .stack-tags span { border: 0; background: #e7f1f2; border-radius: 5px; color: #497482; }
#ai-stack .stack-swipe-controls { border-color: #c8e0e3; }
#ai-stack .task-stage {
  --task-ink: #174c5c;
  --task-muted: #536f7a;
  border-color: #c5dfe3;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 22px 45px -31px #185a7270, 0 3px 8px #185a7205;
}
#ai-stack .task-windowbar {
  min-height: 48px;
  padding: 12px 20px;
  color: #184e60;
  background: #f4fafb;
  border-bottom: 1px solid #e0edf0;
}
#ai-stack .task-brand { font-size: 12px; }
#ai-stack .task-brand b { color: #527782; }
#ai-stack .task-brand > i { background: #168b91; box-shadow: 0 0 0 4px #168b910c; }
#ai-stack .task-local-badge { border: 0; background: #e4f0f1; color: #507480; font-size: 10px; padding: 3px 8px; }
#ai-stack .task-prompt { padding: 18px 20px 6px; gap: 10px; }
#ai-stack .task-prompt p { color: #184f61; font-size: 15px; line-height: 1.7; }
#ai-stack .task-scenarios button { font-size: 12px; color: #55747f; border-radius: 6px; min-height: 38px; }
#ai-stack .task-scenarios button[aria-pressed="true"] { border-color: transparent; background: #eaf4f5; color: #146b7e; }
#ai-stack .task-run { border-radius: 8px; min-height: 40px; font-size: 12px; padding: 9px 13px; box-shadow: 0 3px 8px #0c60741c; }
#ai-stack .task-run:active { transform: translateY(1px); }
#ai-stack .task-live-status { color: #5a7985; font-size: 10px; }
#ai-stack .task-scene { margin-inline: 16px; }
#ai-stack .task-block-label { font-size: 12px; color: #436b79; margin-bottom: 12px; }
#ai-stack .task-block-label > b { font-size: 10px; color: #6c8a94; }
#ai-stack .task-timeline { margin-inline: 20px; }
#ai-stack .task-step { font-size: 10px; color: #64818a; gap: 6px; }
#ai-stack .task-disclaimer { padding: 11px 20px 14px; font-size: 10px; color: #67838c; }
#ai-stack .task-result-strip { font-size: 12px; color: #5f7f87; background: #f1f6f6; line-height: 1.65; padding: 10px; }
#ai-stack .task-result-strip.is-revealed { background: #eaf5ef; color: #286f60; }

/* This paragraph needs an explicit color: a legacy panel rule made it white. */
#ai-stack .task-wait { position: relative; min-height: 142px; gap: 13px; border-radius: 8px; isolation: isolate; }
#ai-stack .task-wait::before {
  content: "";
  position: absolute;
  inset: 5px;
  z-index: -1;
  pointer-events: none;
  border-radius: inherit;
  background: radial-gradient(ellipse at 50% 43%, #d9efee80, transparent 67%), repeating-linear-gradient(0deg, transparent, transparent 27px, #c6dfe923 27px, #c6dfe923 28px);
  mask-image: radial-gradient(ellipse, #000 12%, transparent 75%);
}
#ai-stack .task-wait > svg { color: #368f9d; width: 31px; height: 31px; opacity: .85; }
#ai-stack .task-wait p { display: block; color: #547984; font-size: 13px; line-height: 1.8; }
#ai-stack .task-answer { border: 0; border-radius: 0; padding: 13px 10px 4px 14px; background: transparent; }
#ai-stack .task-answer-body { min-height: 180px; }
#ai-stack .task-answer-lead { font-size: 14px; color: #365f6d; line-height: 1.8; }
#ai-stack .task-answer-list { gap: 11px; }
#ai-stack .task-answer-list li { font-size: 13px; color: #486d7a; line-height: 1.8; }
#ai-stack .task-answer-list li > span { margin-top: 4px; }
#ai-stack .task-answer-citations { font-size: 10px; color: #63828c; padding-block: 12px; }
#ai-stack .task-library { border-radius: 11px; background: linear-gradient(145deg, #14576b, #207780); padding: 15px; }
#ai-stack .task-source { border: 0; border-radius: 0; background: transparent; padding: 10px 3px; margin: 0; border-bottom: 1px solid #b5e2e31f; opacity: .86; }
#ai-stack .task-source.is-revealed { background: transparent; border-color: #b5e2e33a; }
#ai-stack .task-source.is-selected, #ai-stack .task-source.is-revealed:hover { background: #ffffff0d; border-color: #d5f5ef94; }
#ai-stack .task-source strong { font-size: 12px; }
#ai-stack .task-source small { font-size: 10px; color: #a7ced4; }
#ai-stack .task-source-excerpt { font-size: 11px; color: #c1dfe2; padding-top: 12px; }
#ai-stack .task-channel { border: 0; border-bottom: 1px solid #d9e9ec; background: transparent; border-radius: 0; padding: 10px 4px 11px; margin: 0; opacity: .76; }
#ai-stack .task-channel.is-revealed { border-color: #c8e2e5; }
#ai-stack .task-channel strong { font-size: 13px; }
#ai-stack .task-channel strong small { font-size: 10px; color: #5d7f8a; }
#ai-stack .task-channel p { font-size: 12px; color: #527681; }
#ai-stack .task-channel > b { position: static; grid-column: 2; font-size: 10px; color: #3f8179; }
#ai-stack .task-channel.is-revealed p { padding-right: 0; }
#ai-stack .task-channel-plan > .task-result-strip { margin-top: 12px; }
#ai-stack .task-content-preview { display: flex; flex-direction: column; }
#ai-stack .task-content-sheet { border-radius: 10px; flex: 1; }
#ai-stack .task-content-tags { font-size: 10px; }
#ai-stack .task-content-sheet > p { font-size: 12px; color: #c5e3e5; }
#ai-stack .task-content-sheet > small { font-size: 10px; color: #b4d8dd; }
#ai-stack .task-conversation { border: 0; padding: 12px 4px; border-radius: 0; }
#ai-stack .task-chat-message p { font-size: 13px; color: #375f6f; }
#ai-stack .task-chat-agent p { border: 0; color: #386e69; background: #eaf4f1; }
#ai-stack .task-chat-agent p.task-chat-idle { color: #64838c; }
#ai-stack .task-chat-agent small { font-size: 10px; color: #60828a; }
#ai-stack .task-customer-context { border: 0; border-radius: 10px; padding: 15px; background: #edf6f6; }
#ai-stack .task-context-items > span { font-size: 12px; color: #65858c; }
#ai-stack .task-context-items > span.is-revealed { color: #466f7b; }
#ai-stack .task-next-action > small { font-size: 10px; }
#ai-stack .task-next-action > strong { font-size: 13px; }
#ai-stack .task-next-action > p { font-size: 11px; color: #63878c; }
#ai-stack .task-workflow-board { border: 0; background-color: #eff7f7; border-radius: 10px; }
#ai-stack .task-flow-node { box-shadow: 0 3px 7px #18566b05; min-height: 78px; }
#ai-stack .task-flow-node strong { font-size: 12px; white-space: normal; }
#ai-stack .task-flow-node small { font-size: 10px; }
#ai-stack .task-flow-input { font-size: 10px; color: #5f8590; }
#ai-stack .task-flow-output { border: 0; border-radius: 0; padding: 12px 6px; }
#ai-stack .task-flow-tasks li { font-size: 13px; color: #436d7a; }
#ai-stack .task-flow-review { font-size: 10px; color: #62818b; }
#ai-stack .task-flow-review button { min-height: 40px; font-size: 11px; padding-inline: 12px; }
#ai-stack .task-cockpit { padding: 14px; border-radius: 11px; }
#ai-stack .task-kpi { border: 0; background: transparent; border-radius: 7px; padding: 8px 10px; }
#ai-stack .task-kpi + .task-kpi { border-left: 1px solid #bde6e329; }
#ai-stack .task-kpi > small { font-size: 11px; color: #c2dde2; }
#ai-stack .task-kpi > strong { font-size: 29px; }
#ai-stack .task-kpi > span { font-size: 10px; color: #a5ccd3; }
#ai-stack .task-kpi-alert { background: #bdd19b12; }
#ai-stack .task-diagnostic, #ai-stack .task-decision { border: 0; border-radius: 0; background: transparent; padding: 10px 4px; }
#ai-stack .task-cockpit .task-block-label { font-size: 12px; color: #cce5e9; }
#ai-stack .task-cockpit .task-block-label > b { font-size: 10px; color: #9ac5ce; }
#ai-stack .task-diagnostic > p { font-size: 11px; color: #a8ced5; }
#ai-stack .task-diagnostic-bars > div { font-size: 11px; grid-template-columns: 55px 1fr 26px; }
#ai-stack .task-diagnostic-bars b { font-size: 9px; }
#ai-stack .task-decision-reason { font-size: 12px; color: #c1dfe4; }
#ai-stack .task-decision li { font-size: 12px; }
#ai-stack .task-decision .task-result-strip { font-size: 10px; color: #a9cdd2; line-height: 1.7; }
#ai-stack .task-decision .task-wait p { font-size: 12px; color: #b2d7db; }
#ai-stack .task-decision .task-wait::before { opacity: .35; }

@media (min-width: 1101px) {
  #ai-stack .stack-panel, #ai-stack .stack-panel[data-mode="knowledge"] {
    grid-template-columns: minmax(225px, .65fr) minmax(0, 1.65fr);
    grid-template-rows: min-content 1fr auto;
  }
  #ai-stack .stack-panel-top { padding: 19px 0 0; gap: 8px; }
  #ai-stack .stack-copy, #ai-stack .stack-panel[data-mode="knowledge"] .stack-copy { align-self: start; justify-content: flex-start; padding-top: 19px; gap: 21px; }
  #ai-stack .stack-panel .stack-copy > h3, #ai-stack .stack-panel[data-mode="knowledge"] .stack-copy > h3 { font-size: clamp(27px, 2.15vw, 33px); line-height: 1.5; }
  #ai-stack .stack-swipe-controls { grid-column: 2; padding-top: 4px; }
}
@media (min-width: 601px) {
  #ai-stack .task-scenarios { padding: 8px 0 15px 16px; }
  #ai-stack .task-controlbar { padding: 8px 16px 15px 4px; gap: 9px; }
  #ai-stack .task-live-status { max-width: 77px; }
  #ai-stack .task-knowledge-grid { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 8px; }
}
@media (min-width: 761px) and (max-width: 1100px) {
  #ai-stack .stack-panel-top { padding-block: 0 5px; }
  #ai-stack .stack-copy, #ai-stack .stack-panel[data-mode="knowledge"] .stack-copy { padding: 8px 0; }
}
@media (max-width: 760px) {
  #ai-stack .stack-rail { margin-bottom: 16px; }
  #ai-stack .stack-step { font-size: 13px; padding-inline: 14px; }
  #ai-stack .stack-panel, #ai-stack .stack-panel[data-mode="knowledge"] { gap: 23px; }
  #ai-stack .stack-copy, #ai-stack .stack-panel[data-mode="knowledge"] .stack-copy { padding-inline: 2px; gap: 13px; }
  #ai-stack .stack-panel .stack-copy > p { font-size: 14px; }
  #ai-stack .stack-tags span { font-size: 11px; padding: 5px 9px; }
  #ai-stack .stack-swipe-controls { padding-top: 13px; }
}
@media (max-width: 600px) {
  #ai-stack .task-stage { border-radius: 15px; }
  #ai-stack .task-windowbar { padding: 13px 15px; }
  #ai-stack .task-brand { font-size: 11px; gap: 7px; }
  #ai-stack .task-local-badge { font-size: 10px; padding: 3px 7px; }
  #ai-stack .task-scenarios { padding: 10px 10px 0; min-height: 52px; }
  #ai-stack .task-scenarios button { min-height: 42px; padding-inline: 10px; }
  #ai-stack .task-prompt { padding: 14px 15px 2px; }
  #ai-stack .task-prompt p { font-size: 14px; }
  #ai-stack .task-controlbar { padding: 12px 15px 17px; gap: 9px; }
  #ai-stack .task-run { min-height: 44px; font-size: 12px; padding: 10px 12px; }
  #ai-stack .task-live-status { font-size: 11px; max-width: 102px; }
  #ai-stack .task-scene { margin-inline: 12px; }
  #ai-stack .task-answer { padding: 7px 3px 0; }
  #ai-stack .task-answer-body { min-height: 175px; }
  #ai-stack .task-answer-list li { font-size: 13px; }
  #ai-stack .task-result-strip { font-size: 12px; }
  #ai-stack .task-wait { min-height: 141px; }
  #ai-stack .task-library { padding: 12px; gap: 6px; }
  #ai-stack .task-library .task-block-label { margin-bottom: 2px; }
  #ai-stack .task-source { min-height: 72px; border: 0; border-radius: 5px; padding: 7px 3px; margin: 0; background: #ffffff07; }
  #ai-stack .task-source.is-revealed { background: #ffffff09; }
  #ai-stack .task-source strong { font-size: 11px; line-height: 1.8; }
  #ai-stack .task-source small { font-size: 10px; line-height: 1.65; white-space: normal; }
  #ai-stack .task-source-excerpt { font-size: 11px; min-height: 0; padding-top: 5px; }
  #ai-stack .task-timeline { margin: 16px 15px 0; gap: 10px; padding-top: 12px; }
  #ai-stack .task-step { font-size: 11px; }
  #ai-stack .task-disclaimer { font-size: 10px; padding: 12px 15px 14px; }
  #ai-stack .task-channel { min-height: 80px; padding: 12px 2px; }
  #ai-stack .task-channel p { font-size: 13px; }
  #ai-stack .task-content-sheet > p { font-size: 13px; }
  #ai-stack .task-content-sheet > small { font-size: 10px; }
  #ai-stack .task-conversation { min-height: 267px; padding: 7px 0; }
  #ai-stack .task-chat-agent > div { min-height: 126px; }
  #ai-stack .task-chat-message { gap: 7px; }
  #ai-stack .task-chat-message p { font-size: 13px; line-height: 1.85; }
  #ai-stack .task-customer-context { gap: 0 10px; padding: 13px; }
  #ai-stack .task-context-items > span { font-size: 11px; }
  #ai-stack .task-next-action { padding-left: 11px; }
  #ai-stack .task-next-action > strong { font-size: 12px; }
  #ai-stack .task-next-action > p { font-size: 11px; }
  #ai-stack .task-flow-node { min-height: 87px; padding: 10px 4px; }
  #ai-stack .task-flow-input strong { font-size: 10px; }
  #ai-stack .task-flow-output { padding: 11px 3px 4px; }
  #ai-stack .task-flow-tasks li { font-size: 13px; }
  #ai-stack .task-flow-review { gap: 11px; font-size: 10px; }
  #ai-stack .task-flow-review button { min-height: 44px; }
  #ai-stack .task-cockpit { padding: 11px; gap: 12px; }
  #ai-stack .task-kpi-row { gap: 3px; }
  #ai-stack .task-kpi { padding: 6px 4px; min-height: 100px; }
  #ai-stack .task-kpi > small { font-size: 10px; }
  #ai-stack .task-kpi > strong { font-size: clamp(24px, 6.5vw, 29px); }
  #ai-stack .task-kpi > span { font-size: 10px; }
  #ai-stack .task-diagnostic, #ai-stack .task-decision { padding: 9px 2px; }
  #ai-stack .task-decision { border-top: 1px solid #b5dce22c; padding-top: 15px; }
  #ai-stack .task-decision-reason { font-size: 13px; }
  #ai-stack .task-decision li { font-size: 13px; }
  #ai-stack .task-decision .task-result-strip { font-size: 11px; padding: 8px; }
}
@media (hover: hover) and (pointer: fine) {
  #ai-stack .stack-step:hover { background: #eaf4f4; color: #176a7c; }
  #ai-stack .task-run:hover { background: #11879a; box-shadow: 0 5px 12px #0c607429; }
}
@media (prefers-reduced-motion: no-preference) {
  #ai-stack .task-stage[data-state="done"] .task-result-strip.is-revealed { animation: task-result-settle .65s ease-out both; }
  #ai-stack .task-stage[data-state="done"] .task-live-status { animation: task-complete-ink .55s ease-out both; }
}
@keyframes task-result-settle { from { transform: translateY(4px); opacity: .35; } to { transform: translateY(0); opacity: 1; } }
@keyframes task-complete-ink { from { opacity: .4; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  #ai-stack .stack-step, #ai-stack .task-run, #ai-stack .task-source { transition: none; }
  #ai-stack .task-run:active { transform: none; }
}
