:root{
  --color-page:#f6f9fd;--color-surface:#fff;--color-surface-subtle:#f3f7fc;--color-surface-hover:#edf4ff;
  --color-border:#dfe7f1;--color-border-strong:#9bbcf0;--color-text:#172b46;--color-text-secondary:#5f728c;--color-text-muted:#7d8da2;
  --color-primary:#1763e9;--color-primary-hover:#0f4fca;--color-primary-subtle:#eaf2ff;--color-active-surface:#eaf2ff;--color-focus:#3279ed;
  --color-shadow:rgba(20,50,94,.1);--color-overlay:rgba(10,27,52,.55);--color-success:#13745c;
  --color-quick:#102f57;--color-quick-text:#fff;--color-quick-accent:#7fc0ff;
  --theme-primary:var(--color-primary);--theme-primary-hover:var(--color-primary-hover);--theme-primary-soft:var(--color-primary-subtle);
  --theme-text:var(--color-text);--theme-text-secondary:var(--color-text-secondary);--theme-text-accent:var(--color-primary);
  --theme-surface:var(--color-surface);--theme-surface-soft:var(--color-surface-subtle);--theme-surface-hover:var(--color-surface-hover);
  --theme-border:var(--color-border);--theme-border-strong:var(--color-border-strong);--theme-button-bg:var(--color-primary);--theme-button-hover:var(--color-primary-hover);--theme-button-text:#fff;
  --theme-search-bg:var(--color-surface);--theme-search-border:#cbd9ea;--theme-search-focus:var(--color-focus);--theme-card-bg:var(--color-surface);--theme-card-border:var(--color-border);--theme-card-hover-border:var(--color-border-strong);--theme-card-icon-bg:var(--color-primary-subtle);
  --theme-sidebar-active-text:var(--color-primary);--theme-sidebar-active-indicator:var(--color-primary);--theme-active-surface:var(--color-active-surface);--theme-focus-ring:var(--color-focus);
  --motion-fast:140ms;--motion-normal:220ms;--motion-enter:480ms;--ease-standard:cubic-bezier(.2,0,0,1);--ease-emphasized:cubic-bezier(.2,.8,.2,1);--ease-out:cubic-bezier(0,0,.2,1);
  --content-max-width:1180px;--content-gutter:clamp(24px,4vw,48px);
  --abstract-primary:#2563eb;--abstract-secondary:#06b6d4;--abstract-line:rgba(37,99,235,.2);--abstract-node-surface:#dbeafe;--abstract-node-core:#2563eb;--abstract-glow:rgba(37,99,235,.12);--abstract-signal:#0891b2;
}
:root[data-theme=dark]{
  --color-page:#081221;--color-surface:#101d2f;--color-surface-subtle:#14243a;--color-surface-hover:#192c45;
  --color-border:#293b53;--color-border-strong:#46658b;--color-text:#e7eef9;--color-text-secondary:#adbed3;--color-text-muted:#8295ad;
  --color-primary:#6ea8ff;--color-primary-hover:#8abaff;--color-primary-subtle:#172d4d;--color-active-surface:#193456;--color-focus:#7eb2ff;
  --color-shadow:rgba(0,0,0,.3);--color-overlay:rgba(1,7,16,.76);--color-quick:#0d1a2d;--color-quick-text:#edf5ff;--color-quick-accent:#79bdff;
  --theme-search-border:#344963;--theme-button-text:#071426;
  --abstract-primary:#6ea8ff;--abstract-secondary:#4bc9df;--abstract-line:rgba(110,168,255,.2);--abstract-node-surface:#1a3658;--abstract-node-core:#6ea8ff;--abstract-glow:rgba(75,201,223,.12);--abstract-signal:#4bc9df;
}
html{background:var(--color-page);color:var(--color-text)}body,.bg-slate-50{background:var(--color-page)!important;color:var(--color-text)}.text-slate-800{color:var(--color-text)!important}
.header,.sidebar{background:var(--color-surface);border-color:var(--color-border)}.brand span{color:#1763e9}.brand small,.header-title{color:var(--color-text-secondary)}
.header-search,.hero-search,.nav-filter input{background:var(--color-surface);border-color:var(--theme-search-border);color:var(--color-text)}.search-input{color:var(--color-text)}.search-input::placeholder,.nav-filter input::placeholder{color:var(--color-text-muted)}kbd{background:var(--color-surface-subtle);border-color:var(--color-border);color:var(--color-text-secondary)}
.primary{background:var(--color-primary);color:var(--theme-button-text)}.primary:hover{background:var(--color-primary-hover)}
.theme-toggle{display:inline-flex;width:44px;height:44px;align-items:center;justify-content:center;flex:0 0 44px;border:1px solid var(--color-border);border-radius:10px;background:var(--color-surface);color:var(--color-primary);transition:background var(--motion-normal) var(--ease-standard),border-color var(--motion-normal) var(--ease-standard),color var(--motion-normal) var(--ease-standard)}.theme-toggle:hover{background:var(--color-surface-hover);border-color:var(--color-border-strong)}.theme-toggle svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.theme-toggle:focus-visible{outline:3px solid var(--color-focus);outline-offset:2px}
main{background:transparent}.hero{position:relative;isolation:isolate;max-width:var(--content-max-width);min-height:438px;margin:28px auto 0;padding:46px 44px 40px;overflow:hidden;border:1px solid var(--color-border);border-radius:16px;background:linear-gradient(112deg,var(--color-surface) 0,var(--color-surface) 58%,var(--color-primary-subtle) 145%);box-shadow:0 8px 28px var(--color-shadow)}
.hero>.hero-badge{display:inline-flex;align-items:center;gap:8px;width:max-content;max-width:100%;min-height:38px;margin-bottom:22px;padding:8px 13px;overflow:hidden;border:1px solid color-mix(in srgb,var(--color-primary) 28%,var(--color-border));border-radius:10px;background:var(--color-primary-subtle);color:var(--color-primary);font-size:11px;font-weight:750;line-height:1;letter-spacing:.09em;position:relative}.hero-badge svg{width:18px;height:18px;stroke-width:1.7}.hero-badge::after{content:'';position:absolute;inset:-20% auto -20% -38%;width:28%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);transform:skewX(-18deg);animation:hero-badge-sheen 720ms var(--ease-out) 360ms 1 both;pointer-events:none}
.hero>h1,.hero>p,.hero>.hero-search,.hero>.hero-links{position:relative;z-index:3;max-width:58%}.hero h1{margin-bottom:16px;color:var(--color-text);font-size:clamp(38px,3.55vw,54px);line-height:1.08}.hero h1 span{color:var(--color-primary)}.hero>p{margin-bottom:24px;color:var(--color-text-secondary);font-size:16px}.hero-search{min-height:64px;padding:16px 18px;box-shadow:0 3px 12px var(--color-shadow)}.hero-links{margin-top:20px}.hero-links>a:not(.primary){color:var(--color-primary);font-weight:600}.hero-links>a:not(.primary)::after{content:' →';margin-left:5px}.hero .primary{box-shadow:0 5px 12px color-mix(in srgb,var(--color-primary) 16%,transparent)}
.home-section,.quick-section{max-width:var(--content-max-width)}.section-head h2,.quick-section h2,.category-card h3,.list-title,.article-heading h1,.step h2,.related h2{color:var(--color-text)}.section-head span,.category-card p,.article-list p{color:var(--color-text-secondary)}.category-grid{gap:14px}.category-card{position:relative;display:grid;grid-template-columns:50px minmax(0,1fr) 18px;grid-template-rows:auto 1fr;column-gap:16px;min-height:128px;padding:22px 20px;border-color:var(--color-border);border-radius:11px;background:var(--color-surface);box-shadow:none}.category-card::before{content:'›';grid-column:3;grid-row:1/3;align-self:center;color:var(--color-text-secondary);font-size:27px;font-weight:300;line-height:1}.category-card .card-icon{grid-column:1;grid-row:1/3;width:48px;height:48px;margin:0;border-radius:10px;background:var(--color-primary-subtle);color:var(--color-primary)}.category-card .card-icon svg{width:24px;height:24px;stroke-width:1.7}.category-card h3{grid-column:2;grid-row:1;margin:1px 0 6px;line-height:1.35}.category-card p{grid-column:2;grid-row:2;margin:0;line-height:1.45}.category-card:hover{transform:translateY(-2px);border-color:var(--color-border-strong);box-shadow:0 6px 16px var(--color-shadow)}.category-card:nth-child(4) .card-icon svg{display:none}.category-card:nth-child(4) .card-icon::before{content:'';width:21px;height:19px;border:1.7px solid currentColor;border-radius:3px;background:linear-gradient(currentColor,currentColor) 0 5px/100% 1.7px no-repeat}.category-card:nth-child(4) .card-icon::after{right:auto;top:11px;left:14px;width:2px;height:5px;border-radius:2px;background:currentColor;box-shadow:8px 0 currentColor;opacity:1}
.quick-section{background:var(--color-quick);color:var(--color-quick-text)}.quick-section .eyebrow,.quick-section a b{color:var(--color-quick-accent)}.quick-section p{color:color-mix(in srgb,var(--color-quick-text) 72%,transparent)}.article-list a,.related a,.adjacent a,.screenshot,.mobile-toc{background:var(--color-surface);border-color:var(--color-border)}.article-list b,.related a,.adjacent b{color:var(--color-text)}.coverage,.access-path,.note{background:var(--color-surface-subtle);border-color:var(--color-border)}.coverage p,.article-heading p,.step p,.breadcrumb,.toc a,.article-foot{color:var(--color-text-secondary)}.access-path{border-left-color:var(--color-primary)}.access-path span,.access-path p,.breadcrumb a,.toc a.current,.mobile-toc a.current,.note b,.related a{color:var(--color-primary)}.step-number{background:var(--color-primary-subtle);color:var(--color-primary)}.toc{border-color:var(--color-border)}.article-tools button,.fit-button,.suggestions button,.image-reference{background:var(--color-surface);border-color:var(--color-border);color:var(--color-primary)}.article-tools button:hover,.suggestions button:hover,.image-reference:hover{background:var(--color-surface-hover)}
dialog,#search-dialog,#viewer{background:var(--color-surface);border-color:var(--color-border);color:var(--color-text)}dialog::backdrop{background:var(--color-overlay)}.dialog-top,.dialog-foot,.viewer-top{background:var(--color-surface);border-color:var(--color-border)}#results,.image-scroll{background:var(--color-surface-subtle)}.search-result{color:var(--color-text)}.search-result b{color:var(--color-text)}.search-result small,.search-result p,.dialog-foot{color:var(--color-text-secondary)}.search-result:hover,.search-result.selected{background:var(--color-active-surface);border-color:var(--color-border-strong)}mark{background:var(--color-primary-subtle);color:var(--color-primary)}#toast{background:var(--color-text);color:var(--color-surface)}
.iconbtn{background:var(--color-surface);border-color:var(--color-border);color:var(--color-text)}.mobile-toc summary{color:var(--color-text)}.screenshot span{background:var(--color-surface-subtle);border-color:var(--color-border);color:var(--color-text-secondary)}#reading-progress{background:var(--color-primary)}#shade{background:var(--color-overlay)!important}:focus-visible,.search-input:focus-visible,.skip:focus{outline-color:var(--color-focus)}
@keyframes hero-badge-sheen{from{left:-38%}to{left:125%}}
@media(max-width:1279px){.hero{padding-inline:36px}.hero>h1,.hero>p,.hero>.hero-search,.hero>.hero-links{max-width:62%}.category-card{padding:20px 18px;column-gap:13px}}
@media(max-width:1023px){.hero{min-height:410px;margin-top:22px;padding:40px 32px 34px}.hero>h1,.hero>p,.hero>.hero-search,.hero>.hero-links{max-width:66%}.category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:767px){.hero{min-height:0;padding:34px 26px 30px}.hero>h1,.hero>p,.hero>.hero-search,.hero>.hero-links{max-width:100%}.hero-search{min-height:56px}.category-card{min-height:122px}}
@media(max-width:600px){.theme-toggle{width:40px;height:44px;flex-basis:40px}.hero{margin-top:14px;padding:28px 20px 26px;border-radius:13px}.hero>.hero-badge{min-height:36px;margin-bottom:19px;padding:8px 11px}.hero h1{font-size:35px}.hero-links{align-items:stretch}.hero-links .primary{width:100%}.category-grid{grid-template-columns:1fr}.category-card{min-height:112px;padding:19px}.category-card p{font-size:14px}}
@media(prefers-reduced-motion:reduce){.hero-badge::after{display:none;animation:none}.category-card:hover{transform:none}.theme-toggle,.category-card,.primary{transition:none!important}}
/* Hero fidelity correction: layered SaaS illustration matching the supplied composition. */
.hero{min-height:462px;padding:44px 42px 38px;background:var(--color-surface)}.hero::before{content:'';position:absolute;z-index:0;inset:0 0 0 48%;pointer-events:none;background:radial-gradient(ellipse at 70% 47%,color-mix(in srgb,var(--color-primary-subtle) 88%,transparent) 0,color-mix(in srgb,var(--color-primary-subtle) 44%,transparent) 47%,transparent 76%)}.hero::after{content:'';position:absolute;z-index:0;right:-5%;top:-27%;width:53%;height:155%;border:1px solid color-mix(in srgb,var(--color-primary) 10%,transparent);border-radius:50%;transform:rotate(-8deg);pointer-events:none}.hero>h1,.hero>p,.hero>.hero-search,.hero>.hero-links{max-width:48%}.hero>.hero-badge{margin-bottom:20px}.hero h1{margin-bottom:17px;line-height:1.07}.hero>p{margin-bottom:25px}.hero-search{width:100%;max-width:48%;min-height:64px}.hero-links{margin-top:20px}
@media(max-width:1199px) and (min-width:1024px){.hero{min-height:445px;padding-inline:34px}.hero>h1,.hero>p,.hero>.hero-search,.hero>.hero-links{max-width:64%}.hero::before{left:58%}}
@media(max-width:1023px) and (min-width:768px){.hero{min-height:420px;padding:38px 30px 32px}.hero>h1,.hero>p,.hero>.hero-search,.hero>.hero-links{max-width:59%}.hero::before{left:55%}}
@media(max-width:767px){.hero::before{inset:0;background:linear-gradient(145deg,var(--color-surface),color-mix(in srgb,var(--color-primary-subtle) 34%,var(--color-surface)))}.hero::after{display:none}.hero>h1,.hero>p,.hero>.hero-search,.hero>.hero-links{max-width:100%}}

@media print{.theme-toggle{display:none!important}}

/* Interactive KAIVA product showcase. */
.product-showcase{--product-surface:#fff;--product-raised:#fff;--product-muted:#f5f8fc;--product-border:#dbe5f1;--product-text:#16243a;--product-text-muted:#718096;--product-active:#e8f2ff;--product-incoming:#f1f4f8;--product-outgoing:#e3efff;--product-ai:#edf6ff;--product-ai-accent:#1763e9;--product-shadow:rgba(28,64,112,.16);--product-x:0px;--product-y:0px;--channel-x:0px;--channel-y:0px;position:absolute;z-index:2;right:1.5%;top:50%;width:51%;max-width:600px;height:362px;transform:translate3d(var(--product-x),calc(-50% + var(--product-y)),0);pointer-events:none;color:var(--product-text);font-size:10px;line-height:1.35;transition:transform 420ms var(--ease-out)}
:root[data-theme=dark] .product-showcase{--product-surface:#122138;--product-raised:#172a43;--product-muted:#0f1d31;--product-border:#2c425e;--product-text:#e8f0fb;--product-text-muted:#94a8c2;--product-active:#1b3d67;--product-incoming:#1c3049;--product-outgoing:#1c4779;--product-ai:#172f50;--product-ai-accent:#6ea8ff;--product-shadow:rgba(0,0,0,.35)}
.product-window{position:absolute;inset:16px 20px 10px 18px;overflow:hidden;border:1px solid var(--product-border);border-radius:15px;background:var(--product-surface);box-shadow:0 18px 38px var(--product-shadow);opacity:1;transform:translateY(0);transition:opacity 700ms cubic-bezier(.22,1,.36,1),transform 700ms cubic-bezier(.22,1,.36,1)}
.product-topbar{display:grid;grid-template-columns:62px 1fr auto;align-items:center;height:40px;padding:0 13px;border-bottom:1px solid var(--product-border);background:var(--product-raised)}.product-brand{color:#152f68;font-size:12px;font-weight:850;letter-spacing:-.04em}.product-brand span{color:#1763e9}.product-location{font-weight:750}.product-online{display:flex;align-items:center;gap:5px;color:var(--product-text-muted);font-size:8px}.product-online i{width:6px;height:6px;border-radius:50%;background:#22b573}
.product-body{display:grid;grid-template-columns:38px 142px minmax(0,1fr);height:calc(100% - 40px)}.product-rail{display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 6px;border-right:1px solid var(--product-border);background:var(--product-muted)}.rail-mark{display:grid;width:27px;height:27px;place-items:center;border-radius:7px;color:var(--product-text-muted)}.rail-mark.active{background:var(--product-active);color:var(--product-ai-accent)}.rail-mark svg{width:15px;height:15px}
.conversation-column{border-right:1px solid var(--product-border);background:var(--product-raised)}.conversation-tabs{display:flex;gap:12px;padding:10px 10px 7px;border-bottom:1px solid var(--product-border);color:var(--product-text-muted);font-size:8px}.conversation-tabs b{color:var(--product-ai-accent)}.conversation-search{display:flex;align-items:center;gap:5px;margin:7px 8px;padding:6px 7px;border:1px solid var(--product-border);border-radius:6px;color:var(--product-text-muted);font-size:8px}.conversation-search svg{width:11px;height:11px}.conversation-row{position:relative;display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:7px;align-items:center;min-height:58px;padding:8px;border-left:2px solid transparent}.conversation-row.selected{border-left-color:var(--product-ai-accent);background:var(--product-active)}.product-avatar{display:grid;width:28px;height:28px;place-items:center;border-radius:50%;color:#fff;font-size:8px;font-weight:800}.avatar-blue{background:#4d8df3}.avatar-green{background:#33a47d}.avatar-violet{background:#7868d8}.conversation-row>span:nth-child(2){min-width:0}.conversation-row b,.conversation-row small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.conversation-row b{font-size:9px}.conversation-row small{margin-top:2px;color:var(--product-text-muted);font-size:7px}.conversation-row time{align-self:start;color:var(--product-text-muted);font-size:6px}.unread-dot{position:absolute;right:8px;bottom:10px;width:6px;height:6px;border-radius:50%;background:var(--product-ai-accent);opacity:0;transform:scale(.5);transition:opacity 260ms ease-out,transform 260ms ease-out}
.active-chat{display:grid;grid-template-rows:43px minmax(0,1fr) 39px;min-width:0;background:var(--product-muted)}.chat-head{display:flex;align-items:center;gap:7px;padding:7px 10px;border-bottom:1px solid var(--product-border);background:var(--product-raised)}.chat-head .product-avatar{width:27px;height:27px}.chat-head span:nth-child(2){display:grid}.chat-head small{color:var(--product-text-muted);font-size:7px}.chat-head>i{width:7px;height:7px;margin-left:auto;border-radius:50%;background:#22b573}.chat-stream{position:relative;overflow:hidden;padding:10px 11px}.message{max-width:82%;opacity:0;transform:translateY(8px);transition:opacity 360ms ease-out,transform 420ms cubic-bezier(.22,1,.36,1)}.message span{display:block;padding:7px 9px;border-radius:9px}.message small{display:block;margin-top:3px;color:var(--product-text-muted);font-size:6px}.customer-message{margin-right:auto}.customer-message span{background:var(--product-incoming)}.employee-message{margin:9px 0 0 auto;text-align:right}.employee-message span{background:var(--product-outgoing);text-align:left}.ai-processing,.ai-suggestion{position:absolute;left:11px;right:11px;top:61px;opacity:0;transform:translateY(7px);transition:opacity 320ms ease-out,transform 380ms cubic-bezier(.22,1,.36,1)}.ai-processing{display:flex;align-items:center;gap:4px;padding:8px 9px;border:1px solid color-mix(in srgb,var(--product-ai-accent) 20%,var(--product-border));border-radius:8px;background:var(--product-ai);color:var(--product-text-muted)}.kai-spark{color:var(--product-ai-accent);font-weight:800}.ai-processing i{width:3px;height:3px;border-radius:50%;background:var(--product-ai-accent);animation:product-dot 800ms ease-in-out infinite}.ai-processing i:nth-last-child(2){animation-delay:130ms}.ai-processing i:last-child{animation-delay:260ms}.ai-suggestion{padding:8px 9px;border:1px solid color-mix(in srgb,var(--product-ai-accent) 25%,var(--product-border));border-radius:9px;background:var(--product-ai);box-shadow:0 5px 12px color-mix(in srgb,var(--product-shadow) 60%,transparent)}.ai-suggestion>div{display:flex;gap:5px;align-items:center;color:var(--product-ai-accent)}.ai-suggestion p{margin:5px 0 3px;color:var(--product-text);font-size:8px;line-height:1.35}.ai-suggestion small{color:var(--product-text-muted);font-size:6px}.chat-composer{display:flex;align-items:center;gap:6px;margin:0 8px 7px;padding:7px 8px;border:1px solid var(--product-border);border-radius:7px;background:var(--product-raised);color:var(--product-text-muted);font-size:7px}.composer-placeholder,.composer-ready{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.composer-ready{display:none;color:var(--product-text)}.chat-composer b{display:grid;width:21px;height:21px;place-items:center;border-radius:6px;background:var(--product-border);color:var(--product-text-muted);font-size:9px;transition:background 260ms ease-out,color 260ms ease-out,transform 260ms ease-out}
.channel-chip{position:absolute;z-index:3;display:flex;align-items:center;gap:6px;padding:7px 9px;border:1px solid var(--product-border);border-radius:10px;background:var(--product-raised);box-shadow:0 8px 18px var(--product-shadow);color:var(--product-text);opacity:0;transition:opacity 420ms ease-out,transform 520ms cubic-bezier(.22,1,.36,1)}.channel-chip b{display:grid;width:22px;height:22px;place-items:center;border-radius:7px;color:#fff;font-size:11px}.channel-chip span{font-size:8px;font-weight:700}.channel-zalo{top:1px;right:43px;transform:translate3d(calc(var(--channel-x) + 8px),calc(var(--channel-y) - 5px),0)}.channel-zalo b{background:#1688f8}.channel-facebook{right:2px;bottom:24px;transform:translate3d(calc(var(--channel-x) + 8px),calc(var(--channel-y) + 5px),0)}.channel-facebook b{background:#1677f2;font-family:Arial,sans-serif}
.product-showcase[data-product-state=entrance] .product-window{opacity:0;transform:translateY(8px)}.product-showcase[data-product-state=entrance] :is(.product-rail,.conversation-column,.active-chat){opacity:0;transform:translateY(5px)}.product-rail,.conversation-column,.active-chat{transition:opacity 500ms ease-out,transform 560ms cubic-bezier(.22,1,.36,1)}.conversation-column{transition-delay:70ms}.active-chat{transition-delay:130ms}
.product-showcase:not([data-product-state=entrance]) .channel-chip{opacity:1}.product-showcase:not([data-product-state=entrance]) .channel-zalo{transform:translate3d(var(--channel-x),var(--channel-y),0)}.product-showcase:not([data-product-state=entrance]) .channel-facebook{transform:translate3d(var(--channel-x),var(--channel-y),0)}
.product-showcase:is([data-product-state=new-message],[data-product-state=ai-processing],[data-product-state=ai-suggestion],[data-product-state=sending],[data-product-state=sent]) .customer-message{opacity:1;transform:none}.product-showcase:is([data-product-state=new-message],[data-product-state=ai-processing]) .unread-dot{opacity:1;transform:scale(1)}.product-showcase[data-product-state=ai-processing] .ai-processing{opacity:1;transform:none}.product-showcase:is([data-product-state=ai-suggestion],[data-product-state=sending],[data-product-state=sent]) .ai-suggestion{opacity:1;transform:none}.product-showcase:is([data-product-state=sending],[data-product-state=sent]) .composer-placeholder{display:none}.product-showcase:is([data-product-state=sending],[data-product-state=sent]) .composer-ready{display:block}.product-showcase:is([data-product-state=sending],[data-product-state=sent]) .chat-composer b{background:var(--product-ai-accent);color:#fff;transform:scale(1.04)}.product-showcase[data-product-state=sent] .ai-suggestion{opacity:.42;transform:translateY(-3px) scale(.985)}.product-showcase[data-product-state=sent] .employee-message{opacity:1;transform:none}.product-showcase[data-product-state=reset] :is(.customer-message,.ai-processing,.ai-suggestion,.employee-message,.unread-dot){opacity:0;transition-duration:750ms}
@keyframes product-dot{0%,100%{opacity:.3;transform:translateY(0)}50%{opacity:1;transform:translateY(-2px)}}
.quick-section h2{color:var(--color-quick-text)}.quick-section a{color:var(--color-quick-text)}
@media(max-width:1199px) and (min-width:1024px){.product-showcase{right:0;width:42%;height:330px}.product-body{grid-template-columns:34px 112px minmax(0,1fr)}.conversation-row.tertiary{display:none}.hero>h1,.hero>p,.hero>.hero-search,.hero>.hero-links{max-width:59%}.hero::before{left:57%}.channel-facebook{display:none}}
@media(max-width:1023px) and (min-width:768px){.hero{min-height:430px}.hero>h1,.hero>p,.hero>.hero-search,.hero>.hero-links{max-width:57%}.product-showcase{right:-1%;width:42%;height:302px}.product-window{inset:12px 8px 8px}.product-topbar{grid-template-columns:54px 1fr}.product-online{display:none}.product-body{grid-template-columns:1fr}.product-rail,.conversation-column{display:none}.active-chat{grid-column:1}.channel-chip{display:none}.hero::before{left:55%}}
@media(max-width:767px){.hero{padding-bottom:270px}.product-showcase{top:auto;right:16px;bottom:18px;width:calc(100% - 32px);max-width:none;height:230px;transform:none}.product-window{inset:0}.product-topbar{grid-template-columns:58px 1fr}.product-online{display:none}.product-body{grid-template-columns:1fr}.product-rail,.conversation-column,.channel-chip{display:none}.active-chat{grid-column:1}.chat-stream{padding-block:8px}.ai-processing,.ai-suggestion{top:56px}.hero::before{inset:0;background:linear-gradient(145deg,var(--color-surface),color-mix(in srgb,var(--color-primary-subtle) 34%,var(--color-surface)))}}
@media(max-width:480px){.hero{padding-bottom:258px}.product-showcase{right:12px;bottom:14px;width:calc(100% - 24px);height:220px}.product-topbar{height:36px}.product-body{height:calc(100% - 36px)}.active-chat{grid-template-rows:40px minmax(0,1fr) 36px}.chat-head{padding-block:5px}.chat-stream{padding:7px 9px}.ai-processing,.ai-suggestion{left:9px;right:9px;top:52px}.ai-suggestion p{font-size:7px}.message span{padding:6px 8px}}
@media(prefers-reduced-motion:reduce){.product-showcase,.product-showcase *{animation:none!important;transition:none!important}.product-showcase{--product-x:0px;--product-y:0px;--channel-x:0px;--channel-y:0px}.product-showcase .product-window,.product-showcase .product-rail,.product-showcase .conversation-column,.product-showcase .active-chat{opacity:1!important;transform:none!important}}
@media print{.product-showcase{display:none!important}}
.rail-mark{font-size:17px}.conversation-row{grid-template-columns:28px minmax(0,1fr)}.conversation-label{min-width:0}.conversation-label::after{content:attr(data-preview);display:block;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:7px;font-weight:400;color:var(--product-text-muted)}.chat-identity::after{content:'Zalo OA · đang hoạt động';display:block;color:var(--product-text-muted);font-size:7px;font-weight:400}.message{position:relative;margin-block:0;padding:7px 9px;border-radius:9px;font-size:9px}.customer-message{background:var(--product-incoming)}.employee-message{background:var(--product-outgoing)}.employee-message::after{content:'Đã gửi ✓';position:absolute;right:0;bottom:-12px;font-size:6px;color:var(--product-text-muted)}.suggestion-title{color:var(--product-ai-accent)}.channel-chip::before{content:'Z';display:grid;width:22px;height:22px;place-items:center;border-radius:7px;background:#1688f8;color:#fff;font-size:11px;font-weight:800}.channel-facebook::before{content:'f';background:#1677f2}.product-showcase[data-product-state=sending] .composer-placeholder{display:block;font-size:0}.product-showcase[data-product-state=sending] .composer-placeholder::after{content:'Mình sẽ kiểm tra và hỗ trợ bạn ngay nhé.';font-size:7px;color:var(--product-text)}
.hero::after{display:none}.product-showcase[data-product-state=sent] .employee-message{margin-top:102px}.product-showcase[data-product-state=sent] .ai-suggestion{opacity:1;transform:none}.product-showcase[data-product-state=sent] .composer-ready{display:none}.product-showcase[data-product-state=sent] .composer-placeholder{display:block}.product-showcase[data-product-state=sent] .chat-composer b{background:var(--product-border);color:var(--product-text-muted);transform:none}.product-showcase[data-product-state=reset] :is(.message,.ai-suggestion){transition-timing-function:cubic-bezier(.4,0,.2,1)}.product-showcase:not([data-product-state=ai-processing]) .ai-processing i{animation-play-state:paused}:root[data-theme=dark] .product-brand{color:var(--product-text)}
@media(max-width:1023px){.product-showcase{height:362px}.product-showcase .active-chat{font-size:9px}.product-showcase[data-product-state=sent] .employee-message{margin-top:92px}}
@media(max-width:767px){.hero{padding-bottom:354px}.product-showcase{height:320px}.product-showcase .chat-stream{padding:8px 10px}.product-showcase .ai-suggestion{top:59px}.product-showcase .ai-suggestion p{font-size:8px}.product-showcase[data-product-state=sent] .employee-message{margin-top:92px}}
/* Official KChat mark copied from https://client.kaiva.one/login; preserve brand artwork. */
.channel-kchat{left:18px;bottom:24px;transform:translate3d(calc(var(--channel-x) - 8px),calc(var(--channel-y) + 5px),0)}.channel-kchat::before{display:none}.channel-kchat>svg{width:22px;height:22px;flex:0 0 22px}.channel-kchat>span{font-size:inherit;font-weight:inherit}.product-showcase:not([data-product-state=entrance]) .channel-kchat{transform:translate3d(var(--channel-x),var(--channel-y),0)}
