/* =========================================================
   20 — PAGE: INDEX / INDEXG
   ========================================================= */
/* WORKAIBOX WUI landing composition.
   Shared components own colour, focus and interaction states. This file owns
   only landing layout, inverse contexts and documented landing variants. */
html:has(body[data-page="index"].wui-landing) { scroll-behavior: smooth; }
body[data-page="index"].wui-landing {
    margin: 0;
    background: var(--wui-page-bg);
    color: var(--wui-text-primary);
    font-family: var(--wui-font);
  }
  body[data-page="index"].wui-landing .index-shell { min-height: 100vh; overflow: hidden; }

  /* Header and navigation */
  body[data-page="index"].wui-landing .landing {
    z-index: var(--wui-z-sidebar);
    height: var(--wui-topbar-h);
    transition: background var(--wui-motion-slow) var(--wui-ease-standard), box-shadow var(--wui-motion-slow) var(--wui-ease-standard), border-color var(--wui-motion-slow) var(--wui-ease-standard);
  }
  body[data-page="index"].wui-landing .landing.is-top {
    background: transparent;
    border-color: transparent;
    box-shadow: none;
  }
  body[data-page="index"].wui-landing .landing:not(.is-top) {
    box-shadow: var(--wui-card-shadow);
  }
  body[data-page="index"].wui-landing .index-header__inner {
    width: min(1440px, calc(100% - 48px)); height: 100%; margin: auto;
    position: relative;
    display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--wui-space-6);
  }
  body[data-page="index"].wui-landing .index-brand { display: inline-flex; align-items: center; color: inherit; text-decoration: none; }
  body[data-page="index"].wui-landing .index-brand__logo { display: block; width: 202px; height: auto; max-height: calc(var(--wui-topbar-h) - 18px); object-fit: contain; }
  body[data-page="index"].wui-landing .index-brand__logo--light {
    display: none;
  }
  body[data-page="index"].wui-landing .landing.is-top .index-brand__logo--default, html[data-theme="dark"] body[data-page="index"].wui-landing .landing:not(.is-top) .index-brand__logo--default { display: none; }
  body[data-page="index"].wui-landing .landing.is-top .index-brand__logo--light, html[data-theme="dark"] body[data-page="index"].wui-landing .landing:not(.is-top) .index-brand__logo--light { display: block; }
  body[data-page="index"].wui-landing .index-brand--footer { padding: 0; background: transparent; }
  body[data-page="index"].wui-landing .index-brand--footer .index-brand__logo { width: 224px; max-height: none; }
  body[data-page="index"].wui-landing .index-nav {
    position: absolute;
    left: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--wui-space-2);
    transform: translateX(-50%);
  }
  body[data-page="index"].wui-landing .index-nav a {
    padding: var(--wui-space-3) var(--wui-space-4); border: var(--wui-line);
    color: var(--wui-text-secondary); font-size: var(--wui-font-sm); font-weight: var(--wui-weight-bold);
    letter-spacing: .35px; text-decoration: none;
  }
  body[data-page="index"].wui-landing .index-nav a:hover, body[data-page="index"].wui-landing .index-nav a.is-active { background: var(--wui-action-primary-soft); color: var(--wui-text-primary); }
  body[data-page="index"].wui-landing .landing.is-top .index-nav a { color: var(--wui-white); border-color: var(--wui-alpha-white-35); }
  body[data-page="index"].wui-landing .landing.is-top .index-nav a:hover, body[data-page="index"].wui-landing .landing.is-top .index-nav a.is-active { background: var(--wui-alpha-white-10); }
  body[data-page="index"].wui-landing .index-actions { justify-self: end; gap: var(--wui-space-2); }

  body[data-page="index"].wui-landing .wui-auth-actions { gap: var(--wui-space-2); }

  /* Shared button variants */
  body[data-page="index"].wui-landing .wui-landing__cta { height: var(--wui-control-lg); padding-inline: var(--wui-space-5); text-decoration: none; }
  body[data-page="index"].wui-landing .index-auth-btn { min-width: 92px; min-height: var(--wui-control-sm); height: var(--wui-control-sm); }
  body[data-page="index"].wui-landing .index-hero .index-btn--outline, body[data-page="index"].wui-landing .landing.is-top .index-btn--outline {
    background: var(--wui-brand-ink); border-color: var(--wui-alpha-white-40); color: var(--wui-white);
  }

  /* Profile and mobile controls */
  body[data-page="index"].wui-landing .index-mobile-user { position: relative; }
  
  
  
  
  
  
  
  
  
  
  
  body[data-page="index"].wui-landing .index-mobile-user { display: none; }
  body[data-page="index"].wui-landing .index-mobile-user__button, body[data-page="index"].wui-landing .index-mobile-toggle {
    width: var(--wui-topbar-h);
    min-width: var(--wui-topbar-h);
    height: var(--wui-topbar-h);
    padding: 0;
    border-radius: 0;
  }
  body[data-page="index"].wui-landing .index-mobile-user__button { border: 0; }
  body[data-page="index"].wui-landing .index-mobile-user__button .wui-icon { width: 19px; height: 19px; display: block; }
  body[data-page="index"].wui-landing .index-mobile-toggle { display: none; }
  body[data-page="index"].wui-landing .index-mobile-toggle span { display: block; height: 2px; margin: var(--wui-space-1) 0; background: var(--wui-text-primary); }
  body[data-page="index"].wui-landing .landing.is-top .index-mobile-toggle, body[data-page="index"].wui-landing .landing.is-top .index-mobile-user__button { background: transparent; color: var(--wui-white); }
  body[data-page="index"].wui-landing .landing.is-top .index-mobile-toggle { border-color: var(--wui-alpha-white-35); }
  body[data-page="index"].wui-landing .landing.is-top .index-mobile-toggle:hover, body[data-page="index"].wui-landing .landing.is-top .index-mobile-user__button:hover { background: var(--wui-alpha-white-10); box-shadow: none; }
  body[data-page="index"].wui-landing .landing.is-top .index-mobile-toggle:hover { border-color: var(--wui-alpha-white-35); }
  body[data-page="index"].wui-landing .landing.is-top .index-mobile-toggle span { background: var(--wui-white); }

  /* Hero */
  body[data-page="index"].wui-landing .index-hero { position: relative; min-height: 670px; overflow: hidden; background: var(--wui-brand-ink); color: var(--wui-white); }
  body[data-page="index"].wui-landing .index-hero::after { content: ""; position: absolute; width: 480px; height: 480px; right: -150px; top: -130px; border: 110px solid var(--wui-alpha-primary-12); transform: rotate(25deg); }
  body[data-page="index"].wui-landing .index-hero__inner { position: relative; z-index: var(--wui-z-local); width: min(1440px, calc(100% - 48px)); min-height: 670px; margin: auto; padding-top: var(--wui-topbar-h); display: grid; grid-template-columns: .9fr 1.1fr; gap: var(--wui-space-18); align-items: center; }
  body[data-page="index"].wui-landing .index-hero__eyebrow { margin-bottom: var(--wui-space-5); color: var(--wui-gray-400); font-size: var(--wui-font-xs); font-weight: var(--wui-weight-heavy); letter-spacing: 1.8px; }
  body[data-page="index"].wui-landing .index-hero h1 { max-width: 650px; margin: 0 0 var(--wui-space-6); font-size: var(--wui-font-display-lg); line-height: var(--wui-line-none); }
  body[data-page="index"].wui-landing .index-hero p { max-width: 620px; margin: 0 0 var(--wui-space-9); color: var(--wui-gray-100); font-size: var(--wui-font-xl); line-height: var(--wui-line-loose); }
  body[data-page="index"].wui-landing .index-hero__actions, body[data-page="index"].wui-landing .index-hero__trust { display: flex; flex-wrap: wrap; }
  body[data-page="index"].wui-landing .index-hero__actions { gap: var(--wui-space-3); }
  body[data-page="index"].wui-landing .index-hero__trust { gap: var(--wui-space-7); margin-top: var(--wui-space-10); color: var(--wui-gray-400); font-size: var(--wui-font-xs); }
  body[data-page="index"].wui-landing .index-hero__trust span::before { content: "✓"; margin-right: var(--wui-space-2); }
  body[data-page="index"].wui-landing .wui-landing__hero-preview { min-height: 420px; background: var(--wui-subtle-bg); color: var(--wui-text-primary); border: var(--wui-border-width) solid var(--wui-alpha-white-25); box-shadow: var(--wui-shadow-landing-hero); transform: perspective(1300px) rotateY(-5deg); }
  body[data-page="index"].wui-landing .index-hero-panel__top { height: var(--wui-control-3xl); padding: 0 var(--wui-space-5); display: flex; align-items: center; justify-content: space-between; background: var(--wui-card-bg); border-bottom: var(--wui-line); }
  body[data-page="index"].wui-landing .index-hero-panel__dots { display: flex; gap: var(--wui-space-2); }
  body[data-page="index"].wui-landing .index-hero-panel__dots i { width: 7px; height: 7px; display: block; background: var(--wui-gray-300); }
  body[data-page="index"].wui-landing .index-hero-panel__brand { color: var(--wui-text-primary); font-size: var(--wui-font-xs); font-weight: var(--wui-weight-heavy); }
  body[data-page="index"].wui-landing .index-hero-panel__body { display: grid; grid-template-columns: 105px 1fr; min-height: 362px; }
  body[data-page="index"].wui-landing .index-hero-panel__side { padding: var(--wui-space-4) var(--wui-space-3); background: var(--wui-card-bg); border-right: var(--wui-line); }
  body[data-page="index"].wui-landing .index-hero-panel__side span { display: block; height: 35px; margin-bottom: var(--wui-space-2); background: var(--wui-subtle-bg); }
  body[data-page="index"].wui-landing .index-hero-panel__side span:first-child { background: var(--wui-action-primary-soft); border: var(--wui-border-width) solid var(--wui-action-primary); }
  body[data-page="index"].wui-landing .index-hero-panel__content { padding: var(--wui-space-5); }
  body[data-page="index"].wui-landing .index-hero-panel__title, body[data-page="index"].wui-landing .index-hero-panel__chart { background: var(--wui-card-bg); border: var(--wui-line); }
  body[data-page="index"].wui-landing .index-hero-panel__title { height: 55px; margin-bottom: var(--wui-space-4); padding: var(--wui-space-4); font-weight: var(--wui-weight-heavy); }
  body[data-page="index"].wui-landing .index-hero-panel__cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--wui-space-3); }
  body[data-page="index"].wui-landing .wui-landing__preview-card { height: 82px; padding: var(--wui-space-3); box-shadow: none; }
  body[data-page="index"].wui-landing .wui-landing__preview-card b { display: block; margin-top: var(--wui-space-2); font-size: var(--wui-font-2xl); }
  body[data-page="index"].wui-landing .index-hero-panel__chart { position: relative; height: 165px; margin-top: var(--wui-space-3); overflow: hidden; }
  body[data-page="index"].wui-landing .index-hero-panel__chart::before { content: ""; position: absolute; left: 35px; right: 18px; bottom: 35px; height: 90px; background: linear-gradient(160deg,transparent 0 18%,var(--wui-action-primary) 19% 21%,transparent 22% 36%,var(--wui-action-primary) 37% 39%,transparent 40% 54%,var(--wui-action-primary) 55% 57%,transparent 58% 73%,var(--wui-action-primary) 74% 76%,transparent 77%); }

  /* Content sections */
  body[data-page="index"].wui-landing .index-section { padding: var(--wui-space-23) 0; }
  body[data-page="index"].wui-landing .index-section--soft { background: var(--wui-page-bg); }
  body[data-page="index"].wui-landing .index-section__inner { width: min(1240px, calc(100% - 48px)); margin: auto; }
  body[data-page="index"].wui-landing .index-section__head { max-width: 820px; margin: 0 auto var(--wui-space-13); text-align: center; }
  body[data-page="index"].wui-landing .index-section__head small { color: var(--wui-link-text); font-weight: var(--wui-weight-heavy); letter-spacing: 1.2px; }
  body[data-page="index"].wui-landing .index-section__head h2, body[data-page="index"].wui-landing .index-split h2 { color: var(--wui-text-primary); }
  body[data-page="index"].wui-landing .index-section__head h2 { margin: var(--wui-space-3) 0 var(--wui-space-4); font-size: var(--wui-font-display-md); }
  body[data-page="index"].wui-landing .index-section__head p, body[data-page="index"].wui-landing .index-split p { color: var(--wui-text-tertiary); line-height: var(--wui-line-loose); }
  body[data-page="index"].wui-landing .index-feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: var(--wui-line); border-left: var(--wui-line); }
  body[data-page="index"].wui-landing .wui-landing__feature { min-height: 230px; padding: var(--wui-space-9); border-width: 0 1px 1px 0; box-shadow: none; }
  body[data-page="index"].wui-landing .index-feature-icon { width: 48px; height: 48px; margin-bottom: var(--wui-space-6); display: grid; place-items: center; }
  body[data-page="index"].wui-landing .index-feature-icon .wui-icon { width: 24px; height: 24px; }
  body[data-page="index"].wui-landing .index-feature-card h3 { margin: 0 0 var(--wui-space-3); font-size: var(--wui-font-xl); }
  body[data-page="index"].wui-landing .index-feature-card p { margin: 0; color: var(--wui-text-tertiary); font-size: var(--wui-font-md); line-height: var(--wui-line-relaxed); }
  body[data-page="index"].wui-landing .index-split { display: grid; grid-template-columns: 1fr 1fr; gap: var(--wui-space-18); align-items: center; }
  body[data-page="index"].wui-landing .index-split h2 { margin: 0 0 var(--wui-space-5); font-size: var(--wui-font-display-md); }
  body[data-page="index"].wui-landing .wui-landing__check-list { margin-top: var(--wui-space-7); }
  body[data-page="index"].wui-landing .wui-landing__check-list .wui-list-item {
    justify-content: flex-start;
    gap: var(--wui-space-3);
    min-height: 52px;
    padding: var(--wui-space-3) var(--wui-space-4);
    font-size: var(--wui-font-md);
    font-weight: var(--wui-weight-bold);
  }
  body[data-page="index"].wui-landing .wui-landing__check-list .wui-list-item::before {
    content: "✓";
    flex: 0 0 18px;
    width: 18px;
    margin: 0;
    color: var(--wui-link-text);
    font-size: var(--wui-font-lg);
    line-height: var(--wui-line-none);
    text-align: center;
  }
  body[data-page="index"].wui-landing .wui-landing__panel { padding: var(--wui-space-9); display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--wui-space-3); background: var(--wui-brand-ink); color: var(--wui-white); }
  body[data-page="index"].wui-landing .wui-landing__stat { padding: var(--wui-space-6); background: var(--wui-alpha-white-06); color: var(--wui-white); border-color: var(--wui-alpha-white-11); box-shadow: none; }
  body[data-page="index"].wui-landing .wui-landing__stat strong { display: block; margin-bottom: var(--wui-space-2); font-size: var(--wui-font-display-sm); }
  body[data-page="index"].wui-landing .wui-landing__stat small, body[data-page="index"].wui-landing .wui-landing__panel p { color: var(--wui-gray-400); }
  body[data-page="index"].wui-landing .index-cta { padding: var(--wui-space-15); display: flex; justify-content: space-between; align-items: center; gap: var(--wui-space-8); }
  body[data-page="index"].wui-landing .index-cta h2 { margin: 0 0 var(--wui-space-2); font-size: var(--wui-font-display-sm); }
  body[data-page="index"].wui-landing .index-cta p { margin: 0; }

  /* Footer */
  body[data-page="index"].wui-landing .index-footer { padding: var(--wui-space-14) 0 var(--wui-space-8); background: var(--wui-brand-ink); color: var(--wui-gray-400); }
  body[data-page="index"].wui-landing .index-footer__inner { width: min(1240px, calc(100% - 48px)); margin: auto; display: grid; grid-template-columns: 1.5fr repeat(3, 1fr); gap: var(--wui-space-11); }
  body[data-page="index"].wui-landing .index-footer__inner > div:first-child p { margin-top: var(--wui-space-5); line-height: var(--wui-line-loose); }
  body[data-page="index"].wui-landing .index-footer h3 { margin: 0 0 var(--wui-space-5); color: var(--wui-white); font-size: var(--wui-font-md); }
  body[data-page="index"].wui-landing .index-footer__inner > div:not(:first-child) a { min-height: 32px; display: flex; align-items: center; margin: var(--wui-space-1) 0; color: var(--wui-gray-400); text-decoration: none; font-size: var(--wui-font-sm); }
  body[data-page="index"].wui-landing .index-footer__bottom { width: min(1240px, calc(100% - 48px)); margin: var(--wui-space-9) auto 0; padding-top: var(--wui-space-6); border-top: var(--wui-border-width) solid var(--wui-alpha-white-10); font-size: var(--wui-font-xs); }

  /* Sliding mobile navigation */
  body[data-page="index"].wui-landing .index-mobile-nav { display: block; width: 300px; padding: var(--wui-space-30) var(--wui-space-10) var(--wui-space-8); overflow: auto; background: var(--wui-raised-bg); }
  body[data-page="index"].wui-landing .index-mobile-nav::before { content: "WORKAIBOX"; position: absolute; top: 46px; left: 40px; color: var(--wui-text-primary); font-size: var(--wui-font-xl); font-weight: var(--wui-weight-heavy); letter-spacing: 1.4px; }
  body[data-page="index"].wui-landing .index-mobile-nav a {
    min-height: 52px;
    display: flex;
    align-items: center;
    padding: var(--wui-space-3) var(--wui-space-4);
    color: var(--wui-text-primary);
    border: var(--wui-line);
    border-bottom: 0;
    background: var(--wui-raised-bg);
    font-size: var(--wui-font-md);
    font-weight: var(--wui-weight-heavy);
    text-decoration: none;
  }
  body[data-page="index"].wui-landing .index-mobile-nav a:last-child { border-bottom: var(--wui-line); }
  body[data-page="index"].wui-landing .index-mobile-nav a:hover, body[data-page="index"].wui-landing .index-mobile-nav a:focus-visible, body[data-page="index"].wui-landing .index-mobile-nav a.is-active {
    color: var(--wui-text-primary);
    background: var(--wui-action-primary-soft);
    outline: 0;
  }
  body[data-page="index"].wui-landing.show-mobile-menu { overflow-x: hidden; }

  @media (max-width: 1180px) {
    body[data-page="index"].wui-landing .index-header__inner {
      position: relative;
      grid-template-columns: var(--wui-topbar-h) minmax(0, 1fr) var(--wui-topbar-h);
      width: min(100% - 28px, 1240px);
      gap: var(--wui-space-3);
    }
    body[data-page="index"].wui-landing .index-mobile-toggle { display: block; grid-column: 1; justify-self: start; }
    body[data-page="index"].wui-landing .index-brand { grid-column: 2; justify-self: center; }
    body[data-page="index"].wui-landing .index-mobile-user { display: block; grid-column: 3; justify-self: end; }
    body[data-page="index"].wui-landing .index-nav, body[data-page="index"].wui-landing .index-actions { display: none; }
    body[data-page="index"].wui-landing .index-hero__inner { grid-template-columns: 1fr; padding-block: var(--wui-space-18); padding-top: calc(var(--wui-topbar-h) + var(--wui-space-18)); }
    body[data-page="index"].wui-landing .wui-landing__hero-preview { transform: none; }
    body[data-page="index"].wui-landing .index-feature-grid { grid-template-columns: repeat(2, 1fr); }
  }
  @media (max-width: 820px) {
    body[data-page="index"].wui-landing .landing, body[data-page="index"].wui-landing .index-header__inner { height: var(--wui-topbar-h); }
    body[data-page="index"].wui-landing .index-brand__logo { width: 178px; max-height: calc(var(--wui-topbar-h) - 16px); }
  }
  @media (max-width: 820px) {
    body[data-page="index"].wui-landing .index-header__inner, body[data-page="index"].wui-landing .index-hero__inner, body[data-page="index"].wui-landing .index-section__inner, body[data-page="index"].wui-landing .index-footer__inner, body[data-page="index"].wui-landing .index-footer__bottom { width: min(100% - 28px, 1240px); }
    body[data-page="index"].wui-landing .index-hero { min-height: auto; }
    body[data-page="index"].wui-landing .index-hero__inner { min-height: auto; padding-block: var(--wui-space-16); padding-top: calc(var(--wui-topbar-h) + var(--wui-space-16)); }
    body[data-page="index"].wui-landing .index-hero h1 { font-size: var(--wui-font-display-md); }
    body[data-page="index"].wui-landing .index-hero p { font-size: var(--wui-font-lg); }
    body[data-page="index"].wui-landing .index-hero__trust { display: grid; gap: var(--wui-space-3); }
    body[data-page="index"].wui-landing .wui-landing__hero-preview { display: none; }
    body[data-page="index"].wui-landing .index-feature-grid, body[data-page="index"].wui-landing .index-split, body[data-page="index"].wui-landing .wui-landing__panel { grid-template-columns: 1fr; }
    body[data-page="index"].wui-landing .index-split { gap: var(--wui-space-9); }
    body[data-page="index"].wui-landing .index-section { padding: var(--wui-space-16) 0; }
    body[data-page="index"].wui-landing .index-section__head h2, body[data-page="index"].wui-landing .index-split h2 { font-size: var(--wui-font-display-sm); }
    body[data-page="index"].wui-landing .index-cta { display: block; padding: var(--wui-space-10); }
    body[data-page="index"].wui-landing .index-cta .wui-btn { margin-top: var(--wui-space-6); }
    body[data-page="index"].wui-landing .index-footer__inner { grid-template-columns: 1fr 1fr; }
    body[data-page="index"].wui-landing .index-footer__inner > div:first-child { grid-column: 1 / -1; }
  }
  @media (max-width: 420px) {
    body[data-page="index"].wui-landing .index-brand { position: absolute; left: 50%; transform: translateX(-50%); }
    body[data-page="index"].wui-landing .index-brand__logo { width: 148px; max-height: calc(var(--wui-topbar-h) - 18px); }
  }


/* Guest chat — index only */
body[data-page="index"].wui-landing .index-guest-chat {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: var(--wui-z-toast);
  pointer-events: none;
}
body[data-page="index"].wui-landing .index-guest-chat__launcher, body[data-page="index"].wui-landing .index-guest-chat__panel { pointer-events: auto; }
body[data-page="index"].wui-landing .index-guest-chat__launcher {
  min-width: 58px;
  height: var(--wui-control-3xl);
  padding: 0 var(--wui-space-5);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--wui-space-3);
  border: 1px solid var(--wui-brand-cyan-strong);
  border-radius: var(--wui-radius-round);
  background: var(--wui-brand-cyan);
  color: var(--wui-brand-ink);
  box-shadow: var(--wui-floating-shadow);
  font: inherit;
  font-size: var(--wui-font-sm);
  font-weight: var(--wui-weight-heavy);
  cursor: pointer;
  transition: transform var(--wui-motion-normal) var(--wui-ease-standard), background-color var(--wui-motion-normal) var(--wui-ease-standard), box-shadow var(--wui-motion-normal) var(--wui-ease-standard);
}
body[data-page="index"].wui-landing .index-guest-chat__launcher:hover, body[data-page="index"].wui-landing .index-guest-chat__launcher:focus-visible {
  background: var(--wui-brand-cyan-strong);
  transform: translateY(-2px);
  box-shadow: var(--wui-floating-shadow-hover);
  outline: 0;
}
body[data-page="index"].wui-landing .index-guest-chat__launcher .wui-icon { display: block; }
body[data-page="index"].wui-landing .index-guest-chat__launcher .index-guest-chat__launcher-close { display: none; }
body[data-page="index"].wui-landing .index-guest-chat.is-open .index-guest-chat__launcher-chat { display: none; }
body[data-page="index"].wui-landing .index-guest-chat.is-open .index-guest-chat__launcher .index-guest-chat__launcher-close { display: block; }
body[data-page="index"].wui-landing .index-guest-chat.is-open .index-guest-chat__launcher-label { display: none; }
body[data-page="index"].wui-landing .index-guest-chat.is-open .index-guest-chat__launcher { width: 58px; padding: 0; }

body[data-page="index"].wui-landing .index-guest-chat__panel {
  position: absolute;
  right: 0;
  bottom: 72px;
  width: min(390px, calc(100vw - 32px));
  height: min(600px, calc(100vh - 120px));
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--wui-card-bg);
  border: var(--wui-line);
  box-shadow: var(--wui-overlay-shadow);
  opacity: 0;
  visibility: hidden;
  transform: translateY(16px) scale(.985);
  transform-origin: right bottom;
  transition: opacity var(--wui-motion-normal) var(--wui-ease-standard), transform var(--wui-motion-normal) var(--wui-ease-standard), visibility var(--wui-motion-normal) var(--wui-ease-standard);
}
body[data-page="index"].wui-landing .index-guest-chat.is-open .index-guest-chat__panel {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}
body[data-page="index"].wui-landing .index-guest-chat__header {
  min-height: 68px;
  padding: var(--wui-space-3) var(--wui-space-3) var(--wui-space-3) var(--wui-space-4);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--wui-space-3);
  flex: 0 0 auto;
  background: var(--wui-brand-ink);
  color: var(--wui-white);
  border-bottom: 3px solid var(--wui-brand-cyan);
}
body[data-page="index"].wui-landing .index-guest-chat__identity { min-width: 0; display: flex; align-items: center; gap: var(--wui-space-3); }
body[data-page="index"].wui-landing .index-guest-chat__identity > div { min-width: 0; }
body[data-page="index"].wui-landing .index-guest-chat__identity strong, body[data-page="index"].wui-landing .index-guest-chat__identity small { display: block; }
body[data-page="index"].wui-landing .index-guest-chat__identity strong { font-size: var(--wui-font-lg); line-height: var(--wui-line-heading); }
body[data-page="index"].wui-landing .index-guest-chat__identity small { margin-top: var(--wui-space-1); color: var(--wui-gray-300); font-size: var(--wui-font-xs); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body[data-page="index"].wui-landing .index-guest-chat__brand-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  flex: 0 0 38px;
  background: var(--wui-brand-cyan);
  border-radius: var(--wui-radius-round);
}
body[data-page="index"].wui-landing .index-guest-chat__brand-icon .wui-icon { display: block; }
body[data-page="index"].wui-landing .index-guest-chat__close {
  width: 40px;
  min-width: 40px;
  height: 40px;
  border: 0;
  background: transparent;
}
body[data-page="index"].wui-landing .index-guest-chat__close .wui-icon { filter: none; }
body[data-page="index"].wui-landing .index-guest-chat__close:hover, body[data-page="index"].wui-landing .index-guest-chat__close:focus-visible { background: var(--wui-alpha-white-10); }
body[data-page="index"].wui-landing .index-guest-chat__body { min-height: 0; flex: 1 1 auto; display: flex; }
body[data-page="index"].wui-landing .index-guest-chat__start, body[data-page="index"].wui-landing .index-guest-chat__conversation { width: 100%; min-height: 0; }
body[data-page="index"].wui-landing .index-guest-chat__start {
  padding: var(--wui-space-7) var(--wui-space-6) var(--wui-space-6);
  overflow: auto;
}
body[data-page="index"].wui-landing .index-guest-chat__welcome-icon {
  width: 52px;
  height: 52px;
  margin-bottom: var(--wui-space-5);
  display: grid;
  place-items: center;
  background: var(--wui-action-primary-soft);
  border: 1px solid color-mix(in srgb, var(--wui-brand-cyan) 38%, var(--wui-line-color));
  border-radius: var(--wui-radius-round);
}
body[data-page="index"].wui-landing .index-guest-chat__welcome-icon .wui-icon { display: block; }
body[data-page="index"].wui-landing .index-guest-chat__start h2 { margin: 0 0 var(--wui-space-2); color: var(--wui-text-primary); font-size: var(--wui-font-2xl); }
body[data-page="index"].wui-landing .index-guest-chat__start > p { margin: 0 0 var(--wui-space-6); color: var(--wui-text-tertiary); font-size: var(--wui-font-sm); line-height: var(--wui-line-relaxed); }
body[data-page="index"].wui-landing .index-guest-chat__start-form { display: grid; gap: var(--wui-space-4); }
body[data-page="index"].wui-landing .index-guest-chat__field { display: grid; gap: var(--wui-space-2); color: var(--wui-text-secondary); font-size: var(--wui-font-sm); font-weight: var(--wui-weight-bold); }
body[data-page="index"].wui-landing .index-guest-chat__field > span { display: flex; align-items: center; justify-content: space-between; gap: var(--wui-space-3); }
body[data-page="index"].wui-landing .index-guest-chat__field small { color: var(--wui-text-tertiary); font-size: var(--wui-font-xs); font-weight: var(--wui-weight-regular); }
body[data-page="index"].wui-landing .index-guest-chat__field .wui-input { width: 100%; }
body[data-page="index"].wui-landing .index-guest-chat__form-error { min-height: 16px; margin: calc(-1 * var(--wui-space-1)) 0 0; color: var(--wui-palette-danger); font-size: var(--wui-font-xs); }
body[data-page="index"].wui-landing .index-guest-chat__start-button { width: 100%; min-height: var(--wui-control-lg); display: inline-flex; align-items: center; justify-content: center; gap: var(--wui-space-2); }
body[data-page="index"].wui-landing .index-guest-chat__start-button .wui-icon, body[data-page="index"].wui-landing .index-guest-chat__send .wui-icon { display: block; }

body[data-page="index"].wui-landing .index-guest-chat__conversation { display: flex; flex-direction: column; }
body[data-page="index"].wui-landing .index-guest-chat__conversation[hidden] { display: none; }
body[data-page="index"].wui-landing .index-guest-chat__guest-row {
  min-height: 54px;
  padding: var(--wui-space-2) var(--wui-space-4);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--wui-space-3);
  flex: 0 0 auto;
  background: var(--wui-subtle-bg);
  border-bottom: var(--wui-line);
}
body[data-page="index"].wui-landing .index-guest-chat__guest-row > div { min-width: 0; }
body[data-page="index"].wui-landing .index-guest-chat__guest-row strong, body[data-page="index"].wui-landing .index-guest-chat__guest-label { display: block; }
body[data-page="index"].wui-landing .index-guest-chat__guest-row strong { max-width: 210px; color: var(--wui-text-primary); font-size: var(--wui-font-sm); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body[data-page="index"].wui-landing .index-guest-chat__guest-label { margin-bottom: var(--wui-space-1); color: var(--wui-text-tertiary); font-size: var(--wui-font-xs); }
body[data-page="index"].wui-landing .index-guest-chat__restart { padding: var(--wui-space-1) 0; border: 0; background: transparent; color: var(--wui-link-text); font: inherit; font-size: var(--wui-font-xs); font-weight: var(--wui-weight-bold); cursor: pointer; }
body[data-page="index"].wui-landing .index-guest-chat__restart:hover, body[data-page="index"].wui-landing .index-guest-chat__restart:focus-visible { text-decoration: underline; outline: 0; }
body[data-page="index"].wui-landing .index-guest-chat__messages {
  min-height: 0;
  padding: var(--wui-space-5) var(--wui-space-4);
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: var(--wui-space-3);
  overflow-y: auto;
  overscroll-behavior: contain;
  background: var(--wui-page-bg);
}
body[data-page="index"].wui-landing .index-guest-chat__message { max-width: 82%; font-size: var(--wui-font-sm); line-height: var(--wui-line-normal); }
body[data-page="index"].wui-landing .index-guest-chat__message p { margin: 0; padding: var(--wui-space-3) var(--wui-space-3); border: var(--wui-line); background: var(--wui-card-bg); color: var(--wui-text-primary); overflow-wrap: anywhere; }
body[data-page="index"].wui-landing .index-guest-chat__message span { display: block; margin-top: var(--wui-space-1); color: var(--wui-text-tertiary); font-size: var(--wui-font-xs); }
body[data-page="index"].wui-landing .index-guest-chat__message--outgoing { align-self: flex-end; text-align: right; }
body[data-page="index"].wui-landing .index-guest-chat__message--outgoing p { background: var(--wui-action-primary-soft); border-color: color-mix(in srgb, var(--wui-brand-cyan) 45%, var(--wui-line-color)); text-align: left; }
body[data-page="index"].wui-landing .index-guest-chat__message--incoming { align-self: flex-start; }
body[data-page="index"].wui-landing .index-guest-chat__composer {
  min-height: var(--wui-control-3xl);
  padding: var(--wui-space-2) var(--wui-space-3);
  display: grid;
  grid-template-columns: minmax(0, 1fr) 42px;
  gap: var(--wui-space-2);
  align-items: end;
  flex: 0 0 auto;
  background: var(--wui-card-bg);
  border-top: var(--wui-line);
}
body[data-page="index"].wui-landing .index-guest-chat__composer-input {
  min-height: var(--wui-control-md);
  display: flex;
  align-items: center;
  border: var(--wui-line);
  background: var(--wui-input-bg, var(--wui-card-bg));
}
body[data-page="index"].wui-landing .index-guest-chat__composer-input:focus-within { border-color: var(--wui-control-border-focus); box-shadow: var(--wui-shadow-control-focus); }
body[data-page="index"].wui-landing .index-guest-chat__composer textarea {
  width: 100%;
  max-height: 112px;
  min-height: var(--wui-control-sm);
  padding: var(--wui-space-3) var(--wui-space-3);
  resize: none;
  overflow-y: auto;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--wui-text-primary);
  font: inherit;
  font-size: var(--wui-font-sm);
  line-height: var(--wui-line-normal);
}
body[data-page="index"].wui-landing .index-guest-chat__composer textarea::placeholder { color: var(--wui-text-tertiary); }
body[data-page="index"].wui-landing .index-guest-chat__send {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 1px solid var(--wui-brand-cyan-strong);
  background: var(--wui-brand-cyan);
  cursor: pointer;
}
body[data-page="index"].wui-landing .index-guest-chat__send:hover, body[data-page="index"].wui-landing .index-guest-chat__send:focus-visible { background: var(--wui-brand-cyan-strong); outline: 0; }
body[data-page="index"].wui-landing .index-guest-chat__composer-note {
  padding: 0 var(--wui-space-3) var(--wui-space-2);
  flex: 0 0 auto;
  background: var(--wui-card-bg);
  color: var(--wui-text-tertiary);
  font-size: var(--wui-font-2xs);
  line-height: var(--wui-line-compact);
}

@media (max-width: 540px) {
  body[data-page="index"].wui-landing .index-guest-chat { right: 12px; bottom: 12px; }
  body[data-page="index"].wui-landing .index-guest-chat__launcher { width: 56px; min-width: 56px; height: var(--wui-control-2xl); padding: 0; }
  body[data-page="index"].wui-landing .index-guest-chat__launcher-label { display: none; }
  body[data-page="index"].wui-landing .index-guest-chat__panel {
    bottom: 68px;
    width: calc(100vw - 24px);
    height: min(620px, calc(100dvh - 100px));
  }
  body[data-page="index"].wui-landing .index-guest-chat__start { padding: var(--wui-space-6) var(--wui-space-5) var(--wui-space-5); }
}

@media (prefers-reduced-motion: reduce) {
  body[data-page="index"].wui-landing .index-guest-chat__launcher, body[data-page="index"].wui-landing .index-guest-chat__panel { transition: none; }
}