/* Selected A layout and scene states. Values live in the shared token theme. */
* {
  box-sizing:border-box}
html {
  scroll-behavior:smooth;
  scroll-padding-top:24px}
body {
  margin:0;line-height:var(--site-leading-0);
  -webkit-font-smoothing:antialiased}
button {
  font:inherit}
button {
  -webkit-tap-highlight-color:transparent}
a {
  -webkit-tap-highlight-color:transparent}
button {
  cursor:pointer}
button:disabled {
  cursor:default;
  opacity:.5}
button:focus-visible {
  outline:3px solid var(--tone-9074c5);
  outline-offset:4px}
a:focus-visible {
  outline:3px solid var(--tone-9074c5);
  outline-offset:4px}
a {
  color:inherit;
  text-decoration:none}
svg {
  width:20px;
  height:20px;
  flex-shrink:0}
button {
  border:0;
  background:none;
  color:inherit}
p {
  margin:0}
h1 {
  font-weight:var(--site-weight-0);line-height:var(--site-leading-1);margin:0;letter-spacing:var(--site-tracking-0)}
h2 {
  font-weight:var(--site-weight-0);line-height:var(--site-leading-1);margin:0;letter-spacing:var(--site-tracking-0)}
h3 {
  font-weight:var(--site-weight-0);line-height:var(--site-leading-1);
  margin:0}
h1 {
  font-size:clamp(var(--text-42px),4.35vw,var(--text-64px))}
h2 {
  font-size:var(--text-40px)}
h3 {
  font-size:var(--text-21px);letter-spacing:var(--site-tracking-1)}
em {
  font-weight:var(--site-weight-1)}
small {
  font-size:var(--text-11px)}
.wrap {
  margin:0 auto;padding-left:var(--space-32px);padding-right:var(--space-32px)}
.brand {
  display:flex;align-items:center;gap:var(--space-7px);font-size:var(--text-23px);font-weight:var(--site-weight-2);letter-spacing:var(--site-tracking-2)}
.brand-mark {
  font-size:var(--text-37px);line-height:var(--site-leading-2)}
.labs {
  font-weight:var(--site-weight-1);font-size:var(--text-13px);letter-spacing:var(--site-tracking-3);align-self:flex-end;margin-bottom:var(--space-4px)}
.site-header nav {
  margin-left:auto}
.button {
  color:var(--color-bg-primary);padding:var(--space-13px) var(--space-18px);border-radius:var(--radius-7px);display:inline-flex;align-items:center;justify-content:center;gap:var(--space-16px);font-size:var(--text-13px);font-weight:var(--site-weight-0);
  min-height:44px}
.button.small {
  min-height:34px;padding:var(--space-8px) var(--space-14px);font-size:var(--text-12px)}
.eyebrow {
  font-size:var(--text-11px);letter-spacing:var(--site-tracking-4);text-transform:uppercase;font-weight:var(--site-weight-2);display:block;margin-bottom:var(--space-23px)}
.hero {
  padding-top:var(--space-70px);padding-bottom:var(--space-65px)}
.demo {
  min-width:0;color:var(--text)}
.stage {
  position:relative;margin-top:var(--space-10px)}
.workspace {
  width:calc(100% - 38px);position:absolute;left:0;top:5px;border:1px solid var(--line);border-radius:var(--radius-10px);background:var(--panel);box-shadow:var(--site-shadow-0);
  overflow:hidden;
  z-index:2}
.app-top {
  height:34px;display:flex;align-items:center;gap:var(--space-7px);padding:0 var(--space-12px);border-bottom:1px solid var(--line);font-size:var(--text-10px);background:var(--panel)}
.app-symbol {
  font-size:var(--text-18px)}
.app-top>b {
  font-size:var(--text-11px);font-weight:var(--site-weight-2)}
.app-top>span:nth-of-type(2) {
  margin-left:var(--space-13px);color:var(--muted)}
.app-top i {
  margin-left:auto;width:4px;height:4px;background:var(--accent);
  border-radius:50%}
.app-top small {
  font-size:var(--text-9px);color:var(--muted)}
.app-body {
  display:flex}
.inbox {
  width:110px;flex-shrink:0;background:var(--bg);border-right:1px solid var(--line);position:relative;padding:0 var(--space-5px)}
.inbox-heading {
  height:37px;display:flex;gap:var(--space-6px);align-items:center;padding:0 var(--space-6px);font-size:var(--text-10px)}
.inbox-heading svg {
  width:13px;
  height:13px}
.inbox-tabs {
  font-size:var(--text-9px);color:var(--muted);display:flex;gap:var(--space-13px);padding:var(--space-4px) var(--space-8px) var(--space-10px)}
.inbox-tabs b {
  font-weight:var(--site-weight-0);color:var(--text)}
.person-row {
  height:40px;display:flex;align-items:center;gap:var(--space-7px);padding:0 var(--space-6px);border-radius:var(--radius-4px)}
.person-row.selected {
  background:var(--selected)}
.avatar {
  height:22px;width:22px;border-radius:50%;background:var(--avatar-bg);color:var(--avatar-text);display:grid;place-items:center;font-size:var(--text-9px)}
.person-row b {
  font-size:var(--text-10px);font-weight:var(--site-weight-0);
  display:block}
.person-row small {
  display:block;font-size:var(--text-8px);color:var(--muted)}
.person-row i {
  width:4px;height:4px;background:var(--accent);
  border-radius:50%;
  margin-left:auto}
.inbox-bottom {
  position:absolute;bottom:12px;left:10px;display:flex;align-items:center;gap:var(--space-5px);font-size:var(--text-8px);color:var(--muted)}
.inbox-bottom .robot {
  width:18px;
  height:18px}
.inbox-bottom .robot svg {
  width:13px;
  height:13px}
.chat-panel {
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column}
.chat-header {
  height:47px;padding:0 var(--space-13px);display:flex;align-items:center;gap:var(--space-8px);border-bottom:1px solid var(--line);
  flex-shrink:0}
.robot {
  width:27px;height:27px;border-radius:var(--radius-8px);background:var(--accent-soft);color:var(--accent);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0}
.robot svg {
  width:19px;
  height:19px}
.chat-header strong {
  font-size:var(--text-11px);font-weight:var(--site-weight-2);display:flex;gap:var(--space-6px);
  align-items:center}
.chat-header small {
  display:flex;gap:var(--space-4px);align-items:center;font-size:var(--text-8px);color:var(--muted)}
.messages {
  flex:1;position:relative;padding:0 var(--space-15px);
  min-height:0}
.welcome {
  font-size:var(--text-9px);color:var(--muted)}
.welcome>span {
  display:block;text-align:center;font-size:var(--text-8px);color:var(--faint)}
.welcome p {
  margin:0 0 var(--space-9px) 0}
.message {
  opacity:0;transform:translateY(10px);transition:var(--site-transition-0)}
.customer {
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  max-width:100%}
.customer small {
  font-size:var(--text-8px);color:var(--muted);margin-bottom:var(--space-3px)}
.bubble {
  background:var(--accent-fill);color:var(--accent-fill-ink);line-height:var(--site-leading-0);max-width:290px;padding:var(--space-8px) var(--space-11px);border-radius:var(--radius-10px) var(--radius-10px) var(--radius-2px) var(--radius-10px)}
.agent-pending {
  position:absolute;top:129px;left:15px;display:flex;align-items:center;gap:var(--space-6px);opacity:0;transition:var(--site-transition-1)}
.agent-pending>span:last-child {
  font-size:var(--text-9px);color:var(--muted);margin-left:var(--space-3px)}
.dots {
  background:var(--raised);border:1px solid var(--line);height:28px;padding:0 var(--space-10px);display:flex;gap:var(--space-4px);align-items:center;border-radius:var(--radius-9px)}
.dots i {
  height:4px;width:4px;border-radius:50%;background:var(--muted);animation:var(--site-animation-0)}
.dots i:nth-child(2) {
  animation-delay:.15s}
.dots i:nth-child(3) {
  animation-delay:.3s}
.agent-reply {
  display:flex;gap:var(--space-7px);
  position:relative}
.agent-reply>.robot {
  width:22px;height:22px;margin-top:var(--space-2px)}
.agent-reply>.robot svg {
  width:16px;
  height:16px}
.reply-content {
  min-width:0;
  flex:1}
.reply-content>small {
  display:flex;gap:var(--space-5px);font-size:var(--text-8px);color:var(--muted);margin-bottom:var(--space-4px)}
.reply-content>small span {
  font-size:var(--text-7px);padding:0 var(--space-3px);border:1px solid var(--line);border-radius:var(--radius-2px)}
.reply-content>p {
  margin-bottom:var(--space-7px);line-height:var(--site-leading-0)}
.rich-card {
  border:1px solid var(--line);background:var(--panel);border-radius:var(--radius-8px);overflow:hidden;box-shadow:var(--site-shadow-1);
  max-width:338px}
.product {
  display:flex;gap:var(--space-12px);padding:var(--space-9px);
  align-items:center}
.product-image {
  position:relative;background:var(--tone-eae9e2);border-radius:var(--radius-5px);
  width:95px;
  padding:0;
  flex-shrink:0;
  overflow:hidden}
.product-image img {
  display:block;width:100%;height:100%;object-fit:cover;transition:var(--site-transition-2)}
.product-image span {
  position:absolute;bottom:5px;right:6px;font-size:var(--text-10px);color:var(--tone-48513d)}
.product-image.zoomed img {
  transform:scale(1.65)}
.product>div {
  min-width:0}
.mini-label {
  letter-spacing:var(--site-tracking-5);color:var(--muted);display:block;margin-bottom:var(--space-6px)}
.product strong {
  font-weight:var(--site-weight-0);display:block;line-height:var(--site-leading-3)}
.product p {
  color:var(--muted);margin:var(--space-6px) 0 var(--space-8px);line-height:var(--site-leading-0)}
.product-tag {
  display:flex;align-items:center;gap:var(--space-3px);color:var(--accent);line-height:var(--site-leading-4)}
.product-tag svg {
  width:11px;
  height:11px}
.total-row {
  padding:var(--space-10px) var(--space-12px);border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:var(--space-8px);align-items:center;background:var(--raised)}
.total-row small {
  display:block;color:var(--muted);margin-top:var(--space-2px)}
.total-row>strong {
  font-size:var(--text-22px);font-weight:var(--site-weight-0);letter-spacing:var(--site-tracking-6);
  font-variant-numeric:tabular-nums;
  white-space:nowrap}
.estimate-note {
  line-height:var(--site-leading-5);padding:var(--space-7px) var(--space-12px);color:var(--muted)}
.composer {
  display:flex;align-items:center;gap:var(--space-9px);height:33px;border-top:1px solid var(--line);margin-top:auto;padding:0 var(--space-12px);color:var(--faint);font-size:var(--text-9px);
  flex-shrink:0}
.composer>span:first-child {
  margin-right:auto}
.send-icon {
  border-radius:var(--radius-4px);background:var(--raised);width:18px;height:18px;text-align:center;color:var(--muted)}
.tool-dock {
  position:absolute;right:0;bottom:23px;width:265px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-9px);box-shadow:var(--site-shadow-2);z-index:4;opacity:0;transform:translateY(12px) scale(.97);transition:var(--site-transition-3);
  transform-origin:top left}
.tool-heading {
  height:32px;border-bottom:1px solid var(--line);padding:0 var(--space-12px);display:flex;align-items:center;justify-content:space-between;gap:var(--space-8px)}
.tool-heading>span {
  display:flex;align-items:center;gap:var(--space-6px);font-size:var(--text-7px);letter-spacing:var(--site-tracking-5);color:var(--muted)}
.tool-heading svg {
  width:12px;
  height:12px}
.connection-light {
  width:5px;height:5px;border-radius:50%;background:var(--accent)}
.tool-row {
  display:flex;align-items:center;gap:var(--space-10px);padding:var(--space-10px) var(--space-12px);opacity:.4;transition:var(--site-transition-4)}
.tool-icon {
  display:grid;place-items:center;background:var(--raised);border:1px solid var(--line);width:29px;height:29px;border-radius:var(--radius-6px)}
.tool-icon svg {
  width:17px;
  height:17px}
.tool-row strong {
  display:block;font-size:var(--text-11px);font-weight:var(--site-weight-0)}
.tool-row small {
  display:block;font-size:var(--text-8px);color:var(--muted);margin-top:var(--space-1px)}
.tool-status {
  margin-left:auto;display:grid;place-items:center;width:15px;height:15px;border:1.5px solid var(--line);border-top-color:var(--accent);
  border-radius:50%}
.tool-status svg {
  width:12px;height:12px;opacity:0;color:var(--accent)}
.tool-return {
  padding:var(--space-7px) var(--space-12px);background:var(--accent-soft);color:var(--accent);font-size:var(--text-8px);display:flex;align-items:center;gap:var(--space-7px);border-radius:0 0 var(--radius-8px) var(--radius-8px)}
.tool-return svg {
  width:12px;height:12px;transform:rotate(-90deg)}
.demo:not([data-phase="0"]) .customer {
  opacity:1;
  transform:none}
.demo[data-phase="1"] .agent-pending {
  opacity:0}
.demo:is([data-phase="2"],[data-phase="3"],[data-phase="4"]) .agent-pending {
  opacity:1}
.demo:is([data-phase="2"],[data-phase="3"],[data-phase="4"]) .tool-dock {
  opacity:1;
  transform:none}
.demo:is([data-phase="2"],[data-phase="3"],[data-phase="4"]) .library {
  opacity:1}
.demo:is([data-phase="3"],[data-phase="4"]) .pricing {
  opacity:1}
.demo[data-phase="2"] .library {
  background:var(--accent-soft)}
.demo[data-phase="3"] .pricing {
  background:var(--accent-soft)}
.demo[data-phase="2"] .library .tool-status {
  animation:var(--site-animation-1)}
.demo[data-phase="3"] .pricing .tool-status {
  animation:var(--site-animation-1)}
.demo:is([data-phase="3"],[data-phase="4"]) .library .tool-status {
  border-color:transparent}
.demo[data-phase="4"] .pricing .tool-status {
  border-color:transparent}
.demo:is([data-phase="3"],[data-phase="4"]) .library .tool-status svg {
  opacity:1}
.demo[data-phase="4"] .pricing .tool-status svg {
  opacity:1}
.demo:is([data-phase="5"],[data-phase="6"]) .agent-reply {
  opacity:1;
  transform:none}
.demo:is([data-phase="5"],[data-phase="6"]) .tool-dock {
  transform:translateY(-20px) scale(.9)}
.demo[data-playing="false"] * {
  animation-play-state:paused!important}
.demo.reduced * {
  animation:none!important;
  transition:none!important}
.story-index {
  padding-top:var(--space-35px)}
.story-index ol {
  list-style:none;padding:0;margin:var(--space-25px) 0 var(--space-35px)}
.story-index li {
  display:flex;gap:var(--space-16px);border-left:2px solid var(--tone-daddd1);padding:0 0 var(--space-26px) var(--space-19px);opacity:.55;transition:var(--site-transition-5)}
.story-index li.active {
  opacity:1;border-color:var(--tone-7a9359)}
.story-index li>span {
  font-size:var(--text-10px);color:var(--tone-7e8d70);padding-top:var(--space-4px)}
.story-index strong {
  font-size:var(--text-16px);font-weight:var(--site-weight-0)}
.story-index p {
  font-size:var(--text-12px);color:var(--tone-727b68);margin-top:var(--space-6px);
  max-width:205px}
.text-button {
  padding:0;font-size:var(--text-13px);margin-top:var(--space-22px);
  text-decoration:underline;
  text-underline-offset:5px}
.closing {
  text-align:center;border-top:1px solid var(--tone-dfe4d6);padding-top:var(--space-70px);padding-bottom:var(--space-85px)}
.closing .brand-mark {
  display:block;font-size:var(--text-47px);margin-bottom:var(--space-23px)}
.closing h2 {
  font-size:var(--text-43px)}
.closing p {
  font-size:var(--text-15px);margin:var(--space-20px) 0 var(--space-28px)}
footer {
  display:flex;align-items:center;gap:var(--space-35px);padding-top:var(--space-30px);padding-bottom:var(--space-35px)!important;border-top:1px solid var(--tone-e1e5da);font-size:var(--text-11px)}
footer>small {
  margin-left:auto;font-size:var(--text-10px)}
footer .brand {
  color:var(--tone-2e3627)}
.reduced * {
  scroll-behavior:auto!important}
@keyframes spin {
  to {
  transform:rotate(360deg)}
}
@keyframes dots {
  50% {
  transform:translateY(-3px);
  opacity:.4}
}
@media(min-width:1450px) {
  .wrap {
  max-width:1320px}
}
@media(max-width:1100px) {
  .wrap {
  padding-left:var(--space-24px);padding-right:var(--space-24px)}
}
@media(max-width:760px) {
  h1 {
  font-size:var(--text-43px)}
h2 {
  font-size:var(--text-33px)}
.site-header>.button {
  margin-left:auto}
.brand {
  font-size:var(--text-21px)}
.hero {
  padding-top:var(--space-32px);padding-bottom:var(--space-36px)}
.workspace {
  width:calc(100% - 10px)}
.inbox {
  display:none}
.app-top small {
  font-size:var(--text-8px)}
.app-top>span:nth-of-type(2) {
  margin-left:var(--space-5px)}
.chat-header {
  padding:0 var(--space-10px)}
.messages {
  padding:0 var(--space-11px)}
.bubble {
  max-width:260px}
.agent-pending {
  left:11px}
.agent-reply {
  gap:var(--space-5px)}
.tool-dock {
  right:0;
  bottom:8px;
  width:248px}
.story-index {
  padding:0;
  order:2}
.story-index ol {
  display:flex;gap:var(--space-12px);
  margin:0}
.story-index li {
  flex:1;display:block;padding:var(--space-8px) 0 0;border-left:0;border-top:2px solid var(--tone-daddd1)}
.story-index li p {
  display:none}
.story-index li strong {
  font-size:var(--text-11px);line-height:var(--site-leading-4);
  display:block}
.story-index li>span {
  font-size:var(--text-8px)}
.closing {
  padding-top:var(--space-50px);padding-bottom:var(--space-60px)}
.closing h2 {
  font-size:var(--text-33px)}
footer {
  flex-wrap:wrap;gap:var(--space-14px)}
footer>span {
  width:100%}
footer>small {
  margin-left:0}
.product {
  gap:var(--space-9px)}
.total-row>strong {
  font-size:var(--text-22px)}
}
@media(prefers-reduced-motion:reduce) {
  html {
  scroll-behavior:auto}
* {
  animation:none!important;
  transition:none!important}
*::before {
  animation:none!important;
  transition:none!important}
*::after {
  animation:none!important;
  transition:none!important}
}
.welcome {
  padding-top:var(--space-6px)}
.welcome>span {
  margin-bottom:var(--space-3px)}
.welcome p {
  display:none}
.agent-reply {
  margin-top:var(--space-10px)}
.product-image {
  height:88px}
.app-body {
  height:430px}
.stage {
  height:535px}
.person-row small {
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:55px}
.person-row>div {
  min-width:0}
.bubble {
  font-size:var(--text-12px)}
.reply-content>p {
  font-size:var(--text-11px)}
.product strong {
  font-size:var(--text-13px)}
.mini-label {
  font-size:var(--text-8px)}
.product p {
  font-size:var(--text-10px)}
.product-tag {
  font-size:var(--text-9px)}
.estimate-note {
  font-size:var(--text-8px)}
.total-row span {
  font-size:var(--text-10px)}
.total-row small {
  font-size:var(--text-9px)}
.demo:is([data-phase="5"],[data-phase="6"]) .tool-dock {
  pointer-events:none}
@media(max-width:760px) {
  .app-body {
  height:446px}
.stage {
  height:533px}
.product-image {
  width:83px;
  height:88px}
.product strong {
  font-size:var(--text-12px)}
.product-tag {
  font-size:var(--text-8px)}
.estimate-note {
  font-size:var(--text-8px)}
.total-row small {
  font-size:var(--text-8px)}
.bubble {
  font-size:var(--text-12px)}
.reply-content>p {
  font-size:var(--text-11px)}
.reply-content>small {
  font-size:var(--text-9px)}
}
body {
  background:var(--color-bg-primary);color:var(--color-text-primary)}
em {
  color:var(--color-text-secondary)}
.brand-mark {
  color:var(--color-accent)}
.app-symbol {
  color:var(--color-accent)}
.brand {
  color:var(--color-text-primary)}
.labs {
  color:var(--color-text-tertiary)}
.site-header nav {
  color:var(--color-text-secondary)}
.button {
  background:var(--color-text-primary)}
.button:hover {
  background:var(--tone-424a53)}
.eyebrow {
  color:var(--color-text-tertiary)}
.wrap {
  max-width:1280px}
.journey.hero {
  padding-top:var(--space-20px);padding-bottom:var(--space-32px)}
.journey-heading {
  display:flex;justify-content:space-between;align-items:center;gap:var(--space-45px);margin-bottom:var(--space-22px)}
.journey-heading .eyebrow {
  margin-bottom:var(--space-10px);font-size:var(--text-9px)}
.journey h1 {
  font-size:var(--text-43px);line-height:var(--site-leading-6)}
.heading-side {
  max-width:335px;padding-top:var(--space-15px)}
.heading-side p {
  font-size:var(--text-13px);color:var(--color-text-secondary);line-height:var(--site-leading-7)}
.heading-side .text-button {
  margin-top:var(--space-10px);font-size:var(--text-12px)}
.journey-content {
  display:grid;grid-template-columns:185px minmax(0,1fr);gap:var(--space-32px);
  align-items:start}
.journey .story-index {
  padding-top:var(--space-60px)}
.journey .story-index ol {
  margin:var(--space-22px) 0}
.journey .story-index li {
  padding:0 0 var(--space-24px) var(--space-12px);gap:var(--space-10px);border-left-color:var(--color-border-primary);
  opacity:.52}
.journey .story-index li.active {
  border-left-color:var(--color-accent);
  opacity:1}
.journey .story-index strong {
  font-size:var(--text-13px)}
.journey .story-index p {
  font-size:var(--text-11px);color:var(--color-text-secondary);
  max-width:155px}
.journey .story-index li>span {
  font-size:var(--text-9px);color:var(--color-text-tertiary)}
.journey .stage {
  height:489px;margin-top:var(--space-6px);
  isolation:isolate}
.journey .workspace {
  top:0;left:0;width:calc(100% - 265px);z-index:2;box-shadow:var(--site-shadow-3)}
.journey .app-body {
  height:425px}
.journey .inbox {
  width:94px}
.journey .person-row {
  height:40px}
.journey .inbox-heading {
  height:32px}
.journey .person-row small {
  max-width:48px}
.journey .messages {
  padding:0 var(--space-12px)}
.journey .bubble {
  font-size:var(--text-12px);
  max-width:285px}
.journey .agent-pending {
  top:118px;left:12px;padding-right:var(--space-5px);z-index:4;background:var(--panel);border-radius:var(--radius-10px)}
.journey .agent-pending>span:last-child {
  display:none}
.journey .agent-reply {
  gap:var(--space-6px);margin-top:var(--space-10px)}
.journey .reply-content>p {
  font-size:var(--text-11px)}
.journey .rich-card {
  max-width:338px}
.journey .product-image {
  width:84px;
  height:88px}
.journey .product strong {
  font-size:var(--text-12px)}
.journey .product p {
  font-size:var(--text-9px)}
.journey .estimate-note {
  font-size:var(--text-8px)}
.journey .tool-dock {
  top:63px;bottom:auto;right:0;width:232px;opacity:1;transform:none;box-shadow:none;border-radius:var(--radius-9px);z-index:4;transition:var(--site-transition-6)}
.journey .tool-heading {
  height:32px}
.journey .tool-heading>span {
  font-size:var(--text-7px)}
.journey .tool-row {
  position:relative;padding:var(--space-11px);gap:var(--space-8px);opacity:1;background:var(--panel)}
.journey .tool-row strong {
  font-size:var(--text-11px)}
.journey .tool-row small {
  font-size:var(--text-8px)}
.journey .tool-status {
  width:14px;
  height:14px}
.port {
  position:absolute;left:-4px;top:50%;width:7px;height:7px;border:1.5px solid var(--muted);background:var(--panel);border-radius:50%;transform:translateY(-50%)}
.library-preview {
  display:flex;align-items:center;gap:var(--space-10px);padding:0 var(--space-11px) var(--space-12px);min-height:97px;opacity:.3;transition:var(--site-transition-7)}
.library-preview img {
  width:66px;height:77px;border-radius:var(--radius-4px);
  object-fit:cover}
.library-preview b {
  display:block}
.library-preview small {
  display:block}
.match-status {
  display:block}
.match-status {
  font-size:var(--text-8px);color:var(--muted);margin-bottom:var(--space-5px)}
.library-preview b {
  font-size:var(--text-10px);font-weight:var(--site-weight-0)}
.library-preview small {
  font-size:var(--text-8px);color:var(--muted);margin-top:var(--space-3px)}
.calculation {
  padding:0 var(--space-11px) var(--space-13px);opacity:.3;transition:var(--site-transition-7)}
.calculation>span {
  font-size:var(--text-9px);color:var(--muted)}
.calculation strong {
  display:block;font-size:var(--text-25px);font-weight:var(--site-weight-0);letter-spacing:var(--site-tracking-7);line-height:var(--site-leading-4)}
.calculation small {
  font-size:var(--text-8px);color:var(--muted)}
.journey .tool-return {
  font-size:var(--text-8px);background:var(--raised);color:var(--muted)}
.journey .tool-return svg {
  transform:none}
.journey .demo[data-phase="2"] .library {
  background:var(--accent-soft)}
.journey .demo[data-phase="3"] .pricing {
  background:var(--accent-soft)}
.journey .demo:is([data-phase="3"],[data-phase="4"],[data-phase="5"],[data-phase="6"]) .library-preview {
  opacity:1}
.journey .demo:is([data-phase="4"],[data-phase="5"],[data-phase="6"]) .calculation {
  opacity:1}
.journey .demo:is([data-phase="5"],[data-phase="6"]) .tool-dock {
  transform:none;
  opacity:1}
.journey .demo:is([data-phase="4"],[data-phase="5"],[data-phase="6"]) .tool-return {
  color:var(--accent);background:var(--accent-soft)}
.journey .demo:is([data-phase="5"],[data-phase="6"]) .tool-status {
  border-color:transparent}
.journey .demo:is([data-phase="5"],[data-phase="6"]) .tool-status svg {
  opacity:1}
.result-transfer {
  position:absolute;z-index:8;display:flex;align-items:center;gap:var(--space-12px);padding:var(--space-13px);width:255px;border:1px solid var(--line);background:var(--panel);border-radius:var(--radius-9px);box-shadow:var(--site-shadow-4);
  opacity:0;
  pointer-events:none}
.result-transfer>img {
  width:70px;height:83px;object-fit:cover;border-radius:var(--radius-4px)}
.result-transfer small {
  display:block;font-size:var(--text-7px);letter-spacing:var(--site-tracking-5);color:var(--muted);margin-bottom:var(--space-5px)}
.result-transfer strong {
  display:block;font-size:var(--text-11px);font-weight:var(--site-weight-0)}
.result-transfer b {
  display:block;font-size:var(--text-24px);line-height:var(--site-leading-3);letter-spacing:var(--site-tracking-7);font-weight:var(--site-weight-0)}
.result-transfer span {
  display:flex;gap:var(--space-4px);align-items:center;font-size:var(--text-7px);color:var(--accent);margin-top:var(--space-5px)}
.result-transfer svg {
  width:10px;
  height:10px}
.closing p {
  color:var(--color-text-secondary)}
.closing {
  border-color:var(--color-border-secondary)}
footer {
  border-color:var(--color-border-secondary)}
footer {
  color:var(--color-text-tertiary)}
@media(max-width:1100px) {
  .journey-content {
  grid-template-columns:150px minmax(0,1fr);gap:var(--space-24px)}
.journey h1 {
  font-size:var(--text-36px)}
.journey .workspace {
  width:calc(100% - 223px)}
.journey .tool-dock {
  width:205px}
.journey .inbox {
  display:none}
.journey .product strong {
  font-size:var(--text-11px)}
.journey .product-tag {
  font-size:var(--text-8px)}
}
@media(max-width:760px) {
  .wrap {
  padding-left:var(--space-20px);padding-right:var(--space-20px)}
.journey.hero {
  padding-top:var(--space-16px)}
.journey-heading {
  display:block;margin-bottom:var(--space-18px)}
.journey h1 {
  font-size:var(--text-33px)}
.journey-heading .eyebrow {
  font-size:var(--text-8px);margin-bottom:var(--space-8px)}
.heading-side {
  padding-top:var(--space-12px);
  max-width:none}
.heading-side p {
  font-size:var(--text-12px)}
.heading-side p br {
  display:none}
.heading-side .text-button {
  display:none}
.journey-content {
  display:flex;flex-direction:column;gap:var(--space-12px)}
.journey .story-index {
  padding:0;
  order:2;
  width:100%}
.journey .story-index ol {
  display:flex;margin:0;gap:var(--space-12px)}
.journey .story-index li {
  flex:1;border-left:0;border-top:2px solid var(--color-border-primary);padding:var(--space-8px) 0 0;
  display:block;
  opacity:.6}
.journey .story-index li.active {
  border-top-color:var(--color-accent)}
.journey .story-index strong {
  font-size:var(--text-10px)}
.journey .story-index p {
  display:none}
.journey .story-index li>span {
  font-size:var(--text-8px)}
.journey .demo {
  order:1;
  width:100%}
.journey .workspace {
  width:100%}
.journey .app-body {
  height:439px}
.journey .tool-dock {
  height:161px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:27px 51px 59px 24px;border-radius:var(--radius-8px)}
.journey .tool-heading {
  height:27px;
  grid-column:1/-1}
.journey .tool-row {
  padding:var(--space-6px) var(--space-9px);gap:var(--space-5px);
  min-width:0}
.journey .tool-row strong {
  font-size:var(--text-10px)}
.journey .tool-row small {
  font-size:var(--text-7px)}
.journey .tool-icon {
  width:22px;
  height:22px}
.journey .tool-icon svg {
  width:14px;
  height:14px}
.journey .library {
  grid-column:1;
  grid-row:2}
.journey .pricing {
  grid-column:2;grid-row:2;border-top:0;border-left:1px solid var(--line)}
.journey .library-preview {
  grid-row:3;grid-column:1;padding:0 var(--space-9px) var(--space-5px);min-height:0;gap:var(--space-7px)}
.journey .library-preview img {
  height:49px;
  width:37px}
.journey .library-preview b {
  font-size:var(--text-8px)}
.journey .library-preview small {
  font-size:var(--text-7px)}
.journey .match-status {
  font-size:var(--text-7px);margin-bottom:var(--space-2px)}
.journey .calculation {
  grid-row:3;grid-column:2;padding:0 var(--space-9px) var(--space-4px);border-left:1px solid var(--line)}
.journey .calculation strong {
  font-size:var(--text-21px)}
.journey .calculation>span {
  font-size:var(--text-8px)}
.journey .calculation small {
  font-size:var(--text-7px)}
.journey .tool-return {
  grid-row:4;grid-column:1/-1;padding:var(--space-4px) var(--space-9px);font-size:var(--text-7px)}
.journey .port {
  left:50%;transform:translateX(-50%)}
.journey .result-transfer {
  width:245px}
.journey .estimate-note {
  font-size:var(--text-8px)}
.journey .demo[data-phase="0"] .tool-dock .tool-status {
  border-color:var(--line)}
}
@media(max-width:760px) {
  .journey .stage {
  height:497px}
.journey .tool-dock {
  top:265px;bottom:auto;right:-5px;width:calc(100% - 14px);box-shadow:var(--site-shadow-5)}
.journey .demo:is([data-phase="5"],[data-phase="6"]) .tool-dock {
  opacity:0;
  pointer-events:none}
}
@media(max-width:760px) {
  .journey .port {
  top:-31px}
}
.employee-view .stage {
  height:518px}
.employee-view .app-body {
  height:449px}
.employee-view .customer {
  align-items:flex-start}
.employee-view .customer .bubble {
  background:var(--raised);color:var(--text);border:1px solid var(--line);border-radius:var(--radius-10px) var(--radius-10px) var(--radius-10px) var(--radius-2px)}
.employee-view .customer small {
  text-align:left}
.employee-view .agent-reply {
  margin-left:auto;
  max-width:381px;
  flex-direction:row-reverse;
  align-items:flex-start}
.employee-view .reply-content>small {
  justify-content:flex-end}
.employee-view .reply-content>p {
  background:var(--accent-fill);color:var(--accent-fill-ink);border-radius:var(--radius-10px) var(--radius-10px) var(--radius-2px) var(--radius-10px);padding:var(--space-7px) var(--space-10px);margin-bottom:var(--space-6px);font-size:var(--text-11px);
  text-align:left}
.employee-view .rich-card {
  margin-left:auto;border-color:var(--line)}
.employee-view .agent-reply>.robot {
  margin-top:0}
.employee-view .agent-pending {
  left:auto;
  right:12px;
  flex-direction:row-reverse;
  top:112px}
.employee-view .chat-header>.avatar {
  width:27px;height:27px;font-size:var(--text-11px)}
.ai-owner {
  margin-left:auto;display:flex;gap:var(--space-5px);align-items:center;font-size:var(--text-9px);color:var(--muted)}
.ai-owner .robot {
  width:20px;
  height:20px}
.ai-owner .robot svg {
  width:14px;
  height:14px}
.ai-owner b {
  font-size:var(--text-8px);border:1px solid var(--line);border-radius:var(--radius-3px);font-weight:var(--site-weight-1);padding:var(--space-1px) var(--space-3px);
  white-space:nowrap}
.employee-view .tool-dock {
  left:0;
  right:auto;
  top:61px;
  width:231px}
.employee-view .workspace {
  left:253px;width:calc(100% - 253px)}
.employee-view .tool-dock .port {
  display:none}
.employee-view .result-transfer {
  width:255px;box-shadow:var(--site-shadow-6)}
.employee-view .tool-heading>span {
  font-size:var(--text-8px)}
.employee-view .library-preview b {
  font-size:var(--text-11px)}
.employee-view .calculation strong {
  font-size:var(--text-26px)}
.employee-view .library-preview {
  opacity:0;transform:translateY(5px);transition:var(--site-transition-8)}
.employee-view .demo:is([data-phase="3"],[data-phase="4"],[data-phase="5"],[data-phase="6"]) .library-preview {
  transform:none;
  opacity:1}
.employee-view .calculation {
  opacity:0;transform:translateY(5px);transition:var(--site-transition-8)}
.employee-view .demo:is([data-phase="4"],[data-phase="5"],[data-phase="6"]) .calculation {
  opacity:1;
  transform:none}
.employee-view .tool-return {
  color:var(--muted)}
.employee-view .demo[data-phase="0"] .tool-status {
  border-color:var(--line)}
.employee-view .demo[data-phase="0"] .tool-status svg {
  opacity:0}
.employee-view .demo[data-phase="1"] .tool-status svg {
  opacity:0}
.employee-view .demo[data-phase="0"] .tool-dock {
  pointer-events:none}
.employee-view .product-image {
  width:83px;
  height:88px}
.employee-view .estimate-note {
  padding:var(--space-6px) var(--space-10px)}
.employee-view .total-row {
  padding:var(--space-8px) var(--space-10px)}
.employee-view .product {
  padding:var(--space-8px)}
.employee-view .tool-heading {
  white-space:nowrap}
.employee-view .person-row {
  height:40px}
.employee-view .inbox {
  width:85px}
.employee-view .person-row small {
  max-width:41px}
.workdrawer .workspace {
  left:0;
  width:100%}
.workdrawer .tool-dock {
  left:14px;top:174px;width:236px;opacity:0;transform:translateX(-14px);box-shadow:var(--site-shadow-7);border-radius:0 var(--radius-9px) var(--radius-9px) 0;border-left:3px solid var(--line)}
.workdrawer .demo:is([data-phase="2"],[data-phase="3"],[data-phase="4"]) .tool-dock {
  opacity:1;
  transform:none}
.workdrawer .demo:is([data-phase="5"],[data-phase="6"]) .tool-dock {
  opacity:0;transform:translateX(-20px);
  pointer-events:none}
.workdrawer .tool-heading {
  background:var(--bg)}
.workdrawer .agent-reply {
  max-width:390px}
.workdrawer .messages {
  padding-left:var(--space-17px);padding-right:var(--space-17px)}
.workdrawer .tool-row {
  padding-top:var(--space-9px);padding-bottom:var(--space-9px)}
.workdrawer .library-preview {
  min-height:87px;padding-bottom:var(--space-8px)}
.workdrawer .library-preview img {
  height:69px}
.workdrawer .calculation {
  padding-bottom:var(--space-10px)}
@media(max-width:1100px) {
  .employee-view .workspace {
  left:222px;width:calc(100% - 222px)}
.employee-view .tool-dock {
  width:204px}
.employee-view .inbox {
  display:none}
.employee-view .ai-owner {
  font-size:var(--text-8px);gap:var(--space-4px)}
.employee-view .ai-owner b {
  font-size:var(--text-7px)}
.employee-view .reply-content>p {
  font-size:var(--text-10px)}
.workdrawer .workspace {
  left:0;
  width:100%}
.workdrawer .tool-dock {
  width:219px}
}
@media(max-width:760px) {
  .employee-view .stage {
  height:522px}
.employee-view .workspace {
  left:0;
  width:100%}
.employee-view .app-body {
  height:454px}
.employee-view .agent-reply {
  max-width:100%;margin-left:var(--space-17px);gap:var(--space-5px)}
.employee-view .agent-reply>.robot {
  width:20px;
  height:20px}
.employee-view .reply-content>p {
  font-size:var(--text-11px);padding:var(--space-7px) var(--space-9px)}
.employee-view .customer .bubble {
  max-width:265px;font-size:var(--text-12px)}
.employee-view .ai-owner {
  font-size:var(--text-9px)}
.employee-view .ai-owner b {
  font-size:var(--text-7px)}
.employee-view .tool-dock {
  left:-3px;right:auto;top:264px;width:calc(100% - 15px);height:161px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:27px 51px 59px 24px;opacity:0;transform:translateX(-9px);border-radius:var(--radius-8px)}
.employee-view .tool-row {
  padding:var(--space-6px) var(--space-9px)}
.employee-view .library-preview {
  display:flex;min-height:0;transform:none;gap:var(--space-7px);padding:0 var(--space-9px) var(--space-5px);
  text-align:left}
.employee-view .library-preview img {
  width:37px;
  height:49px;
  margin:0}
.employee-view .library-preview b {
  font-size:var(--text-8px)}
.employee-view .calculation {
  display:block;padding:0 var(--space-9px) var(--space-4px);
  transform:none}
.employee-view .calculation strong {
  font-size:var(--text-21px)}
.employee-view .demo:is([data-phase="2"],[data-phase="3"],[data-phase="4"]) .tool-dock {
  opacity:1;
  transform:none}
.employee-view .demo:is([data-phase="5"],[data-phase="6"]) .tool-dock {
  opacity:0;transform:translateX(-9px)}
.workdrawer .tool-dock {
  left:5px;top:259px;width:calc(100% - 25px);border-left:3px solid var(--line)}
.workdrawer .agent-reply {
  max-width:100%}
.employee-view .result-transfer {
  width:245px}
.employee-view .estimate-note {
  font-size:var(--text-8px)}
.employee-view .product strong {
  font-size:var(--text-12px)}
.employee-view .product p {
  font-size:var(--text-9px)}
.employee-view .product-tag {
  font-size:var(--text-8px)}
}
.workdrawer .stage {
  height:532px}
@media(max-width:760px) {
  .workdrawer .stage {
  height:522px}
}
.support-hero.workdrawer .stage {
  height:514px;
  margin:0}
.support-hero.hero {
  padding-bottom:var(--space-28px)}
.support-hero .story-index {
  padding-top:var(--space-55px)}
.support-hero .story-index ol {
  margin:0}
.support-hero .tool-dock {
  top:174px}
.support-hero .app-body {
  height:449px}
.support-hero .demo {
  min-width:0}
.support-hero .workspace {
  box-shadow:var(--site-shadow-8)}
.support-hero.baseline .journey-heading {
  margin-bottom:var(--space-30px)}
.support-hero .result-transfer {
  box-shadow:var(--site-shadow-9)}
.support-hero .demo[aria-label] {
  outline:none}
.section-heading {
  margin-bottom:var(--space-36px)}
.section-heading .eyebrow {
  font-size:var(--text-10px);margin-bottom:var(--space-15px)}
.section-heading h2 {
  font-size:var(--text-38px)}
.outcome-section {
  padding-top:var(--space-80px);padding-bottom:var(--space-80px);border-top:1px solid var(--color-border-secondary)}
.outcome-grid {
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--color-border-secondary);border-bottom:1px solid var(--color-border-secondary)}
.outcome-grid>article {
  padding:var(--space-26px) var(--space-24px);border-right:1px solid var(--color-border-secondary);
  min-width:0}
.outcome-grid>article:first-child {
  padding-left:0}
.outcome-grid>article:last-child {
  border-right:0;
  padding-right:0}
.outcome-grid>article>h3 {
  font-size:var(--text-21px);margin-top:var(--space-24px)}
.outcome-grid>article>p {
  font-size:var(--text-13px);color:var(--color-text-secondary);line-height:var(--site-leading-7);margin-top:var(--space-11px);
  max-width:320px}
.handoff-note {
  display:flex;gap:var(--space-9px);align-items:center;padding:var(--space-13px);font-size:var(--text-10px);line-height:var(--site-leading-0)}
.human-note {
  display:flex;gap:var(--space-9px);align-items:center;padding:var(--space-13px);font-size:var(--text-10px);line-height:var(--site-leading-0)}
.handoff-note .robot {
  width:23px;
  height:23px}
.handoff-note .robot svg {
  width:16px;
  height:16px}
.human-note {
  padding-top:0}
.handoff-footer {
  padding:var(--space-8px) var(--space-13px);border-top:1px solid var(--color-border-secondary);background:var(--color-bg-level-1);font-size:var(--text-8px);color:var(--color-text-secondary)}
.feature-story {
  display:grid;grid-template-columns:1fr 1fr;gap:var(--space-110px);align-items:center;padding-top:var(--space-95px);padding-bottom:var(--space-95px);border-top:1px solid var(--color-border-secondary)}
.feature-prose {
  max-width:430px}
.feature-prose h2 {
  font-size:var(--text-40px);line-height:var(--site-leading-8)}
.feature-prose .eyebrow {
  font-size:var(--text-10px);margin-bottom:var(--space-18px)}
.feature-prose>p {
  font-size:var(--text-15px);color:var(--color-text-secondary);line-height:var(--site-leading-9);margin-top:var(--space-20px)}
.feature-prose>p+p {
  margin-top:var(--space-12px)}
.feature-story.reverse .feature-prose {
  grid-column:2;
  grid-row:1}
.launch-section {
  padding-top:var(--space-75px);padding-bottom:var(--space-75px);border-top:1px solid var(--color-border-secondary)}
.launch-grid {
  display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-45px)}
.launch-grid article {
  border-top:1px solid var(--color-border-primary);padding-top:var(--space-20px)}
.launch-grid article>span {
  font-size:var(--text-10px);color:var(--color-accent)}
.launch-grid h3 {
  font-size:var(--text-21px);margin:var(--space-18px) 0 var(--space-13px);max-width:250px;line-height:var(--site-leading-10)}
.launch-grid p {
  font-size:var(--text-13px);color:var(--color-text-secondary);line-height:var(--site-leading-9);
  max-width:300px}
.launch-cta {
  display:flex;align-items:center;gap:var(--space-30px);justify-content:space-between;border-top:1px solid var(--color-border-secondary);margin-top:var(--space-35px);padding-top:var(--space-20px)}
.launch-cta>p {
  font-size:var(--text-12px);color:var(--color-text-secondary)}
.launch-cta .text-button {
  margin:0;font-size:var(--text-12px)}
.faq {
  display:grid;grid-template-columns:1fr 1.2fr;gap:var(--space-90px);padding-top:var(--space-75px);padding-bottom:var(--space-85px);border-top:1px solid var(--color-border-secondary)}
.faq .eyebrow {
  font-size:var(--text-10px);margin-bottom:var(--space-17px)}
.faq h2 {
  font-size:var(--text-39px)}
.faq details {
  border-bottom:1px solid var(--color-border-secondary);padding:var(--space-17px) 0}
.faq details:first-child {
  padding-top:0}
.faq summary {
  cursor:pointer;font-size:var(--text-15px);list-style:none;display:flex;justify-content:space-between;gap:var(--space-15px)}
.faq summary::after {
  content:'+';color:var(--color-text-tertiary);font-size:var(--text-19px);line-height:var(--site-leading-2)}
.faq details p {
  font-size:var(--text-13px);color:var(--color-text-secondary);line-height:var(--site-leading-7);margin-top:var(--space-13px);
  max-width:480px}
.closing h2 {
  max-width:730px;
  margin:auto}
@media(max-width:1100px) {
  .support-hero .product strong {
  font-size:var(--text-11px)}
.outcome-grid>article {
  padding:var(--space-20px) var(--space-16px)}
.feature-story {
  gap:var(--space-55px)}
}
@media(max-width:760px) {
  .support-hero.workdrawer .stage {
  height:507px}
.support-hero .tool-dock {
  top:259px}
.support-hero .app-body {
  height:454px}
.support-hero.hero {
  padding-top:var(--space-16px);padding-bottom:var(--space-20px)}
.support-hero.baseline .journey-heading {
  margin-bottom:var(--space-23px)}
.support-hero.baseline .story-index {
  padding:0}
.support-hero .journey-content {
  gap:var(--space-12px)}
.section-heading h2 {
  font-size:var(--text-32px)}
.feature-prose h2 {
  font-size:var(--text-32px)}
.section-heading .eyebrow {
  font-size:var(--text-9px)}
.feature-prose .eyebrow {
  font-size:var(--text-9px)}
.outcome-section {
  padding-top:var(--space-50px);padding-bottom:var(--space-50px)}
.outcome-grid {
  grid-template-columns:1fr;
  border-bottom:0}
.outcome-grid>article {
  padding:var(--space-24px) 0 var(--space-27px);border:0;border-bottom:1px solid var(--color-border-secondary)}
.outcome-grid>article:first-child {
  padding:var(--space-24px) 0 var(--space-27px);border:0;border-bottom:1px solid var(--color-border-secondary)}
.outcome-grid>article:last-child {
  padding:var(--space-24px) 0 var(--space-27px);border:0;border-bottom:1px solid var(--color-border-secondary)}
.outcome-grid>article>h3 {
  margin-top:var(--space-19px)}
.feature-story {
  grid-template-columns:1fr;gap:var(--space-30px);padding-top:var(--space-55px);padding-bottom:var(--space-55px)}
.feature-story.reverse .feature-prose {
  grid-column:auto;
  grid-row:auto}
.feature-prose>p {
  font-size:var(--text-14px)}
.launch-section {
  padding-top:var(--space-50px);padding-bottom:var(--space-50px)}
.launch-grid {
  grid-template-columns:1fr;gap:var(--space-24px)}
.launch-grid h3 {
  max-width:none;margin:var(--space-12px) 0 var(--space-9px)}
.launch-grid p {
  max-width:none}
.launch-cta {
  align-items:flex-start;flex-direction:column;gap:var(--space-16px)}
.faq {
  grid-template-columns:1fr;gap:var(--space-30px);padding-top:var(--space-50px);padding-bottom:var(--space-55px)}
.faq h2 {
  font-size:var(--text-33px)}
.faq summary {
  font-size:var(--text-14px)}
.faq details p {
  font-size:var(--text-12px)}
.support-hero .product strong {
  font-size:var(--text-12px)}
}
.capability-section .commerce-card {
  min-height:220px}
.commerce-card {
  border:1px solid var(--tone-dfe4e9);border-radius:var(--radius-9px);background:var(--color-bg-primary);overflow:hidden;color:var(--color-text-primary)}
.commerce-card small {
  display:block;color:var(--color-text-tertiary);font-size:var(--text-10px);line-height:var(--site-leading-0)}
.commerce-card strong {
  font-weight:var(--site-weight-0)}
.example-head {
  padding:var(--space-19px) var(--space-20px);border-bottom:1px solid var(--color-border-secondary)}
.example-head>strong {
  display:block;font-size:var(--text-15px);margin:var(--space-3px) 0}
.example-head>small {
  font-size:var(--text-9px)}
.bag-art {
  width:92px;height:140px;position:relative;flex-shrink:0;border-radius:var(--radius-6px);background:linear-gradient(145deg,var(--tone-f4f5f2),var(--tone-e7e9e4));
  overflow:hidden}
.bag-handle {
  position:absolute;width:24%;height:17%;border:5px solid var(--bag-dark);border-bottom:0;border-radius:var(--radius-11px) var(--radius-11px) 0 0;
  left:38%;
  top:12%}
.bag-body {
  position:absolute;left:19%;top:19%;width:62%;height:68%;border-radius:38% 38% 15% 15%;background:linear-gradient(105deg,var(--bag-dark),var(--bag) 24%,var(--bag-light) 68%,var(--bag));box-shadow:var(--site-shadow-10);border:1px solid var(--tone-4d5b4e35)}
.bag-zip {
  position:absolute;left:10%;top:20%;width:80%;height:17%;border-top:2px solid var(--bag-dark);
  border-radius:50%}
.bag-pocket {
  position:absolute;left:11%;bottom:10%;width:78%;height:33%;background:var(--bag);border-radius:var(--radius-8px) var(--radius-8px) var(--radius-11px) var(--radius-11px);border:1px solid var(--tone-42564040);box-shadow:var(--site-shadow-11)}
.bag-pocket span {
  position:absolute;top:13%;right:12%;height:7px;width:2px;background:var(--tone-d9d9c9)}
.bag-body>i {
  position:absolute;top:39%;left:41%;width:18%;height:5%;border-radius:var(--radius-1px);background:var(--tone-e2dbcf);box-shadow:var(--site-shadow-12)}
.product-section {
  gap:var(--space-95px)}
.product-section.reverse>.feature-art {
  grid-column:1;
  grid-row:1}
.feature-art {
  min-width:0}
.handoff-example .handoff-note {
  align-items:flex-start;padding:var(--space-23px) var(--space-20px);font-size:var(--text-12px)}
.handoff-example .handoff-note b {
  font-weight:var(--site-weight-0);display:block;margin-bottom:var(--space-8px)}
.handoff-example .handoff-note p {
  font-size:var(--text-12px);color:var(--color-text-secondary);line-height:var(--site-leading-7)}
.context-pills {
  display:flex;gap:var(--space-7px);flex-wrap:wrap;padding:0 var(--space-20px) var(--space-20px) var(--space-52px)}
.context-pills span {
  font-size:var(--text-9px);background:var(--color-bg-level-1);border:1px solid var(--color-border-secondary);border-radius:var(--radius-4px);padding:var(--space-3px) var(--space-6px);color:var(--color-text-secondary)}
.handoff-example .human-note {
  padding:0 var(--space-20px) var(--space-22px);font-size:var(--text-12px);
  align-items:flex-start}
.handoff-example .avatar {
  flex-shrink:0}
.handoff-example .handoff-footer {
  font-size:var(--text-10px);padding:var(--space-12px) var(--space-20px)}
.capability-section .outcome-grid>article>p {
  max-width:none}
@media(max-width:1100px) {
  .product-section {
  gap:var(--space-50px)}
}
@media(max-width:760px) {
  .capability-section .commerce-card {
  min-height:220px}
.product-section {
  gap:var(--space-27px)}
.product-section.reverse>.feature-art {
  grid-column:auto;
  grid-row:auto}
}
.language-toggle {
  display:flex;border:1px solid var(--color-border-primary);border-radius:var(--radius-6px);
  flex-shrink:0}
.language-toggle a {
  border-radius:var(--radius-4px)}
.language-toggle [aria-current=page] {
  background:var(--color-text-primary);
  color:white}
.language-toggle a:hover:not([aria-pressed=true]) {
  background:var(--tone-f1f3f5)}
html:lang(zh-TW) h1 {
  letter-spacing:var(--site-tracking-8);line-height:var(--site-leading-4);font-weight:var(--site-weight-0)}
html:lang(zh-TW) h2 {
  letter-spacing:var(--site-tracking-8);line-height:var(--site-leading-4);font-weight:var(--site-weight-0)}
html:lang(zh-TW) h3 {
  letter-spacing:var(--site-tracking-8);line-height:var(--site-leading-4);font-weight:var(--site-weight-0)}
html:lang(zh-TW) .journey-heading h1 {
  font-size:var(--text-43px);line-height:var(--site-leading-11)}
html:lang(zh-TW) h1 em {
  font-style:normal;font-weight:var(--site-weight-0);letter-spacing:var(--site-tracking-9)}
html:lang(zh-TW) .feature-prose h2 {
  font-size:var(--text-36px)}
html:lang(zh-TW) .section-heading h2 {
  font-size:var(--text-36px)}
html:lang(zh-TW) .eyebrow {
  letter-spacing:var(--site-tracking-10);font-weight:var(--site-weight-0)}
html:lang(zh-TW) .feature-prose p {
  line-height:var(--site-leading-12)}
html:lang(zh-TW) .heading-side {
  max-width:310px}
html:lang(zh-TW) .heading-side p {
  line-height:var(--site-leading-13)}
html:lang(zh-TW) .journey-heading {
  margin-bottom:var(--space-24px)}
html:lang(zh-TW) .capability-section h3 {
  font-size:var(--text-21px)}
html:lang(zh-TW) .story-index strong {
  font-size:var(--text-13px)}
html:lang(zh-TW) .story-index p {
  font-size:var(--text-11px);line-height:var(--site-leading-14)}
html:lang(zh-TW) .closing h2 {
  font-size:var(--text-34px);
  max-width:650px}
.attention-mark {
  font-size:var(--text-10px);color:var(--tone-a03a3a);display:block;margin-bottom:var(--space-5px)}
.support-outcomes .commerce-card {
  min-height:232px}
@media(max-width:1100px) {
  .site-header nav {
  gap:var(--space-16px)}
html:lang(zh-TW) .journey-heading h1 {
  font-size:var(--text-37px)}
html:lang(zh-TW) .feature-prose h2 {
  font-size:var(--text-31px)}
}
@media(max-width:760px) {
  .site-header .brand {
  margin-right:auto}
.language-toggle a {
  padding:var(--space-6px)}
.site-header nav {
  display:none}
html:lang(zh-TW) .journey-heading h1 {
  font-size:var(--text-32px);line-height:var(--site-leading-4)}
html:lang(zh-TW) .heading-side p {
  font-size:var(--text-12px)}
html:lang(zh-TW) .section-heading h2 {
  font-size:var(--text-29px);line-height:var(--site-leading-15)}
html:lang(zh-TW) .feature-prose h2 {
  font-size:var(--text-29px);line-height:var(--site-leading-15)}
html:lang(zh-TW) .closing h2 {
  font-size:var(--text-28px)}
html:lang(zh-TW) .story-index strong {
  font-size:var(--text-10px)}
html:lang(zh-TW) .story-index p {
  font-size:var(--text-9px)}
html:lang(zh-TW) .feature-prose p {
  font-size:var(--text-13px)}
.support-outcomes .commerce-card {
  min-height:220px}
}
@media(min-width:1101px) {
  html:lang(zh-TW) .support-hero .inbox {
  width:102px}
html:lang(zh-TW) .support-hero .person-row {
  gap:var(--space-5px)}
html:lang(zh-TW) .support-hero .person-row b {
  white-space:nowrap;font-size:var(--text-10px)}
html:lang(zh-TW) .support-hero .inbox-tabs {
  gap:var(--space-9px);font-size:var(--text-8px);
  white-space:nowrap}
html:lang(zh-TW) .support-hero .person-row small {
  max-width:48px}
}
.site-header {
  display:grid;grid-template-columns:minmax(166px,1fr) 264px 106px 110px;gap:var(--space-22px);
  height:68px;
  min-height:68px;
  padding-top:0;
  padding-bottom:0;
  align-items:center}
.site-header .brand {
  font-family:var(--font-wordmark)!important;font-size:var(--text-23px)!important;line-height:var(--site-leading-16)!important;font-weight:var(--site-weight-2);letter-spacing:var(--site-tracking-2);
  width:166px;
  height:40px;
  flex:none;
  white-space:nowrap;
  align-items:center}
footer .brand {
  font-family:var(--font-wordmark)!important;font-size:var(--text-23px)!important;line-height:var(--site-leading-16)!important;font-weight:var(--site-weight-2);letter-spacing:var(--site-tracking-2);
  width:166px;
  height:40px;
  flex:none;
  white-space:nowrap;
  align-items:center}
.brand .brand-mark {
  font-family:var(--font-symbol)!important;font-size:var(--text-37px)!important;line-height:var(--site-leading-17)!important;
  display:block;
  width:34px;
  height:40px;
  flex:none}
.brand .labs {
  font-family:var(--font-wordmark)!important;font-size:var(--text-13px)!important;line-height:var(--site-leading-18)!important;font-weight:var(--site-weight-1);letter-spacing:var(--site-tracking-3);align-self:center;margin:var(--space-9px) 0 0;
  flex:none}
.site-header nav {
  width:264px;display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:0;text-align:center;font-size:var(--text-12px);line-height:var(--site-leading-19)}
.site-header>.button {
  width:110px;height:34px;padding:0 var(--space-10px);min-height:34px;line-height:var(--site-leading-19);gap:var(--space-9px);font-size:var(--text-12px);
  white-space:nowrap}
.language-toggle {
  width:106px;height:34px;padding:var(--space-3px);gap:var(--space-2px);
  align-items:center}
.language-toggle a {
  height:26px;min-height:26px;padding:0;line-height:var(--site-leading-20);font-size:var(--text-11px)}
.language-toggle a:first-child {
  width:65px}
.language-toggle a:last-child {
  width:29px}
.channel-story {
  min-width:0;
  position:relative}
.channel-tabs {
  display:flex;justify-content:center;gap:var(--space-6px);margin-bottom:var(--space-18px)}
.channel-tabs button {
  display:flex;align-items:center;gap:var(--space-6px);padding:var(--space-6px) var(--space-9px);border-radius:var(--radius-6px);border:1px solid transparent;font-size:var(--text-10px);color:var(--color-text-secondary)}
.channel-tabs button[aria-pressed=true] {
  border-color:var(--color-border-primary);background:var(--color-bg-level-1);color:var(--color-text-primary)}
.channel-tabs button:hover {
  background:var(--color-bg-level-1)}
.channel-icon {
  height:22px;width:22px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-6px);
  flex-shrink:0}
.channel-icon svg {
  width:15px;
  height:15px}
.channel-icon.line {
  background:var(--tone-06c755);color:white;font-size:var(--text-7px);font-weight:var(--site-weight-3);letter-spacing:var(--site-tracking-11)}
.channel-icon.instagram {
  background:linear-gradient(35deg,var(--tone-ffc35f),var(--tone-db3987) 55%,var(--tone-7650bb));
  color:white}
.channel-icon.whatsapp {
  background:var(--tone-27c46a);
  color:white}
.phone-stage {
  height:508px;
  position:relative;
  isolation:isolate}
.customer-phone {
  position:absolute;top:0;left:50%;width:302px;transform:translateX(-50%);border:1px solid var(--color-border-primary);border-radius:var(--radius-17px);overflow:hidden;background:var(--color-bg-primary);box-shadow:var(--site-shadow-13);transition:var(--site-transition-9);
  opacity:0;
  pointer-events:none}
.phone-channel {
  height:36px;display:flex;align-items:center;justify-content:center;gap:var(--space-7px);background:var(--color-bg-primary);border-bottom:1px solid var(--color-border-secondary);font-size:var(--text-10px)}
.phone-channel b {
  font-weight:var(--site-weight-0)}
.phone-channel .channel-icon {
  height:18px;width:18px;border-radius:var(--radius-5px)}
.phone-channel .channel-icon svg {
  width:12px;
  height:12px}
.phone-shop {
  height:53px;display:flex;gap:var(--space-9px);align-items:center;padding:0 var(--space-14px);background:var(--color-bg-level-1);border-bottom:1px solid var(--color-border-secondary)}
.store-avatar {
  width:29px;height:29px;border-radius:var(--radius-8px);color:var(--color-accent);background:var(--color-accent-tint);font-size:var(--text-23px);
  flex-shrink:0}
.phone-shop strong {
  display:block;font-size:var(--text-11px);font-weight:var(--site-weight-0);line-height:var(--site-leading-4)}
.phone-shop small {
  display:block;font-size:var(--text-8px);color:var(--color-text-tertiary);margin-top:var(--space-3px)}
.phone-shop>span:last-child {
  margin-left:auto;color:var(--color-text-tertiary)}
.phone-thread {
  height:367px;display:flex;flex-direction:column;align-items:flex-start;padding:var(--space-12px) var(--space-14px);gap:var(--space-10px);background:var(--tone-e7eef3);
  overflow:hidden}
.customer-phone[data-channel=Instagram] .phone-thread {
  background:var(--color-bg-primary)}
.customer-phone[data-channel=WhatsApp] .phone-thread {
  background:var(--tone-f0efe7)}
.phone-date {
  align-self:center;font-size:var(--text-8px);color:var(--color-text-tertiary)}
.phone-request {
  align-self:flex-end;max-width:91%;background:var(--tone-cbedba);border-radius:var(--radius-10px) var(--radius-10px) var(--radius-2px) var(--radius-10px);padding:var(--space-9px) var(--space-11px);font-size:var(--text-11px);line-height:var(--site-leading-21);opacity:0;transform:translateY(8px);transition:var(--site-transition-10)}
.customer-phone[data-channel=Instagram] .phone-request {
  background:var(--tone-f2eafa)}
.customer-phone[data-channel=WhatsApp] .phone-request {
  background:var(--tone-d9efcf)}
.customer-photo {
  margin:0 0 var(--space-7px);
  width:89px}
.customer-photo .bag-art {
  width:89px;
  height:74px}
.customer-photo .bag-body {
  width:39%;
  left:31%}
.customer-photo .bag-handle {
  width:17%;
  left:42%;
  border-width:3px}
.work-spinner {
  width:12px;height:12px;display:inline-block;flex-shrink:0;border:1.5px solid var(--tone-ded6ec);border-top-color:var(--color-accent);border-radius:50%;animation:var(--site-animation-2)}
.phone-response {
  max-width:94%;width:100%;opacity:0;transform:translateY(8px);transition:var(--site-transition-6);
  margin-top:-10px}
.response-author {
  display:flex;align-items:center;gap:var(--space-5px);font-size:var(--text-8px);color:var(--color-text-secondary);margin-bottom:var(--space-5px)}
.response-author b {
  font-weight:var(--site-weight-1)}
.response-author .robot {
  width:17px;height:17px;border-radius:var(--radius-5px)}
.response-author .robot svg {
  width:13px;
  height:13px}
.phone-response>p {
  font-size:var(--text-10px);line-height:var(--site-leading-0);background:white;border:1px solid var(--color-border-secondary);border-radius:var(--radius-8px) var(--radius-8px) var(--radius-8px) var(--radius-2px);padding:var(--space-8px) var(--space-10px);margin-bottom:var(--space-7px)}
.phone-result {
  padding:var(--space-11px) var(--space-12px);border:1px solid var(--color-border-primary);border-radius:var(--radius-8px);background:var(--color-bg-primary)}
.phone-result>small {
  display:block;font-size:var(--text-7px);letter-spacing:var(--site-tracking-12);color:var(--color-text-tertiary)}
.phone-result>strong {
  display:block;font-size:var(--text-21px);font-weight:var(--site-weight-0);line-height:var(--site-leading-4);margin:var(--space-4px) 0 var(--space-1px)}
.phone-result>span {
  font-size:var(--text-10px);color:var(--color-text-secondary)}
.phone-result>div {
  display:flex;gap:var(--space-5px);align-items:center;font-size:var(--text-8px);color:var(--color-success);margin-top:var(--space-10px);padding-top:var(--space-8px);border-top:1px solid var(--color-border-secondary)}
.phone-result svg {
  width:12px;
  height:12px}
.phone-composer {
  height:37px;display:flex;align-items:center;gap:var(--space-9px);font-size:var(--text-14px);color:var(--color-text-tertiary);padding:0 var(--space-13px);background:var(--color-bg-primary);border-top:1px solid var(--color-border-secondary)}
.phone-composer>span:nth-child(2) {
  flex:1;background:var(--color-bg-level-1);border-radius:var(--radius-10px);font-size:var(--text-9px);padding:var(--space-4px) var(--space-9px)}
.channel-agent {
  display:flex;justify-content:center;align-items:center;gap:var(--space-7px);margin-top:var(--space-16px);font-size:var(--text-11px);color:var(--color-text-secondary);
  min-height:27px}
.channel-agent strong {
  font-size:var(--text-11px);font-weight:var(--site-weight-0);color:var(--color-text-primary)}
.channel-agent>span:last-child {
  font-size:var(--text-9px)}
.channel-agent .robot {
  width:22px;
  height:22px}
.channel-agent .robot svg {
  width:15px;
  height:15px}
.channel-story[data-moment="3"] .phone-request {
  opacity:1;
  transform:none}
.channel-story[data-moment="3"] .phone-response {
  opacity:1;
  transform:none}
.channel-story[data-focus="0"] .customer-phone[data-index="0"] {
  opacity:1;
  z-index:3;
  pointer-events:auto}
.channel-story[data-focus="1"] .customer-phone[data-index="1"] {
  opacity:1;
  z-index:3;
  pointer-events:auto}
.channel-story[data-focus="2"] .customer-phone[data-index="2"] {
  opacity:1;
  z-index:3;
  pointer-events:auto}
.constellation .customer-phone {
  opacity:.52;transform:translateX(-50%) scale(.78)}
.constellation .customer-phone[data-index="0"] {
  left:24%}
.constellation .customer-phone[data-index="1"] {
  left:50%}
.constellation .customer-phone[data-index="2"] {
  left:76%}
.constellation[data-focus="0"] .customer-phone[data-index="0"] {
  transform:translateX(-50%) scale(1);box-shadow:var(--site-shadow-14)}
.constellation[data-focus="1"] .customer-phone[data-index="1"] {
  transform:translateX(-50%) scale(1);box-shadow:var(--site-shadow-14)}
.constellation[data-focus="2"] .customer-phone[data-index="2"] {
  transform:translateX(-50%) scale(1);box-shadow:var(--site-shadow-14)}
.constellation .phone-stage {
  overflow:visible}
.action-process .example-head {
  padding:var(--space-20px)}
.action-step {
  padding:var(--space-18px) var(--space-20px);border-bottom:1px solid var(--color-border-secondary);display:flex;gap:var(--space-13px);align-items:center;opacity:.45;transition:var(--site-transition-4)}
.action-step:last-child {
  border:0}
.action-step>span:first-child {
  font-size:var(--text-10px);color:var(--color-accent)}
.action-step strong {
  display:block;font-size:var(--text-13px);font-weight:var(--site-weight-0)}
.action-step p {
  font-size:var(--text-11px);line-height:var(--site-leading-21);color:var(--color-text-secondary);margin-top:var(--space-5px)}
.action-check {
  margin-left:auto;color:var(--color-success);
  opacity:0}
.action-check svg {
  width:15px;
  height:15px}
.action-story[data-action-phase="0"] [data-action-step="0"] {
  opacity:1}
.action-story[data-action-phase="1"] [data-action-step="0"] {
  opacity:1}
.action-story[data-action-phase="1"] [data-action-step="1"] {
  opacity:1}
.action-story[data-action-phase="2"] .action-step {
  opacity:1}
.action-story[data-action-phase="2"] .action-check {
  opacity:1}
.action-story[data-action-phase="1"] [data-action-step="1"] {
  background:var(--tone-f6f3fa)}
.action-tool {
  height:45px;display:flex;align-items:center;gap:var(--space-8px);color:var(--color-accent);font-size:var(--text-11px);padding-left:var(--space-22px)}
.action-tool>svg {
  width:15px;
  height:15px}
.action-tool>span:last-child {
  opacity:0}
.action-story[data-action-phase="2"] .action-tool>span:last-child {
  opacity:1}
.action-story[data-action-phase="2"] .action-tool>.work-spinner {
  display:none}
.action-story:not([data-action-phase="2"]) .action-tool>svg {
  display:none}
.action-receipt {
  display:flex;gap:var(--space-16px);align-items:center;padding:var(--space-22px);opacity:0;transform:translateY(-8px);transition:var(--site-transition-6);
  min-height:113px}
.action-story[data-action-phase="2"] .action-receipt {
  opacity:1;
  transform:none}
.receipt-check {
  width:34px;height:34px;border-radius:50%;background:var(--color-success-soft);color:var(--color-success);
  display:grid;
  place-items:center;
  flex-shrink:0}
.receipt-check svg {
  width:19px;
  height:19px}
.action-receipt strong {
  font-size:var(--text-20px);display:block;font-weight:var(--site-weight-0);margin:var(--space-5px) 0}
.action-receipt p {
  font-size:var(--text-11px);color:var(--color-text-secondary)}
.action-receipt small {
  font-size:var(--text-8px)}
.phone-result {
  font-family:var(--font-site)}
.phone-thread {
  font-family:var(--font-site)}
.customer-phone .store-avatar {
  font-family:var(--font-symbol)}
@keyframes work-spin {
  to {
  transform:rotate(360deg)}
}
@media(max-width:1100px) {
  .site-header {
  grid-template-columns:minmax(166px,1fr) 106px 110px;gap:var(--space-18px)}
.site-header nav {
  display:none}
.constellation .customer-phone {
  width:260px}
.constellation .customer-phone[data-index="0"] {
  left:28%}
.constellation .customer-phone[data-index="2"] {
  left:72%}
.constellation .phone-thread {
  height:385px}
.channel-tabs button {
  padding:var(--space-5px)}
.channel-tabs {
  gap:var(--space-3px)}
}
@media(max-width:760px) {
  .site-header {
  display:grid;grid-template-columns:166px 106px;justify-content:space-between;gap:var(--space-10px);
  height:76px;
  min-height:76px;
  padding-top:0;
  padding-bottom:0;
  flex-wrap:nowrap}
.site-header>.button {
  display:none}
.site-header .brand {
  font-size:var(--text-23px)!important;
  width:166px;
  height:40px;
  margin:0}
footer .brand {
  font-size:var(--text-23px)!important;
  width:166px;
  height:40px;
  margin:0}
.site-header .brand-mark {
  font-size:var(--text-37px)!important}
.site-header .labs {
  font-size:var(--text-13px)!important}
.language-toggle {
  height:34px;padding:var(--space-3px)}
.language-toggle a {
  height:26px;min-height:26px;line-height:var(--site-leading-20);font-size:var(--text-11px)}
.customer-phone {
  width:286px}
.phone-thread {
  height:377px}
.phone-stage {
  height:517px}
.channel-agent {
  flex-wrap:wrap;gap:var(--space-6px);margin-top:var(--space-14px)}
.channel-agent>span:last-child {
  font-size:var(--text-9px)}
.channel-tabs button {
  font-size:var(--text-10px);padding:var(--space-6px)}
.constellation .customer-phone {
  width:260px}
.constellation .customer-phone[data-index="0"] {
  left:25%}
.constellation .customer-phone[data-index="2"] {
  left:75%}
.constellation .customer-phone {
  transform:translateX(-50%) scale(.62);
  opacity:.45}
.constellation .phone-stage {
  overflow:hidden;
  margin-left:-12px;
  margin-right:-12px}
.constellation[data-focus="0"] .customer-phone[data-index="0"] {
  left:50%}
.constellation[data-focus="1"] .customer-phone[data-index="1"] {
  left:50%}
.constellation[data-focus="2"] .customer-phone[data-index="2"] {
  left:50%}
.action-step {
  padding:var(--space-16px);gap:var(--space-10px)}
.action-step strong {
  font-size:var(--text-12px)}
.action-step p {
  font-size:var(--text-10px)}
.action-receipt {
  padding:var(--space-18px);gap:var(--space-12px)}
.action-receipt strong {
  font-size:var(--text-18px)}
.action-receipt p {
  font-size:var(--text-10px)}
.phone-result strong {
  letter-spacing:var(--site-tracking-3)!important}
.channel-story .phone-shop strong {
  line-height:var(--site-leading-0)!important}
.phone-response>p {
  line-height:var(--site-leading-22)}
html:lang(zh-TW) .phone-thread {
  height:377px}
}
@media(prefers-reduced-motion:reduce) {
  .customer-phone {
  transition:none!important}
.phone-request {
  transition:none!important}
.phone-response {
  transition:none!important}
.action-receipt {
  transition:none!important}
.action-step {
  transition:none!important}
.work-spinner {
  animation:none!important}
}
.constellation .customer-phone {
  transform-origin:top center;
  top:0}
.constellation[data-focus="0"] .customer-phone[data-index="1"] {
  left:22%}
.constellation[data-focus="1"] .customer-phone[data-index="0"] {
  left:22%}
.constellation[data-focus="2"] .customer-phone[data-index="0"] {
  left:22%}
.constellation[data-focus="0"] .customer-phone[data-index="2"] {
  left:78%}
.constellation[data-focus="1"] .customer-phone[data-index="2"] {
  left:78%}
.constellation[data-focus="2"] .customer-phone[data-index="1"] {
  left:78%}
.constellation[data-focus="0"] .customer-phone[data-index="0"] {
  left:50%;
  top:40px}
.constellation[data-focus="1"] .customer-phone[data-index="1"] {
  left:50%;
  top:40px}
.constellation[data-focus="2"] .customer-phone[data-index="2"] {
  left:50%;
  top:40px}
.constellation .phone-stage {
  height:552px}
@media(max-width:1100px) {
  .constellation .phone-stage {
  height:572px}
}
.demo:not([data-phase="4"]) .result-transfer {
  display:none}
@media(max-width:1100px) {
  .constellation .phone-stage {
  overflow:hidden}
}
.support-outcomes .outcome-grid {
  align-items:start}
.support-outcomes .outcome-grid>article {
  padding-top:var(--space-28px)}
.support-outcomes .mini-chat {
  overflow:hidden;background:var(--color-bg-level-1);border:1px solid var(--color-border-primary);border-radius:var(--radius-10px);
  box-shadow:none}
.mini-chat-top {
  display:flex;align-items:center;gap:var(--space-8px);height:45px;padding:0 var(--space-14px);background:var(--color-bg-primary);border-bottom:1px solid var(--color-border-secondary)}
.mini-chat-top .store-avatar {
  width:24px;height:24px;font-size:var(--text-20px)}
.mini-chat-top>strong {
  font-size:var(--text-11px);font-weight:var(--site-weight-0)}
.mini-chat-top>span:last-child {
  margin-left:auto;color:var(--color-text-tertiary)}
.mini-chat-thread {
  padding:var(--space-16px) var(--space-14px);display:flex;flex-direction:column;gap:var(--space-16px)}
.mini-customer {
  align-self:flex-end;background:var(--tone-eae1f4);border:1px solid var(--tone-e2d7ef);padding:var(--space-10px) var(--space-12px);font-size:var(--text-12px);line-height:var(--site-leading-5);border-radius:var(--radius-10px) var(--radius-10px) var(--radius-2px) var(--radius-10px);max-width:88%;transition:var(--site-transition-11)}
.mini-business {
  max-width:94%;align-self:flex-start;transition:var(--site-transition-11)}
.mini-author {
  display:flex;align-items:center;gap:var(--space-6px);font-size:var(--text-9px);color:var(--color-text-secondary);margin-bottom:var(--space-7px)}
.mini-author .robot {
  width:20px;
  height:20px}
.mini-author .robot svg {
  width:14px;
  height:14px}
.mini-bubble {
  padding:var(--space-10px) var(--space-12px);border:1px solid var(--color-border-primary);border-radius:var(--radius-2px) var(--radius-10px) var(--radius-10px);background:var(--color-bg-primary);font-size:var(--text-12px);line-height:var(--site-leading-21);
  margin:0}
.mini-source {
  display:flex;gap:var(--space-5px);font-size:var(--text-9px);line-height:var(--site-leading-0);color:var(--color-text-secondary);margin-top:var(--space-13px)}
.mini-source svg {
  color:var(--color-success);
  width:13px;
  height:13px;
  flex-shrink:0}
.mini-account {
  border:1px solid var(--color-border-primary);border-radius:var(--radius-8px);margin-top:var(--space-7px)}
.mini-account>div:first-child {
  display:flex;align-items:center;justify-content:space-between;gap:var(--space-10px)}
.mini-account small {
  font-size:var(--text-7px);letter-spacing:var(--site-tracking-13);color:var(--color-text-secondary)}
.mini-active {
  display:flex;align-items:center;gap:var(--space-3px);font-size:var(--text-8px);color:var(--color-success)}
.mini-active svg {
  width:10px;
  height:10px}
.mini-receipt {
  display:flex;align-items:center;gap:var(--space-4px);font-size:var(--text-8px);color:var(--color-success);margin-top:var(--space-9px);padding-top:var(--space-8px);border-top:1px solid var(--color-border-secondary)}
.mini-receipt svg {
  width:12px;
  height:12px}
.mini-upgrade-result {
  transition:var(--site-transition-12)}
.mini-escalation {
  display:flex;gap:var(--space-7px);align-items:start;border:1px solid var(--color-border-primary);border-radius:var(--radius-7px);padding:var(--space-10px);background:var(--color-bg-primary);margin-top:var(--space-8px)}
.mini-escalation>svg {
  width:14px;height:14px;flex-shrink:0;color:var(--color-accent)}
.mini-escalation strong {
  display:block;font-size:var(--text-10px);font-weight:var(--site-weight-0)}
.mini-escalation span {
  display:block;font-size:var(--text-8px);color:var(--color-text-secondary);line-height:var(--site-leading-21);margin-top:var(--space-3px)}
.mini-human {
  display:flex;align-items:center;gap:var(--space-6px);font-size:var(--text-9px);color:var(--color-text-secondary);margin-top:var(--space-10px)}
.mini-human .avatar {
  width:21px;height:21px;font-size:var(--text-9px)}
.support-outcomes .section-heading h2 {
  max-width:960px}
@media(max-width:1100px) {
  .mini-chat-thread {
  padding:var(--space-12px) var(--space-10px);gap:var(--space-12px)}
.mini-customer {
  font-size:var(--text-11px);padding:var(--space-9px)}
.mini-bubble {
  font-size:var(--text-11px);padding:var(--space-9px)}
.mini-chat-top {
  padding:0 var(--space-10px)}
.mini-author {
  font-size:var(--text-8px)}
.mini-business {
  max-width:100%}
.mini-account {
  padding:var(--space-10px)}
.mini-account small {
  font-size:var(--text-6px)}
.mini-escalation {
  padding:var(--space-9px) var(--space-7px)}
.mini-escalation strong {
  font-size:var(--text-9px)}
.support-outcomes .mini-chat {
  height:348px;
  min-height:348px}
}
@media(max-width:760px) {
  .support-outcomes .outcome-grid>article {
  padding-top:var(--space-20px)}
.support-outcomes .mini-chat {
  height:326px;
  min-height:326px}
.mini-chat-thread {
  padding:var(--space-16px);gap:var(--space-16px)}
.mini-customer {
  font-size:var(--text-12px);padding:var(--space-10px) var(--space-12px)}
.mini-bubble {
  font-size:var(--text-12px);padding:var(--space-10px) var(--space-12px)}
.mini-author {
  font-size:var(--text-9px)}
.mini-business {
  max-width:94%}
.mini-chat-top {
  padding:0 var(--space-16px)}
.mini-account small {
  font-size:var(--text-7px)}
.mini-escalation strong {
  font-size:var(--text-10px)}
}
@media(prefers-reduced-motion:reduce) {
  .mini-chat * {
  animation:none!important;
  transition:none!important}
}
.support-outcomes .mini-chat {
  height:360px;
  min-height:360px}
@media(min-width:761px) and (max-width:1100px) {
  .support-outcomes .mini-chat {
  height:380px;
  min-height:380px}
}
.upgrade .mini-business {
  width:90%;
  max-width:90%}
.mini-upgrade-result>.mini-bubble {
  width:fit-content}
.mini-chat * {
  animation:none!important;
  transition:none!important}
.channel-story .phone-request {
  animation:none!important;
  transition:none!important}
.channel-story .phone-response {
  animation:none!important;
  transition:none!important}
.store-avatar {
  line-height:var(--site-leading-2);
  display:grid;
  place-items:center}
.store-avatar>svg {
  width:70%;
  height:70%;
  display:block}
.hero.landing .journey-content {
  padding-top:var(--space-32px)}
.mini-account {
  border-color:var(--tone-d9cce9);background:linear-gradient(125deg,var(--tone-f5effb),var(--color-bg-primary) 80%);padding:var(--space-12px) var(--space-14px);
  position:relative;
  overflow:hidden}
.mini-account .mini-active {
  background:var(--color-success-soft);padding:var(--space-3px) var(--space-6px);border-radius:var(--radius-4px)}
.membership-plan {
  display:flex;align-items:center;gap:var(--space-11px);margin:var(--space-13px) 0 var(--space-11px)}
.plan-emblem {
  width:37px;height:44px;display:grid;place-items:center;flex-shrink:0;border:1px solid var(--tone-d6c3e9);background:var(--tone-eae0f5);color:var(--color-accent);border-radius:var(--radius-8px)}
.plan-emblem svg {
  width:25px;
  height:25px}
.previous-plan {
  display:flex;gap:var(--space-5px);align-items:center;font-size:var(--text-8px);color:var(--color-text-tertiary)}
.previous-plan svg {
  width:12px;height:12px;color:var(--color-accent)}
.membership-plan strong {
  display:block;font-size:var(--text-28px);line-height:var(--site-leading-1);font-weight:var(--site-weight-2);letter-spacing:var(--site-tracking-14);margin-top:var(--space-3px)}
.membership-plan>p {
  font-size:var(--text-13px);margin:0 0 0 auto;font-weight:var(--site-weight-0);white-space:nowrap;color:var(--color-text-primary)}
.membership-plan>p>span {
  display:block;font-size:var(--text-8px);font-weight:var(--site-weight-1);color:var(--color-text-secondary);text-align:right;margin-top:var(--space-5px)}
.mini-account .mini-receipt {
  border-color:var(--tone-e4dced);margin-top:var(--space-10px)}
@media(min-width:761px) and (max-width:1100px) {
  .mini-account {
  padding:var(--space-10px)}
.membership-plan {
  gap:var(--space-7px)}
.plan-emblem {
  width:27px;
  height:35px}
.plan-emblem svg {
  width:20px;
  height:20px}
.membership-plan strong {
  font-size:var(--text-22px)}
.membership-plan>p {
  font-size:var(--text-11px)}
}
:root {
  }
body {
  font-family:var(--font-site)}
html:lang(zh-TW) body {
  font-family:var(--font-site)}
em {
  font-family:var(--font-site)}
html:lang(zh-TW) h1 em {
  font-family:var(--font-site)}

.language-toggle a { display: inline-block; text-align: center; }

/* Progressive enhancement: static chats and inactive scenes never animate. */
[data-running="false"] *, [data-running="false"] *::before, [data-running="false"] *::after { animation-play-state: paused !important; }
.mini-upgrade-result { display: block; }
.phone-request, .phone-response { opacity: 1; transform: none; }
.skip-link { position: absolute; top: 0; left: 0; transform: translateY(-120%); background: var(--color-bg-primary); color: var(--color-text-primary); padding: var(--space-4); z-index: 20; }
.skip-link:focus { transform: none; }
.language-toggle a[aria-current="page"] { background: var(--color-bg-primary); color: var(--color-text-primary); border-radius: var(--radius-4); }
/* Let enlarged text grow the demonstrations instead of clipping their results. */
.support-hero.workdrawer .stage { height: auto; min-height: 514px; }
.support-hero.workdrawer .workspace { position: relative; }
.support-hero .app-body { height: auto; min-height: 449px; }
.support-hero .messages { flex: 1 0 auto; }
.support-outcomes .mini-chat { height: auto; }
.mini-chat-top, .phone-shop { min-height: 45px; height: auto; padding-top: var(--space-2); padding-bottom: var(--space-2); }
.phone-shop { min-height: 53px; }
.mini-chat-top > strong, .phone-shop > div { min-width: 0; }
.membership-plan { flex-wrap: wrap; }
.constellation .phone-thread { height: auto; min-height: 367px; }
.constellation .phone-stage { display: grid; grid-template-columns: minmax(0,1fr); height: auto; min-height: 552px; padding-bottom: var(--space-40px); }
.constellation .customer-phone { position: relative; grid-area: 1 / 1; align-self: start; }
.site-header { grid-template-columns: minmax(166px,1fr) 264px max-content 110px; }
.site-header > .button { white-space: normal; height: auto; }
.language-toggle { width: auto; min-width: 106px; }
.language-toggle a:first-child { width: 5.91em; }
.language-toggle a:last-child { width: 2.64em; }
@media (min-width:761px) and (max-width:1100px) {
 .support-outcomes .mini-chat { min-height: 380px; }
 .site-header { grid-template-columns: minmax(166px,1fr) max-content 110px; }
}
@media (max-width:1100px) {
 .constellation .phone-thread { min-height: 385px; }
 .constellation .phone-stage { min-height: 572px; }
}
@media (max-width:760px) {
 .site-header { grid-template-columns: 166px max-content; }
 .support-hero .app-body { min-height: 454px; }
 .support-hero.workdrawer .stage { min-height: 522px; }
 .constellation .phone-thread { min-height: 377px; }
}

/* A vector mark cannot be substituted with a platform emoji glyph. */
.brand-mark,.app-symbol {display:inline-flex!important;align-items:center;justify-content:center;color:var(--color-accent)}
.brand-mark svg {width:34px;height:34px;display:block}
.app-symbol svg {width:19px;height:19px;display:block}
.closing>.brand-mark svg {width:44px;height:44px}
.language-toggle {display:flex;width:auto;min-width:100px;background:var(--color-bg-level-1)}
.language-toggle a:first-child,.language-toggle a:last-child {width:44px}
.language-toggle a[aria-current="page"] {background:var(--color-accent-tint);color:var(--color-accent);font-weight:var(--site-weight-0)}
.mobile-menu,.capability-tabs {display:none}
.mobile-menu summary {list-style:none;cursor:pointer}
.mobile-menu summary::-webkit-details-marker {display:none}
.mobile-menu .menu-close,.mobile-menu[open] .menu-open {display:none}
.mobile-menu[open] .menu-close {display:block}
.mobile-menu summary:focus-visible {outline:3px solid var(--tone-9074c5);outline-offset:2px}
@media(max-width:1100px){
 .site-header {position:relative;grid-template-columns:minmax(166px,1fr) max-content 110px 44px;gap:var(--space-12px)}
 .mobile-menu {display:block}
 .mobile-menu summary {width:44px;height:44px;display:grid;place-items:center;border-radius:var(--radius-6px)}
 .mobile-menu summary:hover,.mobile-menu[open] summary {background:var(--color-bg-level-1)}
 .site-header .mobile-menu nav {display:flex;flex-direction:column;position:absolute;top:calc(100% - 4px);left:var(--space-20px);right:var(--space-20px);width:auto;z-index:10;padding:var(--space-8px);background:var(--color-bg-primary);border:1px solid var(--color-border-primary);border-radius:var(--radius-8px);box-shadow:var(--site-shadow-13)}
 .site-header .mobile-menu nav a {display:flex;align-items:center;min-height:48px;padding:var(--space-12px);font-size:var(--text-15px);text-align:left;border-radius:var(--radius-4px)}
 .mobile-menu nav a:hover {background:var(--color-bg-level-1)}
 .site-header .mobile-menu nav a:last-child {color:var(--color-accent)}
}
@media(max-width:760px){
 .site-header {grid-template-columns:minmax(166px,1fr) 96px 44px;gap:var(--space-4px);height:76px;min-height:76px}
 .language-toggle {min-width:96px;width:96px;height:44px;padding:2px;gap:0}
 .language-toggle a:first-child,.language-toggle a:last-child {flex:1;width:auto;height:38px;min-height:38px;display:grid;place-items:center;padding:0 var(--space-4px);font-size:var(--text-12px)}
 .support-outcomes article[hidden] {display:none}
}

/* Whitespace separates marketing sections; borders remain inside the UI examples. */
.outcome-section,.feature-story,.launch-section,.faq,.closing,footer {border-top:0}
.outcome-grid {border-top:0;border-bottom:0}
.launch-grid>article,.launch-cta {border-top:0}
@media(max-width:350px){
 .site-header {padding-left:var(--space-8px);padding-right:var(--space-8px);grid-template-columns:minmax(166px,1fr) 88px 44px;gap:var(--space-3px)}
 .language-toggle {min-width:88px;width:88px}
}

/* One centered brand signature across desktop and mobile. */
footer.wrap {flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:var(--space-16px)}
footer.wrap>.brand {margin:0}
footer.wrap>span {max-width:100%;font-size:var(--text-14px);line-height:1.6}
footer.wrap>small {margin:0}