
  html, body { max-width: 100%; overflow-x: clip; }
  .official-site {
    --official-ink: #1d1d1f;
    --official-copy: #46545b;
    --official-muted: #65747b;
    --official-blue: #2477d4;
    --official-blue-hover: #155da9;
    --official-aqua: #0a8795;
    --official-aqua-dark: #096775;
    --official-violet: #7868d8;
    --official-coral: #e87350;
    --official-mint: #2b9b7c;
    --official-blue-soft: #edf6fb;
    --official-line: #dce5e8;
    --official-soft: #f4f9f8;
    --official-white: #ffffff;
    width: 100%;
    max-width: 100vw;
    min-height: 100dvh;
    overflow-x: clip;
    color: var(--official-ink);
    background: #fcfefe;
  }
  .official-site *, .official-site *::before, .official-site *::after { box-sizing: border-box; }
  .official-wrap { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }
  .official-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
  .official-skip-link {
    position: fixed;
    top: 8px;
    left: 8px;
    z-index: 50;
    padding: 10px 14px;
    border-radius: 10px;
    background: var(--official-ink);
    color: #fff;
    transform: translateY(-160%);
  }
  .official-skip-link:focus { transform: translateY(0); }
  .official-site a:focus-visible,
  .official-site button:focus-visible,
  .official-site summary:focus-visible {
    outline: 3px solid rgb(29 29 31 / .24);
    outline-offset: 3px;
  }
  .official-header {
    position: sticky;
    top: 0;
    z-index: 20;
    padding: 10px 0 8px;
    pointer-events: none;
  }
  .official-header::after {
    content: "";
    position: absolute;
    inset: 0 0 -16px;
    z-index: 0;
    background: linear-gradient(to bottom, rgb(246 252 252 / .9), rgb(255 255 255 / 0));
    pointer-events: none;
  }
  .official-nav {
    position: relative;
    min-height: 60px;
    padding: 7px 8px 7px 14px;
    display: flex;
    align-items: center;
    gap: 14px;
    border: 1px solid rgb(255 255 255 / .76);
    border-radius: 18px;
    background: rgb(241 249 250 / .76);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .98), inset 0 -1px 0 rgb(27 99 111 / .08), 0 12px 36px rgb(28 87 96 / .09);
    -webkit-backdrop-filter: blur(24px) saturate(180%);
    backdrop-filter: blur(24px) saturate(180%);
    pointer-events: auto;
    view-transition-name: official-nav;
    transition: min-height .34s cubic-bezier(.16,1,.3,1), background-color .34s ease, border-color .34s ease, box-shadow .34s ease;
  }
  .official-site[data-scrolled] .official-nav {
    min-height: 56px;
    border-color: rgb(255 255 255 / .9);
    background: rgb(247 251 252 / .84);
    box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgb(27 99 111 / .08), 0 16px 44px rgb(28 87 96 / .13);
  }
  .official-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--official-ink);
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -.02em;
    white-space: nowrap;
  }
  .official-mark {
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
    overflow: hidden;
    border-radius: 11px;
    background: #fff;
    view-transition-name: official-logo;
  }
  .official-mark img { width: 100%; height: 100%; display: block; object-fit: cover; }
  .official-links {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 2px;
    color: #5f5f64;
    font-size: 13px;
    font-weight: 680;
    white-space: nowrap;
  }
  .official-nav-link {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    padding: 0 12px;
    border-radius: 999px;
    transition: color .22s cubic-bezier(.16,1,.3,1), background-color .22s cubic-bezier(.16,1,.3,1);
  }
  .official-nav-link:hover { color: var(--official-ink); background: rgb(255 255 255 / .72); }
  .official-nav-link[aria-current="page"] { color: var(--official-ink); background: #fff; }
  .official-button {
    position: relative;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    overflow: hidden;
    border: 1px solid rgb(210 210 215 / .88);
    border-radius: 999px;
    padding: 10px 18px;
    background: rgb(255 255 255 / .62);
    color: var(--official-ink);
    font-size: 14px;
    font-weight: 760;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    transform: translate3d(var(--button-x, 0), var(--button-y, 0), 0) scale(1);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .96), inset 0 -1px 0 rgb(0 0 0 / .04), 0 8px 24px rgb(0 0 0 / .07);
    -webkit-backdrop-filter: blur(18px) saturate(180%);
    backdrop-filter: blur(18px) saturate(180%);
    transition: transform .26s cubic-bezier(.16,1,.3,1), border-color .2s ease, background-color .2s ease, color .2s ease, box-shadow .26s cubic-bezier(.16,1,.3,1);
  }
  .official-button::before {
    content: "";
    position: absolute;
    inset: 1px 5px auto;
    height: 46%;
    border-radius: inherit;
    background: linear-gradient(to bottom, rgb(255 255 255 / .72), rgb(255 255 255 / 0));
    pointer-events: none;
  }
  .official-button::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: radial-gradient(circle at var(--button-glare-x, 50%) var(--button-glare-y, 50%), rgb(255 255 255 / .72), rgb(255 255 255 / 0) 44%);
    opacity: 0;
    pointer-events: none;
    transition: opacity .24s ease;
  }
  .official-button > span { position: relative; z-index: 1; }
  .official-button:hover { border-color: rgb(174 174 178 / .86); background: rgb(255 255 255 / .84); transform: translate3d(var(--button-x, 0), calc(var(--button-y, 0) - 1px), 0) scale(1.01); box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgb(0 0 0 / .05), 0 10px 28px rgb(0 0 0 / .1); }
  .official-button:hover::after { opacity: .72; }
  .official-button:active { transform: translate3d(0, 0, 0) scale(.975); transition-duration: .08s; }
  .official-button-arrow { transition: transform .28s cubic-bezier(.16,1,.3,1); }
  .official-button:hover .official-button-arrow { transform: translateX(3px); }
  .official-button.primary { border-color: rgb(255 255 255 / .28); background: rgb(9 103 117 / .92); color: #fff; box-shadow: inset 0 1px 0 rgb(255 255 255 / .34), inset 0 -1px 0 rgb(4 70 82 / .32), 0 10px 26px rgb(8 103 117 / .24); }
  .official-button.primary:hover { border-color: rgb(255 255 255 / .34); background: rgb(6 86 100 / .96); box-shadow: inset 0 1px 0 rgb(255 255 255 / .28), inset 0 -1px 0 rgb(4 61 71 / .34), 0 14px 34px rgb(8 103 117 / .3); }
  .official-header .official-button { min-height: 42px; padding-inline: 16px; }
  .official-mobile-menu { display: none; margin-left: auto; }
  .official-mobile-menu summary {
    min-width: 44px;
    min-height: 44px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 999px;
    background: #fff;
    color: var(--official-ink);
    font-size: 13px;
    font-weight: 760;
    cursor: pointer;
    list-style: none;
  }
  .official-mobile-menu summary::-webkit-details-marker { display: none; }
  .official-mobile-panel {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    padding: 10px;
    display: grid;
    gap: 2px;
    border: 1px solid rgb(255 255 255 / .8);
    border-radius: 16px;
    background: rgb(248 250 252 / .94);
    box-shadow: inset 0 1px 0 #fff;
    -webkit-backdrop-filter: blur(24px) saturate(170%);
    backdrop-filter: blur(24px) saturate(170%);
  }
  .official-mobile-panel a {
    min-height: 44px;
    display: flex;
    align-items: center;
    padding: 0 12px;
    border-radius: 10px;
    color: var(--official-copy);
    font-size: 14px;
    font-weight: 680;
  }
  .official-mobile-panel a:hover,
  .official-mobile-panel a[aria-current="page"] { background: #fff; color: var(--official-ink); }
  .official-actions { margin-top: 30px; display: flex; flex-wrap: wrap; gap: 10px; }
  .official-actions .official-button { min-height: 50px; padding-inline: 22px; }
  .official-status {
    width: fit-content;
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    padding: 0 12px;
    margin: 0 0 22px;
    border: 1px solid rgb(210 210 215 / .78);
    border-radius: 999px;
    background: rgb(236 249 247 / .78);
    color: var(--official-aqua-dark);
    font-size: 12px;
    font-weight: 760;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .94), 0 8px 24px rgb(0 0 0 / .04);
    -webkit-backdrop-filter: blur(16px) saturate(150%);
    backdrop-filter: blur(16px) saturate(150%);
  }
  .official-home-hero,
  .official-page-hero {
    position: relative;
    min-height: calc(100dvh - 78px);
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(440px, 1.1fr);
    align-items: center;
    gap: clamp(48px, 8vw, 104px);
    padding-top: clamp(52px, 7vw, 88px);
    padding-bottom: clamp(68px, 8vw, 104px);
  }
  .official-home-hero::before,
  .official-home-hero::after {
    content: "";
    position: absolute;
    z-index: -1;
    border-radius: 50%;
    filter: blur(8px);
    pointer-events: none;
  }
  .official-home-hero::before {
    width: min(540px, 46vw);
    aspect-ratio: 1;
    right: -10%;
    top: 8%;
    background: radial-gradient(circle, rgb(75 185 196 / .2), rgb(75 185 196 / 0) 69%);
  }
  .official-home-hero::after {
    width: min(360px, 34vw);
    aspect-ratio: 1;
    left: -16%;
    bottom: -4%;
    background: radial-gradient(circle, rgb(240 157 111 / .16), rgb(240 157 111 / 0) 70%);
  }
  .official-page-hero::before {
    content: "";
    position: absolute;
    z-index: 0;
    width: min(760px, 72vw);
    aspect-ratio: 1;
    right: -24vw;
    top: -18%;
    border-radius: 50%;
    background: radial-gradient(circle, rgb(210 214 222 / .36) 0%, rgb(239 241 244 / .2) 38%, rgb(255 255 255 / 0) 72%);
    filter: blur(12px);
    pointer-events: none;
  }
  .official-page-hero > * { position: relative; z-index: 1; }
  .official-page-hero { min-height: min(760px, calc(100dvh - 78px)); }
  .official-home-hero h1,
  .official-page-hero h1 {
    max-width: 720px;
    margin: 0;
    color: var(--official-ink);
    font-size: clamp(44px, 5vw, 76px);
    line-height: 1.05;
    letter-spacing: -.038em;
    text-wrap: balance;
  }
  .official-home-hero h1 { font-size: clamp(44px, 4.4vw, 64px); }
  .official-page-hero h1 { font-size: clamp(42px, 4.7vw, 68px); }
  .official-lead {
    max-width: 38em;
    margin: 24px 0 0;
    color: var(--official-copy);
    font-size: 18px;
    line-height: 1.72;
    text-wrap: pretty;
  }
  .official-hero-facts {
    margin-top: 26px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px 22px;
    color: var(--official-muted);
    font-size: 13px;
    line-height: 1.5;
  }
  .official-hero-facts span { display: inline-flex; align-items: center; gap: 8px; }
  .official-hero-facts span::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--official-ink); opacity: .62; }
  .official-home-routes {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 1.3fr repeat(3, 1fr);
    margin-top: -32px;
    margin-bottom: 32px;
    overflow: hidden;
    border: 1px solid rgb(255 255 255 / .9);
    border-radius: 22px;
    background: rgb(246 251 251 / .76);
    box-shadow: inset 0 1px 0 #fff, 0 24px 58px rgb(28 91 99 / .1);
    -webkit-backdrop-filter: blur(26px) saturate(170%);
    backdrop-filter: blur(26px) saturate(170%);
  }
  .official-home-route {
    min-height: 108px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 18px;
    padding: 20px 22px;
    color: var(--official-copy);
    transition: color .25s ease, background-color .25s ease, transform .3s cubic-bezier(.16,1,.3,1);
  }
  .official-home-route + .official-home-route { border-left: 1px solid rgb(210 210 215 / .72); }
  .official-home-route:hover { color: var(--official-ink); background: rgb(255 255 255 / .76); transform: translateY(-2px); }
  .official-home-route:nth-child(1) { background: rgb(228 245 250 / .62); }
  .official-home-route:nth-child(2) { background: rgb(230 248 241 / .6); }
  .official-home-route:nth-child(3) { background: rgb(244 237 252 / .62); }
  .official-home-route:nth-child(4) { background: rgb(255 239 229 / .62); }
  .official-home-route strong { color: var(--official-ink); font-size: 15px; }
  .official-home-route span { display: flex; align-items: center; justify-content: space-between; gap: 16px; font-size: 12px; line-height: 1.5; }
  .official-home-route span::after { content: "→"; color: var(--official-ink); font-size: 17px; transition: transform .28s cubic-bezier(.16,1,.3,1); }
  .official-home-route:hover span::after { transform: translateX(4px); }
  .official-home-route.current span::before,
  .official-home-route.future span::before {
    width: 6px;
    height: 6px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: var(--official-aqua);
    content: "";
  }
  .official-home-route.current span,
  .official-home-route.future span { justify-content: flex-start; }
  .official-home-route.current span::after,
  .official-home-route.future span::after { margin-left: auto; }
  .official-motion-story {
    --story-progress: 0;
    min-height: 224vh;
    margin-top: 10px;
  }
  .official-motion-stage {
    position: sticky;
    top: 88px;
    min-height: min(720px, calc(100vh - 108px));
    display: grid;
    grid-template-columns: minmax(260px, .62fr) minmax(0, 1.38fr);
    gap: clamp(28px, 5vw, 76px);
    align-items: center;
    overflow: hidden;
    padding: clamp(28px, 4.6vw, 58px);
    border: 1px solid rgb(255 255 255 / .94);
    border-radius: 32px;
    background: linear-gradient(145deg, #eef8fa, #f5f1fb 56%, #fff3eb);
    box-shadow: inset 0 1px 0 #fff, 0 36px 100px rgb(34 75 85 / .14);
  }
  .official-motion-stage::before {
    content: "";
    position: absolute;
    width: 520px;
    height: 520px;
    right: -180px;
    top: -240px;
    border-radius: 50%;
    background: rgb(255 255 255 / .7);
    pointer-events: none;
  }
  .official-motion-copy { position: relative; z-index: 2; }
  .official-motion-kicker { margin: 0 0 22px; color: var(--official-aqua-dark); font-size: 12px; font-weight: 790; letter-spacing: .08em; }
  .official-motion-steps { display: grid; gap: 8px; }
  .official-motion-step {
    position: relative;
    width: 100%;
    padding: 18px 18px 18px 52px;
    border: 0;
    border-radius: 18px;
    background: transparent;
    color: var(--official-muted);
    text-align: left;
    cursor: pointer;
    transition: color .32s ease, background-color .32s ease, transform .36s cubic-bezier(.16,1,.3,1);
  }
  .official-motion-step::before {
    content: attr(data-step-label);
    position: absolute;
    left: 16px;
    top: 19px;
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    border: 1px solid rgb(100 116 123 / .24);
    border-radius: 50%;
    font-size: 10px;
    font-weight: 780;
  }
  .official-motion-step strong { display: block; color: currentColor; font-size: 17px; }
  .official-motion-step span { display: block; margin-top: 6px; font-size: 13px; line-height: 1.55; }
  .official-motion-step[aria-current="step"] { background: rgb(255 255 255 / .72); color: var(--official-ink); transform: translateX(5px); box-shadow: inset 0 1px 0 #fff, 0 12px 30px rgb(53 67 77 / .08); }
  .official-motion-step[aria-current="step"]::before { border-color: transparent; background: var(--official-aqua); color: #fff; }
  .official-motion-progress { height: 3px; margin: 24px 18px 0 52px; overflow: hidden; border-radius: 999px; background: rgb(106 119 125 / .13); }
  .official-motion-progress i { width: 100%; height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg, var(--official-aqua), var(--official-violet), var(--official-coral)); transform: scaleX(var(--story-progress)); transform-origin: left; }
  .official-motion-hint { margin: 12px 18px 0 52px; color: var(--official-muted); font-size: 11px; }
  .official-motion-canvas {
    position: relative;
    z-index: 1;
    min-height: 548px;
    margin: 0;
    overflow: hidden;
    border: 1px solid rgb(255 255 255 / .96);
    border-radius: 27px;
    background: rgb(255 255 255 / .68);
    box-shadow: inset 0 1px 0 #fff, 0 28px 70px rgb(37 69 80 / .14);
    -webkit-backdrop-filter: blur(24px) saturate(150%);
    backdrop-filter: blur(24px) saturate(150%);
  }
  .official-motion-canvas-head { min-height: 58px; display: flex; align-items: center; gap: 12px; padding: 0 18px; border-bottom: 1px solid rgb(193 209 214 / .6); background: rgb(255 255 255 / .64); }
  .official-motion-canvas-head img { width: 30px; height: 30px; border-radius: 9px; object-fit: cover; }
  .official-motion-canvas-head strong { font-size: 13px; }
  .official-motion-canvas-head span { margin-left: auto; color: var(--official-muted); font-size: 10px; }
  .official-motion-canvas-body { position: relative; min-height: 444px; padding: 24px; }
  .official-motion-layer { position: absolute; transition: opacity .58s ease, transform .7s cubic-bezier(.16,1,.3,1), box-shadow .58s ease; }
  .official-motion-customer { top: 30px; left: 24px; width: min(78%, 430px); padding: 20px; border-radius: 20px 20px 20px 7px; background: #fff; box-shadow: 0 18px 44px rgb(44 79 88 / .11); }
  .official-motion-layer-label { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 10px; color: var(--official-muted); font-size: 10px; }
  .official-motion-customer p, .official-motion-reply p { margin: 0; color: #2b353a; font-size: 15px; line-height: 1.65; }
  .official-motion-translation-card { top: 198px; left: 62px; width: min(74%, 410px); padding: 18px 20px; border: 1px solid rgb(255 255 255 / .92); border-radius: 18px; background: rgb(232 247 246 / .92); box-shadow: 0 20px 48px rgb(16 111 116 / .12); }
  .official-motion-translation-card strong { display: block; color: #0b6874; font-size: 17px; line-height: 1.6; }
  .official-motion-translation-card span { display: block; margin-bottom: 8px; color: var(--official-muted); font-size: 10px; }
  .official-motion-reply { right: 24px; bottom: 28px; width: min(82%, 450px); padding: 20px; border-radius: 20px 20px 7px; background: linear-gradient(145deg, #f0ecfb, #fff); box-shadow: 0 22px 52px rgb(86 67 133 / .14); }
  .official-motion-reply strong { display: block; margin-top: 13px; padding-top: 13px; border-top: 1px solid rgb(120 104 216 / .2); color: #554a93; font-size: 15px; line-height: 1.6; }
  .official-motion-ready[data-motion-scene="0"] .official-motion-translation-card,
  .official-motion-ready[data-motion-scene="0"] .official-motion-reply,
  .official-motion-ready[data-motion-scene="1"] .official-motion-reply { opacity: 0; transform: translate3d(0, 28px, 0) scale(.97); pointer-events: none; }
  .official-motion-ready[data-motion-scene="1"] .official-motion-customer,
  .official-motion-ready[data-motion-scene="2"] .official-motion-customer { transform: translate3d(-8px, -8px, 0) scale(.97); box-shadow: 0 12px 32px rgb(44 79 88 / .08); }
  .official-motion-ready[data-motion-scene="2"] .official-motion-translation-card { transform: translate3d(-12px, -8px, 0) scale(.97); }
  .official-motion-caption { min-height: 46px; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 0 20px; border-top: 1px solid rgb(193 209 214 / .6); color: var(--official-muted); font-size: 10px; }
  .official-motion-caption strong { color: var(--official-aqua-dark); }
  .official-showcase-head { display: grid; grid-template-columns: minmax(0, .72fr) minmax(280px, 1.28fr); align-items: end; gap: 48px; margin-bottom: 42px; }
  .official-showcase-head h2 { margin: 0; font-size: clamp(36px, 4.4vw, 58px); line-height: 1.08; letter-spacing: -.036em; text-wrap: balance; }
  .official-showcase-head p { max-width: 55ch; margin: 0; color: var(--official-copy); font-size: 16px; line-height: 1.75; }
  .official-future-wall { display: grid; grid-template-columns: 1.1fr .9fr; gap: 18px; }
  .official-future-wall-main,
  .official-future-wall-grid figure {
    position: relative;
    overflow: hidden;
    margin: 0;
    border: 1px solid rgb(255 255 255 / .92);
    border-radius: 28px;
    box-shadow: inset 0 1px 0 #fff, 0 24px 64px rgb(87 65 40 / .1);
  }
  .official-future-wall-main { min-height: 590px; display: grid; grid-template-columns: 1fr .72fr; align-items: center; padding: clamp(32px, 5vw, 58px); background: #fff0e8; }
  .official-future-wall-main h2 { max-width: 12ch; margin: 0; font-size: clamp(37px, 4.5vw, 58px); line-height: 1.07; letter-spacing: -.036em; }
  .official-future-wall-main p { max-width: 42ch; margin: 18px 0 0; color: #684c40; line-height: 1.72; }
  .official-future-wall-main img { width: min(300px, 100%); align-self: end; justify-self: center; filter: drop-shadow(0 20px 16px rgb(91 56 37 / .17)); animation: official-float 5s ease-in-out infinite; }
  .official-future-wall-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
  .official-future-wall-grid figure { min-height: 285px; display: grid; align-content: end; justify-items: center; padding: 24px 18px 18px; background: #f0edfb; }
  .official-future-wall-grid figure:nth-child(2) { background: #e9f6fb; }
  .official-future-wall-grid figure:nth-child(3) { background: #eaf8f2; }
  .official-future-wall-grid figure:nth-child(4) { background: #fff3e8; }
  .official-future-wall-grid img { width: min(150px, 80%); max-height: 190px; object-fit: contain; filter: drop-shadow(0 14px 12px rgb(39 54 60 / .12)); }
  .official-future-wall[data-parallax-wall] [data-parallax-item] { transform: translate3d(0, var(--future-y, 0), 0); transition: transform .12s linear; will-change: transform; }
  .official-future-wall[data-parallax-wall] .official-future-wall-main img { animation: none; }
  .official-future-wall-grid figcaption { width: 100%; margin-top: 14px; display: flex; justify-content: space-between; gap: 12px; color: var(--official-copy); font-size: 12px; }
  .official-future-wall-grid figcaption span { color: var(--official-muted); }
  .official-product-story {
    position: relative;
    overflow: hidden;
    padding: clamp(26px, 4vw, 42px);
    border: 1px solid rgb(255 255 255 / .88);
    border-radius: 28px;
    background: linear-gradient(145deg, rgb(255 255 255 / .88), rgb(246 244 248 / .74));
    box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgb(0 0 0 / .04), 0 28px 70px rgb(45 39 58 / .12);
    -webkit-backdrop-filter: blur(28px) saturate(150%);
    backdrop-filter: blur(28px) saturate(150%);
  }
  .official-product-story::before {
    content: "";
    position: absolute;
    width: 220px;
    height: 220px;
    right: -82px;
    top: -106px;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 35%, rgb(255 255 255 / .94), rgb(205 209 217 / .34) 42%, rgb(255 255 255 / 0) 72%);
    pointer-events: none;
  }
  .official-product-story-head { display: flex; align-items: center; gap: 14px; margin-bottom: 34px; }
  .official-product-story-head img { width: 54px; height: 54px; border-radius: 15px; object-fit: cover; }
  .official-product-story-head strong { display: block; font-size: 19px; }
  .official-product-story-head span { display: block; margin-top: 4px; color: var(--official-muted); font-size: 13px; }
  .official-product-platforms {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: -10px 0 26px;
    padding: 10px 12px;
    border: 1px solid rgb(255 255 255 / .86);
    border-radius: 16px;
    background: rgb(255 255 255 / .48);
    box-shadow: inset 0 1px 0 #fff;
  }
  .official-product-platforms img { width: 28px; height: 28px; object-fit: contain; filter: saturate(.88); }
  .official-product-platforms span { margin-left: auto; color: var(--official-muted); font-size: 11px; font-weight: 720; }
  .official-product-story ol { margin: 0; padding: 0; list-style: none; }
  .official-product-story li {
    position: relative;
    display: grid;
    grid-template-columns: 28px 150px 1fr;
    gap: 14px;
    padding: 18px 0;
    border-top: 1px solid rgb(148 163 184 / .34);
  }
  .official-product-story li b { color: #65656a; font-size: 13px; }
  .official-product-story li strong { font-size: 15px; }
  .official-product-story li span { color: var(--official-copy); font-size: 14px; line-height: 1.6; }
  .official-section { padding-top: clamp(76px, 9vw, 124px); padding-bottom: clamp(76px, 9vw, 124px); }
  .official-section.soft { background: var(--official-soft); }
  .official-section.blue-soft { background: var(--official-blue-soft); }
  .official-section-head { max-width: 720px; margin-bottom: 44px; }
  .official-section-head h2 {
    margin: 0;
    font-size: clamp(34px, 4vw, 52px);
    line-height: 1.12;
    letter-spacing: -.032em;
    text-wrap: balance;
  }
  .official-section-head p { max-width: 64ch; margin: 18px 0 0; color: var(--official-copy); font-size: 17px; line-height: 1.75; }
  .official-link-rows { border-top: 1px solid #cbd5e1; }
  .official-link-row {
    min-height: 170px;
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr) auto;
    align-items: center;
    gap: clamp(28px, 5vw, 72px);
    padding: 28px 0;
    border-bottom: 1px solid var(--official-line);
    transition: padding .32s cubic-bezier(.16,1,.3,1), color .2s ease;
  }
  .official-link-row:hover { padding-inline: 14px; color: var(--official-blue-hover); }
  .official-link-row > span:first-child { color: var(--official-muted); font-size: 14px; font-weight: 720; }
  .official-link-row h3 { margin: 0 0 9px; color: var(--official-ink); font-size: clamp(23px, 2.6vw, 34px); letter-spacing: -.025em; }
  .official-link-row p { max-width: 58ch; margin: 0; color: var(--official-copy); line-height: 1.7; }
  .official-link-row > span:last-child { font-size: 26px; transition: transform .3s cubic-bezier(.16,1,.3,1); }
  .official-link-row:hover > span:last-child { transform: translateX(6px); }
  .official-comparison { border-top: 1px solid #d2d2d7; }
  .official-comparison-row {
    display: grid;
    grid-template-columns: 190px minmax(0, .85fr) minmax(0, 1.15fr);
    gap: clamp(24px, 4vw, 56px);
    padding: 28px 0;
    border-bottom: 1px solid var(--official-line);
  }
  .official-comparison-row:first-child { padding-block: 14px; color: var(--official-muted); font-size: 12px; font-weight: 760; }
  .official-comparison-row > strong { font-size: 16px; line-height: 1.5; }
  .official-comparison-row > div { color: var(--official-copy); line-height: 1.72; }
  .official-comparison-row > div strong { display: block; margin-bottom: 6px; color: var(--official-ink); font-size: 14px; }
  .official-comparison-state { display: inline-block; margin-bottom: 9px; color: var(--official-muted); font-size: 11px; font-weight: 780; letter-spacing: .04em; }
  .official-comparison-note { max-width: 72ch; margin: 22px 0 0; color: var(--official-muted); font-size: 13px; line-height: 1.7; }
  .official-feature-explorer {
    display: grid;
    grid-template-columns: minmax(270px, .58fr) minmax(0, 1.42fr);
    overflow: hidden;
    border-top: 1px solid #d2d2d7;
    border-bottom: 1px solid #d2d2d7;
    background: rgb(255 255 255 / .52);
  }
  .official-feature-tabs { padding: 10px 0; border-right: 1px solid var(--official-line); }
  .official-feature-tab {
    width: 100%;
    min-height: 92px;
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    padding: 18px 22px;
    border: 0;
    border-bottom: 1px solid var(--official-line);
    background: transparent;
    color: var(--official-copy);
    text-align: left;
    cursor: pointer;
    transition: background-color .25s ease, color .25s ease, padding .32s cubic-bezier(.16,1,.3,1);
  }
  .official-feature-tab:last-child { border-bottom: 0; }
  .official-feature-tab:hover { padding-left: 26px; color: var(--official-ink); }
  .official-feature-tab[aria-selected="true"] { background: rgb(229 247 247 / .88); color: var(--official-aqua-dark); box-shadow: inset 3px 0 0 var(--official-aqua); }
  .official-feature-tab > span { padding-top: 2px; color: var(--official-muted); font-size: 12px; font-weight: 760; }
  .official-feature-tab strong { display: block; font-size: 16px; }
  .official-feature-tab small { display: block; margin-top: 6px; color: var(--official-muted); font-size: 12px; line-height: 1.45; }
  .official-feature-stage {
    min-height: 480px;
    display: grid;
    align-items: center;
    padding: clamp(34px, 6vw, 70px);
    background: radial-gradient(circle at 82% 12%, rgb(255 255 255 / .98), rgb(235 248 248 / .84) 48%, rgb(236 240 252 / .84));
  }
  .official-feature-panel[hidden] { display: none; }
  .official-feature-panel { animation: official-panel-in .45s cubic-bezier(.16,1,.3,1); }
  .official-feature-panel > span { color: var(--official-muted); font-size: 12px; font-weight: 760; letter-spacing: .04em; }
  .official-feature-panel h3 { max-width: 15ch; margin: 14px 0 0; font-size: clamp(30px, 4vw, 50px); line-height: 1.08; letter-spacing: -.035em; }
  .official-feature-panel > p { max-width: 54ch; margin: 18px 0 0; color: var(--official-copy); font-size: 16px; line-height: 1.75; }
  .official-flow-proof {
    margin-top: 34px;
    padding: 20px 22px;
    border: 1px solid rgb(255 255 255 / .82);
    border-radius: 18px;
    background: rgb(255 255 255 / .58);
    box-shadow: inset 0 1px 0 #fff, 0 16px 38px rgb(0 0 0 / .06);
    -webkit-backdrop-filter: blur(18px) saturate(160%);
    backdrop-filter: blur(18px) saturate(160%);
  }
  .official-flow-proof strong { display: block; font-size: 14px; }
  .official-flow-proof p { margin: 8px 0 0; color: var(--official-copy); font-size: 14px; line-height: 1.65; }
  .official-platform-line { display: flex; flex-wrap: wrap; gap: 10px 20px; margin-top: 28px; color: var(--official-copy); font-size: 14px; font-weight: 720; }
  .official-platform-line span { position: relative; }
  .official-platform-line span + span::before { content: "·"; position: absolute; left: -13px; color: #aeaeb2; }
  .official-future-teaser {
    min-height: 360px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(240px, .58fr);
    align-items: center;
    gap: clamp(32px, 6vw, 72px);
    overflow: hidden;
    padding: clamp(36px, 6vw, 68px);
    background: #eef7f7;
  }
  .official-future-teaser h2 { max-width: 680px; margin: 0; font-size: clamp(34px, 4vw, 52px); line-height: 1.12; letter-spacing: -.03em; text-wrap: balance; }
  .official-future-teaser p { max-width: 640px; margin: 18px 0 0; color: var(--official-copy); font-size: 17px; line-height: 1.75; }
  .official-future-teaser .official-button { margin-top: 26px; }
  .official-future-teaser-media { align-self: end; display: grid; place-items: end center; }
  .official-future-teaser-media img { width: min(245px, 88%); height: auto; filter: drop-shadow(0 16px 12px rgb(0 0 0 / .11)); animation: official-float 5s ease-in-out infinite; }
  .official-demo {
    margin: 0;
    overflow: hidden;
    border: 1px solid #dedee2;
    border-radius: 16px;
    background: #edf4f6;
  }
  .official-hero-demo {
    border: 0;
    background: #edf4f6;
    box-shadow: 0 22px 54px rgb(24 93 104 / .16);
    transform: perspective(1100px) rotateX(var(--official-tilt-x, 0deg)) rotateY(var(--official-tilt-y, 0deg)) translate3d(0, var(--official-tilt-lift, 0), 0);
    transform-style: preserve-3d;
    transition: transform .5s cubic-bezier(.16,1,.3,1), box-shadow .5s cubic-bezier(.16,1,.3,1);
  }
  .official-hero-demo:hover { --official-tilt-lift: -4px; box-shadow: 0 24px 58px rgb(0 0 0 / .14); }
  .official-demo-head {
    min-height: 56px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    border-bottom: 1px solid var(--official-line);
    background: #fff;
  }
  .official-demo-head img { width: 34px; height: 34px; border-radius: 10px; object-fit: cover; }
  .official-demo-head strong { font-size: 14px; }
  .official-demo-head span { margin-left: auto; color: var(--official-muted); font-size: 11px; }
  .official-demo-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 18px; }
  .official-language-pair { display: flex; align-items: center; gap: 10px; color: #3a3a3c; font-size: 13px; font-weight: 720; }
  .official-language-pair i { width: 24px; height: 1px; background: #aeaeb2; }
  .official-mode-switch { display: inline-flex; padding: 3px; border-radius: 10px; background: #e5e5e7; }
  .official-mode-switch button { min-height: 32px; padding: 0 11px; border: 0; border-radius: 8px; background: transparent; color: #6e6e73; font-size: 12px; font-weight: 720; cursor: pointer; }
  .official-mode-switch button[aria-pressed="true"] { background: #fff; color: var(--official-ink); }
  .official-demo-body { padding: 0 18px 20px; }
  .official-message { padding: 19px; border-radius: 13px; background: #fff; }
  .official-message + .official-message { width: 88%; margin: 12px 0 0 auto; background: #e8f6f2; }
  .official-message-meta { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 12px; color: var(--official-muted); font-size: 11px; }
  .official-message p { margin: 0; color: #2c2c2e; font-size: 15px; line-height: 1.7; }
  .official-message .official-translation { max-height: 130px; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--official-line); color: #1d1d1f; font-size: 17px; opacity: 1; transition: max-height .3s cubic-bezier(.16,1,.3,1), opacity .2s ease, margin .3s ease, padding .3s ease; }
  .official-demo[data-mode="original"] .official-translation { max-height: 0; overflow: hidden; margin: 0; padding: 0; border: 0; opacity: 0; }
  .official-demo-auto .official-message { transition: opacity .62s ease, transform .72s cubic-bezier(.16,1,.3,1), box-shadow .62s ease; }
  .official-demo-auto[data-auto-phase="0"] .official-message:first-child .official-translation { opacity: .12; transform: translateY(8px); }
  .official-demo-auto[data-auto-phase="0"] .official-message:nth-child(2),
  .official-demo-auto[data-auto-phase="1"] .official-message:nth-child(2) { opacity: 0; transform: translateY(20px) scale(.98); }
  .official-demo-auto[data-auto-phase="1"] .official-message:first-child { box-shadow: 0 14px 34px rgb(19 120 127 / .1); }
  .official-demo-foot { display: flex; justify-content: space-between; gap: 14px; margin-top: 15px; color: var(--official-muted); font-size: 12px; line-height: 1.55; }
  .official-demo-state { color: var(--official-blue-hover); font-weight: 720; white-space: nowrap; }
  .official-workbench-demo {
    --official-workbench-glow: rgb(85 193 178 / .24);
    position: relative;
    overflow: hidden;
    border: 1px solid rgb(255 255 255 / .9);
    border-radius: 28px;
    background: #e8f3f4;
    box-shadow: inset 0 1px 0 #fff, 0 36px 90px rgb(29 96 105 / .16), 0 8px 24px rgb(0 0 0 / .06);
  }
  .official-workbench-demo[data-active-feature="telegram"] { --official-workbench-glow: rgb(77 151 234 / .22); }
  .official-workbench-demo[data-active-feature="line"] { --official-workbench-glow: rgb(79 205 137 / .22); }
  .official-workbench-head { min-height: 62px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 12px 20px; border-bottom: 1px solid rgb(186 186 191 / .52); background: rgb(255 255 255 / .74); -webkit-backdrop-filter: blur(24px) saturate(160%); backdrop-filter: blur(24px) saturate(160%); }
  .official-workbench-head strong { font-size: 14px; }
  .official-workbench-head span { color: var(--official-muted); font-size: 11px; }
  .official-workbench-brand { width: 28px; height: 28px; display: block; border-radius: 9px; object-fit: cover; box-shadow: 0 5px 14px rgb(34 34 38 / .1); }
  .official-workbench-body { min-height: 500px; display: grid; grid-template-columns: 96px minmax(0, 1fr); }
  .official-workbench-tabs { position: relative; z-index: 2; padding: 14px 10px; display: grid; align-content: start; gap: 8px; border-right: 1px solid rgb(186 186 191 / .52); background: rgb(245 245 247 / .74); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); }
  .official-workbench-tab { min-height: 70px; display: grid; place-items: center; gap: 5px; padding: 8px 4px; border: 0; border-radius: 14px; background: transparent; color: var(--official-muted); font-size: 10px; cursor: pointer; transition: background-color .2s ease, color .2s ease, transform .25s cubic-bezier(.16,1,.3,1); }
  .official-workbench-tab:hover { color: var(--official-ink); transform: translateY(-1px); }
  .official-workbench-tab[aria-selected="true"] { color: var(--official-ink); background: rgb(255 255 255 / .9); box-shadow: inset 0 1px 0 #fff, 0 9px 22px rgb(48 41 62 / .12); }
  .official-workbench-tab img { width: 30px; height: 30px; object-fit: contain; }
  .official-workbench-panel[hidden] { display: none; }
  .official-workbench-panel { position: relative; isolation: isolate; min-height: 500px; display: grid; align-content: center; overflow: hidden; padding: clamp(28px, 5vw, 60px); background: linear-gradient(145deg, rgb(255 255 255 / .94), rgb(242 241 245 / .88)); animation: official-panel-in .48s cubic-bezier(.16,1,.3,1); }
  .official-workbench-panel::before {
    content: "";
    position: absolute;
    z-index: -1;
    width: 420px;
    height: 420px;
    right: -90px;
    top: -180px;
    border-radius: 50%;
    background: var(--official-workbench-glow);
    filter: blur(16px);
    transition: background-color .45s ease;
  }
  .official-workbench-panel::after {
    content: "";
    position: absolute;
    z-index: -1;
    width: 250px;
    height: 250px;
    left: 10%;
    bottom: -170px;
    border-radius: 50%;
    background: rgb(216 218 222 / .22);
    filter: blur(20px);
  }
  .official-workbench-context { display: flex; justify-content: space-between; gap: 18px; margin-bottom: 18px; color: var(--official-muted); font-size: 11px; }
  .official-workbench-message { position: relative; max-width: 680px; padding: 28px; border: 1px solid rgb(255 255 255 / .96); border-radius: 22px; background: rgb(255 255 255 / .7); box-shadow: inset 0 1px 0 #fff, 0 24px 58px rgb(49 42 62 / .11); -webkit-backdrop-filter: blur(24px) saturate(155%); backdrop-filter: blur(24px) saturate(155%); }
  .official-workbench-message > p { margin: 0; color: #2c2c2e; font-size: 16px; line-height: 1.72; }
  .official-workbench-translation { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--official-line); }
  .official-workbench-translation span { display: block; margin-bottom: 8px; color: var(--official-muted); font-size: 11px; font-weight: 760; }
  .official-workbench-translation strong { font-size: 18px; line-height: 1.65; }
  .official-workbench-actions { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 10px 20px; color: var(--official-muted); font-size: 12px; }
  .official-detail-grid { display: grid; grid-template-columns: minmax(230px, .62fr) minmax(0, 1.38fr); gap: clamp(42px, 7vw, 90px); }
  .official-detail-aside { position: sticky; top: 100px; align-self: start; }
  .official-detail-aside h2 { margin: 0; font-size: 25px; line-height: 1.28; }
  .official-detail-aside p { margin: 14px 0 0; color: var(--official-copy); line-height: 1.7; }
  .official-detail-list { counter-reset: capability; margin: 0; padding: 0; list-style: none; border-top: 1px solid #cbd5e1; }
  .official-detail-list li { counter-increment: capability; display: grid; grid-template-columns: 42px 180px minmax(0, 1fr); gap: 18px 26px; align-items: start; padding: 28px 0; border-bottom: 1px solid var(--official-line); transition: transform .32s cubic-bezier(.16,1,.3,1); }
  .official-detail-list li::before { content: counter(capability, decimal-leading-zero); width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid rgb(255 255 255 / .86); border-radius: 12px; background: rgb(255 255 255 / .66); color: #706787; font-size: 11px; font-weight: 780; box-shadow: inset 0 1px 0 #fff, 0 8px 20px rgb(53 44 67 / .07); }
  .official-detail-list li:hover { transform: translateX(6px); }
  .official-detail-list strong { font-size: 17px; }
  .official-detail-list span { color: var(--official-copy); line-height: 1.72; }
  .official-voice-stage { position: relative; overflow: hidden; padding: clamp(32px, 5vw, 58px); border: 1px solid rgb(255 255 255 / .9); border-radius: 28px; background: radial-gradient(circle at 18% 12%, rgb(255 255 255 / .98), transparent 34%), linear-gradient(135deg, rgb(239 235 247 / .94), rgb(247 240 236 / .9)); box-shadow: inset 0 1px 0 #fff, 0 28px 70px rgb(48 40 61 / .11); }
  .official-voice-stage::after { content: ""; position: absolute; width: 260px; height: 260px; right: -100px; top: -130px; border-radius: 50%; background: rgb(199 184 255 / .22); filter: blur(14px); pointer-events: none; }
  .official-voice-visual { min-height: 160px; display: flex; align-items: center; justify-content: center; gap: clamp(18px, 3vw, 34px); }
  .official-voice-orb { position: relative; z-index: 1; width: 74px; height: 74px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid rgb(255 255 255 / .9); border-radius: 50%; background: rgb(255 255 255 / .58); color: #433d51; font-size: 22px; box-shadow: inset 0 1px 0 #fff, 0 16px 36px rgb(61 49 78 / .14); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); animation: official-voice-breathe 2.6s ease-in-out infinite; }
  .official-wave { width: min(520px, 68%); height: 112px; display: flex; align-items: center; justify-content: center; gap: 8px; }
  .official-wave i { width: 5px; height: var(--wave); border-radius: 999px; background: linear-gradient(to bottom, #8f83af, #453e52); transform-origin: center; animation: official-wave 1.6s ease-in-out infinite alternate; animation-delay: var(--delay); }
  .official-voice-copy { display: flex; justify-content: space-between; gap: 28px; padding-top: 20px; border-top: 1px solid #cbd5e1; }
  .official-voice-copy span { max-width: 28ch; color: var(--official-copy); font-size: 14px; line-height: 1.65; }
  .official-platform-ribbon {
    min-height: 104px;
    display: flex;
    align-items: center;
    gap: clamp(24px, 5vw, 70px);
    padding: 18px 26px;
    border: 1px solid rgb(220 220 224 / .84);
    border-radius: 24px;
    background: rgb(255 255 255 / .72);
    box-shadow: inset 0 1px 0 #fff, 0 18px 50px rgb(42 42 48 / .07);
    -webkit-backdrop-filter: blur(24px) saturate(150%);
    backdrop-filter: blur(24px) saturate(150%);
  }
  .official-platform-ribbon-copy { min-width: 180px; }
  .official-platform-ribbon-copy strong { display: block; font-size: 15px; }
  .official-platform-ribbon-copy span { display: block; margin-top: 5px; color: var(--official-muted); font-size: 12px; }
  .official-platform-dock { flex: 1; display: flex; align-items: center; justify-content: center; gap: clamp(14px, 3vw, 30px); }
  .official-platform-dock-item {
    --dock-scale: 1;
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    border: 1px solid rgb(255 255 255 / .92);
    border-radius: 18px;
    background: rgb(247 247 249 / .84);
    box-shadow: inset 0 1px 0 #fff, 0 10px 24px rgb(38 38 43 / .09);
    transform: translateY(calc((var(--dock-scale) - 1) * -8px)) scale(var(--dock-scale));
    transform-origin: center bottom;
    transition: transform .26s cubic-bezier(.16,1,.3,1), box-shadow .26s ease;
  }
  .official-platform-dock-item img { width: 34px; height: 34px; object-fit: contain; }
  .official-platform-dock-item:hover { box-shadow: inset 0 1px 0 #fff, 0 18px 34px rgb(38 38 43 / .14); }
  .official-capability-mosaic {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    grid-auto-rows: minmax(210px, auto);
    gap: 18px;
  }
  .official-capability-card {
    --spot-x: 50%;
    --spot-y: 50%;
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 360px;
    padding: clamp(28px, 4vw, 46px);
    border: 1px solid rgb(218 218 223 / .8);
    border-radius: 28px;
    background: #f3f8f9;
    box-shadow: inset 0 1px 0 #fff, 0 22px 54px rgb(39 39 45 / .08);
    transform: perspective(1100px) rotateX(var(--official-tilt-x, 0deg)) rotateY(var(--official-tilt-y, 0deg));
    transform-style: preserve-3d;
    transition: transform .45s cubic-bezier(.16,1,.3,1), box-shadow .35s ease;
  }
  .official-capability-card::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: radial-gradient(280px circle at var(--spot-x) var(--spot-y), rgb(255 255 255 / .96), rgb(255 255 255 / 0) 68%);
    opacity: 0;
    transition: opacity .3s ease;
    pointer-events: none;
  }
  .official-capability-card:hover { box-shadow: inset 0 1px 0 #fff, 0 32px 76px rgb(39 39 45 / .13); }
  .official-capability-card:hover::before { opacity: 1; }
  .official-capability-card.voice { grid-column: span 7; }
  .official-capability-card.manage { grid-column: span 5; }
  .official-capability-card.fallback { grid-column: span 5; }
  .official-capability-card.future { grid-column: span 7; display: grid; grid-template-columns: minmax(0, 1fr) minmax(180px, .72fr); align-items: center; gap: 24px; }
  .official-capability-card.voice { background: #f0edfb; }
  .official-capability-card.manage { background: #eaf8f2; }
  .official-capability-card.fallback { background: #fff3e8; }
  .official-capability-card.future { background: #eaf6fb; }
  .official-capability-card h3 { max-width: 14ch; margin: 0; font-size: clamp(27px, 3vw, 40px); line-height: 1.08; letter-spacing: -.032em; text-wrap: balance; }
  .official-capability-card > p, .official-capability-card-copy > p { max-width: 48ch; margin: 14px 0 0; color: var(--official-copy); font-size: 15px; line-height: 1.68; }
  .official-capability-card-label { display: block; margin-bottom: 16px; color: var(--official-muted); font-size: 12px; font-weight: 760; }
  .official-capability-voice-ui { margin-top: 34px; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 24px; }
  .official-capability-voice-ui .official-wave { width: 100%; }
  .official-capability-card:not([data-playing="true"]) .official-wave i { animation-play-state: paused; opacity: .5; transform: scaleY(.68); }
  .official-voice-toggle { min-width: 116px; min-height: 44px; border: 1px solid rgb(205 205 210 / .92); border-radius: 999px; background: rgb(255 255 255 / .76); color: var(--official-ink); font: inherit; font-size: 13px; font-weight: 760; cursor: pointer; box-shadow: inset 0 1px 0 #fff, 0 8px 20px rgb(40 40 45 / .08); transition: transform .22s cubic-bezier(.16,1,.3,1), box-shadow .22s ease; }
  .official-voice-toggle:hover { transform: translateY(-2px); box-shadow: inset 0 1px 0 #fff, 0 12px 28px rgb(40 40 45 / .12); }
  .official-voice-toggle:active { transform: scale(.98); }
  .official-manage-flow { margin-top: 30px; display: grid; gap: 10px; }
  .official-manage-flow span { min-height: 56px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 0 16px; border: 1px solid rgb(219 219 224 / .9); border-radius: 16px; background: rgb(255 255 255 / .72); color: var(--official-copy); font-size: 13px; box-shadow: inset 0 1px 0 #fff; transition: transform .28s cubic-bezier(.16,1,.3,1); }
  .official-manage-flow span:hover { transform: translateX(5px); }
  .official-manage-flow strong { color: var(--official-ink); font-size: 14px; }
  .official-fallback-ui { margin-top: 32px; padding: 20px; border: 1px solid rgb(212 212 217 / .9); border-radius: 18px; background: rgb(255 255 255 / .72); box-shadow: inset 0 1px 0 #fff; }
  .official-fallback-ui-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding-bottom: 14px; border-bottom: 1px solid var(--official-line); }
  .official-fallback-ui-head strong { font-size: 14px; }
  .official-fallback-ui-head span { color: var(--official-muted); font-size: 12px; }
  .official-fallback-ui p { margin: 16px 0 0; color: var(--official-copy); font-size: 14px; line-height: 1.65; }
  .official-future-card-media { align-self: end; display: grid; place-items: end center; }
  .official-future-card-media img { width: min(250px, 100%); height: auto; filter: drop-shadow(0 18px 14px rgb(30 30 34 / .14)); animation: official-float 5s ease-in-out infinite; }
  @media (prefers-reduced-motion: no-preference) {
    .official-capabilities-hero > div:first-child > * { animation: official-hero-copy-in .72s cubic-bezier(.16,1,.3,1) both; }
    .official-capabilities-hero > div:first-child > :nth-child(2) { animation-delay: .07s; }
    .official-capabilities-hero > div:first-child > :nth-child(3) { animation-delay: .14s; }
    .official-capabilities-hero > div:first-child > :nth-child(4) { animation-delay: .21s; }
    .official-capabilities-hero .official-hero-demo { animation: official-hero-visual-in .9s .12s cubic-bezier(.16,1,.3,1) both; }
  }
  .official-future-visual { position: relative; min-height: 440px; display: grid; place-items: center; background: var(--official-blue-soft); }
  .official-future-visual img { width: min(300px, 65%); height: auto; filter: drop-shadow(0 14px 10px rgb(0 0 0 / .12)); animation: official-float 5s ease-in-out infinite; }
  .official-future-note {
    position: absolute;
    left: 24px;
    right: 24px;
    bottom: 24px;
    padding: 16px 18px;
    border-radius: 13px;
    background: rgb(255 255 255 / .76);
    color: var(--official-copy);
    font-size: 13px;
    line-height: 1.6;
    -webkit-backdrop-filter: blur(18px) saturate(160%);
    backdrop-filter: blur(18px) saturate(160%);
  }
  .official-future-note strong { color: var(--official-ink); }
  .official-future-capabilities { overflow: hidden; border-top: 1px solid #d2d2d7; border-bottom: 1px solid #d2d2d7; }
  .official-future-capability-tabs { display: grid; grid-template-columns: repeat(6, 1fr); border-bottom: 1px solid var(--official-line); background: #f5f5f7; }
  .official-future-capability-tab {
    min-height: 72px;
    padding: 12px 16px;
    border: 0;
    border-right: 1px solid var(--official-line);
    background: transparent;
    color: var(--official-muted);
    font-size: 13px;
    font-weight: 740;
    cursor: pointer;
    transition: background-color .25s ease, color .25s ease;
  }
  .official-future-capability-tab:last-child { border-right: 0; }
  .official-future-capability-tab:hover { color: var(--official-ink); background: rgb(255 255 255 / .6); }
  .official-future-capability-tab[aria-selected="true"] { color: var(--official-ink); background: #fff; box-shadow: inset 0 -2px 0 var(--official-ink); }
  .official-future-capability-panel[hidden] { display: none; }
  .official-future-capability-panel {
    min-height: 560px;
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(300px, .72fr);
    align-items: center;
    gap: clamp(36px, 7vw, 90px);
    padding: clamp(38px, 6vw, 72px);
    animation: official-panel-in .45s cubic-bezier(.16,1,.3,1);
  }
  .official-future-capability-copy > span { color: var(--official-muted); font-size: 12px; font-weight: 780; letter-spacing: .05em; }
  .official-future-capability-copy h3 { max-width: 15ch; margin: 14px 0 0; font-size: clamp(34px, 4vw, 54px); line-height: 1.08; letter-spacing: -.036em; }
  .official-future-capability-copy > p { max-width: 58ch; margin: 20px 0 0; color: var(--official-copy); font-size: 16px; line-height: 1.78; }
  .official-future-capability-points { margin: 30px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--official-line); }
  .official-future-capability-points li { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 18px; padding: 15px 0; border-bottom: 1px solid var(--official-line); }
  .official-future-capability-points strong { font-size: 13px; }
  .official-future-capability-points span { color: var(--official-copy); font-size: 13px; line-height: 1.6; }
  .official-future-capability-media {
    min-height: 390px;
    display: grid;
    align-content: center;
    justify-items: center;
    overflow: hidden;
    padding: 28px 24px 18px;
    background: radial-gradient(circle at 50% 34%, #fff 0%, #f4f4f6 48%, #e9e9ed 100%);
  }
  .official-future-capability-media img { width: min(290px, 88%); height: auto; object-fit: contain; filter: drop-shadow(0 18px 15px rgb(0 0 0 / .12)); }
  .official-future-capability-media figcaption { margin-top: 18px; color: var(--official-muted); font-size: 11px; text-align: center; }
  .official-pricing-status { padding: clamp(30px, 4vw, 48px); background: var(--official-blue-soft); }
  .official-pricing-status-head { display: flex; align-items: center; gap: 14px; margin-bottom: 42px; }
  .official-pricing-status-head img { width: 50px; height: 50px; border-radius: 14px; object-fit: cover; }
  .official-pricing-status-head strong { display: block; font-size: 18px; }
  .official-pricing-status-head span { display: block; margin-top: 4px; color: var(--official-muted); font-size: 13px; }
  .official-pricing-status > strong { display: block; max-width: 14ch; font-size: clamp(30px, 3.5vw, 46px); line-height: 1.15; letter-spacing: -.03em; }
  .official-pricing-status > p { max-width: 44ch; margin: 18px 0 0; color: var(--official-copy); line-height: 1.75; }
  .official-pricing-intro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, .7fr); align-items: end; gap: clamp(32px, 7vw, 92px); padding-bottom: clamp(26px, 3vw, 40px); border-bottom: 1px solid var(--official-line); }
  .official-pricing-intro h2 { max-width: 18ch; margin: 0; font-size: clamp(38px, 4.6vw, 62px); line-height: 1.04; letter-spacing: -.035em; text-wrap: balance; }
  .official-pricing-intro p { max-width: 43ch; margin: 0; color: var(--official-copy); font-size: 16px; line-height: 1.8; text-wrap: pretty; }
  .official-pricing-stage { margin-top: 18px; overflow: hidden; border: 1px solid var(--official-line); border-radius: 22px; background: rgb(255 255 255 / .78); box-shadow: 0 18px 45px rgb(52 88 126 / .08); }
  .official-pricing-stage-head { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 0 clamp(22px, 2.8vw, 36px); border-bottom: 1px solid var(--official-line); color: var(--official-muted); font-size: 13px; font-weight: 700; letter-spacing: .02em; }
  .official-pricing-stage-head strong { color: var(--official-ink); font-size: 13px; }
  .official-pricing-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .official-pricing-plan { position: relative; min-height: 660px; display: flex; flex-direction: column; padding: clamp(24px, 3vw, 36px); overflow: hidden; background: #fff; }
  .official-pricing-plan + .official-pricing-plan { border-left: 1px solid var(--official-line); }
  .official-pricing-plan.team { background: linear-gradient(145deg, #fbfdff 0%, #f1f9fb 100%); }
  .official-pricing-plan::after { content: ""; position: absolute; inset: auto -34px -46px auto; width: 156px; aspect-ratio: 1; border-radius: 50%; background: rgb(105 200 217 / .13); pointer-events: none; }
  .official-pricing-plan.team::after { background: rgb(180 155 210 / .15); }
  .official-pricing-plan.agent { color: var(--official-ink); background: linear-gradient(145deg, #51b5c9 0%, #afe4eb 52%, #f1c5d8 100%); }
  .official-pricing-plan.agent::after { width: 210px; background: rgb(255 255 255 / .28); }
  .official-pricing-plan > * { position: relative; z-index: 1; }
  .official-pricing-plan-label { min-height: 26px; display: inline-flex; align-items: center; align-self: flex-start; padding: 0 10px; border-radius: 999px; background: rgb(72 175 202 / .12); color: #176d89; font-size: 12px; font-weight: 780; letter-spacing: .015em; }
  .official-pricing-plan.team .official-pricing-plan-label { background: rgb(180 155 210 / .18); color: #70548f; }
  .official-pricing-plan.agent .official-pricing-plan-label { background: rgb(255 255 255 / .38); color: #244d65; }
  .official-pricing-plan h3 { margin: 24px 0 0; font-size: clamp(28px, 2.6vw, 36px); line-height: 1.08; letter-spacing: -.03em; text-wrap: balance; }
  .official-pricing-plan > p { min-height: 78px; margin: 16px 0 0; color: var(--official-copy); font-size: 15px; line-height: 1.72; text-wrap: pretty; }
  .official-pricing-plan.agent > p { color: #34546a; }
  .official-pricing-audience { min-height: 45px; margin: 18px 0 0; padding: 12px 0; border-top: 1px solid rgb(126 154 177 / .24); border-bottom: 1px solid rgb(126 154 177 / .24); color: var(--official-copy); font-size: 13px; line-height: 1.5; }
  .official-pricing-audience b { margin-right: 8px; color: var(--official-ink); font-weight: 760; }
  .official-pricing-plan.agent .official-pricing-audience { border-color: rgb(48 89 108 / .22); color: #34546a; }
  .official-pricing-price { min-height: 52px; display: flex; align-items: end; gap: 8px; margin-top: 28px; }
  .official-pricing-price strong { font-size: clamp(28px, 3vw, 42px); line-height: 1; letter-spacing: -.035em; }
  .official-pricing-price span { padding-bottom: 3px; color: var(--official-muted); font-size: 13px; font-weight: 680; }
  .official-pricing-plan.agent .official-pricing-price span { color: #456273; }
  .official-pricing-modules { display: grid; gap: 11px; margin: 24px 0; }
  .official-pricing-module { padding-bottom: 11px; border-bottom: 1px solid rgb(126 154 177 / .18); }
  .official-pricing-module:last-child { padding-bottom: 0; border-bottom: 0; }
  .official-pricing-module strong { display: block; margin-bottom: 4px; color: var(--official-ink); font-size: 13px; }
  .official-pricing-module span { display: block; color: var(--official-copy); font-size: 13px; line-height: 1.58; }
  .official-pricing-plan.agent .official-pricing-module { border-color: rgb(48 89 108 / .18); }
  .official-pricing-plan.agent .official-pricing-module span { color: #34546a; }
  .official-pricing-plan ul { display: grid; gap: 12px; margin: 0 0 24px; padding: 0; list-style: none; }
  .official-pricing-plan li { display: grid; grid-template-columns: 12px minmax(0, 1fr); gap: 9px; align-items: start; color: var(--official-copy); font-size: 14px; line-height: 1.55; }
  .official-pricing-plan li::before { content: ""; width: 7px; height: 7px; margin-top: .43em; border-radius: 50%; background: var(--official-aqua); }
  .official-pricing-plan.agent li { color: #34546a; }
  .official-pricing-plan.agent li::before { background: #d681aa; }
  .official-pricing-plan .official-button { width: 100%; margin-top: auto; justify-content: center; }
  .official-pricing-plan.agent .official-button { border-color: rgb(255 255 255 / .62); background: rgb(255 255 255 / .45); color: var(--official-ink); }
  .official-pricing-plan.agent .official-button:hover { background: rgb(255 255 255 / .72); }
  .official-pricing-overview { display: grid; grid-template-columns: minmax(240px, .72fr) minmax(0, 1.28fr); gap: clamp(28px, 6vw, 84px); align-items: start; }
  .official-pricing-overview-copy { position: sticky; top: 126px; }
  .official-pricing-overview-copy h2 { margin: 0; font-size: clamp(36px, 4vw, 56px); line-height: 1.06; letter-spacing: -.035em; }
  .official-pricing-overview-copy p { max-width: 30ch; margin: 20px 0 0; color: var(--official-copy); font-size: 16px; line-height: 1.75; }
  .official-pricing-compare { border-top: 1px solid var(--official-line); }
  .official-pricing-compare-row { display: grid; grid-template-columns: minmax(108px, .56fr) minmax(175px, 1.35fr) repeat(3, minmax(0, .78fr)); gap: 16px; align-items: center; padding: 19px 0; border-bottom: 1px solid var(--official-line); }
  .official-pricing-compare-row > strong { font-size: 14px; line-height: 1.42; }
  .official-pricing-compare-row > span { min-height: 32px; display: flex; align-items: center; color: var(--official-copy); font-size: 13px; line-height: 1.52; }
  .official-pricing-compare-row:first-child { padding: 0; color: var(--official-muted); font-size: 12px; font-weight: 760; }
  .official-pricing-compare-row:first-child > span { min-height: 48px; color: var(--official-muted); font-size: 12px; font-weight: 760; }
  .official-pricing-compare-row .is-current { color: #15718a; font-weight: 740; }
  .official-pricing-compare-row .is-config { color: #6e568d; font-weight: 740; }
  .official-pricing-compare-row .is-future { color: #a15176; font-weight: 740; }
  .official-plan-names { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid #cbd5e1; border-bottom: 1px solid #cbd5e1; }
  .official-plan-name { min-height: 156px; display: flex; flex-direction: column; justify-content: space-between; padding: 28px; }
  .official-plan-name + .official-plan-name { border-left: 1px solid var(--official-line); }
  .official-plan-name strong { font-size: 24px; }
  .official-plan-name span { color: var(--official-muted); font-size: 13px; }
  .official-pricing-note { display: flex; align-items: center; justify-content: space-between; gap: 30px; margin-top: 30px; }
  .official-pricing-note p { max-width: 62ch; margin: 0; color: var(--official-copy); line-height: 1.75; }
  .official-download-v2 { overflow: hidden; background: linear-gradient(180deg, #f9fcff 0%, #fff 29%, #f8fbfc 100%); }
  .official-download-v2-hero { padding: clamp(56px, 7vw, 92px) 0 54px; text-align: center; }
  .official-download-v2-kicker { margin: 0 0 14px; color: #248bad; font-size: 12px; font-weight: 820; letter-spacing: .1em; }
  .official-download-v2-hero h1 { margin: 0; color: var(--official-ink); font-size: clamp(46px, 6vw, 76px); line-height: 1.02; letter-spacing: -.052em; }
  .official-download-v2-hero > .official-wrap > p:last-of-type { max-width: 630px; margin: 20px auto 0; color: var(--official-copy); font-size: 17px; line-height: 1.72; text-wrap: balance; }
  .official-download-platforms { padding-bottom: clamp(68px, 8vw, 104px); }
  .official-download-platform-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
  .official-download-platform-card { position: relative; min-height: 430px; display: flex; flex-direction: column; padding: 30px; overflow: hidden; border: 1px solid rgb(139 169 190 / .34); border-radius: 24px; background: rgb(255 255 255 / .92); box-shadow: 0 18px 48px rgb(61 93 121 / .08); }
  .official-download-platform-card.is-available { border-color: rgb(55 145 224 / .55); box-shadow: 0 22px 54px rgb(61 126 187 / .13); }
  .official-download-platform-card.is-available::before { position: absolute; inset: 0 0 auto; height: 4px; background: linear-gradient(90deg, #41bcd7, #839be7 60%, #d98fbd); content: ""; }
  .official-download-platform-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
  .official-download-platform-icon { width: 62px; height: 62px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 18px; background: #edf6ff; color: #247ee7; }
  .official-download-platform-card[data-download-platform^="mac"] .official-download-platform-icon { background: #f4f1fb; color: #65558a; }
  .official-download-platform-icon svg { width: 32px; height: 32px; }
  .official-download-platform-state { padding-top: 5px; color: var(--official-muted); font-size: 12px; font-weight: 760; }
  .official-download-platform-card.is-available .official-download-platform-state { color: #188b73; }
  .official-download-platform-card h2 { margin: 28px 0 10px; font-size: clamp(27px, 2.2vw, 34px); line-height: 1.08; letter-spacing: -.035em; }
  .official-download-platform-card > p { min-height: 50px; margin: 0; color: var(--official-copy); font-size: 14px; line-height: 1.68; }
  .official-download-platform-meta { display: grid; gap: 0; margin: 24px 0 26px; border-top: 1px solid var(--official-line); }
  .official-download-platform-meta span { min-height: 44px; display: flex; align-items: center; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--official-line); color: var(--official-muted); font-size: 12px; }
  .official-download-platform-meta strong { color: var(--official-ink); font-size: 13px; text-align: right; }
  .official-download-platform-card .official-button,
  .official-download-button-disabled { width: 100%; min-height: 52px; justify-content: center; margin-top: auto; }
  .official-download-button-disabled { display: inline-flex; align-items: center; border: 1px solid #d9e0e7; border-radius: 14px; background: #edf1f4; color: #8a95a3; font-size: 14px; font-weight: 780; cursor: not-allowed; }
  .official-download-v2-section { padding: clamp(68px, 8vw, 104px) 0; border-top: 1px solid var(--official-line); }
  .official-download-v2-section.is-soft { background: linear-gradient(135deg, rgb(229 248 252 / .5), rgb(251 241 247 / .52)); }
  .official-download-section-head { display: grid; grid-template-columns: minmax(240px, .75fr) minmax(0, 1.25fr); gap: clamp(36px, 7vw, 96px); align-items: end; margin-bottom: 42px; }
  .official-download-section-head span { color: #248bad; font-size: 12px; font-weight: 820; letter-spacing: .08em; }
  .official-download-section-head h2 { margin: 10px 0 0; font-size: clamp(36px, 4.5vw, 56px); line-height: 1.05; letter-spacing: -.045em; }
  .official-download-section-head p { max-width: 40ch; justify-self: start; margin: 0; color: var(--official-copy); font-size: 15px; line-height: 1.75; text-wrap: pretty; }
  .official-download-release-layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(46px, 7vw, 92px); }
  .official-download-release-current { padding-top: 26px; border-top: 2px solid var(--official-ink); }
  .official-download-release-current header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
  .official-download-release-current header span { color: var(--official-muted); font-size: 12px; font-weight: 760; }
  .official-download-release-current h3 { margin: 7px 0 0; font-size: 30px; letter-spacing: -.03em; }
  .official-download-release-current header strong { color: #188b73; font-size: 13px; }
  .official-download-release-current > p { margin: 0; color: var(--official-copy); font-size: 13px; line-height: 1.65; overflow-wrap: anywhere; }
  .official-download-release-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin: 30px 0; }
  .official-download-release-facts span { color: var(--official-muted); font-size: 11px; }
  .official-download-release-facts strong { display: block; margin-top: 6px; color: var(--official-ink); font-size: 15px; overflow-wrap: anywhere; }
  .official-download-release-notes { display: grid; gap: 12px; margin: 0; padding: 22px 0 0; border-top: 1px solid var(--official-line); list-style: none; }
  .official-download-release-notes li { display: grid; grid-template-columns: 9px 1fr; gap: 12px; color: var(--official-copy); font-size: 14px; line-height: 1.6; }
  .official-download-release-notes li::before { width: 7px; height: 7px; margin-top: .55em; border-radius: 50%; background: linear-gradient(135deg, #3ebbd4, #de83b4); content: ""; }
  .official-download-requirements { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--official-line); }
  .official-download-requirement { min-height: 126px; display: grid; align-content: start; gap: 9px; padding: 24px 28px 22px 0; border-bottom: 1px solid var(--official-line); }
  .official-download-requirement:nth-child(2n) { padding-right: 0; padding-left: 28px; border-left: 1px solid var(--official-line); }
  .official-download-requirement strong { font-size: 14px; }
  .official-download-requirement span { max-width: 26ch; color: var(--official-copy); font-size: 14px; line-height: 1.65; text-wrap: pretty; }
  .official-download-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 12px; border-top: 1px solid #aac9d8; }
  .official-download-step { position: relative; padding: 34px 28px 0 0; }
  .official-download-step::before { position: absolute; top: -6px; left: 0; width: 11px; height: 11px; border: 2px solid #fff; border-radius: 50%; background: #44bcd2; box-shadow: 0 0 0 1px #44bcd2; content: ""; }
  .official-download-step:nth-child(2)::before { background: #65c3bc; box-shadow: 0 0 0 1px #65c3bc; }
  .official-download-step:nth-child(3)::before { background: #978fe3; box-shadow: 0 0 0 1px #978fe3; }
  .official-download-step:nth-child(4)::before { background: #db82ae; box-shadow: 0 0 0 1px #db82ae; }
  .official-download-step b { color: #81a9c0; font-size: 34px; letter-spacing: -.04em; }
  .official-download-step h3 { margin: 18px 0 9px; font-size: 20px; }
  .official-download-step p { margin: 0; color: var(--official-copy); font-size: 13px; line-height: 1.65; }
  .official-download-safety { display: flex; align-items: center; justify-content: space-between; gap: 32px; margin-top: 52px; padding: 26px 0; border-top: 1px solid var(--official-line); border-bottom: 1px solid var(--official-line); }
  .official-download-safety-copy strong { display: block; margin-bottom: 7px; font-size: 18px; }
  .official-download-safety-copy p { max-width: 670px; margin: 0; color: var(--official-copy); font-size: 14px; line-height: 1.65; }
  .official-download-safety .official-actions { flex: 0 0 auto; margin: 0; }
  @media (max-width: 1020px) {
    .official-download-platform-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .official-download-platform-card:last-child { grid-column: 1 / -1; min-height: 360px; }
    .official-download-section-head { grid-template-columns: 1fr; gap: 16px; align-items: start; }
    .official-download-section-head p { max-width: 52ch; justify-self: start; }
    .official-download-release-layout { grid-template-columns: 1fr; gap: 52px; }
    .official-download-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 34px 0; border-top: 0; }
    .official-download-step { min-height: 180px; padding-top: 26px; border-top: 1px solid #aac9d8; }
  }
  @media (max-width: 760px) {
    .official-download-v2-hero { padding: 46px 0 36px; }
    .official-download-v2-hero h1 { font-size: clamp(40px, 12vw, 52px); }
    .official-download-v2-hero > .official-wrap > p:last-of-type { max-width: 30em; margin-top: 16px; font-size: 15px; }
    .official-download-platforms { padding-bottom: 64px; }
    .official-download-platform-grid { grid-template-columns: 1fr; gap: 14px; }
    .official-download-platform-card,
    .official-download-platform-card:last-child { grid-column: auto; min-height: 0; padding: 24px 20px; border-radius: 20px; }
    .official-download-platform-card h2 { margin-top: 22px; font-size: 28px; }
    .official-download-platform-card > p { min-height: 0; }
    .official-download-platform-meta { margin: 20px 0 22px; }
    .official-download-v2-section { padding: 64px 0; }
    .official-download-section-head { margin-bottom: 32px; }
    .official-download-section-head h2 { font-size: 38px; }
    .official-download-release-current header { align-items: flex-start; flex-direction: column; gap: 8px; }
    .official-download-release-facts { grid-template-columns: 1fr; gap: 14px; }
    .official-download-requirements { grid-template-columns: 1fr; }
    .official-download-requirement,
    .official-download-requirement:nth-child(2n) { min-height: 0; gap: 7px; padding: 18px 0; border-left: 0; }
    .official-download-requirement span { max-width: none; }
    .official-download-steps { grid-template-columns: 1fr; gap: 24px; }
    .official-download-step { min-height: 0; padding: 24px 0 0; }
    .official-download-step h3 { margin-top: 10px; }
    .official-download-safety { align-items: stretch; flex-direction: column; margin-top: 42px; }
    .official-download-safety .official-actions { width: 100%; display: grid; }
    .official-download-safety .official-button { width: 100%; justify-content: center; }
  }
  .official-guide { counter-reset: guide; border-top: 1px solid #cbd5e1; }
  .official-guide article { counter-increment: guide; display: grid; grid-template-columns: 100px minmax(220px, .7fr) minmax(0, 1.3fr); gap: 34px; padding: 34px 0; border-bottom: 1px solid var(--official-line); }
  .official-guide article::before { content: counter(guide, decimal-leading-zero); color: var(--official-blue); font-size: 14px; font-weight: 800; }
  .official-guide h2 { margin: 0; font-size: 22px; }
  .official-guide p { margin: 0; color: var(--official-copy); line-height: 1.72; }
  .official-legal { width: min(860px, calc(100% - 48px)); margin: 0 auto; padding: 70px 0 104px; }
  .official-legal-head { margin-bottom: 42px; }
  .official-legal-head h1 { margin: 0; font-size: clamp(42px, 5vw, 64px); letter-spacing: -.035em; }
  .official-legal-head p { margin: 18px 0 0; color: var(--official-copy); font-size: 17px; line-height: 1.75; }
  .official-legal-section { padding: 28px 0; border-top: 1px solid var(--official-line); }
  .official-legal-section h2 { margin: 0 0 12px; font-size: 20px; }
  .official-legal-section p { margin: 0; color: var(--official-copy); line-height: 1.8; }
  .official-end-cta { padding-top: 30px; padding-bottom: clamp(76px, 9vw, 116px); }
  .official-end-cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 36px; padding: clamp(30px, 5vw, 52px); background: #0a5f6c; color: #fff; box-shadow: 0 24px 58px rgb(10 95 108 / .2); }
  .official-end-cta h2 { margin: 0 0 9px; font-size: clamp(28px, 3vw, 40px); letter-spacing: -.025em; }
  .official-end-cta p { max-width: 620px; margin: 0; color: #d1d1d6; line-height: 1.7; }
  .official-footer { border-top: 1px solid var(--official-line); background: #eff7f7; }
  .official-footer-inner { padding-top: 50px; padding-bottom: 42px; display: grid; grid-template-columns: 1.25fr .75fr .75fr; gap: 50px; }
  .official-footer-brand { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
  .official-footer-brand img { width: 42px; height: 42px; border-radius: 12px; object-fit: cover; }
  .official-footer-brand .official-brand-name { font-size: 20px; }
  .official-footer h2 { margin: 0; font-size: 20px; }
  .official-footer p { max-width: 420px; margin: 0; color: var(--official-muted); line-height: 1.7; }
  .official-footer h3 { margin: 0 0 14px; font-size: 14px; }
  .official-footer ul { margin: 0; padding: 0; display: grid; gap: 10px; list-style: none; }
  .official-footer a { color: var(--official-copy); font-size: 14px; }
  .official-footer a:hover { color: var(--official-blue-hover); }
  .official-copyright { padding: 18px 0 26px; border-top: 1px solid var(--official-line); color: var(--official-muted); font-size: 13px; }

  /* Product-led home: the application, not decorative cards, owns the first screen. */
  .official-site {
    --official-ink: #10172a;
    --official-copy: #46516a;
    --official-muted: #727d94;
    --official-aqua: #68b9f2;
    --official-aqua-dark: #2f86c6;
    --official-blue: #58a7e3;
    --official-mint: #b8e4fa;
    --official-coral: #ee94c5;
    background: #fff;
  }
  .official-nav {
    border-color: rgb(255 255 255 / .86);
    background: rgb(248 250 250 / .72);
    box-shadow: inset 0 1px 0 #fff, 0 10px 34px rgb(32 75 147 / .1);
  }
  .official-button,
  .official-button.primary {
    border-color: rgb(255 255 255 / .35);
    background: linear-gradient(135deg, #77bdf0, #9cb6ef 68%, #efa5cd);
    color: #10213d;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .7), inset 0 -1px 0 rgb(58 112 174 / .18), 0 12px 28px rgb(74 137 192 / .2);
  }
  .official-button:hover,
  .official-button.primary:hover {
    border-color: rgb(255 255 255 / .48);
    background: linear-gradient(135deg, #69b1e7, #8ea8e6 68%, #e695bf);
    color: #10213d;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .66), inset 0 -1px 0 rgb(55 102 160 / .2), 0 16px 36px rgb(69 123 177 / .23);
  }
  .official-button:not(.primary):nth-child(2) {
    border-color: rgb(204 207 209 / .9);
    background: rgb(255 255 255 / .72);
    color: var(--official-ink);
    box-shadow: inset 0 1px 0 #fff, 0 8px 22px rgb(24 37 40 / .07);
  }
  .official-button:not(.primary):nth-child(2):hover { background: #fff; color: var(--official-ink); }
  .official-header .official-button.primary { background: linear-gradient(135deg, rgb(119 189 240 / .95), rgb(156 182 239 / .95), rgb(239 165 205 / .95)); color: #10213d; }

  .official-home-intro {
    position: relative;
    isolation: isolate;
    padding: clamp(82px, 9vw, 130px) 0 0;
    text-align: center;
  }
  .official-home-intro::before {
    content: "";
    position: absolute;
    z-index: -1;
    width: min(840px, 86vw);
    height: 420px;
    left: 50%;
    top: 18px;
    transform: translateX(-50%);
    background:
      radial-gradient(circle at 20% 42%, rgb(104 185 242 / .22), transparent 39%),
      radial-gradient(circle at 79% 34%, rgb(238 148 197 / .2), transparent 38%),
      radial-gradient(circle at 53% 8%, rgb(147 178 240 / .13), transparent 31%);
    filter: blur(24px);
    pointer-events: none;
  }
  .official-home-intro h1 {
    max-width: 980px;
    margin: 0 auto;
    font-size: clamp(52px, 6.25vw, 88px);
    line-height: .98;
    letter-spacing: -.058em;
    text-wrap: balance;
  }
  .official-home-intro .official-lead {
    max-width: 710px;
    margin: 28px auto 0;
    color: #4f575b;
    font-size: clamp(17px, 1.55vw, 20px);
    line-height: 1.72;
  }
  .official-home-intro .official-actions { justify-content: center; margin-top: 30px; }
  .official-home-intro .official-actions .official-button { min-width: 148px; }
  .official-platform-proof {
    margin: 26px auto 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    color: var(--official-muted);
    font-size: 12px;
  }
  .official-platform-proof span { margin-right: 3px; }
  .official-platform-proof img { width: 26px; height: 26px; object-fit: contain; filter: saturate(.82); }
  .official-platform-proof em { width: 1px; height: 20px; background: #d8dcde; }

  .official-product-theater-wrap {
    position: relative;
    isolation: isolate;
    width: min(1320px, calc(100% - 40px));
    margin: clamp(54px, 7vw, 88px) auto 0;
    padding-bottom: clamp(76px, 9vw, 120px);
  }
  .official-product-theater-wrap::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: -42px -5% 14px;
    border-radius: 50%;
    background: radial-gradient(ellipse at 38% 38%, rgb(104 185 242 / .24), rgb(144 168 234 / .15) 40%, rgb(238 148 197 / .13) 60%, transparent 72%);
    filter: blur(24px);
  }
  .official-product-theater {
    --theater-scale: .965;
    --theater-y: 18px;
    position: relative;
    overflow: hidden;
    border: 1px solid rgb(177 198 235 / .86);
    border-radius: 18px;
    background: #f7f8f8;
    box-shadow: 0 42px 96px rgb(25 72 164 / .21), 0 10px 30px rgb(96 70 187 / .1);
    transform: translate3d(0, var(--theater-y), 0) scale(var(--theater-scale));
    transform-origin: center top;
    transition: box-shadow .4s ease;
    will-change: transform;
  }
  .official-product-theater:hover { box-shadow: 0 50px 110px rgb(25 72 164 / .25), 0 14px 38px rgb(118 70 187 / .13); }
  .official-theater-titlebar {
    min-height: 54px;
    display: grid;
    grid-template-columns: 116px minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    padding: 0 18px;
    border-bottom: 1px solid #dfe3e4;
    background: rgb(255 255 255 / .76);
    -webkit-backdrop-filter: blur(22px) saturate(160%);
    backdrop-filter: blur(22px) saturate(160%);
  }
  .official-window-dots { display: flex; gap: 8px; }
  .official-window-dots i { width: 11px; height: 11px; border-radius: 50%; background: #ff655d; box-shadow: 19px 0 #ffbd3f, 38px 0 #28c941; }
  .official-theater-titlebar strong { justify-self: center; font-size: 12px; letter-spacing: -.01em; }
  .official-theater-titlebar span { color: var(--official-muted); font-size: 10px; }
  .official-theater-body { min-height: 650px; display: grid; grid-template-columns: 78px 236px minmax(0, 1fr); }
  .official-theater-rail {
    position: relative;
    z-index: 2;
    padding: 16px 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    border-right: 1px solid #dfe3e4;
    background: linear-gradient(180deg, #f1f6ff, #f5f2ff);
  }
  .official-theater-logo { width: 38px; height: 38px; margin-bottom: 9px; border-radius: 11px; object-fit: cover; box-shadow: 0 5px 16px rgb(28 49 53 / .12); }
  .official-theater-tab {
    width: 54px;
    min-height: 58px;
    display: grid;
    place-items: center;
    gap: 4px;
    padding: 7px 3px;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: #737b7f;
    font: inherit;
    font-size: 8px;
    cursor: pointer;
    transition: transform .24s cubic-bezier(.16,1,.3,1), background-color .24s ease, box-shadow .24s ease;
  }
  .official-theater-tab img { width: 27px; height: 27px; object-fit: contain; }
  .official-theater-tab:hover { transform: translateY(-2px); color: var(--official-ink); }
  .official-theater-tab[aria-selected="true"] { background: #fff; color: #2f86c6; box-shadow: 0 9px 22px rgb(75 137 190 / .17); }
  .official-theater-rail-mark { width: 32px; height: 32px; margin-top: auto; display: grid; place-items: center; border-radius: 50%; background: #dce2e3; color: #667075; font-size: 11px; font-weight: 800; }
  .official-theater-inbox { border-right: 1px solid #dfe3e4; background: #fbfcfc; }
  .official-theater-inbox-head { padding: 21px 18px 14px; }
  .official-theater-inbox-head strong { display: block; font-size: 17px; letter-spacing: -.02em; }
  .official-theater-inbox-head span { display: block; margin-top: 4px; color: var(--official-muted); font-size: 10px; }
  .official-theater-search { height: 34px; margin: 0 12px 10px; display: flex; align-items: center; padding: 0 11px; border-radius: 9px; background: #edf0f0; color: #8b9295; font-size: 10px; }
  .official-theater-contact { margin: 0 8px 4px; padding: 12px 10px; display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 9px; align-items: center; border-radius: 11px; }
  .official-theater-contact.active { background: #e8f1ff; }
  .official-theater-avatar { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; background: #d9e8e8; color: #365259; font-size: 10px; font-weight: 800; }
  .official-theater-contact:nth-of-type(4) .official-theater-avatar { background: #efe4dc; color: #73523d; }
  .official-theater-contact:nth-of-type(5) .official-theater-avatar { background: #e8e2f4; color: #5b4c79; }
  .official-theater-contact strong { display: block; overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
  .official-theater-contact p { margin: 4px 0 0; overflow: hidden; color: var(--official-muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
  .official-theater-contact time { color: #969c9f; font-size: 8px; }
  .official-product-scene[hidden] { display: none; }
  .official-product-scene { min-width: 0; min-height: 650px; display: grid; grid-template-columns: minmax(0, 1fr) 292px; animation: official-panel-in .45s cubic-bezier(.16,1,.3,1); }
  .official-theater-chat { min-width: 0; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; background: #fff; }
  .official-theater-chat-head { min-height: 65px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 0 22px; border-bottom: 1px solid #e4e7e8; }
  .official-theater-chat-head strong { display: block; font-size: 13px; }
  .official-theater-chat-head span { display: block; margin-top: 4px; color: var(--official-muted); font-size: 9px; }
  .official-theater-presence { width: 8px; height: 8px; flex: 0 0 auto; border-radius: 50%; background: #37bd83; box-shadow: 0 0 0 5px rgb(55 189 131 / .12); }
  .official-theater-messages { position: relative; overflow: hidden; padding: 30px clamp(22px, 3vw, 44px); background: linear-gradient(160deg, #fbfdff, #f8f6ff); }
  .official-theater-messages::before { content: ""; position: absolute; width: 300px; height: 300px; right: -160px; top: -150px; border-radius: 50%; background: var(--scene-glow, rgb(71 190 169 / .16)); filter: blur(8px); }
  .official-theater-bubble { position: relative; max-width: 82%; padding: 17px 18px; border: 1px solid #e5e8e8; border-radius: 15px 15px 15px 5px; background: #fff; box-shadow: 0 12px 30px rgb(37 53 56 / .07); }
  .official-theater-bubble + .official-theater-bubble { margin-top: 16px; margin-left: auto; border-radius: 15px 15px 5px; background: linear-gradient(135deg, #e9f3ff, #f5edff); }
  .official-theater-bubble span { display: block; margin-bottom: 8px; color: var(--official-muted); font-size: 9px; }
  .official-theater-bubble p { margin: 0; color: #293033; font-size: 12px; line-height: 1.62; }
  .official-theater-inline-translation { margin-top: 11px; padding-top: 11px; border-top: 1px solid #dfe5ef; color: #2f86c6; font-size: 12px; font-weight: 740; line-height: 1.58; }
  .official-theater-composer { margin: 0 18px 18px; padding: 13px 14px; border: 1px solid #dde2e3; border-radius: 13px; background: #fff; box-shadow: 0 8px 24px rgb(32 49 52 / .06); }
  .official-theater-composer p { margin: 0; color: #4f585b; font-size: 10px; line-height: 1.55; }
  .official-theater-composer-foot { margin-top: 12px; display: flex; align-items: center; justify-content: space-between; color: var(--official-muted); font-size: 9px; }
  .official-theater-send { min-width: 54px; height: 26px; display: grid; place-items: center; border-radius: 8px; background: #68b9f2; color: #10213d; font-size: 9px; font-weight: 800; box-shadow: 0 7px 16px rgb(69 145 199 / .2); }
  .official-theater-inspector { min-width: 0; padding: 20px 18px; border-left: 1px solid #dfe3e4; background: #f5f7f7; }
  .official-theater-inspector > span { color: var(--official-muted); font-size: 9px; font-weight: 760; letter-spacing: .06em; }
  .official-theater-inspector h2 { margin: 9px 0 18px; font-size: 19px; line-height: 1.18; letter-spacing: -.03em; }
  .official-theater-panel { margin-top: 10px; padding: 14px; border: 1px solid #e0e4e5; border-radius: 12px; background: #fff; }
  .official-theater-panel small { display: block; color: var(--official-muted); font-size: 8px; }
  .official-theater-panel strong { display: block; margin-top: 7px; color: #2f383a; font-size: 11px; line-height: 1.5; }
  .official-theater-panel.accent { border-color: rgb(39 113 255 / .24); background: linear-gradient(135deg, #e9f3ff, #f5edff); }
  .official-theater-panel.accent strong { color: #2f86c6; }
  .official-theater-checks { margin: 18px 0 0; padding: 0; list-style: none; }
  .official-theater-checks li { display: flex; align-items: center; gap: 8px; padding: 9px 0; border-top: 1px solid #e0e4e5; color: #5f686c; font-size: 9px; }
  .official-theater-checks li::before { content: "✓"; width: 16px; height: 16px; display: grid; place-items: center; border-radius: 50%; background: #dff3ea; color: #16805b; font-size: 8px; font-weight: 900; }
  .official-theater-disclaimer { margin: 15px 0 0; color: #83898c; font-size: 8px; line-height: 1.55; }

  .official-home-manifesto { padding: clamp(72px, 9vw, 118px) 0; border-top: 1px solid #eef0f0; }
  .official-home-manifesto-inner { display: grid; grid-template-columns: minmax(260px, .72fr) minmax(0, 1.28fr); gap: clamp(60px, 10vw, 150px); align-items: start; }
  .official-home-manifesto h2 { max-width: 9ch; margin: 0; font-size: clamp(40px, 5.2vw, 68px); line-height: 1.02; letter-spacing: -.052em; }
  .official-home-principles { border-top: 1px solid #d9ddde; }
  .official-home-principle { display: grid; grid-template-columns: 54px 180px minmax(0, 1fr); gap: 24px; padding: 25px 0; border-bottom: 1px solid #d9ddde; }
  .official-home-principle > span { color: #3e94d3; font-size: 11px; font-weight: 800; }
  .official-home-principle strong { font-size: 16px; }
  .official-home-principle p { margin: 0; color: var(--official-copy); font-size: 14px; line-height: 1.68; }

  .official-editorial-section { overflow: hidden; padding: clamp(82px, 10vw, 132px) 0; }
  .official-editorial-section.mint {
    color: #10213d;
    background:
      radial-gradient(circle at 88% 4%, rgb(244 162 207 / .34), transparent 26%),
      radial-gradient(circle at 8% 96%, rgb(140 218 250 / .34), transparent 30%),
      linear-gradient(135deg, #70b9ed 0%, #98b9ef 50%, #eea2cb 100%);
  }
  .official-editorial-section.sky {
    background:
      radial-gradient(circle at 88% 8%, rgb(238 159 202 / .19), transparent 28%),
      radial-gradient(circle at 10% 78%, rgb(112 187 231 / .16), transparent 32%),
      linear-gradient(135deg, #f5fbff, #f7f6ff 55%, #fff5fa);
  }
  .official-editorial-section.mint .official-editorial-head span,
  .official-editorial-section.mint .official-editorial-link { color: #10213d; }
  .official-editorial-section.mint .official-editorial-head p { color: rgb(16 33 61 / .76); }
  .official-editorial-section.mint .official-workbench-demo { border-color: rgb(255 255 255 / .58); box-shadow: 0 40px 90px rgb(62 82 120 / .2); }
  .official-editorial-section.sky .official-future-wall-main {
    color: #10213d;
    background:
      radial-gradient(circle at 78% 18%, rgb(245 171 210 / .4), transparent 27%),
      linear-gradient(135deg, #70b9ed, #a3b5ef 64%, #eea2cb);
    box-shadow: 0 32px 72px rgb(78 116 174 / .2);
  }
  .official-editorial-section.sky .official-future-wall-main .official-status { border-color: rgb(255 255 255 / .68); background: rgb(255 255 255 / .28); color: #10213d; }
  .official-editorial-section.sky .official-future-wall-main p { color: rgb(16 33 61 / .76); }
  .official-editorial-section.sky .official-future-wall-main .official-button { border-color: rgb(255 255 255 / .7); background: rgb(255 255 255 / .38); color: #10213d; -webkit-backdrop-filter: blur(18px) saturate(150%); backdrop-filter: blur(18px) saturate(150%); }
  .official-editorial-section.sky .official-future-wall-grid figure:nth-child(1) { background: #f0e9ff; }
  .official-editorial-section.sky .official-future-wall-grid figure:nth-child(2) { background: #e4f1ff; }
  .official-editorial-section.sky .official-future-wall-grid figure:nth-child(3) { background: #e9edff; }
  .official-editorial-section.sky .official-future-wall-grid figure:nth-child(4) { background: #ffe8f3; }
  .official-editorial-head { display: grid; grid-template-columns: minmax(260px, .8fr) minmax(0, 1.2fr); align-items: end; gap: clamp(46px, 8vw, 112px); margin-bottom: 46px; }
  .official-editorial-head span { display: block; margin-bottom: 16px; color: #3e94d3; font-size: 11px; font-weight: 820; letter-spacing: .08em; }
  .official-editorial-head h2 { max-width: 10ch; margin: 0; font-size: clamp(42px, 5.4vw, 70px); line-height: 1.01; letter-spacing: -.052em; }
  .official-editorial-head p { max-width: 57ch; margin: 0; color: var(--official-copy); font-size: 16px; line-height: 1.78; }
  .official-editorial-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 20px; color: var(--official-ink); font-size: 13px; font-weight: 800; }
  .official-editorial-link::after { content: "→"; transition: transform .24s cubic-bezier(.16,1,.3,1); }
  .official-editorial-link:hover::after { transform: translateX(4px); }
  .official-editorial-section .official-workbench-demo { border: 1px solid rgb(204 214 215 / .84); border-radius: 16px; box-shadow: 0 34px 80px rgb(31 56 59 / .13); }
  .official-editorial-section .official-workbench-panel { min-height: 560px; }
  .official-end-cta-inner { border-radius: 18px; background: linear-gradient(125deg, #70b9ed, #a3b5ef 64%, #eea2cb); color: #10213d; box-shadow: 0 28px 66px rgb(74 117 177 / .2); }
  .official-end-cta p { color: rgb(16 33 61 / .72); }
  .official-footer { background: #f5f7f7; }
  [data-reveal] { opacity: 1; transform: none; }
  .official-reveal-pending { opacity: 1; transform: none; }
  .official-reveal-in { animation: official-reveal-in .48s cubic-bezier(.16,1,.3,1) both; }
  @keyframes official-wave { from { transform: scaleY(.68); opacity: .5; } to { transform: scaleY(1); opacity: 1; } }
  @keyframes official-voice-breathe { 0%, 100% { transform: scale(1); box-shadow: inset 0 1px 0 #fff, 0 16px 36px rgb(61 49 78 / .14); } 50% { transform: scale(1.045); box-shadow: inset 0 1px 0 #fff, 0 20px 44px rgb(106 82 137 / .2); } }
  @keyframes official-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
  @keyframes official-panel-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
  @keyframes official-reveal-in { from { opacity: .72; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }
  @keyframes official-hero-copy-in { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } }
  @keyframes official-hero-visual-in { from { opacity: 0; clip-path: inset(0 0 22% 0 round 24px); } to { opacity: 1; clip-path: inset(0 0 0 0 round 24px); } }
  @media (max-width: 1020px) {
    .official-links, .official-nav > .official-button { display: none; }
    .official-mobile-menu { display: block; }
    .official-home-hero, .official-page-hero { grid-template-columns: 1fr; min-height: auto; gap: 46px; padding-top: 64px; }
    .official-detail-grid { grid-template-columns: 1fr; gap: 36px; }
    .official-home-routes { grid-template-columns: repeat(2, 1fr); margin-top: -16px; }
    .official-home-route:nth-child(3) { border-left: 0; border-top: 1px solid rgb(210 210 215 / .72); }
    .official-home-route:nth-child(4) { border-top: 1px solid rgb(210 210 215 / .72); }
    .official-showcase-head { grid-template-columns: 1fr; gap: 18px; }
    .official-future-wall { grid-template-columns: 1fr; }
    .official-feature-explorer { grid-template-columns: 1fr; }
    .official-feature-tabs { display: grid; grid-template-columns: repeat(4, 1fr); padding: 0; border-right: 0; border-bottom: 1px solid var(--official-line); }
    .official-feature-tab { min-height: 84px; grid-template-columns: 1fr; gap: 4px; padding: 16px; border-right: 1px solid var(--official-line); border-bottom: 0; }
    .official-feature-tab:last-child { border-right: 0; }
    .official-feature-tab:hover { padding-left: 16px; }
    .official-feature-tab small { display: none; }
    .official-detail-aside { position: static; }
    .official-download-item { grid-template-columns: 150px minmax(0, 1fr) auto; }
    .official-download-empty { grid-template-columns: 150px minmax(0, 1fr) auto; }
    .official-comparison-row { grid-template-columns: 150px minmax(0, .85fr) minmax(0, 1.15fr); gap: 24px; }
    .official-future-capability-panel { grid-template-columns: 1fr; }
    .official-pricing-intro { grid-template-columns: 1fr; gap: 20px; }
    .official-pricing-stage-head { min-height: 52px; }
    .official-pricing-grid { grid-template-columns: 1fr; }
    .official-pricing-plan { min-height: 0; }
    .official-pricing-plan + .official-pricing-plan { border-top: 1px solid var(--official-line); border-left: 0; }
    .official-pricing-overview { grid-template-columns: 1fr; gap: 32px; }
    .official-pricing-overview-copy { position: static; }
    .official-future-capability-media { min-height: 340px; }
    .official-capability-card.voice, .official-capability-card.manage, .official-capability-card.fallback, .official-capability-card.future { grid-column: span 6; }
    .official-capability-card.future { grid-template-columns: 1fr; }
    .official-theater-body { grid-template-columns: 72px 200px minmax(0, 1fr); }
    .official-product-scene { grid-template-columns: minmax(0, 1fr) 240px; }
    .official-home-manifesto-inner { grid-template-columns: 1fr; gap: 38px; }
    .official-home-manifesto h2 { max-width: 12ch; }
  }
  @media (max-width: 700px) {
    .official-wrap { width: min(100% - 32px, 1180px); }
    .official-header { padding-top: 8px; }
    .official-nav { min-height: 56px; padding-left: 10px; border-radius: 16px; }
    .official-mobile-panel { background: rgb(245 245 247 / .98); }
    .official-brand { font-size: 17px; }
    .official-mark { width: 36px; height: 36px; }
    .official-home-hero, .official-page-hero { gap: 38px; padding-top: 46px; padding-bottom: 70px; }
    .official-home-hero h1, .official-page-hero h1 { font-size: 40px; line-height: 1.1; }
    .official-lead { font-size: 16px; }
    .official-actions { display: grid; grid-template-columns: 1fr; }
    .official-actions .official-button { width: 100%; }
    .official-home-routes { display: flex; margin-top: -24px; overflow-x: auto; scroll-snap-type: x mandatory; border-radius: 18px; }
    .official-home-route { min-width: 220px; min-height: 98px; scroll-snap-align: start; }
    .official-home-route + .official-home-route,
    .official-home-route:nth-child(3),
    .official-home-route:nth-child(4) { border-top: 0; border-left: 1px solid rgb(210 210 215 / .72); }
    .official-product-story { padding: 24px 20px; }
    .official-pricing-intro { padding-bottom: 28px; }
    .official-pricing-intro h2 { font-size: 38px; }
    .official-pricing-stage { margin-top: 14px; border-radius: 18px; }
    .official-pricing-stage-head { align-items: flex-start; flex-direction: column; justify-content: center; gap: 2px; padding: 12px 22px; }
    .official-pricing-plan { padding: 26px 22px; }
    .official-pricing-plan > p { min-height: 0; }
    .official-pricing-compare-row { grid-template-columns: minmax(70px, .58fr) minmax(90px, 1.25fr) repeat(3, minmax(0, .75fr)); gap: 8px; padding: 16px 0; }
    .official-pricing-compare-row > strong, .official-pricing-compare-row > span { font-size: 12px; }
    .official-pricing-compare-row:first-child > span { min-height: 42px; font-size: 11px; }
    .official-motion-story { min-height: auto; }
    .official-motion-stage { position: static; min-height: 0; grid-template-columns: 1fr; gap: 24px; padding: 28px 20px 20px; border-radius: 24px; }
    .official-motion-kicker { margin-bottom: 12px; }
    .official-motion-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
    .official-motion-step { min-height: 92px; padding: 14px 10px; border-radius: 14px; text-align: center; }
    .official-motion-step::before { position: static; width: 22px; height: 22px; margin: 0 auto 8px; }
    .official-motion-step strong { font-size: 13px; }
    .official-motion-step span { display: none; }
    .official-motion-step[aria-current="step"] { transform: none; }
    .official-motion-progress, .official-motion-hint { display: none; }
    .official-motion-canvas { min-height: 0; border-radius: 21px; }
    .official-motion-canvas-body { min-height: 0; display: grid; gap: 12px; padding: 16px; }
    .official-motion-layer,
    .official-motion-customer,
    .official-motion-translation-card,
    .official-motion-reply { position: static; width: 100%; }
    .official-motion-ready .official-motion-layer { opacity: 1 !important; transform: none !important; pointer-events: auto !important; }
    .official-motion-caption { align-items: flex-start; flex-direction: column; justify-content: center; padding-block: 10px; }
    .official-future-wall-main { min-height: 560px; grid-template-columns: 1fr; align-content: space-between; padding: 34px 24px 0; }
    .official-future-wall-main img { width: min(230px, 72%); }
    .official-future-wall-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
    .official-future-wall-grid figure { min-height: 220px; padding: 18px 12px 14px; border-radius: 20px; }
    .official-future-wall-grid img { width: min(120px, 82%); max-height: 140px; }
    .official-future-wall-grid figcaption { display: grid; gap: 3px; }
    .official-product-story li { grid-template-columns: 26px 1fr; gap: 8px 12px; }
    .official-product-story li span { grid-column: 2; }
    .official-section-head h2 { font-size: 34px; }
    .official-comparison-row { grid-template-columns: 1fr; gap: 10px; padding: 24px 0; }
    .official-comparison-row:first-child { display: none; }
    .official-comparison-row > strong { font-size: 14px; }
    .official-feature-tabs { grid-template-columns: repeat(2, 1fr); }
    .official-feature-tab:nth-child(2) { border-right: 0; }
    .official-feature-tab:nth-child(-n+2) { border-bottom: 1px solid var(--official-line); }
    .official-feature-stage { min-height: 420px; padding: 30px 22px; }
    .official-feature-panel h3 { font-size: 34px; }
    .official-link-row { min-height: 0; grid-template-columns: 1fr auto; gap: 10px 18px; padding: 26px 0; }
    .official-link-row > span:first-child { grid-column: 1 / -1; }
    .official-link-row p { grid-column: 1; }
    .official-link-row > span:last-child { grid-column: 2; grid-row: 2 / span 2; align-self: center; }
    .official-link-row:hover { padding-inline: 0; }
    .official-future-teaser { min-height: 0; grid-template-columns: 1fr; padding: 34px 24px 0; }
    .official-future-teaser-media img { width: min(210px, 72%); }
    .official-demo-head { flex-wrap: wrap; }
    .official-demo-head span { flex-basis: calc(100% - 46px); margin: -6px 0 2px 46px; }
    .official-demo-toolbar { align-items: flex-start; flex-direction: column; }
    .official-demo-foot { flex-direction: column; }
    .official-workbench-body { min-height: 0; grid-template-columns: 1fr; }
    .official-workbench-tabs { grid-template-columns: repeat(3, 1fr); padding: 10px; border-right: 0; border-bottom: 1px solid var(--official-line); }
    .official-workbench-tab { min-height: 58px; display: flex; }
    .official-workbench-tab img { width: 26px; height: 26px; }
    .official-workbench-panel { min-height: 430px; padding: 26px 18px; }
    .official-workbench-head { grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 10px 12px; }
    .official-workbench-head span { grid-column: 1 / -1; }
    .official-message { padding: 16px; }
    .official-detail-list li { grid-template-columns: 42px 1fr; gap: 8px 12px; }
    .official-detail-list li strong, .official-detail-list li span { grid-column: 2; }
    .official-detail-list li::before { grid-column: 1; grid-row: 1 / span 2; }
    .official-detail-list li:hover { transform: none; }
    .official-voice-visual { min-height: 140px; gap: 14px; }
    .official-voice-orb { width: 58px; height: 58px; }
    .official-wave { width: min(240px, 72%); gap: 5px; }
    .official-voice-copy { flex-direction: column; }
    .official-platform-ribbon { align-items: flex-start; flex-direction: column; gap: 18px; padding: 22px 18px; }
    .official-platform-ribbon-copy { min-width: 0; }
    .official-platform-dock { width: 100%; justify-content: flex-start; }
    .official-platform-dock-item { width: 52px; height: 52px; border-radius: 16px; }
    .official-capability-mosaic { grid-template-columns: 1fr; gap: 14px; }
    .official-capability-card.voice, .official-capability-card.manage, .official-capability-card.fallback, .official-capability-card.future { grid-column: 1; min-height: 0; }
    .official-capability-card { padding: 28px 22px; transform: none; }
    .official-capability-card.future { grid-template-columns: minmax(0, 1fr) minmax(120px, .62fr); }
    .official-capability-voice-ui { grid-template-columns: 1fr; gap: 8px; }
    .official-capability-voice-ui .official-wave { width: 100%; }
    .official-voice-toggle { width: 100%; }
    .official-future-card-media img { width: min(180px, 100%); }
    .official-future-visual { min-height: 370px; }
    .official-future-capability-tabs { grid-template-columns: repeat(2, 1fr); }
    .official-future-capability-tab { min-height: 58px; border-bottom: 1px solid var(--official-line); }
    .official-future-capability-tab:nth-child(2n) { border-right: 0; }
    .official-future-capability-tab:last-child { grid-column: auto; border-bottom: 0; }
    .official-future-capability-panel { min-height: 0; padding: 32px 22px; }
    .official-future-capability-copy h3 { font-size: 36px; }
    .official-future-capability-points li { grid-template-columns: 1fr; gap: 5px; }
    .official-future-capability-media { min-height: 300px; }
    .official-hero-demo { transform: none; }
    .official-plan-names { grid-template-columns: 1fr; }
    .official-plan-name { min-height: 112px; padding: 22px 0; }
    .official-plan-name + .official-plan-name { border-left: 0; border-top: 1px solid var(--official-line); }
    .official-pricing-note { align-items: flex-start; flex-direction: column; }
    .official-pricing-note .official-button { width: 100%; }
    .official-download-item, .official-download-empty { display: block; padding: 28px 0; }
    .official-download-item h2 { margin-top: 10px; }
    .official-download-item .official-button { width: 100%; margin-top: 20px; }
    .official-guide article { grid-template-columns: 50px 1fr; gap: 12px 16px; }
    .official-guide p { grid-column: 2; }
    .official-legal { width: min(100% - 32px, 860px); padding-top: 52px; }
    .official-end-cta-inner { align-items: flex-start; flex-direction: column; padding: 30px 24px; }
    .official-end-cta .official-button { width: 100%; }
    .official-footer-inner { grid-template-columns: 1fr; gap: 32px; padding-top: 40px; }
    .official-home-intro { padding-top: 58px; }
    .official-home-intro h1 { font-size: clamp(43px, 13vw, 58px); line-height: 1.01; }
    .official-home-intro .official-lead { margin-top: 22px; font-size: 16px; }
    .official-home-intro .official-actions { display: flex; flex-direction: column; }
    .official-product-theater-wrap { width: calc(100% - 20px); margin-top: 46px; padding-bottom: 68px; }
    .official-product-theater { --theater-scale: 1; --theater-y: 0px; border-radius: 14px; transform: none; }
    .official-theater-titlebar { min-height: 48px; grid-template-columns: 78px minmax(0, 1fr); padding: 0 12px; }
    .official-theater-titlebar strong { justify-self: start; }
    .official-theater-titlebar > span { display: none; }
    .official-theater-body { min-height: 0; grid-template-columns: 1fr; }
    .official-theater-rail { padding: 9px 10px; flex-direction: row; border-right: 0; border-bottom: 1px solid #dfe3e4; }
    .official-theater-logo { width: 32px; height: 32px; margin: 0 6px 0 0; }
    .official-theater-tab { width: auto; min-height: 44px; grid-template-columns: 24px auto; padding: 6px 10px; }
    .official-theater-tab img { width: 22px; height: 22px; }
    .official-theater-rail-mark { display: none; }
    .official-theater-inbox { display: none; }
    .official-product-scene { min-height: 590px; grid-template-columns: 1fr; }
    .official-theater-chat { min-height: 590px; }
    .official-theater-inspector { display: none; }
    .official-theater-chat-head { min-height: 58px; padding-inline: 16px; }
    .official-theater-messages { padding: 22px 15px; }
    .official-theater-bubble { max-width: 92%; }
    .official-platform-proof { gap: 12px; }
    .official-home-manifesto { padding-block: 72px; }
    .official-home-manifesto h2 { font-size: 42px; }
    .official-home-principle { grid-template-columns: 40px minmax(0, 1fr); gap: 8px 14px; }
    .official-home-principle p { grid-column: 2; }
    .official-editorial-head { grid-template-columns: 1fr; gap: 22px; margin-bottom: 30px; }
    .official-editorial-head h2 { font-size: 42px; }
    .official-editorial-section .official-workbench-panel { min-height: 460px; }
  }
  @media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .official-site *, .official-site *::before, .official-site *::after { animation: none !important; transition-duration: .01ms !important; }
    .official-reveal-pending { opacity: 1; transform: none; }
    .official-motion-story { min-height: auto; }
    .official-motion-stage { position: static; }
    .official-motion-ready .official-motion-layer { opacity: 1 !important; transform: none !important; pointer-events: auto !important; }
    .official-future-wall[data-parallax-wall] [data-parallax-item] { transform: none !important; will-change: auto; }
  }
  @media (prefers-reduced-transparency: reduce) {
    .official-nav, .official-mobile-panel, .official-future-note, .official-button, .official-flow-proof { background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; }
  }
  @media (prefers-contrast: more) {
    .official-nav, .official-mobile-panel { border-color: #64748b; background: #fff; }
  }

  /* Home cinema redesign: product-led, bright, and intentionally restrained. */
  .official-site {
    --official-ink: #15213a;
    --official-copy: #536078;
    --official-muted: #59657b;
    --official-blue: #6f96e5;
    --official-blue-hover: #587fd2;
    --official-blue-soft: #edf3ff;
    --official-pink: #e89ab8;
    --official-pink-soft: #fff0f6;
    --official-line: #dfe5ef;
    --official-type-hero: clamp(2.75rem, 4.2vw, 3.75rem);
    --official-type-section: clamp(2.125rem, 3.2vw, 3rem);
    --official-type-subsection: clamp(1.75rem, 2.6vw, 2.5rem);
    --official-section-space: clamp(5rem, 7vw, 6.5rem);
    --official-nav-offset: 86px;
    background: #f8faff;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei UI", sans-serif;
    font-kerning: normal;
  }
  .official-wrap { width: min(1240px, calc(100% - 56px)); }
  .official-header {
    position: fixed;
    inset: 0 0 auto;
    z-index: 30;
    padding-top: 12px;
  }
  .official-site main { padding-top: var(--official-nav-offset); }
  .official-header::after { display: none; }
  .official-nav {
    min-height: 62px;
    border-color: rgb(255 255 255 / .86);
    background: rgb(255 255 255 / .78);
    box-shadow: inset 0 1px 0 #fff, 0 8px 30px rgb(47 67 111 / .09);
  }
  .official-site[data-scrolled] .official-nav {
    min-height: 58px;
    background: rgb(255 255 255 / .9);
    box-shadow: inset 0 1px 0 #fff, 0 8px 28px rgb(47 67 111 / .11);
  }
  .official-nav-link[aria-current="page"] { background: #f2f5fb; }
  .official-button,
  .official-button:not(.primary):nth-child(2) {
    border-color: transparent;
    background:
      linear-gradient(rgb(255 255 255 / .86), rgb(255 255 255 / .78)) padding-box,
      linear-gradient(112deg, rgb(111 150 229 / .62), rgb(232 154 184 / .62)) border-box;
    color: var(--official-ink);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .96), 0 5px 8px rgb(67 91 144 / .09);
  }
  .official-button:hover,
  .official-button:not(.primary):nth-child(2):hover {
    border-color: transparent;
    background:
      linear-gradient(rgb(255 255 255 / .96), rgb(255 255 255 / .9)) padding-box,
      linear-gradient(112deg, rgb(95 141 232 / .82), rgb(232 142 180 / .82)) border-box;
    color: var(--official-ink);
    box-shadow: inset 0 1px 0 #fff, 0 7px 8px rgb(67 91 144 / .13);
  }
  .official-button.primary {
    border-color: rgb(255 255 255 / .54);
    background: linear-gradient(112deg, #79aae9 0%, #a9a5e6 54%, #e9a0bc 100%);
    color: #14213c;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .72), inset 0 -1px 0 rgb(72 92 155 / .16), 0 7px 8px rgb(88 111 175 / .2);
  }
  .official-button.primary:hover {
    border-color: rgb(255 255 255 / .72);
    background: linear-gradient(112deg, #6e9fe4 0%, #9d9bdd 52%, #e793b3 100%);
    color: #101d37;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .72), inset 0 -1px 0 rgb(72 92 155 / .18), 0 8px 8px rgb(88 111 175 / .24);
  }
  .official-button.primary::after { background: radial-gradient(circle at var(--button-glare-x, 50%) var(--button-glare-y, 50%), rgb(255 255 255 / .3), transparent 46%); }
  .official-header .official-button.primary {
    border-color: rgb(255 255 255 / .62);
    background: linear-gradient(112deg, rgb(121 170 233 / .82), rgb(169 165 230 / .78), rgb(233 160 188 / .82));
    color: #14213c;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .78), 0 5px 8px rgb(79 103 163 / .16);
    -webkit-backdrop-filter: blur(20px) saturate(170%);
    backdrop-filter: blur(20px) saturate(170%);
  }
  .official-header .official-button.primary:hover {
    border-color: rgb(255 255 255 / .78);
    background: linear-gradient(112deg, #73a4e6, #a19ee0, #e897b6);
    color: #101d37;
  }

  .official-cinema-hero {
    position: relative;
    min-height: 0;
    overflow: hidden;
    padding: clamp(2rem, 3vw, 3.25rem) 0 clamp(4.25rem, 6vw, 5.75rem);
    isolation: isolate;
    background:
      radial-gradient(ellipse 54% 92% at 99% 46%, rgb(118 190 244 / .48) 0%, rgb(168 180 239 / .25) 45%, transparent 75%),
      radial-gradient(ellipse 42% 66% at 10% 100%, rgb(131 182 240 / .24) 0%, transparent 74%),
      linear-gradient(118deg, #f5f9ff 0%, #f9fbff 42%, #fff3f8 100%);
  }
  .official-cinema-hero::before,
  .official-cinema-hero::after {
    content: "";
    position: absolute;
    z-index: 0;
    pointer-events: none;
  }
  .official-cinema-hero::before {
    width: min(70vw, 1040px);
    height: min(62vw, 830px);
    top: 49%;
    right: -28vw;
    border-radius: 48% 52% 38% 62% / 54% 42% 58% 46%;
    background: linear-gradient(140deg, rgb(89 171 237 / .4), rgb(169 171 234 / .22) 54%, rgb(242 161 198 / .32));
    filter: blur(20px);
    transform: translateY(-50%) rotate(-10deg);
  }
  .official-cinema-hero::after {
    width: min(46vw, 640px);
    height: min(42vw, 560px);
    left: -20vw;
    bottom: -34vw;
    border-radius: 50%;
    background: rgb(115 178 237 / .2);
    filter: blur(16px);
  }
  .official-cinema-grid {
    position: relative;
    z-index: 1;
    min-height: 0;
    display: block;
  }
  .official-hero-declaration {
    max-width: none;
    margin: 0;
    color: var(--official-ink);
    font-size: clamp(3.25rem, 5.45vw, 5.6rem);
    font-weight: 760;
    line-height: 1.04;
    letter-spacing: -.065em;
    line-break: strict;
    text-align: center;
    white-space: nowrap;
  }
  .official-hero-declaration span { display: inline; }
  .official-cinema-copy {
    position: relative;
    z-index: 2;
    width: min(100%, 960px);
    margin: 0 auto;
    padding: 0;
    text-align: center;
  }
  .official-cinema-label {
    width: fit-content;
    margin: 0 auto 26px;
    padding: 8px 12px;
    border: 1px solid rgb(104 145 220 / .25);
    border-radius: 999px;
    background: rgb(255 255 255 / .5);
    color: #4562a5;
    font-size: 12px;
    font-weight: 780;
    letter-spacing: .04em;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .88);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
  }
  .official-hero-support-title {
    margin: 20px 0 0;
    max-width: 12ch;
    color: #3f5f9b;
    font-size: clamp(2rem, 2.55vw, 2.75rem);
    line-height: 1.14;
    letter-spacing: -.03em;
    text-wrap: balance;
  }
  .official-hero-support-title span { display: block; }
  .official-cinema-copy .official-lead {
    max-width: 38em;
    margin: 1.35rem auto 0;
    font-size: 1.125rem;
    line-height: 1.72;
    text-wrap: pretty;
  }
  .official-cinema-copy .official-actions { justify-content: center; margin-top: 30px; }
  .official-cinema-platforms {
    justify-content: center;
    margin-top: 30px;
    display: flex;
    align-items: center;
    gap: 14px;
    color: var(--official-muted);
    font-size: 12px;
  }
  .official-cinema-platforms > span { margin-right: 4px; }
  .official-cinema-platforms img {
    width: 30px;
    height: 30px;
    display: block;
    border-radius: 8px;
    object-fit: contain;
  }
  .official-cinema-visual {
    position: relative;
    width: min(920px, 72vw);
    min-width: 0;
  }
  .official-cinema-visual::before,
  .official-cinema-visual::after {
    content: "";
    position: absolute;
    pointer-events: none;
  }
  .official-cinema-visual::before {
    width: 78%;
    height: 78%;
    right: -7%;
    top: -8%;
    border-radius: 16px;
    background: #e6efff;
  }
  .official-cinema-visual::after {
    width: 34%;
    height: 42%;
    left: -4%;
    bottom: -5%;
    border-radius: 16px;
    background: #ffebf3;
  }
  .official-cinema-visual .official-product-theater-wrap { position: relative; z-index: 1; width: 100%; margin: 0; padding: 0; }
  .official-cinema-visual .official-product-theater {
    --theater-scale: 1;
    --theater-y: 0px;
    width: 920px;
    border: 0;
    border-radius: 16px;
    box-shadow: 0 26px 68px rgb(45 69 126 / .2);
    transform: translate3d(0, 0, 0);
  }
  .official-cinema-visual .official-product-theater:hover { box-shadow: 0 30px 72px rgb(45 69 126 / .23); }
  .official-cinema-visual .official-theater-body { min-height: 560px; grid-template-columns: 68px 208px minmax(0, 1fr); }
  .official-cinema-visual .official-product-scene { min-height: 560px; grid-template-columns: minmax(0, 1fr) 248px; }
  .official-cinema-visual .official-theater-chat { min-height: 560px; }
  .official-cinema-visual .official-theater-titlebar { min-height: 48px; }
  .official-cinema-visual .official-theater-messages { padding: 26px 30px; }
  .official-cinema-visual .official-theater-inspector { padding: 18px 16px; }

  .official-agent-cinema-grid {
    display: block;
  }
  .official-agent-hero-visual {
    position: relative;
    width: min(100%, 1020px);
    min-height: 530px;
    margin: clamp(3.5rem, 6vw, 5.5rem) auto 0;
    display: block;
    overflow: hidden;
    border: 1px solid rgb(255 255 255 / .8);
    border-radius: 28px;
    background:
      radial-gradient(circle at 76% 26%, rgb(255 255 255 / .8) 0 2px, transparent 3px),
      radial-gradient(circle at 82% 18%, rgb(255 255 255 / .68) 0 1px, transparent 2px),
      linear-gradient(140deg, #bad8fb 0%, #d8e7ff 43%, #f7d6e5 100%);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .86), 0 32px 76px rgb(55 75 128 / .2);
    isolation: isolate;
  }
  .official-agent-hero-visual::before {
    content: "";
    position: absolute;
    width: 520px;
    height: 520px;
    right: -142px;
    bottom: -214px;
    border-radius: 50%;
    border: 1px solid rgb(255 255 255 / .7);
    background: rgb(255 255 255 / .18);
    box-shadow: 0 0 0 42px rgb(255 255 255 / .08), 0 0 0 84px rgb(255 255 255 / .05);
    pointer-events: none;
  }
  .official-agent-stage-horizon {
    position: absolute;
    z-index: 1;
    inset: auto 8% 38% 7%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgb(255 255 255 / .85), transparent);
  }
  .official-agent-stage-horizon::before,
  .official-agent-stage-horizon::after {
    content: "";
    position: absolute;
    top: -1px;
    width: 54px;
    height: 3px;
    border-radius: 999px;
    background: rgb(255 255 255 / .88);
  }
  .official-agent-stage-horizon::before { left: 14%; }
  .official-agent-stage-horizon::after { right: 8%; }
  .official-agent-stage-copy {
    position: relative;
    z-index: 2;
    max-width: 310px;
    padding: 36px 34px;
  }
  .official-agent-stage-head { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 8px; color: #455d9b; white-space: nowrap; }
  .official-agent-stage-head span { min-width: 0; font-size: 9px; font-weight: 800; letter-spacing: .085em; white-space: nowrap; }
  .official-agent-stage-head strong { color: #26385f; font-size: 13px; letter-spacing: -.02em; white-space: nowrap; }
  .official-agent-stage-head i { padding: 4px 7px; border: 1px solid rgb(82 110 172 / .2); border-radius: 999px; color: #7a608d; font-size: 10px; font-style: normal; font-weight: 760; white-space: nowrap; }
  .official-agent-stage-statement { margin-top: 46px; }
  .official-agent-stage-statement span,
  .official-agent-stage-statement strong { display: block; }
  .official-agent-stage-statement span { color: #4c6093; font-size: clamp(1.45rem, 2.2vw, 2rem); font-weight: 720; line-height: 1.2; letter-spacing: -.04em; }
  .official-agent-stage-statement strong { margin-top: 7px; color: var(--official-ink); font-size: clamp(1.85rem, 2.8vw, 2.65rem); line-height: 1.08; letter-spacing: -.055em; }
  .official-agent-stage-flow { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 26px; }
  .official-agent-stage-flow span { padding: 7px 10px; border: 1px solid rgb(255 255 255 / .66); border-radius: 999px; background: rgb(255 255 255 / .34); color: #43557f; font-size: 11px; font-weight: 720; box-shadow: inset 0 1px 0 rgb(255 255 255 / .7); }
  .official-agent-portrait {
    position: absolute;
    z-index: 3;
    right: 7%;
    bottom: 0;
    width: min(48%, 350px);
    min-width: 220px;
    display: grid;
    align-items: end;
    justify-items: center;
  }
  .official-agent-portrait img {
    width: 100%;
    height: auto;
    filter: drop-shadow(0 22px 16px rgb(64 67 122 / .18));
    transform-origin: center bottom;
  }
  .official-agent-statusboard {
    position: absolute;
    z-index: 4;
    left: 34px;
    bottom: 32px;
    width: min(292px, calc(100% - 68px));
    margin: 0;
    padding: 18px 19px;
    border: 1px solid rgb(255 255 255 / .78);
    border-radius: 16px;
    background: rgb(255 255 255 / .6);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .96), 0 12px 22px rgb(74 84 135 / .1);
    -webkit-backdrop-filter: blur(24px) saturate(160%);
    backdrop-filter: blur(24px) saturate(160%);
  }
  .official-agent-statusboard > span {
    display: block;
    color: #5d68a4;
    font-size: 10px;
    font-weight: 780;
  }
  .official-agent-statusboard > strong {
    display: block;
    margin-top: 7px;
    color: var(--official-ink);
    font-size: 1.125rem;
    line-height: 1.25;
    letter-spacing: -.015em;
  }
  .official-agent-statusboard > p {
    margin: 7px 0 0;
    color: #5d667e;
    font-size: .8125rem;
    line-height: 1.6;
  }
  .official-agent-statusboard small {
    display: block;
    margin-top: 10px;
    color: #835f73;
    font-size: 10px;
    line-height: 1.55;
  }

  .official-hero-intro {
    width: min(100%, 1040px);
    margin: 0 auto;
    text-align: center;
  }
  .official-hero-intro .official-cinema-label { margin-inline: auto; }
  .official-hero-lower {
    width: min(100%, 1080px);
    margin: clamp(2.75rem, 4vw, 4rem) auto 0;
    display: grid;
    grid-template-columns: minmax(0, .94fr) minmax(0, 1.06fr);
    align-items: start;
    gap: clamp(2.25rem, 4vw, 3.75rem);
  }
  .official-hero-lower .official-cinema-copy {
    width: auto;
    margin: 0;
    padding-top: 28px;
    text-align: left;
  }
  .official-hero-lower .official-hero-support-title { margin-top: 0; font-size: clamp(1.9rem, 2.4vw, 2.55rem); }
  .official-hero-lower .official-cinema-copy .official-lead { max-width: 33ch; margin-inline: 0; font-size: 1.0625rem; }
  .official-hero-lower .official-cinema-copy .official-actions,
  .official-hero-lower .official-cinema-platforms { justify-content: flex-start; }
  .official-hero-lower .official-agent-hero-visual {
    width: 100%;
    min-height: 430px;
    margin: 0;
    border-radius: 22px;
  }
  .official-hero-lower .official-agent-stage-copy { box-sizing: border-box; width: 62%; max-width: none; padding: 32px 34px; }
  .official-hero-lower .official-agent-stage-statement { margin-top: 30px; }
  .official-hero-lower .official-agent-stage-statement span { font-size: 1.45rem; }
  .official-hero-lower .official-agent-stage-statement strong { font-size: clamp(1.8rem, 2.35vw, 2.15rem); white-space: nowrap; }
  .official-hero-lower .official-agent-stage-flow { display: grid; grid-template-columns: repeat(3, max-content); gap: 8px; margin-top: 20px; }
  .official-hero-lower .official-agent-portrait { right: 5%; width: min(36%, 235px); min-width: 170px; }
  .official-hero-lower .official-agent-statusboard { left: 22px; bottom: 20px; width: min(280px, calc(55% - 24px)); max-width: none; padding: 18px 19px; }

  .official-product-theater { background: #f8faff; }
  .official-theater-rail { background: #f0f4ff; }
  .official-theater-tab[aria-selected="true"] { color: #3d65c8; background: linear-gradient(145deg, #fff, #fff0f6); box-shadow: 0 5px 8px rgb(75 112 203 / .14); }
  .official-theater-contact.active { background: #edf3ff; }
  .official-theater-messages { background: #fbfcff; }
  .official-theater-messages::before { display: none; }
  .official-theater-bubble { box-shadow: 0 6px 8px rgb(39 57 98 / .06); }
  .official-theater-bubble + .official-theater-bubble { background: #f0f4ff; }
  .official-theater-inline-translation { color: #4168d1; }
  .official-theater-composer { box-shadow: 0 5px 8px rgb(39 57 98 / .06); }
  .official-theater-send { background: linear-gradient(112deg, #79aae9, #a9a5e6 54%, #e9a0bc); color: #14213c; box-shadow: inset 0 1px 0 rgb(255 255 255 / .62); }
  .official-theater-panel.accent { border-color: #c9d6f8; background: #edf3ff; }
  .official-theater-panel.accent strong { color: #4168d1; }

  .official-home-positioning { padding: var(--official-section-space) 0; border-top: 1px solid #edf0f5; background: #fff; }
  .official-home-positioning-inner {
    display: block;
  }
  .official-home-positioning h2 {
    max-width: 13em;
    margin: 0;
    font-size: var(--official-type-section);
    line-height: 1.12;
    letter-spacing: -.015em;
    line-break: strict;
    text-wrap: balance;
  }
  .official-home-positioning-copy {
    margin-top: 2.5rem;
    display: grid;
    grid-template-columns: minmax(260px, .72fr) minmax(0, 1.28fr);
    gap: clamp(3rem, 7vw, 6rem);
    align-items: start;
  }
  .official-home-positioning-copy > p { max-width: 34em; margin: 0; color: var(--official-copy); font-size: 1.0625rem; line-height: 1.72; text-wrap: pretty; }
  .official-home-positioning-points { margin: 0; padding: 0; list-style: none; }
  .official-home-positioning-points li {
    display: grid;
    grid-template-columns: 160px minmax(0, 1fr);
    gap: 24px;
    padding: 16px 0;
    border-top: 1px solid var(--official-line);
  }
  .official-home-positioning-points strong { font-size: .9375rem; }
  .official-home-positioning-points span { color: var(--official-copy); font-size: .9375rem; line-height: 1.65; }

  .official-home-film { padding: var(--official-section-space) 0; background: #edf3ff; }
  .official-home-film-head { max-width: 760px; }
  .official-home-film-head h2 {
    max-width: 13em;
    margin: 0;
    font-size: var(--official-type-section);
    line-height: 1.12;
    letter-spacing: -.015em;
    line-break: strict;
    text-wrap: balance;
  }
  .official-home-film-head p { max-width: 58ch; margin: 1rem 0 0; color: #52617d; font-size: 1rem; line-height: 1.7; text-wrap: pretty; }
  .official-film-explorer {
    margin-top: 2.25rem;
    display: grid;
    grid-template-columns: 310px minmax(0, 1fr);
    overflow: hidden;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 22px 60px rgb(55 83 145 / .14);
  }
  .official-film-tabs { padding: 26px 0; background: #f8faff; }
  .official-film-tab {
    width: 100%;
    min-height: 116px;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 14px;
    align-content: center;
    padding: 20px 26px;
    border: 0;
    border-bottom: 1px solid #e4e9f3;
    background: transparent;
    color: var(--official-muted);
    text-align: left;
    cursor: pointer;
    transition: color .28s ease, background-color .28s ease;
  }
  .official-film-tab:last-child { border-bottom: 0; }
  .official-film-tab b {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: #e9eef9;
    color: #59677f;
    font-size: 13px;
  }
  .official-film-tab strong { display: block; color: inherit; font-size: 16px; }
  .official-film-tab span { display: block; margin-top: 7px; font-size: 12px; line-height: 1.55; }
  .official-film-tab:hover { color: var(--official-ink); background: #fff; }
  .official-film-tab[aria-selected="true"] { color: var(--official-ink); background: #fff; }
  .official-film-tab[aria-selected="true"] b { background: linear-gradient(135deg, #dfe9ff, #ffe8f1); color: #4168d1; }
  .official-film-stage { min-width: 0; min-height: 460px; padding: clamp(2rem, 4vw, 3.5rem); display: grid; align-items: center; }
  .official-film-panel[hidden] { display: none; }
  .official-film-panel { animation: official-film-panel-in .55s cubic-bezier(.16,1,.3,1); }
  .official-film-panel > p { margin: 0 0 24px; color: #5e6b82; font-size: 13px; }
  .official-film-message {
    max-width: 680px;
    padding: clamp(24px, 4vw, 40px);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 10px 30px rgb(42 61 105 / .1);
  }
  .official-film-message > span { color: #738097; font-size: 12px; }
  .official-film-message > p { margin: 14px 0 0; color: #24314d; font-size: clamp(18px, 2vw, 25px); line-height: 1.55; }
  .official-film-translation { margin-top: 22px; padding-top: 20px; border-top: 1px solid #dce4f3; }
  .official-film-translation small { display: block; color: #567ee8; font-size: 12px; font-weight: 760; }
  .official-film-translation strong { display: block; margin-top: 10px; color: #314f9f; font-size: clamp(18px, 2vw, 25px); line-height: 1.55; }
  .official-film-reply { margin-left: auto; background: #f2f5ff; }
  .official-film-confirm {
    margin-top: 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    color: #64718a;
    font-size: 12px;
  }
  .official-film-confirm b { padding: 10px 16px; border-radius: 999px; background: linear-gradient(112deg, #79aae9, #a9a5e6 54%, #e9a0bc); color: #14213c; font-size: 12px; box-shadow: inset 0 1px 0 rgb(255 255 255 / .6); }

  .official-home-platforms { padding: var(--official-section-space) 0; background: #fff8fb; }
  .official-home-platforms-head { max-width: 760px; margin-bottom: 2.25rem; }
  .official-home-platforms-head h2 { margin: 0; font-size: var(--official-type-section); line-height: 1.12; letter-spacing: -.015em; line-break: strict; text-wrap: balance; }
  .official-home-platforms-head p { max-width: 60ch; margin: 1rem 0 0; color: var(--official-copy); font-size: 1rem; line-height: 1.7; text-wrap: pretty; }
  .official-home-platforms .official-workbench-demo {
    border: 0;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 20px 54px rgb(49 69 111 / .15);
  }
  .official-home-platforms .official-workbench-tabs { background: #f3f6ff; }
  .official-home-platforms .official-workbench-tab[aria-selected="true"] { color: #4168d1; }
  .official-home-platforms .official-workbench-panel { min-height: 480px; background: #fbfcff; }

  .official-home-future { padding: var(--official-section-space) 0; background: linear-gradient(118deg, #f0f5ff 0 47%, #fff0f6 47% 100%); }
  .official-home-future-inner {
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, .78fr);
    align-items: center;
    gap: clamp(3rem, 7vw, 6rem);
  }
  .official-home-future-copy h2 {
    max-width: 11em;
    margin: 0;
    font-size: var(--official-type-section);
    line-height: 1.12;
    letter-spacing: -.015em;
    line-break: strict;
    text-wrap: balance;
  }
  .official-home-future-copy h2 span { display: block; }
  .official-home-future-copy > p { max-width: 58ch; margin: 1.125rem 0 0; color: #654f60; font-size: 1rem; line-height: 1.72; text-wrap: pretty; }
  .official-future-status {
    width: fit-content;
    margin: 0 0 18px;
    padding: 8px 13px;
    border: 1px solid rgb(197 183 214 / .8);
    border-radius: 999px;
    background: rgb(255 255 255 / .64);
    color: #654f71;
    font-size: 12px;
    font-weight: 760;
    -webkit-backdrop-filter: blur(18px) saturate(150%);
    backdrop-filter: blur(18px) saturate(150%);
  }
  .official-home-future-list { margin: 34px 0 0; padding: 0; list-style: none; border-top: 1px solid #edcad8; }
  .official-home-future-list li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 16px 0;
    border-bottom: 1px solid #edcad8;
  }
  .official-home-future-list strong { font-size: 15px; }
  .official-home-future-list span { color: #8b6577; font-size: 12px; }
  .official-home-future-visual {
    position: relative;
    min-height: 440px;
    display: grid;
    place-items: end center;
  }
  .official-home-future-visual::before {
    content: "";
    position: absolute;
    width: 340px;
    height: 340px;
    border-radius: 50%;
    background: #fff;
    box-shadow: inset 0 0 0 1px rgb(234 201 216 / .82);
  }
  .official-home-future-visual img {
    position: relative;
    z-index: 1;
    width: min(292px, 80%);
    height: auto;
    filter: drop-shadow(0 18px 12px rgb(106 66 84 / .16));
    transform-origin: center bottom;
  }
  .official-home-future-note {
    position: absolute;
    z-index: 2;
    right: 0;
    top: 42px;
    max-width: 220px;
    padding: 15px 17px;
    border-radius: 14px;
    background: rgb(255 255 255 / .82);
    color: #6d5666;
    font-size: 12px;
    line-height: 1.55;
    box-shadow: 0 7px 8px rgb(102 64 82 / .1);
    -webkit-backdrop-filter: blur(18px) saturate(150%);
    backdrop-filter: blur(18px) saturate(150%);
  }

  .official-home-playbook {
    position: relative;
    overflow: hidden;
    padding: var(--official-section-space) 0;
    background:
      radial-gradient(circle at 7% 18%, rgb(128 177 237 / .24), transparent 27%),
      radial-gradient(circle at 94% 84%, rgb(237 163 197 / .23), transparent 28%),
      #f8faff;
  }
  .official-home-playbook::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(90deg, rgb(255 255 255 / .48), transparent 44%, rgb(255 255 255 / .3));
  }
  .official-home-playbook .official-wrap { position: relative; }
  .official-playbook-head {
    display: grid;
    grid-template-columns: minmax(0, .86fr) minmax(280px, .64fr);
    gap: clamp(2.5rem, 8vw, 8rem);
    align-items: end;
  }
  .official-playbook-head h2 {
    max-width: 13em;
    margin: 0;
    color: var(--official-ink);
    font-size: var(--official-type-section);
    line-height: 1.12;
    letter-spacing: -.015em;
    text-wrap: balance;
  }
  .official-playbook-head p { max-width: 36em; margin: 0; color: var(--official-copy); font-size: 1rem; line-height: 1.72; text-wrap: pretty; }
  .official-agent-playbook {
    margin-top: 2.5rem;
    overflow: hidden;
    border-radius: 16px;
    background: rgb(255 255 255 / .82);
    box-shadow: 0 22px 52px rgb(54 79 137 / .12);
    -webkit-backdrop-filter: blur(22px) saturate(145%);
    backdrop-filter: blur(22px) saturate(145%);
  }
  .official-playbook-tabs {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-bottom: 1px solid #dfe5ef;
    background: rgb(247 249 255 / .72);
  }
  .official-playbook-tab {
    min-height: 90px;
    padding: 17px clamp(16px, 2.5vw, 30px);
    border: 0;
    border-right: 1px solid #dfe5ef;
    background: transparent;
    color: #68748a;
    text-align: left;
    cursor: pointer;
    transition: color .26s ease, background-color .26s ease, transform .26s cubic-bezier(.16,1,.3,1);
  }
  .official-playbook-tab:last-child { border-right: 0; }
  .official-playbook-tab strong { display: block; color: inherit; font-size: 15px; }
  .official-playbook-tab span { display: block; margin-top: 7px; color: inherit; font-size: 12px; line-height: 1.45; }
  .official-playbook-tab:hover { color: #2c4d9c; background: rgb(255 255 255 / .72); }
  .official-playbook-tab[aria-selected="true"] { color: #203b7d; background: linear-gradient(112deg, rgb(232 241 255 / .9), rgb(255 238 246 / .78)); }
  .official-playbook-panel { min-height: 470px; padding: clamp(1.5rem, 4vw, 3.5rem); animation: official-film-panel-in .5s cubic-bezier(.16,1,.3,1); }
  .official-playbook-panel[hidden], .official-agent-mode-detail[hidden] { display: none; }
  .official-playbook-caption { margin: 0 0 20px; color: #63708a; font-size: 12px; font-weight: 700; }
  .official-workbench-map {
    display: grid;
    grid-template-columns: 170px minmax(260px, 1fr) 218px;
    min-height: 328px;
    overflow: hidden;
    border: 1px solid #dbe3ef;
    border-radius: 14px;
    background: #fff;
  }
  .official-workbench-rail {
    padding: 16px 12px;
    border-right: 1px solid #dbe3ef;
    background: #f6f8fd;
  }
  .official-workbench-rail-head { display: flex; align-items: center; gap: 8px; padding: 5px 6px 14px; color: #233353; font-size: 12px; font-weight: 780; }
  .official-workbench-rail-head i { width: 18px; height: 18px; border-radius: 6px; background: linear-gradient(140deg, #79aae9, #e9a0bc); }
  .official-workbench-rail button {
    width: 100%;
    min-height: 52px;
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 5px;
    padding: 9px 10px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: #69758a;
    font: inherit;
    font-size: 12px;
    text-align: left;
  }
  .official-workbench-rail button:first-of-type { background: #fff; color: #263b73; font-weight: 760; }
  .official-workbench-rail button i { width: 22px; height: 22px; display: grid; place-items: center; border-radius: 7px; background: #e8eefb; color: #4d68ae; font-style: normal; font-size: 10px; }
  .official-workbench-conversation { min-width: 0; padding: 20px clamp(18px, 3vw, 34px); background: linear-gradient(145deg, #ffffff, #fbfcff); }
  .official-workbench-conversation-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 15px; border-bottom: 1px solid #e5eaf3; }
  .official-workbench-conversation-head strong { color: #233353; font-size: 13px; }
  .official-workbench-conversation-head span { color: #65728c; font-size: 11px; }
  .official-workbench-bubble { max-width: 88%; margin-top: 22px; padding: 15px; border-radius: 14px 14px 14px 4px; background: #f3f6fc; color: #35445f; font-size: 13px; line-height: 1.62; }
  .official-workbench-bubble span { display: block; margin-bottom: 7px; color: #74819a; font-size: 10px; font-weight: 720; }
  .official-workbench-translation { margin-top: 10px; padding-top: 10px; border-top: 1px solid #dbe4f4; color: #345aaf; font-weight: 700; }
  .official-workbench-draft { max-width: 84%; margin: 20px 0 0 auto; padding: 15px; border-radius: 14px 14px 4px 14px; background: #eef2ff; color: #34446f; font-size: 13px; line-height: 1.62; }
  .official-workbench-draft span { display: block; margin-bottom: 7px; color: #6376ad; font-size: 10px; font-weight: 720; }
  .official-workbench-inspector { padding: 20px 16px; border-left: 1px solid #dbe3ef; background: #fbfcff; }
  .official-workbench-inspector > span { color: #6b79a0; font-size: 10px; font-weight: 780; letter-spacing: .06em; }
  .official-workbench-inspector h3 { margin: 10px 0 18px; color: #243556; font-size: 17px; line-height: 1.35; letter-spacing: -.02em; }
  .official-workbench-inspector ul { margin: 0; padding: 0; list-style: none; }
  .official-workbench-inspector li { padding: 12px 0; border-top: 1px solid #e0e6f0; color: #5e6d85; font-size: 12px; line-height: 1.55; }
  .official-workbench-inspector li strong { display: block; margin-bottom: 4px; color: #314365; font-size: 12px; }
  .official-workbench-legend { margin: 18px 0 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
  .official-workbench-legend div { padding-top: 13px; border-top: 1px solid #dce3ee; }
  .official-workbench-legend strong { display: block; color: #273855; font-size: 13px; }
  .official-workbench-legend span { display: block; margin-top: 6px; color: #62708a; font-size: 12px; line-height: 1.6; }
  .official-agent-modes-layout { display: grid; grid-template-columns: 238px minmax(0, 1fr); gap: clamp(24px, 5vw, 62px); align-items: start; }
  .official-agent-mode-tabs { display: grid; gap: 8px; }
  .official-agent-mode-tab {
    min-height: 84px;
    padding: 15px 16px;
    border: 1px solid transparent;
    border-radius: 12px;
    background: #f5f7fc;
    color: #66738b;
    text-align: left;
    font: inherit;
    cursor: pointer;
    transition: transform .26s cubic-bezier(.16,1,.3,1), color .26s ease, background-color .26s ease, border-color .26s ease;
  }
  .official-agent-mode-tab strong { display: block; color: inherit; font-size: 15px; }
  .official-agent-mode-tab span { display: block; margin-top: 5px; font-size: 12px; line-height: 1.45; }
  .official-agent-mode-tab:hover { transform: translateX(4px); color: #314c96; background: #eef3ff; }
  .official-agent-mode-tab[aria-selected="true"] { border-color: #cad8f5; background: linear-gradient(112deg, #e7efff, #fff0f6); color: #294587; }
  .official-agent-mode-detail { min-height: 318px; padding: clamp(22px, 4vw, 38px); border-radius: 14px; background: linear-gradient(132deg, #f4f7ff, #fff9fb); animation: official-film-panel-in .46s cubic-bezier(.16,1,.3,1); }
  .official-agent-mode-detail > span { display: inline-flex; padding: 7px 10px; border-radius: 999px; background: rgb(255 255 255 / .72); color: #566b9e; font-size: 11px; font-weight: 760; }
  .official-agent-mode-detail h3 { max-width: 16em; margin: 18px 0 0; color: #1f3157; font-size: clamp(1.75rem, 3vw, 2.5rem); line-height: 1.16; letter-spacing: -.025em; text-wrap: balance; }
  .official-agent-mode-detail > p { max-width: 53ch; margin: 16px 0 0; color: #53627d; font-size: 15px; line-height: 1.75; text-wrap: pretty; }
  .official-agent-mode-boundaries { margin: 24px 0 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
  .official-agent-mode-boundaries div { padding: 12px 0 0; border-top: 1px solid #d8e0f0; }
  .official-agent-mode-boundaries strong { display: block; color: #33486e; font-size: 12px; }
  .official-agent-mode-boundaries span { display: block; margin-top: 6px; color: #64728b; font-size: 12px; line-height: 1.55; }
  .official-usage-route { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border-top: 1px solid #dbe3ef; }
  .official-usage-step { position: relative; padding: 24px 20px 22px; border-right: 1px solid #dbe3ef; }
  .official-usage-step:last-child { border-right: 0; }
  .official-usage-step > span { display: inline-grid; width: 30px; height: 30px; place-items: center; border-radius: 50%; background: #e8efff; color: #4164b1; font-size: 11px; font-weight: 800; }
  .official-usage-step strong { display: block; margin-top: 18px; color: #253655; font-size: 16px; }
  .official-usage-step p { margin: 9px 0 0; color: #60708b; font-size: 13px; line-height: 1.66; }
  .official-usage-step em { display: inline-block; margin-top: 14px; color: #5b6b89; font-size: 11px; font-style: normal; font-weight: 760; }
  .official-usage-step:nth-child(n + 3) em { color: #925d78; }
  .official-usage-note { margin: 20px 0 0; color: #65738b; font-size: 12px; line-height: 1.65; }

  .official-help-quick {
    padding: 46px 0 0;
    background: linear-gradient(180deg, rgb(246 252 254 / .82), #f8faff);
  }
  .official-help-quick-head { display: flex; align-items: end; justify-content: space-between; gap: 28px; }
  .official-help-quick-head h2 { max-width: 12em; margin: 0; color: var(--official-ink); font-size: clamp(2rem, 3.6vw, 3.35rem); line-height: 1.08; letter-spacing: -.035em; }
  .official-help-quick-head p { max-width: 38em; margin: 0; color: var(--official-copy); font-size: 14px; line-height: 1.72; }
  .official-help-quick-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 24px; }
  .official-help-quick-card { min-height: 154px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-content: start; gap: 10px 18px; padding: 22px; border: 1px solid rgb(101 177 205 / .2); border-radius: 20px; background: rgb(255 255 255 / .68); color: var(--official-ink); box-shadow: 0 14px 34px rgb(55 97 126 / .07); backdrop-filter: blur(16px); transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease; }
  .official-help-quick-card:hover { transform: translateY(-3px); border-color: rgb(74 180 207 / .38); box-shadow: 0 18px 40px rgb(55 97 126 / .11); }
  .official-help-quick-card:focus-visible { outline: 3px solid rgb(54 181 207 / .24); outline-offset: 3px; }
  .official-help-quick-card b { grid-column: 1 / -1; color: #24a9c1; font-size: 10px; letter-spacing: .08em; }
  .official-help-quick-card strong { font-size: 17px; }
  .official-help-quick-card i { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: linear-gradient(120deg, #44bfd3, #a08fdb 62%, #dc83b2); color: #fff; font-size: 13px; font-style: normal; }
  .official-help-quick-card span { grid-column: 1 / -1; color: var(--official-copy); font-size: 12px; line-height: 1.58; }

  .official-manual-section {
    position: relative;
    overflow: hidden;
    padding: 64px 0 76px;
    background:
      radial-gradient(circle at 8% 10%, rgb(123 171 234 / .2), transparent 25%),
      radial-gradient(circle at 91% 88%, rgb(231 156 190 / .2), transparent 26%),
      #f8faff;
  }
  .official-manual-section .official-wrap { position: relative; }
  .official-manual-head {
    display: grid;
    grid-template-columns: minmax(0, .85fr) minmax(360px, .75fr);
    gap: clamp(2.5rem, 7vw, 6.5rem);
    align-items: end;
  }
  .official-manual-head h2 { max-width: 13em; margin: 0; color: var(--official-ink); font-size: var(--official-type-section); line-height: 1.12; letter-spacing: -.015em; text-wrap: balance; }
  .official-manual-head p { max-width: 38em; margin: 0; color: var(--official-copy); font-size: 1rem; line-height: 1.72; text-wrap: pretty; }
  .official-manual-explorer {
    margin-top: 2rem;
    overflow: hidden;
    border: 1px solid rgb(255 255 255 / .92);
    border-radius: 26px;
    background: rgb(255 255 255 / .68);
    box-shadow: 0 24px 58px rgb(54 79 137 / .11), inset 0 1px 0 #fff;
    -webkit-backdrop-filter: blur(22px) saturate(145%);
    backdrop-filter: blur(22px) saturate(145%);
  }
  .official-manual-tabs { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; padding: 10px; border-bottom: 1px solid rgb(100 155 188 / .16); background: rgb(241 248 252 / .58); }
  .official-manual-tab {
    min-height: 76px;
    padding: 15px clamp(14px, 2.1vw, 25px);
    border: 1px solid transparent;
    border-radius: 16px;
    background: transparent;
    color: #68748a;
    text-align: left;
    cursor: pointer;
    transition: color .26s ease, background-color .26s ease;
  }
  .official-manual-tab strong { display: block; color: inherit; font-size: 15px; }
  .official-manual-tab span { display: block; margin-top: 6px; color: inherit; font-size: 11px; line-height: 1.45; }
  .official-manual-tab:hover { color: #2c4d9c; background: rgb(255 255 255 / .72); }
  .official-manual-tab:focus-visible { outline: 3px solid rgb(54 181 207 / .22); outline-offset: 1px; }
  .official-manual-tab[aria-selected="true"] { border-color: rgb(115 180 207 / .18); color: #173d68; background: linear-gradient(112deg, rgb(224 248 252 / .92), rgb(239 242 255 / .92) 54%, rgb(255 236 245 / .84)); box-shadow: 0 9px 22px rgb(63 104 139 / .1), inset 0 1px 0 #fff; }
  .official-manual-panel { min-height: 430px; padding: clamp(1.5rem, 3.5vw, 3rem); animation: official-film-panel-in .5s cubic-bezier(.16,1,.3,1); }
  .official-manual-panel[hidden] { display: none; }
  .official-manual-caption { margin: 0 0 22px; color: #63708a; font-size: 12px; font-weight: 700; }
  .official-manual-setup { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(260px, .85fr); gap: clamp(30px, 6vw, 80px); align-items: start; }
  .official-manual-checklist { margin: 0; padding: 0; list-style: none; border-top: 1px solid #dce4ef; }
  .official-manual-checklist li { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 16px; padding: 18px 0; border-bottom: 1px solid #dce4ef; }
  .official-manual-checklist b { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: #eaf0ff; color: #4164b1; font-size: 11px; }
  .official-manual-checklist strong { display: block; color: #253655; font-size: 16px; }
  .official-manual-checklist span { display: block; margin-top: 6px; color: #60708b; font-size: 13px; line-height: 1.65; }
  .official-manual-note { padding: 25px; border: 1px solid rgb(117 172 204 / .16); border-radius: 20px; background: linear-gradient(138deg, rgb(229 247 251 / .78), rgb(243 244 255 / .76) 54%, rgb(255 239 247 / .76)); }
  .official-manual-note > span { color: #5a70a8; font-size: 11px; font-weight: 780; }
  .official-manual-note h3 { margin: 12px 0 0; color: #2d416c; font-size: 21px; line-height: 1.35; letter-spacing: -.02em; }
  .official-manual-note ul { margin: 18px 0 0; padding: 0; list-style: none; }
  .official-manual-note li { padding: 11px 0; border-top: 1px solid rgb(129 151 202 / .24); color: #556681; font-size: 13px; line-height: 1.6; }
  .official-manual-note li::before { content: "✓"; margin-right: 9px; color: #4769b5; font-weight: 900; }
  .official-manual-actions { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 22px; }
  .official-manual-actions .official-button { min-height: 42px; }
  .official-manual-conversation { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(252px, .9fr); gap: clamp(30px, 6vw, 76px); align-items: center; }
  .official-manual-message-flow { padding: clamp(18px, 3vw, 30px); border: 1px solid #dbe3ef; border-radius: 14px; background: #fff; }
  .official-manual-message-flow > div { position: relative; padding: 16px 0 16px 48px; border-bottom: 1px solid #e1e7f1; color: #566781; font-size: 13px; line-height: 1.62; }
  .official-manual-message-flow > div:last-child { border-bottom: 0; }
  .official-manual-message-flow b { position: absolute; left: 0; top: 16px; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; background: #e9effe; color: #4566ad; font-size: 10px; }
  .official-manual-message-flow strong { display: block; color: #293b5e; font-size: 14px; }
  .official-manual-message-flow p { margin: 6px 0 0; color: inherit; }
  .official-manual-conversation-note h3 { max-width: 14em; margin: 0; color: #253958; font-size: clamp(1.75rem, 3vw, 2.5rem); line-height: 1.14; letter-spacing: -.025em; text-wrap: balance; }
  .official-manual-conversation-note p { max-width: 39ch; margin: 16px 0 0; color: #5e6e89; font-size: 15px; line-height: 1.75; }
  .official-manual-conversation-note dl { margin: 24px 0 0; border-top: 1px solid #dce4ef; }
  .official-manual-conversation-note dl div { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 12px; padding: 12px 0; border-bottom: 1px solid #dce4ef; }
  .official-manual-conversation-note dt { color: #2c4168; font-size: 12px; font-weight: 780; }
  .official-manual-conversation-note dd { margin: 0; color: #62718a; font-size: 12px; line-height: 1.6; }
  .official-manual-team { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(28px, 6vw, 74px); }
  .official-manual-team-lane { padding: 0 0 4px; border-top: 2px solid #b8caef; }
  .official-manual-team-lane:nth-child(2) { border-top-color: #e2b4c8; }
  .official-manual-team-lane > span { display: block; margin-top: 18px; color: #6075aa; font-size: 11px; font-weight: 800; }
  .official-manual-team-lane:nth-child(2) > span { color: #94647b; }
  .official-manual-team-lane h3 { margin: 10px 0 0; color: #253958; font-size: 23px; line-height: 1.35; letter-spacing: -.02em; }
  .official-manual-team-lane > p { max-width: 38ch; margin: 13px 0 0; color: #5e6e89; font-size: 14px; line-height: 1.7; }
  .official-manual-team-lane ul { margin: 22px 0 0; padding: 0; list-style: none; border-top: 1px solid #dce4ef; }
  .official-manual-team-lane li { padding: 13px 0; border-bottom: 1px solid #dce4ef; color: #5e6e89; font-size: 13px; line-height: 1.62; }
  .official-manual-team-lane li strong { display: block; margin-bottom: 4px; color: #314669; font-size: 13px; }
  .official-manual-team-foot { grid-column: 1 / -1; margin-top: 8px; padding: 18px 0 0; border-top: 1px solid #dce4ef; color: #63728b; font-size: 13px; line-height: 1.65; }
  .official-manual-team-foot strong { color: #344968; }
  .official-manual-exceptions { margin: 0; padding: 0; list-style: none; border-top: 1px solid #dce4ef; }
  .official-manual-exceptions li { display: grid; grid-template-columns: minmax(180px, .55fr) minmax(0, 1.45fr); gap: clamp(24px, 5vw, 72px); padding: 19px 0; border-bottom: 1px solid #dce4ef; }
  .official-manual-exceptions strong { color: #2f4264; font-size: 15px; }
  .official-manual-exceptions span { color: #5e6e89; font-size: 14px; line-height: 1.68; }
  .official-manual-exceptions em { color: #8a5f75; font-style: normal; font-weight: 720; }

  .official-home-pets {
    padding: var(--official-section-space) 0;
    background: linear-gradient(148deg, #f8fbff 0%, #f3f0ff 50%, #fff4f8 100%);
  }
  .official-home-pets-head {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(300px, .8fr);
    gap: clamp(40px, 8vw, 110px);
    align-items: start;
  }
  .official-home-pets-title h2 {
    max-width: 11em;
    margin: 0;
    font-size: var(--official-type-section);
    line-height: 1.12;
    letter-spacing: -.015em;
    line-break: strict;
    text-wrap: balance;
  }
  .official-home-pets-title > p { max-width: 58ch; margin: 1.125rem 0 0; color: #515d75; font-size: 1rem; line-height: 1.7; text-wrap: pretty; }
  .official-pet-library-note {
    padding: 26px 28px;
    border: 1px solid rgb(255 255 255 / .82);
    border-radius: 16px;
    background: rgb(255 255 255 / .68);
    box-shadow: 0 18px 45px rgb(80 83 145 / .11), inset 0 1px 0 rgb(255 255 255 / .86);
    -webkit-backdrop-filter: blur(24px) saturate(145%);
    backdrop-filter: blur(24px) saturate(145%);
  }
  .official-pet-library-note > span { color: #7550a0; font-size: 11px; font-weight: 800; letter-spacing: .08em; }
  .official-pet-library-note strong { display: block; margin-top: 10px; color: #222a43; font-size: 19px; line-height: 1.42; }
  .official-pet-library-note p { margin: 12px 0 0; color: #59657b; font-size: .9375rem; line-height: 1.68; }
  .official-pet-gallery {
    margin-top: 48px;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-auto-rows: 244px;
    gap: 16px;
  }
  .official-pet-card {
    position: relative;
    grid-column: span 3;
    margin: 0;
    overflow: hidden;
    border: 1px solid rgb(255 255 255 / .76);
    border-radius: 16px;
    background: var(--pet-surface, #edf5ff);
    box-shadow: 0 16px 38px rgb(67 77 128 / .11), inset 0 1px 0 rgb(255 255 255 / .8);
    isolation: isolate;
    transition: transform .45s cubic-bezier(.16,1,.3,1), box-shadow .45s cubic-bezier(.16,1,.3,1);
  }
  .official-pet-card:first-child { grid-column: span 6; grid-row: span 2; --pet-surface: linear-gradient(145deg, #e7f2ff, #f8efff 54%, #ffeef5); }
  .official-pet-card:nth-child(2) { --pet-surface: linear-gradient(145deg, #e1f5ff, #e8edff); }
  .official-pet-card:nth-child(3) { --pet-surface: linear-gradient(145deg, #fff0f5, #f6eaff); }
  .official-pet-card:nth-child(4) { --pet-surface: linear-gradient(145deg, #eeeaff, #e8f3ff); }
  .official-pet-card:nth-child(5) { --pet-surface: linear-gradient(145deg, #e7f8f4, #eef2ff); }
  .official-pet-card::after {
    content: "";
    position: absolute;
    inset: auto -12% -46% 18%;
    z-index: -1;
    height: 68%;
    border-radius: 50%;
    background: rgb(255 255 255 / .62);
    filter: blur(10px);
  }
  .official-pet-card img {
    position: absolute;
    right: 6%;
    bottom: 10px;
    width: 58%;
    max-height: 88%;
    object-fit: contain;
    filter: drop-shadow(0 18px 16px rgb(47 49 86 / .16));
    transform-origin: center bottom;
    transition: transform .45s cubic-bezier(.16,1,.3,1);
  }
  .official-pet-card:first-child img { right: 1%; bottom: 0; width: 69%; max-height: 92%; }
  .official-pet-card figcaption {
    position: absolute;
    z-index: 2;
    left: 24px;
    top: 24px;
    max-width: 48%;
  }
  .official-pet-card figcaption strong { display: block; color: #202942; font-size: 18px; }
  .official-pet-card:first-child figcaption strong { font-size: 24px; }
  .official-pet-card figcaption span { display: block; margin-top: 7px; color: #69738b; font-size: 12px; line-height: 1.55; }
  .official-pet-card:hover { transform: translateY(-6px); box-shadow: 0 24px 52px rgb(67 77 128 / .16), inset 0 1px 0 rgb(255 255 255 / .84); }
  .official-pet-card:hover img { transform: translateY(-5px) scale(1.035); }
  .official-pet-gallery-note { margin: 18px 0 0; color: #59657b; font-size: .8125rem; line-height: 1.65; }

  .official-future-explorer {
    margin-top: 2.5rem;
    overflow: hidden;
    border-radius: 16px;
    background: rgb(255 255 255 / .76);
    box-shadow: 0 18px 48px rgb(82 91 151 / .14);
    -webkit-backdrop-filter: blur(24px) saturate(150%);
    backdrop-filter: blur(24px) saturate(150%);
  }
  .official-future-tabs {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    background: rgb(246 248 255 / .76);
  }
  .official-future-tab {
    min-height: 80px;
    padding: 18px 20px;
    border: 0;
    border-right: 1px solid rgb(213 220 235 / .88);
    background: transparent;
    color: #68748a;
    text-align: left;
    cursor: pointer;
    transition: color .25s ease, background-color .25s ease;
  }
  .official-future-tab:last-child { border-right: 0; }
  .official-future-tab strong { display: block; color: inherit; font-size: 15px; }
  .official-future-tab span { display: block; margin-top: 7px; font-size: 11px; }
  .official-future-tab:hover { color: var(--official-ink); background: rgb(255 255 255 / .66); }
  .official-future-tab[aria-selected="true"] { color: #294b9b; background: linear-gradient(135deg, rgb(227 237 255 / .94), rgb(255 232 242 / .9)); }
  .official-future-stage { min-height: 300px; padding: clamp(1.75rem, 4vw, 3rem); }
  .official-future-panel[hidden] { display: none; }
  .official-future-panel-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(240px, .85fr); gap: clamp(38px, 7vw, 88px); align-items: start; }
  .official-future-panel h3 { max-width: 14ch; margin: 0; color: var(--official-ink); font-size: clamp(28px, 3.4vw, 44px); line-height: 1.08; letter-spacing: -.034em; text-wrap: balance; }
  .official-future-panel-copy > p { max-width: 58ch; margin: 18px 0 0; color: #5d667e; font-size: 16px; line-height: 1.78; }
  .official-future-tags { margin-top: 26px; display: flex; flex-wrap: wrap; gap: 8px; }
  .official-future-tags span { padding: 9px 12px; border-radius: 999px; background: #edf3ff; color: #3c5da9; font-size: 12px; font-weight: 700; }
  .official-future-boundary { padding: 24px; border-radius: 14px; background: #fff; box-shadow: 0 6px 8px rgb(73 84 132 / .09); }
  .official-future-boundary span { display: block; color: #8a6074; font-size: 12px; font-weight: 760; }
  .official-future-boundary strong { display: block; margin-top: 12px; color: #28344f; font-size: 17px; line-height: 1.55; }
  .official-future-boundary p { margin: 14px 0 0; color: #687188; font-size: 13px; line-height: 1.7; }

  .official-home-closing { padding: clamp(74px, 9vw, 112px) 0; background: #f5f8ff; }
  .official-home-closing-inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 32px;
    padding-top: 36px;
    border-top: 2px solid var(--official-blue);
  }
  .official-home-closing h2 { margin: 0; font-size: clamp(32px, 3.6vw, 48px); line-height: 1.12; letter-spacing: -.03em; }
  .official-home-closing p { margin: 12px 0 0; color: var(--official-copy); font-size: 15px; line-height: 1.7; }
  .official-home-closing-actions { display: flex; gap: 10px; }

  .official-footer { background: #f7f9fc; }
  @keyframes official-film-panel-in {
    from { opacity: .3; transform: translate3d(18px, 0, 0); clip-path: inset(0 12% 0 0 round 16px); }
    to { opacity: 1; transform: translate3d(0, 0, 0); clip-path: inset(0 0 0 0 round 16px); }
  }
  @media (prefers-reduced-motion: no-preference) {
    .official-hero-declaration { animation: official-hero-copy-in .72s cubic-bezier(.16,1,.3,1) both; }
    .official-cinema-copy > * { animation: official-hero-copy-in .72s cubic-bezier(.16,1,.3,1) both; }
    .official-cinema-copy > :nth-child(2) { animation-delay: .05s; }
    .official-cinema-copy > :nth-child(3) { animation-delay: .1s; }
    .official-cinema-copy > :nth-child(4) { animation-delay: .15s; }
    .official-cinema-visual .official-product-theater,
    .official-agent-hero-visual { animation: official-hero-visual-in .9s .1s cubic-bezier(.16,1,.3,1) both; }
    .official-agent-portrait img { animation: official-future-breathe 5.8s ease-in-out infinite; }
    .official-cinema-hero::before { animation: official-hero-aura-shift 10s ease-in-out infinite alternate; }
    .official-home-future-visual img { animation: official-future-breathe 5.8s ease-in-out infinite; }
    .official-future-panel { animation: official-film-panel-in .5s cubic-bezier(.16,1,.3,1); }
    .official-pet-gallery.official-reveal-in .official-pet-card { animation: official-pet-card-in .72s cubic-bezier(.16,1,.3,1) backwards; }
    .official-pet-gallery.official-reveal-in .official-pet-card:nth-child(2) { animation-delay: .06s; }
    .official-pet-gallery.official-reveal-in .official-pet-card:nth-child(3) { animation-delay: .12s; }
    .official-pet-gallery.official-reveal-in .official-pet-card:nth-child(4) { animation-delay: .18s; }
    .official-pet-gallery.official-reveal-in .official-pet-card:nth-child(5) { animation-delay: .24s; }
  }
  @keyframes official-pet-card-in { from { opacity: .55; transform: translateY(18px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }
  @keyframes official-future-breathe { 0%, 100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-9px) rotate(1deg); } }
  @keyframes official-hero-aura-shift { from { transform: translateY(-50%) rotate(-10deg) scale(1); } to { transform: translateY(-47%) rotate(-5deg) scale(1.045); } }

  @media (max-width: 1120px) {
    .official-help-quick-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .official-cinema-grid { grid-template-columns: minmax(320px, .8fr) minmax(520px, 1.2fr); }
    .official-agent-cinema-grid { grid-template-columns: minmax(390px, .9fr) minmax(500px, 1.1fr); }
    .official-cinema-visual { width: 780px; }
    .official-cinema-visual .official-product-theater { width: 780px; }
    .official-cinema-visual .official-theater-body { grid-template-columns: 64px 180px minmax(0, 1fr); }
    .official-cinema-visual .official-product-scene { grid-template-columns: minmax(0, 1fr) 210px; }
  }
  @media (max-width: 920px) {
    .official-wrap { width: min(100% - 40px, 1240px); }
    .official-cinema-grid { min-height: 0; grid-template-columns: 1fr; gap: 54px; }
    .official-cinema-copy .official-lead { max-width: 38em; }
    .official-cinema-visual { width: 100%; }
    .official-agent-hero-visual { width: 100%; }
    .official-cinema-visual .official-product-theater { width: 100%; }
    .official-home-positioning-inner { grid-template-columns: 1fr; gap: 34px; }
    .official-home-positioning-copy { grid-template-columns: 1fr; gap: 1.5rem; }
    .official-film-explorer { grid-template-columns: 1fr; }
    .official-film-tabs { display: grid; grid-template-columns: repeat(3, 1fr); padding: 0; }
    .official-film-tab { min-height: 116px; grid-template-columns: 1fr; justify-items: start; border-right: 1px solid #e4e9f3; border-bottom: 0; }
    .official-film-tab:last-child { border-right: 0; }
    .official-home-future-inner { grid-template-columns: 1fr; }
    .official-home-future-visual { min-height: 440px; }
    .official-home-pets-head { grid-template-columns: 1fr; gap: 28px; }
    .official-playbook-head { grid-template-columns: 1fr; gap: 18px; }
    .official-workbench-map { grid-template-columns: 142px minmax(0, 1fr); }
    .official-workbench-inspector { grid-column: 1 / -1; border-top: 1px solid #dbe3ef; border-left: 0; }
    .official-workbench-inspector ul { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
    .official-agent-modes-layout { grid-template-columns: 1fr; }
    .official-agent-mode-tabs { grid-template-columns: repeat(3, 1fr); }
    .official-manual-head { grid-template-columns: 1fr; gap: 18px; }
    .official-manual-setup,
    .official-manual-conversation { grid-template-columns: 1fr; }
    .official-pet-gallery { grid-auto-rows: 220px; }
    .official-pet-card:first-child { grid-column: span 7; }
    .official-pet-card { grid-column: span 5; }
    .official-future-panel-grid { grid-template-columns: 1fr; }
    .official-hero-lower { grid-template-columns: 1fr; gap: 34px; }
    .official-hero-lower .official-cinema-copy { max-width: 38em; padding-top: 0; }
  }
  @media (max-width: 700px) {
    .official-wrap { width: min(100% - 32px, 1240px); }
    .official-site { --official-nav-offset: 74px; }
    .official-header { padding-top: 8px; }
    .official-cinema-hero {
      min-height: 0;
      padding-block: 3.5rem 4rem;
      background:
        radial-gradient(ellipse 100% 40% at 82% 0%, rgb(135 188 242 / .35), transparent 78%),
        radial-gradient(ellipse 92% 38% at 34% 100%, rgb(239 161 198 / .25), transparent 80%),
        linear-gradient(160deg, #f4f9ff 0%, #fbfcff 48%, #fff3f8 100%);
    }
    .official-cinema-hero::before { width: 540px; height: 420px; top: 52%; right: -280px; filter: blur(14px); }
    .official-cinema-hero::after { width: 360px; height: 320px; left: -220px; bottom: 18%; filter: blur(12px); }
    .official-hero-declaration { max-width: 100%; font-size: clamp(2.875rem, 11.6vw, 3.55rem); line-height: 1.05; white-space: normal; }
    .official-hero-declaration span { display: block; }
    .official-cinema-copy .official-actions { display: flex; flex-direction: column; }
    .official-cinema-copy .official-button { width: 100%; }
    .official-agent-hero-visual { min-height: 530px; border-radius: 22px; }
    .official-agent-stage-copy { max-width: 260px; padding: 26px 22px; }
    .official-agent-stage-statement { margin-top: 34px; }
    .official-agent-stage-statement span { font-size: 1.3rem; }
    .official-agent-stage-statement strong { font-size: 2rem; }
    .official-agent-stage-flow { max-width: 238px; margin-top: 20px; gap: 6px; }
    .official-agent-stage-flow span { padding: 6px 8px; font-size: 10px; }
    .official-agent-stage-horizon { inset: auto 7% 32% 6%; }
    .official-agent-portrait { right: -1%; width: min(64%, 272px); min-width: 0; }
    .official-agent-portrait img { width: 100%; }
    .official-agent-statusboard { left: 14px; bottom: 14px; width: min(232px, calc(100% - 28px)); padding: 14px 15px; border-radius: 14px; }
    .official-agent-statusboard > strong { font-size: 1rem; }
    .official-agent-statusboard > p { font-size: .75rem; }
    .official-hero-lower { margin-top: 42px; }
    .official-hero-lower .official-cinema-copy { text-align: center; }
    .official-hero-lower .official-cinema-copy .official-actions,
    .official-hero-lower .official-cinema-platforms { justify-content: center; }
    .official-hero-lower .official-agent-hero-visual { min-height: 500px; }
    .official-hero-lower .official-agent-stage-copy { width: 100%; max-width: none; padding: 26px 22px; }
    .official-hero-lower .official-agent-stage-statement strong { white-space: nowrap; }
    .official-hero-lower .official-agent-stage-flow { display: flex; }
    .official-hero-lower .official-agent-statusboard { left: 14px; bottom: 14px; width: min(232px, calc(100% - 28px)); padding: 14px 15px; }
    .official-cinema-platforms { margin-top: 26px; }
    .official-cinema-visual::before { width: 88%; right: -12%; }
    .official-cinema-visual::after { width: 44%; left: -8%; }
    .official-cinema-visual .official-product-theater { border-radius: 14px; }
    .official-cinema-visual .official-theater-body { grid-template-columns: 1fr; }
    .official-cinema-visual .official-theater-rail { display: flex; }
    .official-cinema-visual .official-product-scene { min-height: 520px; grid-template-columns: 1fr; }
    .official-cinema-visual .official-theater-chat { min-height: 520px; }
    .official-cinema-visual .official-theater-inbox,
    .official-cinema-visual .official-theater-inspector { display: none; }
    .official-home-positioning { padding-block: 4rem; }
    .official-home-positioning h2 { max-width: 100%; font-size: 2.125rem; line-height: 1.16; }
    .official-home-positioning-copy { margin-top: 2rem; }
    .official-home-positioning-points li { grid-template-columns: 1fr; gap: 5px; }
    .official-home-film { padding-block: 4rem; }
    .official-home-film-head h2,
    .official-home-platforms-head h2,
    .official-home-future-copy h2,
    .official-home-pets-title h2 { max-width: 100%; font-size: 2.125rem; line-height: 1.16; }
    .official-film-tabs { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; }
    .official-film-tab { min-width: 210px; min-height: 104px; scroll-snap-align: start; }
    .official-film-tab b { display: none; }
    .official-film-stage { min-height: 430px; padding: 24px 16px; }
    .official-film-message { padding: 22px 18px; }
    .official-film-message > p,
    .official-film-translation strong { font-size: 18px; }
    .official-film-confirm { align-items: flex-start; flex-direction: column; }
    .official-home-platforms { padding-block: 4rem; }
    .official-home-platforms .official-workbench-panel { min-height: 440px; }
    .official-home-future { padding-block: 4rem 2rem; }
    .official-home-future { background: linear-gradient(180deg, #f0f5ff 0 48%, #fff0f6 48% 100%); }
    .official-home-future-inner { min-height: 0; }
    .official-home-future-visual { min-height: 340px; }
    .official-home-future-visual::before { width: 260px; height: 260px; }
    .official-home-future-visual img { width: min(225px, 76%); }
    .official-home-future-note { top: 12px; right: 0; max-width: 180px; }
    .official-home-pets { padding-block: 4rem; }
    .official-home-playbook { padding-block: 4rem; }
    .official-playbook-head h2 { max-width: 100%; font-size: 2.125rem; line-height: 1.16; }
    .official-agent-playbook { margin-top: 2rem; border-radius: 14px; }
    .official-playbook-tabs { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; }
    .official-playbook-tab { min-width: 178px; min-height: 86px; scroll-snap-align: start; }
    .official-playbook-panel { min-height: 0; padding: 22px 16px; }
    .official-workbench-map { grid-template-columns: 1fr; border-radius: 12px; }
    .official-workbench-rail { display: flex; gap: 5px; overflow-x: auto; padding: 11px; border-right: 0; border-bottom: 1px solid #dbe3ef; }
    .official-workbench-rail-head { min-width: max-content; padding: 8px 5px; }
    .official-workbench-rail button { width: auto; min-width: 112px; margin: 0; }
    .official-workbench-conversation { padding: 18px 15px; }
    .official-workbench-bubble, .official-workbench-draft { max-width: 94%; }
    .official-workbench-inspector { padding: 18px 15px; }
    .official-workbench-inspector ul { grid-template-columns: 1fr; gap: 0; }
    .official-workbench-legend { grid-template-columns: 1fr; gap: 0; }
    .official-workbench-legend div { padding-block: 12px; }
    .official-agent-mode-tabs { display: flex; overflow-x: auto; padding-bottom: 3px; }
    .official-agent-mode-tab { min-width: 160px; }
    .official-agent-mode-detail { min-height: 0; padding: 23px 18px; }
    .official-agent-mode-detail h3 { font-size: 1.75rem; }
    .official-agent-mode-boundaries { grid-template-columns: 1fr; gap: 0; }
    .official-agent-mode-boundaries div { padding-block: 12px; }
    .official-usage-route { grid-template-columns: 1fr; }
    .official-usage-step { padding: 20px 0; border-right: 0; border-bottom: 1px solid #dbe3ef; }
    .official-usage-step:last-child { border-bottom: 0; }
    .official-help-quick { padding-top: 34px; }
    .official-help-quick-head { align-items: start; flex-direction: column; gap: 12px; }
    .official-help-quick-head h2 { font-size: 2.25rem; }
    .official-help-quick-grid { grid-template-columns: 1fr; gap: 10px; margin-top: 19px; }
    .official-help-quick-card { min-height: 132px; padding: 19px; border-radius: 17px; }
    .official-manual-section { padding-block: 3.5rem; }
    .official-manual-head h2 { max-width: 100%; font-size: 2.125rem; line-height: 1.16; }
    .official-manual-explorer { margin-top: 1.5rem; border-radius: 20px; }
    .official-manual-tabs { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; }
    .official-manual-tab { min-width: 172px; scroll-snap-align: start; }
    .official-manual-panel { min-height: 0; padding: 22px 16px; }
    .official-manual-note { padding: 21px 18px; }
    .official-manual-checklist li { grid-template-columns: 36px minmax(0, 1fr); gap: 12px; }
    .official-manual-conversation-note h3 { font-size: 1.75rem; }
    .official-manual-conversation-note dl div { grid-template-columns: 1fr; gap: 4px; }
    .official-manual-team { grid-template-columns: 1fr; gap: 34px; }
    .official-manual-exceptions li { grid-template-columns: 1fr; gap: 8px; }
    .official-pet-gallery {
      width: 100%;
      margin-top: 38px;
      padding: 0;
      display: grid;
      grid-template-columns: 1fr;
      grid-auto-rows: auto;
      gap: 16px;
      overflow: visible;
    }
    .official-pet-card { width: 100%; min-width: 0; height: 300px; grid-column: auto; grid-row: auto; }
    .official-pet-card:first-child { width: 100%; min-width: 0; height: 390px; grid-column: auto; grid-row: auto; }
    .official-pet-card img { right: 2%; width: 66%; max-height: 72%; }
    .official-pet-card:first-child img { right: 0; width: 82%; max-height: 76%; }
    .official-pet-card figcaption,
    .official-pet-card:first-child figcaption { left: 22px; top: 22px; max-width: 62%; }
    .official-future-explorer { margin-top: 38px; }
    .official-future-tabs { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; }
    .official-future-tab { min-width: 176px; scroll-snap-align: start; }
    .official-future-stage { min-height: 430px; padding: 28px 20px; }
    .official-future-panel h3 { font-size: 34px; }
    .official-home-closing-inner { grid-template-columns: 1fr; }
    .official-home-closing-actions { display: grid; grid-template-columns: 1fr; }
    .official-home-closing-actions .official-button { width: 100%; }
  }

  /* Global type rhythm: large display copy stays deliberate; supporting copy stays readable. */
  .official-site {
    --official-type-display: clamp(3.25rem, 5.1vw, 5rem);
    --official-type-page: clamp(2.8rem, 4.2vw, 4.25rem);
    --official-type-section: clamp(2.15rem, 3vw, 3.2rem);
    --official-type-card: clamp(1.35rem, 1.7vw, 1.85rem);
  }
  .official-site h1,
  .official-site h2,
  .official-site h3 { text-wrap: balance; }
  .official-title-lines > span { display: block; }
  .official-site p { text-wrap: pretty; }
  .official-page-hero h1 {
    max-width: 13ch;
    font-size: var(--official-type-page);
    line-height: 1.09;
    letter-spacing: -.032em;
  }
  .official-section-head h2,
  .official-home-positioning h2,
  .official-home-film-head h2,
  .official-home-platforms-head h2,
  .official-home-future-copy h2,
  .official-home-pets-title h2,
  .official-playbook-head h2,
  .official-manual-head h2,
  .official-home-closing h2 {
    max-width: 15ch;
    font-size: var(--official-type-section);
    line-height: 1.13;
    letter-spacing: -.028em;
  }
  .official-section-head p,
  .official-detail-aside p,
  .official-future-capability-copy p,
  .official-manual-head p,
  .official-manual-team-lane p,
  .official-manual-conversation-note p,
  .official-legal p {
    max-width: 62ch;
    font-size: 1rem;
    line-height: 1.76;
  }
  .official-capability-card h3,
  .official-future-capability-copy h3,
  .official-link-row h3,
  .official-agent-mode-detail h3,
  .official-manual-conversation-note h3,
  .official-manual-note h3,
  .official-manual-team-lane h3 {
    max-width: 18ch;
    font-size: var(--official-type-card);
    line-height: 1.24;
    letter-spacing: -.025em;
  }
  .official-hero-declaration {
    font-size: var(--official-type-display);
    line-height: 1.08;
    letter-spacing: -.035em;
    text-wrap: balance;
  }
  .official-hero-lower {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.16fr);
    align-items: center;
  }
  .official-hero-lower .official-cinema-copy { padding-top: 0; }
  .official-hero-lower .official-hero-support-title {
    max-width: 11ch;
    font-size: clamp(1.8rem, 2.25vw, 2.4rem);
    line-height: 1.18;
    letter-spacing: -.028em;
  }
  .official-hero-lower .official-cinema-copy .official-lead {
    max-width: 30ch;
    margin-top: 1rem;
    font-size: 1rem;
    line-height: 1.72;
  }
  .official-agent-stage-head {
    display: flex;
    flex-wrap: wrap;
    gap: 7px 10px;
    white-space: normal;
  }
  .official-agent-stage-head span { font-size: 11px; letter-spacing: .065em; white-space: normal; }
  .official-agent-stage-head strong { font-size: 14px; white-space: normal; }
  .official-agent-stage-head i { font-size: 11px; white-space: normal; }
  .official-hero-lower .official-agent-stage-copy { width: 64%; }
  .official-agent-stage-statement span {
    font-size: clamp(1.3rem, 1.85vw, 1.7rem);
    line-height: 1.22;
    letter-spacing: -.028em;
  }
  .official-agent-stage-statement strong,
  .official-hero-lower .official-agent-stage-statement strong {
    max-width: 11ch;
    font-size: clamp(1.7rem, 2.25vw, 2.15rem);
    line-height: 1.14;
    letter-spacing: -.032em;
    white-space: normal;
  }
  .official-agent-stage-flow { gap: 7px; }
  .official-agent-stage-flow span { font-size: 12px; }
  .official-agent-statusboard > span,
  .official-agent-statusboard small { font-size: 12px; }

  @media (max-width: 920px) {
    .official-hero-lower { grid-template-columns: 1fr; text-align: center; }
    .official-hero-lower .official-cinema-copy,
    .official-hero-lower .official-cinema-copy .official-lead { margin-inline: auto; }
    .official-hero-lower .official-cinema-copy .official-actions,
    .official-hero-lower .official-cinema-platforms { justify-content: center; }
  }
  @media (max-width: 700px) {
    .official-site {
      --official-type-display: clamp(2.75rem, 12vw, 3.35rem);
      --official-type-page: clamp(2.45rem, 10.4vw, 3.05rem);
      --official-type-section: clamp(1.95rem, 8.7vw, 2.45rem);
      --official-type-card: 1.35rem;
    }
    .official-hero-declaration { max-width: 10ch; margin-inline: auto; white-space: normal; }
    .official-hero-declaration span { display: block; }
    .official-page-hero h1,
    .official-section-head h2,
    .official-home-positioning h2,
    .official-home-film-head h2,
    .official-home-platforms-head h2,
    .official-home-future-copy h2,
    .official-home-pets-title h2,
    .official-playbook-head h2,
    .official-manual-head h2,
    .official-home-closing h2 { max-width: 12ch; }
    .official-hero-lower { margin-top: 2.5rem; }
    .official-hero-lower .official-hero-support-title { max-width: 13ch; font-size: 1.75rem; }
    .official-hero-lower .official-cinema-copy .official-lead { max-width: 32ch; }
    .official-hero-lower .official-agent-stage-copy { width: 68%; padding: 24px 20px; text-align: left; }
    .official-agent-stage-statement { margin-top: 28px; }
    .official-agent-stage-statement strong,
    .official-hero-lower .official-agent-stage-statement strong { max-width: 10ch; font-size: 1.7rem; }
    .official-agent-stage-flow { max-width: none; }
    .official-agent-stage-flow span { font-size: 11px; }
    .official-agent-statusboard > span,
    .official-agent-statusboard small { font-size: 11px; }
  }

  /* Unified lake-blue and pale-pink surface: light moves through the page instead of ending as color blocks. */
  .official-site {
    --official-ink: #14223d;
    --official-copy: #52647e;
    --official-muted: #71829a;
    --official-blue: #48afca;
    --official-blue-hover: #2c8eae;
    --official-aqua: #69c8d9;
    --official-aqua-dark: #2b8ca8;
    --official-violet: #b49bd2;
    --official-coral: #efafc7;
    --official-mint: #caeff2;
    --official-blue-soft: #edfafa;
    --official-pink: #edafc6;
    --official-pink-soft: #fff4f8;
    --official-line: #d7e9ef;
    --official-soft: #f8fcfd;
    background:
      radial-gradient(ellipse 72% 47% at 100% 0%, rgb(151 223 236 / .48), transparent 75%),
      radial-gradient(ellipse 56% 42% at 0% 20%, rgb(255 218 230 / .32), transparent 77%),
      linear-gradient(180deg, #fbfeff 0%, #f8fdfe 56%, #fffafe 100%);
    background-repeat: no-repeat;
    background-size: 100% 940px;
    background-color: #f9fcfd;
  }
  .official-site main { background: transparent; }
  .official-header::after {
    display: none;
  }
  .official-nav,
  .official-site[data-scrolled] .official-nav {
    z-index: 1;
    border-color: rgb(255 255 255 / .9);
    background: rgb(255 255 255 / .9);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .96), 0 10px 30px rgb(67 119 144 / .11);
  }
  .official-brand,
  .official-links,
  .official-nav-link { color: #34445d; }
  .official-nav-link:hover,
  .official-nav-link[aria-current="page"] { color: var(--official-ink); background: rgb(226 245 248 / .8); }
  .official-button.primary,
  .official-header .official-button.primary {
    background: linear-gradient(112deg, #2a8eae 0%, #678cb9 50%, #ad668b 100%);
    color: #fff;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .36), inset 0 -1px 0 rgb(34 91 118 / .28), 0 9px 20px rgb(50 123 156 / .22);
  }
  .official-button.primary:hover,
  .official-header .official-button.primary:hover {
    background: linear-gradient(112deg, #237f9f 0%, #5a7ead 50%, #9c587d 100%);
    color: #fff;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .34), inset 0 -1px 0 rgb(30 77 102 / .3), 0 12px 25px rgb(50 112 148 / .27);
  }
  .official-cinema-hero {
    background: transparent;
  }
  .official-cinema-hero::before,
  .official-cinema-hero::after { display: none; }
  .official-agent-hero-visual {
    background:
      radial-gradient(circle at 76% 26%, rgb(255 255 255 / .78) 0 2px, transparent 3px),
      radial-gradient(circle at 82% 18%, rgb(255 255 255 / .66) 0 1px, transparent 2px),
      linear-gradient(140deg, #c9ecf2 0%, #e5f2f8 47%, #f9dce8 100%);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .88), 0 30px 68px rgb(53 118 145 / .18);
  }
  .official-home-future {
    background: transparent;
  }
  .official-page-hero::before {
    background: radial-gradient(circle, rgb(131 211 229 / .3) 0%, rgb(246 204 221 / .16) 42%, rgb(255 255 255 / 0) 74%);
  }
  .official-section.soft { background: rgb(248 252 253 / .82); }
  .official-section.blue-soft { background: linear-gradient(112deg, rgb(234 248 250 / .9), rgb(255 242 247 / .78)); }
  .official-editorial-section.sky {
    background:
      radial-gradient(circle at 88% 8%, rgb(245 186 207 / .17), transparent 30%),
      radial-gradient(circle at 10% 78%, rgb(114 203 222 / .16), transparent 34%),
      linear-gradient(135deg, #f6fcfd, #f8fcff 55%, #fff7fa);
  }
  .official-editorial-section.mint,
  .official-end-cta-inner {
    background:
      radial-gradient(circle at 86% 8%, rgb(255 214 226 / .36), transparent 28%),
      radial-gradient(circle at 8% 96%, rgb(137 220 233 / .3), transparent 30%),
      linear-gradient(118deg, #8ad0df 0%, #b9d7e9 49%, #efbfd1 100%);
  }
  .official-footer { background: linear-gradient(120deg, #f3fafb, #fff6f9); }

  /* Agent-first public site refresh. Cards use 22px corners; actions remain pill-shaped. */
  .official-agent-home-hero {
    min-height: 500px;
    display: grid;
    grid-template-columns: minmax(0, .88fr) minmax(440px, 1.12fr);
    gap: clamp(22px, 3vw, 42px);
    align-items: center;
    margin-top: 18px;
    padding: clamp(32px, 4vw, 50px);
    overflow: hidden;
    border: 1px solid rgb(255 255 255 / .92);
    border-radius: 28px;
    background:
      radial-gradient(circle at 91% 0%, rgb(120 210 225 / .3), transparent 34%),
      radial-gradient(circle at 6% 92%, rgb(249 205 221 / .24), transparent 28%),
      linear-gradient(132deg, #f9fdfe, #edf9fa 54%, #fff5f8);
    box-shadow: inset 0 1px 0 #fff, 0 24px 60px rgb(61 118 140 / .12);
  }
  .official-agent-home-copy { max-width: 520px; padding-left: 4px; }
  .official-agent-home-copy h1,
  .official-agent-page-copy h1 {
    max-width: 10ch;
    margin: 16px 0 16px;
    font-size: clamp(3rem, 5vw, 4.65rem);
    line-height: 1;
    letter-spacing: -.06em;
  }
  .official-agent-home-copy h1 > span,
  .official-agent-section-head .official-title-lines > span { white-space: nowrap; }
  .official-agent-home-copy .official-lead,
  .official-agent-page-copy .official-lead { max-width: 31em; font-size: 1.02rem; line-height: 1.7; }
  .official-agent-home-copy .official-actions { margin-top: 24px; }
  .official-agent-kicker {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 6px 12px;
    border: 1px solid rgb(63 147 174 / .26);
    border-radius: 999px;
    color: #276b80;
    background: rgb(255 255 255 / .72);
    font-size: .78rem;
    font-weight: 750;
    letter-spacing: .08em;
  }
  .official-agent-home-visual,
  .official-agent-page-visual {
    position: relative;
    min-height: 396px;
    margin: 0;
    overflow: hidden;
    border: 1px solid rgb(255 255 255 / .8);
    border-radius: 20px;
    background:
      radial-gradient(circle at 18% 16%, rgb(255 255 255 / .82), transparent 25%),
      linear-gradient(142deg, rgb(191 234 240 / .72), rgb(231 245 247 / .78) 48%, rgb(246 207 221 / .76));
    box-shadow: inset 0 1px 0 #fff;
  }
  .official-agent-home-visual::after,
  .official-agent-page-visual::after {
    content: "";
    position: absolute;
    inset: auto 7% 6% 7%;
    height: 17%;
    border-radius: 50%;
    background: rgb(54 121 144 / .14);
    filter: blur(24px);
  }
  .official-agent-home-visual img,
  .official-agent-page-visual img {
    position: absolute;
    z-index: 1;
    right: 3%;
    bottom: -7%;
    width: min(78%, 410px);
    height: auto;
    object-fit: contain;
  }
  .official-agent-visual-copy {
    position: absolute;
    z-index: 2;
    top: 28px;
    left: 28px;
    max-width: 230px;
  }
  .official-agent-visual-copy > span { color: #36758a; font-size: .75rem; font-weight: 800; letter-spacing: .1em; }
  .official-agent-visual-copy strong { display: block; margin-top: 10px; color: #17344a; font-size: 1.55rem; line-height: 1.16; }
  .official-agent-visual-boundary {
    position: absolute;
    z-index: 3;
    right: 16px;
    bottom: 16px;
    width: min(260px, calc(100% - 44px));
    padding: 16px 18px;
    border: 1px solid rgb(255 255 255 / .86);
    border-radius: 16px;
    color: #29475b;
    background: rgb(255 255 255 / .84);
    box-shadow: 0 12px 28px rgb(55 111 136 / .12);
    backdrop-filter: blur(14px);
  }
  .official-agent-visual-boundary strong { display: block; margin-bottom: 4px; color: #17344a; }
  .official-agent-visual-boundary span { font-size: .82rem; line-height: 1.5; }
  .official-agent-section,
  .official-pet-section { padding-block: clamp(48px, 5vw, 64px); }
  .official-agent-section[data-reveal],
  .official-pet-section[data-reveal] { content-visibility: auto; contain-intrinsic-size: auto 780px; }
  .official-agent-section-head { max-width: 700px; margin-bottom: 28px; }
  .official-agent-section-head h2 { max-width: 12ch; margin: 0 0 14px; font-size: clamp(2.2rem, 3.8vw, 3.45rem); line-height: 1.04; letter-spacing: -.05em; }
  .official-agent-section-head p { max-width: 34em; margin: 0; color: var(--official-copy); line-height: 1.7; }
  .official-agent-modes {
    display: grid;
    grid-template-columns: minmax(260px, .68fr) minmax(0, 1.32fr);
    gap: clamp(28px, 4vw, 54px);
    align-items: start;
  }
  .official-agent-modes .official-agent-section-head { max-width: 360px; margin: 0; padding-top: 8px; }
  .official-agent-modes .official-mode-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: auto; gap: 14px; }
  .official-mode-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    grid-auto-rows: minmax(170px, auto);
    gap: 18px;
  }
  .official-mode-card {
    position: relative;
    overflow: hidden;
    padding: 24px;
    border: 1px solid rgb(115 178 196 / .23);
    border-radius: 22px;
    background: rgb(255 255 255 / .8);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .92), 0 18px 44px rgb(63 118 139 / .09);
    transform: perspective(900px) rotateX(var(--official-tilt-x, 0deg)) rotateY(var(--official-tilt-y, 0deg));
    transition: transform .28s cubic-bezier(.16,1,.3,1), box-shadow .28s ease, border-color .28s ease;
  }
  .official-mode-card::before,
  .official-pricing-plan::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0;
    background: radial-gradient(280px circle at var(--spot-x, 50%) var(--spot-y, 50%), rgb(97 196 213 / .18), transparent 65%);
    transition: opacity .25s ease;
  }
  .official-mode-card:hover::before,
  .official-pricing-plan:hover::before { opacity: 1; }
  .official-mode-card:hover { border-color: rgb(67 160 188 / .42); box-shadow: 0 24px 52px rgb(63 118 139 / .14); }
  .official-mode-card.primary {
    grid-column: 1 / -1;
    grid-row: auto;
    min-height: 0;
    color: #17344a;
    background:
      linear-gradient(145deg, rgb(255 255 255 / .86), rgb(222 244 247 / .74)),
      #def2f5;
  }
  .official-mode-card.secondary { grid-column: auto; min-height: 205px; }
  .official-mode-number { color: #5a91a4; font-size: .8rem; font-weight: 800; letter-spacing: .12em; }
  .official-mode-card h3 { max-width: 14ch; margin: 14px 0 9px; font-size: clamp(1.45rem, 2.25vw, 2.05rem); line-height: 1.1; letter-spacing: -.04em; }
  .official-mode-card p { max-width: 34em; margin: 0; color: var(--official-copy); line-height: 1.62; }
  .official-mode-card dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin: 20px 0 0; }
  .official-mode-card dl div { display: grid; gap: 5px; padding: 11px 14px 0 0; border-top: 1px solid rgb(73 138 159 / .18); }
  .official-mode-card dl div + div { padding-left: 14px; border-left: 1px solid rgb(73 138 159 / .14); }
  .official-mode-card dt { color: #336f84; font-weight: 750; }
  .official-mode-card dd { margin: 0; color: #4d6170; }
  .official-agent-path { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; counter-reset: agent-path; }
  .official-agent-flow-shell { padding-block: 0; }
  .official-agent-path article { counter-increment: agent-path; position: relative; min-height: 168px; padding: 22px 22px 18px; border-top: 1px solid rgb(71 139 161 / .28); }
  .official-agent-path article::before { content: counter(agent-path, decimal-leading-zero); display: block; margin-bottom: 24px; color: #3f879e; font-size: .78rem; font-weight: 800; letter-spacing: .12em; }
  .official-agent-path article:not(:last-child)::after { content: ""; position: absolute; top: -4px; right: -4px; width: 8px; height: 8px; border-radius: 50%; background: #77c5d3; }
  .official-agent-path strong { display: block; margin-bottom: 10px; font-size: 1.08rem; }
  .official-agent-path p { margin: 0; color: var(--official-copy); font-size: .92rem; line-height: 1.65; }
  .official-foundation-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(300px, .7fr); gap: 18px; }
  .official-foundation-card {
    min-height: 205px;
    padding: 26px;
    border-radius: 22px;
    border: 1px solid rgb(94 159 179 / .2);
    background: rgb(255 255 255 / .84);
  }
  .official-foundation-card.translation { background: linear-gradient(132deg, #e7f7f8, #fff 58%); }
  .official-foundation-card.pets { background: linear-gradient(135deg, #fff, #fbe6ee); }
  .official-foundation-card h3 { margin: 0 0 12px; font-size: 1.65rem; letter-spacing: -.035em; }
  .official-foundation-card p { max-width: 38em; margin: 0 0 20px; color: var(--official-copy); line-height: 1.7; }
  .official-agent-section + .official-end-cta { padding-top: 4px; padding-bottom: clamp(42px, 5vw, 62px); }
  .official-agent-page-hero { display: grid; grid-template-columns: minmax(0, .95fr) minmax(390px, .8fr); gap: 64px; align-items: center; padding-block: 68px 86px; }
  .official-agent-page-visual { min-height: 450px; }
  .official-agent-page-visual img { width: min(75%, 360px); }
  .official-agent-control-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 18px; }
  .official-agent-control-card { min-height: 330px; padding: 34px; border: 1px solid rgb(97 162 183 / .22); border-radius: 22px; background: #fff; }
  .official-agent-control-card.media { position: relative; overflow: hidden; background: linear-gradient(145deg, #dff4f6, #fce5ed); }
  .official-agent-control-card.media img { position: absolute; right: -2%; bottom: -8%; width: min(55%, 310px); height: auto; }
  .official-agent-control-card h3 { max-width: 14ch; margin: 0 0 14px; font-size: 2rem; letter-spacing: -.04em; }
  .official-agent-control-card p { max-width: 34em; color: var(--official-copy); line-height: 1.7; }
  .official-agent-control-card ul { display: grid; gap: 12px; margin: 24px 0 0; padding: 0; list-style: none; }
  .official-agent-control-card li { padding-top: 12px; border-top: 1px solid var(--official-line); color: #40586a; }
  .official-capability-bento { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 18px; }
  .official-capability-bento article { min-height: 250px; padding: 30px; border-radius: 22px; border: 1px solid rgb(91 158 178 / .2); background: #fff; }
  .official-capability-bento article:nth-child(1) { grid-column: span 7; min-height: 390px; background: linear-gradient(145deg, #dff5f7, #fff); }
  .official-capability-bento article:nth-child(2) { grid-column: span 5; background: linear-gradient(145deg, #fff, #fce8ef); }
  .official-capability-bento article:nth-child(3),
  .official-capability-bento article:nth-child(4) { grid-column: span 4; }
  .official-capability-bento article:nth-child(5) { grid-column: span 4; background: #edf8fa; }
  .official-capability-bento h3 { max-width: 13ch; margin: 14px 0 12px; font-size: clamp(1.45rem, 2.5vw, 2.2rem); letter-spacing: -.04em; }
  .official-capability-bento p { margin: 0 0 20px; color: var(--official-copy); line-height: 1.68; }
  .official-capability-state { color: #34788e; font-size: .76rem; font-weight: 800; letter-spacing: .08em; }
  .official-pets-hero { display: grid; grid-template-columns: minmax(0, .85fr) minmax(420px, 1fr); gap: 70px; align-items: center; padding-block: 64px 80px; }
  .official-pets-hero h1 { max-width: 10ch; margin: 16px 0 18px; font-size: clamp(3.1rem, 6vw, 5.5rem); line-height: .98; letter-spacing: -.065em; }
  .official-pet-hero-frame { min-height: 470px; }
  .official-pet-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 18px; }
  .official-pet-card { grid-column: span 4; overflow: hidden; border: 1px solid rgb(96 160 180 / .22); border-radius: 22px; background: rgb(255 255 255 / .86); }
  .official-pet-card:first-child,
  .official-pet-card:nth-child(2) { grid-column: span 6; }
  .official-pets-hero > .official-pet-card { grid-column: auto; }
  .official-pet-frame { position: relative; aspect-ratio: 1 / .82; overflow: hidden; background: linear-gradient(145deg, #dff4f6, #fbe8ef); }
  .official-pet-frame::before { content: ""; position: absolute; inset: 0; opacity: 1; background: linear-gradient(100deg, rgb(255 255 255 / .12) 20%, rgb(255 255 255 / .7) 42%, rgb(255 255 255 / .12) 64%); background-size: 220% 100%; }
  .official-pet-frame img { width: 100%; height: 100%; object-fit: contain; opacity: 0; transform: scale(.98); transition: opacity .28s ease, transform .45s cubic-bezier(.16,1,.3,1); }
  .official-pet-frame.is-loaded::before { opacity: 0; }
  .official-pet-frame.is-loaded img { opacity: 1; transform: scale(1); }
  .official-pet-frame.is-error img { display: none; }
  .official-pet-error { position: absolute; inset: 0; display: none; place-items: center; padding: 24px; color: #52647e; text-align: center; }
  .official-pet-frame.is-error .official-pet-error { display: grid; }
  .official-pet-card-copy { padding: 24px 26px 28px; }
  .official-pet-card-copy span { color: #438298; font-size: .78rem; font-weight: 800; }
  .official-pet-card-copy h2 { margin: 8px 0 8px; font-size: 1.45rem; }
  .official-pet-card-copy p { margin: 0; color: var(--official-copy); line-height: 1.65; }
  .official-pricing-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .official-pricing-plan { position: relative; overflow: hidden; border-radius: 22px; }
  .official-pricing-plan.agent { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(260px, .8fr) minmax(0, 1.2fr); gap: 34px; background: linear-gradient(138deg, #dff4f6, #fff 54%, #fbe6ed); }
  .official-pricing-plan.agent > .official-pricing-modules { grid-column: 2; grid-row: 1 / span 6; align-self: stretch; }
  .official-pricing-plan.agent > .official-button { justify-self: start; }
  .official-pricing-plan-label { border-radius: 999px; }

  @media (prefers-reduced-motion: no-preference) {
    .official-pet-frame.is-loading::before { animation: officialPetShimmer 1.25s ease-in-out infinite; }
  }
  @keyframes officialPetShimmer { to { background-position: -120% 0; } }

  @media (max-width: 1020px) {
    .official-agent-home-hero,
    .official-agent-page-hero,
    .official-pets-hero { grid-template-columns: 1fr; gap: 34px; }
    .official-agent-home-hero { min-height: auto; padding: 36px; }
    .official-agent-modes { grid-template-columns: 1fr; gap: 28px; }
    .official-agent-modes .official-agent-section-head { max-width: 640px; padding-top: 0; }
    .official-agent-home-copy,
    .official-agent-page-copy { max-width: 720px; }
    .official-agent-home-visual { min-height: 380px; }
    .official-capability-bento article:nth-child(n) { grid-column: span 6; }
    .official-capability-bento article:first-child { grid-column: 1 / -1; }
  }
  @media (max-width: 700px) {
    .official-agent-home-hero,
    .official-agent-page-hero,
    .official-pets-hero { width: min(100% - 32px, 1180px); padding-block: 26px 42px; }
    .official-agent-home-hero { margin-top: 10px; padding: 24px 20px 16px; gap: 18px; border-radius: 22px; }
    .official-agent-home-copy h1,
    .official-agent-page-copy h1,
    .official-pets-hero h1 { max-width: 10ch; font-size: clamp(2.85rem, 14vw, 4rem); }
    .official-agent-home-visual,
    .official-agent-page-visual,
    .official-pet-hero-frame { min-height: 380px; }
    .official-agent-home-visual { min-height: 300px; }
    .official-agent-home-visual img,
    .official-agent-page-visual img { right: -4%; width: 92%; }
    .official-agent-visual-copy { top: 24px; left: 24px; }
    .official-agent-visual-boundary { right: 14px; bottom: 14px; }
    .official-agent-section,
    .official-pet-section { padding-block: 40px; }
    .official-mode-grid,
    .official-agent-path,
    .official-foundation-grid,
    .official-agent-control-grid,
    .official-capability-bento,
    .official-pet-grid,
    .official-pricing-grid,
    .official-pricing-plan.agent { grid-template-columns: 1fr; }
    .official-agent-modes .official-mode-grid { grid-template-columns: 1fr; }
    .official-mode-card.primary,
    .official-mode-card.secondary,
    .official-capability-bento article:nth-child(n),
    .official-pet-card,
    .official-pet-card:first-child,
    .official-pet-card:nth-child(2),
    .official-pricing-plan.agent { grid-column: auto; grid-row: auto; }
    .official-agent-modes .official-mode-card.primary,
    .official-agent-modes .official-mode-card.secondary { grid-column: 1; grid-row: auto; }
    .official-mode-card.primary,
    .official-mode-card.secondary { min-height: 0; }
    .official-mode-card dl { grid-template-columns: 1fr; }
    .official-mode-card dl div + div { padding-left: 0; border-left: 0; }
    .official-agent-path article { min-height: auto; padding: 22px 0; }
    .official-agent-path article::before { margin-bottom: 20px; }
    .official-agent-path article:not(:last-child)::after { display: none; }
    .official-agent-control-card.media { min-height: 430px; }
    .official-pricing-plan.agent > .official-pricing-modules { grid-column: auto; grid-row: auto; }
  }

  @media (prefers-reduced-motion: reduce) {
    .official-mode-card,
    .official-pet-frame img { transform: none !important; transition: none !important; }
    .official-pet-frame::before { animation: none !important; }
  }

  /* Home v4: one continuous agent story, with translation kept as a foundation. */
  .official-home-v4 { overflow: clip; background: #fff; }
  .official-home-v4-hero {
    position: relative;
    isolation: isolate;
    padding: clamp(34px, 4.2vw, 58px) 0 clamp(46px, 5.2vw, 70px);
    background:
      radial-gradient(circle at 76% 10%, rgb(239 175 201 / .25), transparent 22%),
      radial-gradient(circle at 9% 2%, rgb(40 172 198 / .2), transparent 25%),
      linear-gradient(180deg, #f5fbfd 0%, #fff 78%);
  }
  .official-home-v4-hero::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 12%;
    right: 2%;
    width: min(58vw, 840px);
    aspect-ratio: 1.48;
    border-radius: 46%;
    background: linear-gradient(128deg, rgb(169 231 241 / .62), rgb(255 255 255 / .42) 48%, rgb(239 175 201 / .58));
    filter: blur(42px);
    opacity: .78;
    transform: rotate(-5deg);
    pointer-events: none;
  }
  .official-home-v4-hero-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(320px, .7fr) minmax(0, 1.3fr);
    gap: clamp(32px, 4.5vw, 66px);
    align-items: center;
  }
  .official-home-v4-copy { position: relative; z-index: 2; }
  .official-home-v4-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    color: #34788e;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .07em;
  }
  .official-home-v4-kicker::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #45b9cb; box-shadow: 0 0 0 5px rgb(69 185 203 / .12); }
  .official-home-v4-copy h1 {
    max-width: 8.8ch;
    margin: 16px 0 18px;
    font-size: clamp(58px, 5.6vw, 82px);
    line-height: .96;
    letter-spacing: -.066em;
  }
  .official-home-v4-copy h1 span { display: block; white-space: nowrap; }
  .official-home-v4-title-accent {
    width: max-content;
    color: #288ba8;
    background: linear-gradient(104deg, #239bb9 5%, #6578d8 54%, #d26d9d 96%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .official-home-v4-copy .official-lead { max-width: 32em; margin: 0; font-size: 16px; line-height: 1.68; text-wrap: pretty; }
  .official-home-v4-copy .official-actions { margin-top: 22px; }
  .official-home-v4-status { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 22px 0 0; }
  .official-home-v4-status div { min-width: 0; padding: 11px 10px 10px; border: 1px solid rgb(193 216 222 / .82); border-radius: 12px; background: rgb(255 255 255 / .68); box-shadow: inset 0 1px 0 rgb(255 255 255 / .9); backdrop-filter: blur(10px); }
  .official-home-v4-status dt { overflow: hidden; color: #798a99; font-size: 9px; font-weight: 780; letter-spacing: .04em; text-overflow: ellipsis; white-space: nowrap; }
  .official-home-v4-status dd { overflow: hidden; margin: 5px 0 0; color: #2d4355; font-size: 11px; font-weight: 760; text-overflow: ellipsis; white-space: nowrap; }
  .official-home-v4-workspace { position: relative; min-width: 0; isolation: isolate; padding-top: 8px; }
  .official-home-v4-workspace::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: -7% -8% -8% -13%;
    border-radius: 44% 56% 48% 52%;
    background: radial-gradient(circle at 62% 44%, rgb(255 255 255 / .96), rgb(169 231 241 / .5) 48%, rgb(239 175 201 / .38) 72%, transparent 74%);
    filter: blur(18px);
    pointer-events: none;
  }
  .official-home-v4-workspace .official-product-theater-wrap { width: 100%; margin: 0; padding: 0; }
  .official-home-v4-workspace .official-product-theater { position: relative; z-index: 1; --theater-scale: 1; --theater-y: 0px; border-radius: 17px; transform: none; box-shadow: 0 26px 68px rgb(38 95 132 / .22); }
  .official-home-v4-workspace .official-theater-body { min-height: 530px; grid-template-columns: 62px 164px minmax(0, 1fr); }
  .official-home-v4-workspace .official-product-scene { min-height: 530px; grid-template-columns: minmax(0, 1fr) 202px; }
  .official-home-v4-workspace .official-theater-chat { min-height: 530px; }
  .official-home-v4-workspace .official-theater-titlebar { min-height: 48px; grid-template-columns: 90px minmax(0, 1fr) auto; }
  .official-home-v4-workspace .official-theater-titlebar span:last-child { max-width: 120px; text-align: right; }
  .official-home-v4-workspace .official-theater-rail { padding-inline: 6px; }
  .official-home-v4-workspace .official-theater-tab { width: 48px; }
  .official-home-v4-workspace .official-theater-inbox-head { padding-inline: 14px; }
  .official-home-v4-workspace .official-theater-messages { padding: 24px 18px; }
  .official-home-v4-workspace .official-theater-inspector { padding: 17px 14px; }
  .official-home-v4-hero-agent {
    position: absolute;
    z-index: 4;
    left: -108px;
    bottom: -20px;
    width: 218px;
    height: 278px;
    margin: 0;
    pointer-events: none;
  }
  .official-home-v4-hero-agent-art {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 196px;
    height: 210px;
    aspect-ratio: auto;
    overflow: visible;
    background: transparent;
  }
  .official-home-v4-hero-agent-art::before { border-radius: 48%; }
  .official-home-v4-hero-agent-art img { object-fit: contain; filter: drop-shadow(0 18px 14px rgb(47 82 104 / .18)); }
  .official-home-v4-context-bubble {
    position: absolute;
    top: 0;
    left: -18px;
    width: 184px;
    padding: 13px 14px;
    border: 1px solid rgb(255 255 255 / .92);
    border-radius: 15px 15px 15px 5px;
    background: rgb(255 255 255 / .84);
    box-shadow: 0 16px 36px rgb(47 88 109 / .16);
    backdrop-filter: blur(15px);
  }
  .official-home-v4-context-bubble::after { content: ""; position: absolute; left: 22px; bottom: -7px; width: 14px; height: 14px; border-right: 1px solid rgb(255 255 255 / .92); border-bottom: 1px solid rgb(255 255 255 / .92); background: rgb(255 255 255 / .84); transform: rotate(45deg); }
  .official-home-v4-context-bubble span { display: block; color: #65808e; font-size: 9px; font-weight: 820; letter-spacing: .06em; }
  .official-home-v4-context-bubble strong { display: block; margin-top: 5px; color: #193b50; font-size: 14px; letter-spacing: -.02em; }
  .official-home-v4-context-bubble small { display: inline-flex; align-items: center; gap: 5px; margin-top: 6px; color: #4c7485; font-size: 10px; font-weight: 700; }
  .official-home-v4-context-bubble small::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #e998b9; box-shadow: 0 0 0 4px rgb(233 152 185 / .14); }

  .official-home-v4-section { padding: clamp(52px, 5vw, 72px) 0; }
  .official-home-v4-section.soft { background: #f6fafb; }
  .official-home-v4-head {
    display: grid;
    grid-template-columns: minmax(260px, .72fr) minmax(300px, 1fr);
    gap: clamp(34px, 7vw, 94px);
    align-items: end;
    margin-bottom: 34px;
  }
  .official-home-v4-head > div > span { color: #34758c; font-size: 11px; font-weight: 820; letter-spacing: .08em; }
  .official-home-v4-head h2 { max-width: 12ch; margin: 12px 0 0; font-size: clamp(38px, 4.4vw, 58px); line-height: 1.04; letter-spacing: -.052em; }
  .official-home-v4-head h2 span { display: block; }
  .official-home-v4-head > p { max-width: 42em; margin: 0; color: var(--official-copy); font-size: 16px; line-height: 1.72; text-wrap: pretty; }

  .official-home-v4-modes {
    overflow: hidden;
    border: 1px solid #dbe8eb;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 20px 54px rgb(47 98 117 / .1);
  }
  .official-home-v4-mode-tabs { display: grid; grid-template-columns: repeat(3, 1fr); border-bottom: 1px solid #dbe8eb; }
  .official-home-v4-mode-tab {
    min-height: 88px;
    padding: 18px 22px;
    border: 0;
    border-right: 1px solid #dbe8eb;
    background: #f8fbfc;
    color: #596c7c;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: color .25s ease, background-color .25s ease;
  }
  .official-home-v4-mode-tab:last-child { border-right: 0; }
  .official-home-v4-mode-tab strong { display: block; color: inherit; font-size: 15px; }
  .official-home-v4-mode-tab span { display: block; margin-top: 5px; font-size: 12px; }
  .official-home-v4-mode-tab:hover { color: #285d73; background: #f0f8fa; }
  .official-home-v4-mode-tab[aria-selected="true"] { color: #173f55; background: linear-gradient(128deg, #e4f5f8, #fff1f7); }
  .official-home-v4-mode-panel { min-height: 315px; display: grid; grid-template-columns: minmax(0, .9fr) minmax(300px, 1.1fr); gap: clamp(32px, 6vw, 82px); align-items: center; padding: clamp(28px, 4.5vw, 52px); animation: official-panel-in .42s cubic-bezier(.16,1,.3,1); }
  .official-home-v4-mode-panel[hidden] { display: none; }
  .official-home-v4-mode-copy > span { color: #3f7487; font-size: 11px; font-weight: 820; letter-spacing: .07em; }
  .official-home-v4-mode-copy h3 { max-width: 14ch; margin: 12px 0 0; font-size: clamp(30px, 3.4vw, 44px); line-height: 1.08; letter-spacing: -.045em; }
  .official-home-v4-mode-copy p { max-width: 40em; margin: 16px 0 0; color: var(--official-copy); line-height: 1.72; }
  .official-home-v4-mode-map { display: grid; gap: 0; border-top: 1px solid #d7e5e9; }
  .official-home-v4-mode-map div { display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 20px; padding: 14px 0; border-bottom: 1px solid #d7e5e9; }
  .official-home-v4-mode-map dt { color: #667686; font-size: 11px; font-weight: 760; }
  .official-home-v4-mode-map dd { margin: 0; color: #2d4354; font-size: 13px; line-height: 1.55; }

  .official-home-v4-flow-section {
    color: #163047;
    background:
      radial-gradient(circle at 93% 10%, rgb(244 184 211 / .38), transparent 28%),
      radial-gradient(circle at 5% 92%, rgb(91 190 214 / .34), transparent 30%),
      linear-gradient(125deg, #9fdce7, #dbeaf5 54%, #f4c9dd);
  }
  .official-home-v4-flow-section .official-home-v4-head > div > span { color: #2b697d; }
  .official-home-v4-flow-section .official-home-v4-head > p { color: rgb(22 48 71 / .72); }
  .official-home-v4-flow {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
  }
  .official-home-v4-flow::before,
  .official-home-v4-flow::after { content: ""; position: absolute; z-index: 0; top: 27px; left: 8%; right: 8%; height: 2px; border-radius: 999px; }
  .official-home-v4-flow::before { background: rgb(255 255 255 / .5); }
  .official-home-v4-flow::after { right: auto; width: 30%; background: linear-gradient(90deg, #3c91aa, #fff, #b8769b); transform-origin: left; }
  .official-home-v4-flow article { position: relative; z-index: 1; min-height: 218px; padding: 44px 22px 22px; border: 1px solid rgb(255 255 255 / .62); border-radius: 16px; background: rgb(255 255 255 / .55); box-shadow: inset 0 1px 0 rgb(255 255 255 / .76); backdrop-filter: blur(15px); }
  .official-home-v4-flow article::before { content: attr(data-step); position: absolute; top: 17px; left: 22px; width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%; background: #fff; color: #397c91; font-size: 9px; font-weight: 850; box-shadow: 0 5px 12px rgb(55 105 126 / .13); }
  .official-home-v4-flow article > span { display: inline-flex; margin-top: 18px; color: #64778a; font-size: 10px; font-weight: 800; letter-spacing: .06em; }
  .official-home-v4-flow article strong { display: block; margin-top: 9px; font-size: 18px; }
  .official-home-v4-flow article p { margin: 10px 0 0; color: #4d6475; font-size: 13px; line-height: 1.65; }

  .official-home-v4-bento { display: grid; grid-template-columns: repeat(12, 1fr); gap: 14px; }
  .official-home-v4-cap-card { position: relative; min-height: 248px; overflow: hidden; padding: 28px; border: 1px solid #dce8eb; border-radius: 18px; background: #fff; box-shadow: 0 14px 38px rgb(48 89 107 / .07); }
  .official-home-v4-cap-card:nth-child(1) { grid-column: span 7; min-height: 360px; background: linear-gradient(140deg, #e3f5f8, #fff 68%); }
  .official-home-v4-cap-card:nth-child(2) { grid-column: span 5; background: linear-gradient(140deg, #fff, #faeaf2); }
  .official-home-v4-cap-card:nth-child(3) { grid-column: span 5; }
  .official-home-v4-cap-card:nth-child(4) { grid-column: span 7; background: linear-gradient(140deg, #f7fbfc, #eff4ff); }
  .official-home-v4-cap-card::before { content: ""; position: absolute; inset: 0; opacity: 0; pointer-events: none; background: radial-gradient(320px circle at var(--spot-x, 50%) var(--spot-y, 50%), rgb(79 186 210 / .17), transparent 68%); transition: opacity .25s ease; }
  .official-home-v4-cap-card:hover::before { opacity: 1; }
  .official-home-v4-cap-card > * { position: relative; z-index: 1; }
  .official-home-v4-cap-card > span { color: #4e8798; font-size: 11px; font-weight: 820; letter-spacing: .07em; }
  .official-home-v4-cap-card h3 { max-width: 14ch; margin: 14px 0 0; font-size: clamp(26px, 3vw, 39px); line-height: 1.08; letter-spacing: -.045em; }
  .official-home-v4-cap-card > p { max-width: 44em; margin: 15px 0 0; color: var(--official-copy); font-size: 14px; line-height: 1.72; }
  .official-home-v4-cap-pet {
    position: absolute;
    z-index: 2;
    right: 10px;
    bottom: -10px;
    width: 168px;
    height: 178px;
    aspect-ratio: auto;
    overflow: visible;
    background: transparent;
    pointer-events: none;
  }
  .official-home-v4-cap-pet::before { border-radius: 48%; }
  .official-home-v4-cap-pet img { object-fit: contain; filter: drop-shadow(0 14px 12px rgb(48 78 95 / .12)); }
  .official-home-v4-cap-card:nth-child(1) .official-home-v4-cap-pet { right: auto; left: 18px; width: 188px; height: 190px; }
  .official-home-v4-cap-card:nth-child(2) .official-home-v4-cap-pet { width: 176px; height: 184px; }
  .official-home-v4-cap-card:nth-child(3) .official-home-v4-cap-pet { width: 154px; height: 164px; }
  .official-home-v4-cap-card:nth-child(4) .official-home-v4-cap-pet { width: 174px; height: 182px; }
  .official-home-v4-memory-ui { width: min(360px, 72%); margin: 28px 0 0 auto; border: 1px solid #d7e5e9; border-radius: 13px; background: rgb(255 255 255 / .78); box-shadow: 0 14px 30px rgb(49 101 120 / .1); }
  .official-home-v4-memory-ui div { display: grid; grid-template-columns: 8px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 12px 14px; border-bottom: 1px solid #e1ebed; color: #405869; font-size: 11px; }
  .official-home-v4-memory-ui div:last-child { border-bottom: 0; }
  .official-home-v4-memory-ui i { width: 7px; height: 7px; border-radius: 50%; background: #53aebf; }
  .official-home-v4-memory-ui small { color: #7f8e9c; }
  .official-home-v4-risk-ui { width: calc(100% - 126px); display: grid; gap: 8px; margin-top: 28px; }
  .official-home-v4-risk-ui span { padding: 10px 12px; border: 1px solid #eadbe3; border-radius: 10px; background: rgb(255 255 255 / .68); color: #6b5263; font-size: 11px; }
  .official-home-v4-signal { width: calc(100% - 120px); display: flex; align-items: end; gap: 5px; height: 52px; margin-top: 28px; }
  .official-home-v4-signal i { width: 8px; height: var(--signal); border-radius: 999px; background: linear-gradient(180deg, #67bfd2, #d993b6); transform-origin: bottom; }
  .official-home-v4-task-ui { width: calc(100% - 138px); display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; margin-top: 28px; }
  .official-home-v4-task-ui div { padding: 14px; border-radius: 11px; background: #fff; box-shadow: 0 8px 22px rgb(55 82 128 / .08); }
  .official-home-v4-task-ui strong { display: block; font-size: 12px; }
  .official-home-v4-task-ui span { display: block; margin-top: 6px; color: #78869a; font-size: 10px; line-height: 1.5; }

  .official-home-v4-foundation { padding: 24px 0; border-top: 1px solid #dbe7ea; border-bottom: 1px solid #dbe7ea; background: #f8fbfc; }
  .official-home-v4-foundation-inner { display: grid; grid-template-columns: minmax(250px, .56fr) minmax(0, 1.44fr) auto; gap: 28px; align-items: center; }
  .official-home-v4-foundation-inner > span { color: #35758a; font-size: 11px; font-weight: 820; letter-spacing: .07em; }
  .official-home-v4-foundation-inner strong { display: block; font-size: 20px; line-height: 1.3; }
  .official-home-v4-foundation-inner p { margin: 6px 0 0; color: var(--official-copy); font-size: 13px; line-height: 1.6; }

  .official-home-v4-pets { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
  .official-home-v4-pet { position: relative; min-height: 224px; margin: 0; overflow: hidden; border: 1px solid rgb(255 255 255 / .82); border-radius: 16px; background: linear-gradient(145deg, #e9f6f8, #f9eaf1); box-shadow: 0 14px 34px rgb(62 101 120 / .09); }
  .official-home-v4-pet:nth-child(2) { background: linear-gradient(145deg, #edf4ff, #f5edff); }
  .official-home-v4-pet:nth-child(3) { background: linear-gradient(145deg, #fff0f5, #edf7ff); }
  .official-home-v4-pet:nth-child(4) { background: linear-gradient(145deg, #eef1ff, #f9efff); }
  .official-home-v4-pet:nth-child(5) { background: linear-gradient(145deg, #e8f7f3, #eef4ff); }
  .official-home-v4-pet .official-pet-frame { position: absolute; inset: 0; aspect-ratio: auto; background: transparent; }
  .official-home-v4-pet .official-pet-frame::before { z-index: 2; }
  .official-home-v4-pet .official-pet-frame img { position: absolute; right: 1%; bottom: -7%; width: 86%; height: 82%; object-fit: contain; }
  .official-home-v4-pet figcaption { position: absolute; z-index: 3; top: 16px; left: 17px; right: 12px; pointer-events: none; }
  .official-home-v4-pet figcaption strong { display: block; color: #24394a; font-size: 14px; }
  .official-home-v4-pet figcaption span { display: block; margin-top: 4px; color: #6f7e8c; font-size: 10px; }
  .official-home-v4-pet:hover .official-pet-frame img { transform: translateY(-4px) scale(1.025); }

  .official-home-v4-pricing { background: #f5f8f9; }
  .official-home-v4-price-grid { display: grid; grid-template-columns: repeat(3, 1fr); overflow: hidden; border: 1px solid #d8e4e7; border-radius: 20px; background: #fff; box-shadow: 0 20px 54px rgb(43 83 101 / .09); }
  .official-home-v4-price-card { position: relative; min-height: 430px; display: flex; flex-direction: column; padding: 28px; border-right: 1px solid #d8e4e7; }
  .official-home-v4-price-card:last-child { border-right: 0; }
  .official-home-v4-price-card.agent { background: linear-gradient(145deg, #b6e4ec, #f5e1ec); }
  .official-home-v4-price-card > span { align-self: flex-start; padding: 6px 9px; border-radius: 999px; background: rgb(61 132 153 / .1); color: #376f82; font-size: 10px; font-weight: 820; }
  .official-home-v4-price-card h3 { max-width: calc(100% - 84px); margin: 20px 0 0; font-size: 28px; letter-spacing: -.035em; }
  .official-home-v4-price-pet {
    position: absolute;
    right: 18px;
    top: 42px;
    width: 82px;
    height: 92px;
    aspect-ratio: auto;
    overflow: visible;
    background: transparent;
    pointer-events: none;
  }
  .official-home-v4-price-pet::before { border-radius: 48%; }
  .official-home-v4-price-pet img { object-fit: contain; filter: drop-shadow(0 10px 9px rgb(45 75 92 / .11)); }
  .official-home-v4-price-card > p { min-height: 70px; margin: 12px 0 0; color: var(--official-copy); font-size: 13px; line-height: 1.65; }
  .official-home-v4-price { margin-top: 20px; padding: 16px 0; border-top: 1px solid rgb(79 125 142 / .18); border-bottom: 1px solid rgb(79 125 142 / .18); font-size: 18px; font-weight: 800; }
  .official-home-v4-price-card ul { display: grid; gap: 10px; margin: 20px 0 24px; padding: 0; list-style: none; }
  .official-home-v4-price-card li { display: grid; grid-template-columns: 8px minmax(0, 1fr); gap: 9px; color: #4b6070; font-size: 12px; line-height: 1.55; }
  .official-home-v4-price-card li::before { content: ""; width: 6px; height: 6px; margin-top: .48em; border-radius: 50%; background: #4aa4b8; }
  .official-home-v4-price-card .official-button { width: 100%; justify-content: center; margin-top: auto; }
  .official-home-v4 > .official-end-cta { padding-top: 20px; padding-bottom: 64px; }

  @media (prefers-reduced-motion: no-preference) {
    .official-home-v4-flow::after { animation: official-home-v4-beam 5.4s ease-in-out infinite alternate; }
    .official-home-v4-signal i { animation: official-home-v4-signal 1.4s ease-in-out infinite alternate; animation-delay: calc(var(--order) * -110ms); }
    .official-home-v4-hero-agent-art { animation: official-home-v4-agent-float 4.8s ease-in-out infinite; }
    .official-home-v4-context-bubble { animation: official-home-v4-bubble-breathe 4.8s ease-in-out infinite; }
  }
  @keyframes official-home-v4-beam { from { width: 17%; opacity: .55; } to { width: 84%; opacity: 1; } }
  @keyframes official-home-v4-signal { from { transform: scaleY(.45); opacity: .55; } to { transform: scaleY(1); opacity: 1; } }
  @keyframes official-home-v4-agent-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
  @keyframes official-home-v4-bubble-breathe { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }

  @media (max-width: 1020px) {
    .official-home-v4-hero-grid { grid-template-columns: 1fr; }
    .official-home-v4-copy { max-width: 680px; }
    .official-home-v4-copy h1 { max-width: 10ch; }
    .official-home-v4-hero-agent { left: auto; right: 12px; bottom: -18px; }
    .official-home-v4-workspace .official-theater-body { grid-template-columns: 68px 210px minmax(0, 1fr); }
    .official-home-v4-workspace .official-product-scene { grid-template-columns: minmax(0, 1fr) 240px; }
    .official-home-v4-bento .official-home-v4-cap-card:nth-child(n) { grid-column: span 6; min-height: 290px; }
    .official-home-v4-pets { grid-template-columns: repeat(3, 1fr); }
    .official-home-v4-pet:first-child, .official-home-v4-pet:nth-child(2) { grid-column: span 1; }
    .official-home-v4-price-card { padding: 24px 20px; }
  }
  @media (max-width: 700px) {
    .official-home-v4-hero { padding: 24px 0 42px; }
    .official-home-v4-hero::before { top: 43%; right: -32%; width: 136vw; }
    .official-home-v4-hero-grid { gap: 22px; }
    .official-home-v4-copy h1 { max-width: 100%; margin: 13px 0 14px; font-size: clamp(46px, 14.4vw, 58px); }
    .official-home-v4-copy .official-lead { font-size: 14px; line-height: 1.62; }
    .official-home-v4-copy .official-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 18px; }
    .official-home-v4-copy .official-actions .official-button { min-width: 0; min-height: 44px; padding: 10px 8px; font-size: 12px; white-space: nowrap; }
    .official-home-v4-status { gap: 6px; margin-top: 16px; }
    .official-home-v4-status div { padding: 9px 7px; border-radius: 10px; }
    .official-home-v4-status dt { font-size: 8px; }
    .official-home-v4-status dd { margin-top: 4px; font-size: 10px; }
    .official-home-v4-workspace { padding-top: 20px; }
    .official-home-v4-workspace::before { inset: -8% -28% -9%; }
    .official-home-v4-workspace .official-product-theater { border-radius: 13px; }
    .official-home-v4-hero-agent { top: -39px; right: -2px; bottom: auto; width: 130px; height: 156px; }
    .official-home-v4-hero-agent-art { left: auto; right: -8px; width: 104px; height: 120px; }
    .official-home-v4-context-bubble { top: 7px; left: -52px; width: 128px; padding: 9px 10px; border-radius: 12px 12px 12px 4px; }
    .official-home-v4-context-bubble::after { left: auto; right: 20px; bottom: -6px; width: 11px; height: 11px; }
    .official-home-v4-context-bubble span { font-size: 7px; }
    .official-home-v4-context-bubble strong { margin-top: 3px; font-size: 11px; }
    .official-home-v4-context-bubble small { margin-top: 4px; font-size: 8px; }
    .official-home-v4-workspace .official-theater-titlebar { grid-template-columns: 60px minmax(0, 1fr); padding: 0 12px; }
    .official-home-v4-workspace .official-theater-titlebar > span:last-child { display: none; }
    .official-home-v4-workspace .official-theater-body { min-height: 450px; grid-template-columns: 54px minmax(0, 1fr); }
    .official-home-v4-workspace .official-theater-inbox { display: none; }
    .official-home-v4-workspace .official-product-scene { min-height: 450px; grid-template-columns: 1fr; }
    .official-home-v4-workspace .official-theater-chat { min-height: 450px; }
    .official-home-v4-workspace .official-theater-inspector { display: none; }
    .official-home-v4-workspace .official-theater-messages { padding: 20px 14px; }
    .official-home-v4-workspace .official-theater-bubble { max-width: 94%; padding: 13px; }
    .official-home-v4-workspace .official-theater-composer { margin: 0 12px 12px; }
    .official-home-v4-section { padding: 46px 0; }
    .official-home-v4-head { grid-template-columns: 1fr; gap: 16px; margin-bottom: 24px; }
    .official-home-v4-head h2 { max-width: 100%; font-size: 36px; line-height: 1.08; }
    .official-home-v4-head h2 span { display: inline; }
    .official-home-v4-head h2 span + span::before { content: " "; }
    .official-home-v4-mode-tabs { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; }
    .official-home-v4-mode-tab { min-width: 170px; min-height: 78px; scroll-snap-align: start; }
    .official-home-v4-mode-panel { min-height: 0; grid-template-columns: 1fr; gap: 24px; padding: 24px 18px; }
    .official-home-v4-mode-copy h3 { font-size: 30px; }
    .official-home-v4-flow { grid-template-columns: 1fr; }
    .official-home-v4-flow::before, .official-home-v4-flow::after { top: 20px; bottom: 20px; left: 26px; right: auto; width: 2px; height: auto; }
    .official-home-v4-flow::after { width: 2px; height: 36%; transform-origin: top; }
    .official-home-v4-flow article { min-height: 0; padding: 20px 18px 20px 58px; }
    .official-home-v4-flow article::before { top: 18px; left: 15px; }
    .official-home-v4-flow article > span { margin-top: 0; }
    .official-home-v4-bento { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; }
    .official-home-v4-bento .official-home-v4-cap-card:nth-child(n) { grid-column: auto; min-width: 86vw; min-height: 420px; padding: 24px 20px; scroll-snap-align: start; }
    .official-home-v4-memory-ui { width: 100%; }
    .official-home-v4-risk-ui, .official-home-v4-signal, .official-home-v4-task-ui { width: calc(100% - 118px); }
    .official-home-v4-task-ui { grid-template-columns: 1fr; }
    .official-home-v4-cap-card:nth-child(n) .official-home-v4-cap-pet { right: 4px; left: auto; width: 142px; height: 154px; }
    .official-home-v4-cap-card:nth-child(1) .official-home-v4-cap-pet { bottom: -2px; }
    .official-home-v4-foundation-inner { grid-template-columns: 1fr; gap: 8px; }
    .official-home-v4-foundation-inner .official-button { justify-self: start; margin-top: 8px; }
    .official-home-v4-pets { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; }
    .official-home-v4-pet { min-width: 176px; min-height: 214px; scroll-snap-align: start; }
    .official-home-v4-price-grid { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; border-radius: 16px; }
    .official-home-v4-price-card { min-width: 84vw; min-height: 440px; border-right: 1px solid #d8e4e7; border-bottom: 0; scroll-snap-align: start; }
    .official-home-v4-price-card:last-child { border-right: 0; }
    .official-home-v4-price-card > p { min-height: 0; }
    .official-home-v4 > .official-end-cta { padding-bottom: 46px; }
  }

  @media (prefers-reduced-motion: reduce) {
    .official-home-v4-flow::after,
    .official-home-v4-signal i { animation: none !important; }
  }

  /* Home v5: an agent-first inquiry flow with broadcast as a secondary lane. */
  .official-home-v5-hero {
    position: relative;
    min-height: calc(100vh - 86px);
    overflow: hidden;
    padding: clamp(26px, 3vw, 42px) 0 0;
    background:
      radial-gradient(circle at 18% 52%, rgb(239 175 201 / .24), transparent 24%),
      radial-gradient(circle at 78% 54%, rgb(40 172 198 / .2), transparent 27%),
      linear-gradient(180deg, #f9fcfd 0%, #f5fbfd 68%, #edf9fc 100%);
  }
  .official-home-v5-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: .42;
    background-image: linear-gradient(rgb(73 126 145 / .08) 1px, transparent 1px), linear-gradient(90deg, rgb(73 126 145 / .08) 1px, transparent 1px);
    background-size: 72px 72px;
    mask-image: linear-gradient(180deg, transparent, #000 25%, #000 82%, transparent);
    pointer-events: none;
  }
  .official-home-v5-hero::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -34%;
    width: min(1100px, 92vw);
    aspect-ratio: 2 / 1;
    border-radius: 50%;
    background: linear-gradient(100deg, rgb(169 231 241 / .64), rgb(255 255 255 / .8) 48%, rgb(239 175 201 / .52));
    filter: blur(44px);
    transform: translateX(-50%);
    pointer-events: none;
  }
  .official-home-v5-inner { position: relative; z-index: 1; }
  .official-home-v5-head { max-width: 1180px; margin: 0 auto; text-align: center; }
  .official-home-v5-head h1 { margin: 0 auto; color: #13233e; font-family: "Arial Narrow", "PingFang SC", "Microsoft YaHei", sans-serif; font-weight: 900; line-height: .98; letter-spacing: -.07em; }
  .official-home-v5-head h1 > span { display: block; text-wrap: balance; }
  .official-home-v5-head h1 b { font: inherit; }
  .official-home-v5-head h1 > span:first-child { font-size: clamp(55px, 5.2vw, 76px); }
  .official-home-v5-head h1 > span:last-child { margin-top: 6px; font-size: clamp(48px, 4.65vw, 68px); }
  .official-home-v5-accent {
    color: #18a9c6;
    font-style: normal;
    background: linear-gradient(103deg, #138fae 7%, #27bed2 52%, #1597ba 93%);
    background-size: 180% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .official-home-v5-lead { max-width: 850px; margin: 18px auto 0; color: #53657a; font-size: 16px; line-height: 1.68; text-wrap: balance; }
  .official-home-v5-head .official-actions { justify-content: center; margin-top: 19px; }
  .official-home-v5-boundary { display: flex; justify-content: center; align-items: center; gap: 8px; margin: 11px 0 0; color: #718392; font-size: 10px; font-weight: 680; }
  .official-home-v5-boundary::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #e792b5; box-shadow: 0 0 0 4px rgb(231 146 181 / .12); }

  .official-home-v5-stage {
    --stage-depth-x: 0px;
    --stage-depth-y: 0px;
    --workbench-left: 15%;
    --workbench-right: 12%;
    --workbench-height: 142px;
    --workbench-y: 26px;
    --workbench-scale: .92;
    --workbench-tilt: 11deg;
    --workbench-detail-opacity: 0;
    --workbench-detail-y: 16px;
    position: relative;
    height: 740px;
    margin: 17px auto 0;
    isolation: isolate;
    perspective: 1100px;
  }
  .official-home-v5-stage::before {
    content: "";
    position: absolute;
    z-index: -2;
    left: 12%;
    right: 11%;
    top: 38px;
    height: 360px;
    border: 1px solid rgb(255 255 255 / .8);
    border-radius: 50%;
    background: radial-gradient(circle at 49% 46%, rgb(255 255 255 / .96), rgb(199 239 246 / .7) 46%, rgb(244 201 221 / .52) 72%, transparent 73%);
    filter: drop-shadow(0 32px 55px rgb(59 124 148 / .12));
    transform: rotateX(64deg);
  }
  .official-home-v5-stage-grid { position: absolute; z-index: -1; inset: 10% 2% 0; border-radius: 50%; opacity: .36; background-image: radial-gradient(circle, rgb(65 142 166 / .42) 1px, transparent 1px); background-size: 22px 22px; mask-image: radial-gradient(ellipse, #000 12%, transparent 67%); }
  .official-home-v5-routes { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
  .official-home-v5-route { fill: none; stroke: rgb(61 175 201 / .28); stroke-width: 2; stroke-linecap: round; stroke-dasharray: 5 11; }
  .official-home-v5-route.coral { stroke: rgb(227 121 166 / .34); }
  .official-home-v5-source-stack { position: absolute; z-index: 2; top: 44px; left: 0; width: min(292px, 25%); display: grid; gap: 11px; transform: translate3d(var(--stage-depth-x), var(--stage-depth-y), 0); transition: transform .35s ease; }
  .official-home-v5-source {
    min-width: 0;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) auto;
    gap: 11px;
    align-items: center;
    padding: 12px 13px;
    border: 1px solid rgb(255 255 255 / .94);
    border-radius: 15px;
    background: rgb(255 255 255 / .82);
    box-shadow: 0 13px 34px rgb(49 105 127 / .12);
    backdrop-filter: blur(13px);
    opacity: .7;
    transform: translateX(-10px) scale(.98);
    transition: opacity .55s ease, transform .55s cubic-bezier(.16,1,.3,1), box-shadow .55s ease;
  }
  .official-home-v5-source:nth-child(2) { margin-left: 17px; }
  .official-home-v5-source img { width: 40px; height: 40px; object-fit: contain; }
  .official-home-v5-source strong, .official-home-v5-source p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .official-home-v5-source strong { display: block; color: #263d50; font-size: 12px; }
  .official-home-v5-source p { margin: 5px 0 0; color: #627585; font-size: 10px; }
  .official-home-v5-source > span { color: #73909d; font-size: 8px; font-weight: 760; white-space: nowrap; }
  .official-home-v5-stage[data-phase="intake"] .official-home-v5-source,
  .official-home-v5-stage[data-phase="context"] .official-home-v5-source { opacity: 1; transform: translateX(0) scale(1); box-shadow: 0 16px 38px rgb(49 105 127 / .16); }

  .official-home-v5-core { position: absolute; z-index: 4; top: 116px; left: 36.5%; width: 230px; height: 246px; transform: translate3d(var(--stage-depth-x), var(--stage-depth-y), 0); transition: transform .35s ease; }
  .official-home-v5-core-shell { position: absolute; right: 0; top: 4px; width: 176px; height: 190px; display: grid; align-content: end; justify-items: center; padding: 0 16px 21px; border: 1px solid rgb(255 255 255 / .95); border-radius: 46% 46% 38% 38%; background: linear-gradient(155deg, rgb(255 255 255 / .98), rgb(195 239 247 / .9) 64%, rgb(246 208 225 / .86)); box-shadow: 0 24px 60px rgb(46 125 151 / .2), inset 0 1px 0 #fff; }
  .official-home-v5-core-ring { position: absolute; inset: 16px; border: 1px dashed rgb(38 159 188 / .55); border-radius: 50%; }
  .official-home-v5-core-ring::before, .official-home-v5-core-ring::after { content: ""; position: absolute; width: 8px; height: 8px; border-radius: 50%; background: #28acc6; box-shadow: 0 0 0 6px rgb(40 172 198 / .13); }
  .official-home-v5-core-ring::before { top: 5px; left: 28px; }
  .official-home-v5-core-ring::after { right: 4px; bottom: 34px; background: #e58bb1; box-shadow: 0 0 0 6px rgb(229 139 177 / .13); }
  .official-home-v5-core-face { position: absolute; top: 34px; left: 50%; width: 80px; height: 65px; border: 5px solid #d4f4fa; border-radius: 28px; background: #13233e; box-shadow: 0 10px 24px rgb(19 35 62 / .2); transform: translateX(-50%); }
  .official-home-v5-core-face::before { content: ""; position: absolute; top: 23px; left: 20px; width: 9px; height: 7px; border-bottom: 3px solid #54d6e8; border-radius: 0 0 9px 9px; box-shadow: 29px 0 0 -1px #13233e, 29px 0 0 0 #54d6e8; }
  .official-home-v5-core-shell > span { color: #357d91; font-size: 8px; font-weight: 820; letter-spacing: .08em; }
  .official-home-v5-core-shell > strong { margin-top: 5px; color: #18384d; font-size: 15px; }
  .official-home-v5-core-shell > p { min-height: 17px; margin: 4px 0 0; color: #517184; font-size: 10px; font-weight: 720; }
  .official-home-v5-core-steps { position: absolute; left: 71px; right: 12px; bottom: 27px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; }
  .official-home-v5-core-steps i { height: 3px; border-radius: 999px; background: rgb(73 142 165 / .18); transition: background-color .35s ease, transform .35s ease; }
  .official-home-v5-stage[data-phase="intake"] .official-home-v5-core-steps i:nth-child(1),
  .official-home-v5-stage[data-phase="context"] .official-home-v5-core-steps i:nth-child(-n+2),
  .official-home-v5-stage[data-phase="reply"] .official-home-v5-core-steps i:nth-child(-n+3),
  .official-home-v5-stage[data-phase="broadcast"] .official-home-v5-core-steps i { background: linear-gradient(90deg, #28acc6, #dd82aa); transform: scaleY(1.55); }
  .official-home-v5-core-pet { position: absolute; z-index: 3; left: -40px; bottom: 0; width: 125px; height: 142px; aspect-ratio: auto; overflow: visible; background: transparent; }
  .official-home-v5-core-pet::before { border-radius: 48%; }
  .official-home-v5-core-pet img { object-fit: contain; filter: drop-shadow(0 14px 12px rgb(48 78 95 / .18)); }

  .official-home-v5-reply { position: absolute; z-index: 3; top: 67px; left: 55.5%; width: min(310px, 25%); min-height: 240px; padding: 18px; border: 1px solid rgb(168 210 222 / .68); border-radius: 18px; background: rgb(255 255 255 / .88); box-shadow: 0 22px 54px rgb(53 111 132 / .16); backdrop-filter: blur(15px); opacity: .42; transform: translate3d(calc(20px + var(--stage-depth-x)), var(--stage-depth-y), 0) rotateY(-5deg); transform-origin: left center; transition: opacity .6s ease, transform .7s cubic-bezier(.16,1,.3,1); }
  .official-home-v5-stage[data-phase="reply"] .official-home-v5-reply,
  .official-home-v5-stage[data-phase="broadcast"] .official-home-v5-reply { opacity: 1; transform: translate3d(var(--stage-depth-x), var(--stage-depth-y), 0) rotateY(0); }
  .official-home-v5-reply-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: #4e8090; font-size: 9px; font-weight: 800; }
  .official-home-v5-reply-head span:last-child { color: #267d97; }
  .official-home-v5-reply h2 { margin: 14px 0 0; color: #17364a; font-size: 20px; line-height: 1.12; letter-spacing: -.035em; }
  .official-home-v5-reply > p { margin: 12px 0 0; color: #52697a; font-size: 11px; line-height: 1.64; }
  .official-home-v5-reply-points { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 15px; }
  .official-home-v5-reply-points span { padding: 6px 8px; border-radius: 8px; background: #eef8fa; color: #39798c; font-size: 8px; font-weight: 760; }
  .official-home-v5-reply-state { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 15px; padding-top: 12px; border-top: 1px solid #dce8eb; color: #697d8b; font-size: 9px; }
  .official-home-v5-reply-state strong { color: #bb668b; }

  .official-home-v5-broadcast { position: absolute; z-index: 2; top: 48px; right: 0; width: min(238px, 19%); min-height: 262px; padding: 17px; border: 1px solid rgb(232 175 201 / .52); border-radius: 18px; background: rgb(255 255 255 / .72); box-shadow: 0 18px 46px rgb(121 72 100 / .1); backdrop-filter: blur(13px); opacity: .38; transform: translate3d(calc(18px + var(--stage-depth-x)), var(--stage-depth-y), 0); transition: opacity .6s ease, transform .7s cubic-bezier(.16,1,.3,1); }
  .official-home-v5-stage[data-phase="broadcast"] .official-home-v5-broadcast { opacity: 1; transform: translate3d(var(--stage-depth-x), var(--stage-depth-y), 0); }
  .official-home-v5-broadcast > span { color: #a65e7e; font-size: 8px; font-weight: 820; letter-spacing: .04em; }
  .official-home-v5-broadcast h2 { margin: 9px 0 0; color: #412e3b; font-size: 17px; letter-spacing: -.025em; }
  .official-home-v5-broadcast ul { display: grid; gap: 0; margin: 12px 0 0; padding: 0; list-style: none; }
  .official-home-v5-broadcast li { position: relative; padding: 10px 0 10px 20px; border-top: 1px solid rgb(216 185 201 / .52); color: #6d5866; font-size: 10px; font-weight: 680; }
  .official-home-v5-broadcast li::before { content: ""; position: absolute; left: 1px; top: 13px; width: 8px; height: 8px; border: 2px solid #e48eb4; border-radius: 50%; }
  .official-home-v5-broadcast p { margin: 11px 0 0; color: #917484; font-size: 8px; line-height: 1.5; }

  .official-home-v5-workbench { position: absolute; z-index: 1; left: var(--workbench-left); right: var(--workbench-right); top: 382px; height: var(--workbench-height); overflow: hidden; border: 1px solid rgb(189 213 220 / .74); border-radius: 20px 20px 0 0; background: rgb(255 255 255 / .88); box-shadow: 0 -12px 50px rgb(51 112 133 / .12), 0 28px 70px rgb(51 112 133 / .1); backdrop-filter: blur(18px); transform: perspective(900px) translateY(var(--workbench-y)) rotateX(var(--workbench-tilt)) scale(var(--workbench-scale)); transform-origin: top center; transition: left .08s linear, right .08s linear, height .08s linear, transform .08s linear, box-shadow .4s ease; will-change: left, right, height, transform; }
  .official-home-v5-stage[data-phase="reply"] .official-home-v5-workbench,
  .official-home-v5-stage[data-phase="broadcast"] .official-home-v5-workbench { box-shadow: 0 -16px 58px rgb(51 112 133 / .16), 0 30px 76px rgb(51 112 133 / .12); }
  .official-home-v5-workbench-topbar { min-height: 45px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 0 17px; border-bottom: 1px solid #dce7e9; color: #6b7e8b; font-size: 9px; }
  .official-home-v5-workbench-topbar strong { display: flex; align-items: center; gap: 8px; color: #263e50; font-size: 11px; }
  .official-home-v5-workbench-topbar img { width: 25px; height: 25px; border-radius: 8px; object-fit: cover; }
  .official-home-v5-workbench-shell { min-height: 292px; display: grid; grid-template-columns: 126px minmax(0, 1fr); }
  .official-home-v5-workbench-nav { display: grid; align-content: start; gap: 5px; padding: 14px 10px; border-right: 1px solid #e1e9eb; background: rgb(246 250 251 / .72); }
  .official-home-v5-workbench-nav strong, .official-home-v5-workbench-nav span { padding: 9px 10px; border-radius: 9px; color: #667b89; font-size: 9px; font-weight: 700; }
  .official-home-v5-workbench-nav strong { background: #e5f6fa; color: #2583a0; }
  .official-home-v5-workbench-main { min-width: 0; padding: 13px 15px 18px; }
  .official-home-v5-workbench-toolbar { display: grid; grid-template-columns: 1fr minmax(210px, .9fr); gap: 18px; align-items: center; }
  .official-home-v5-workbench-toolbar h3 { margin: 0; color: #263e50; font-size: 15px; }
  .official-home-v5-workbench-toolbar span { padding: 8px 12px; border: 1px solid #dce7e9; border-radius: 999px; color: #8796a1; font-size: 8px; }
  .official-home-v5-workbench-tabs { display: flex; align-items: center; gap: 20px; margin-top: 11px; border-bottom: 1px solid #e0eaec; color: #7b8d99; font-size: 8px; }
  .official-home-v5-workbench-tabs strong, .official-home-v5-workbench-tabs span { padding: 0 0 9px; white-space: nowrap; }
  .official-home-v5-workbench-tabs strong { border-bottom: 2px solid #36a8c2; color: #286b80; }
  .official-home-v5-workbench-feed { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding: 13px 0 0; opacity: var(--workbench-detail-opacity); transform: translateY(var(--workbench-detail-y)); transition: opacity .12s linear, transform .12s linear; }
  .official-home-v5-workbench-feed article { min-width: 0; display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; gap: 9px; align-items: center; padding: 11px; border: 1px solid #e3ecee; border-radius: 12px; background: #fff; }
  .official-home-v5-workbench-feed img { width: 32px; height: 32px; object-fit: contain; }
  .official-home-v5-workbench-feed strong, .official-home-v5-workbench-feed p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .official-home-v5-workbench-feed strong { display: block; color: #314b5d; font-size: 10px; }
  .official-home-v5-workbench-feed p { margin: 4px 0 0; color: #788b98; font-size: 8px; }
  .official-home-v5-workbench-feed span { color: #4f8798; font-size: 8px; font-weight: 760; white-space: nowrap; }

  @media (prefers-reduced-motion: no-preference) {
    .official-home-v5-head h1 > span { animation: official-home-v5-title-in .75s cubic-bezier(.16,1,.3,1) both; }
    .official-home-v5-head h1 > span:last-child { animation-delay: .12s; }
    .official-home-v5-accent { animation: official-home-v5-color-flow 6s ease-in-out infinite alternate; }
    .official-home-v5-route { animation: official-home-v5-route-flow 3.6s linear infinite; }
    .official-home-v5-route:nth-child(2) { animation-delay: -.8s; }
    .official-home-v5-route:nth-child(3) { animation-delay: -1.6s; }
    .official-home-v5-core-ring { animation: official-home-v5-spin 12s linear infinite; }
    .official-home-v5-core-shell { animation: official-home-v5-core-breathe 3.8s ease-in-out infinite; }
    .official-home-v5-core-pet { animation: official-home-v5-pet-step 4.2s ease-in-out infinite; }
    .official-home-v5-stage-grid { animation: official-home-v5-grid-drift 14s linear infinite; }
    .official-home-v5-stage[data-phase="broadcast"] .official-home-v5-broadcast li::before { animation: official-home-v5-broadcast-pulse 1.2s ease-in-out infinite alternate; }
  }
  @keyframes official-home-v5-title-in { from { opacity: 0; transform: translateY(24px); clip-path: inset(100% 0 0); } to { opacity: 1; transform: translateY(0); clip-path: inset(0); } }
  @keyframes official-home-v5-color-flow { from { background-position: 0 50%; } to { background-position: 100% 50%; } }
  @keyframes official-home-v5-route-flow { to { stroke-dashoffset: -64; } }
  @keyframes official-home-v5-spin { to { transform: rotate(360deg); } }
  @keyframes official-home-v5-core-breathe { 0%, 100% { box-shadow: 0 24px 60px rgb(46 125 151 / .2), inset 0 1px 0 #fff; } 50% { box-shadow: 0 30px 74px rgb(46 125 151 / .3), 0 0 0 12px rgb(86 198 220 / .06), inset 0 1px 0 #fff; } }
  @keyframes official-home-v5-pet-step { 0%, 100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-7px) rotate(1deg); } }
  @keyframes official-home-v5-grid-drift { to { background-position: 22px 22px; } }
  @keyframes official-home-v5-broadcast-pulse { to { background: #e48eb4; box-shadow: 0 0 0 5px rgb(228 142 180 / .12); } }

  @media (max-width: 1100px) {
    .official-home-v5-head h1 > span:first-child { font-size: clamp(52px, 6vw, 66px); }
    .official-home-v5-head h1 > span:last-child { font-size: clamp(43px, 5.4vw, 58px); }
    .official-home-v5-stage { height: 700px; }
    .official-home-v5-source-stack { width: 25%; }
    .official-home-v5-source { grid-template-columns: 34px minmax(0, 1fr); padding: 10px; }
    .official-home-v5-source img { width: 34px; height: 34px; }
    .official-home-v5-source > span { display: none; }
    .official-home-v5-core { left: 34%; transform: scale(.92); transform-origin: center; }
    .official-home-v5-reply { left: 54%; width: 27%; }
    .official-home-v5-broadcast { width: 18%; padding: 14px; }
    .official-home-v5-broadcast h2 { font-size: 15px; }
  }

  @media (max-width: 760px) {
    .official-home-v5-hero { min-height: 0; padding: 20px 0 0; }
    .official-home-v5-hero::before { background-size: 42px 42px; }
    .official-home-v5-hero::after { bottom: 8%; width: 150vw; }
    .official-home-v5-head h1 { line-height: 1.03; letter-spacing: -.062em; }
    .official-home-v5-head h1 > span:first-child { font-size: clamp(39px, 11.4vw, 46px); }
    .official-home-v5-head h1 > span:last-child { margin-top: 7px; font-size: clamp(30px, 8.2vw, 33px); }
    .official-home-v5-head h1 b { display: block; white-space: nowrap; }
    .official-home-v5-lead { margin-top: 14px; font-size: 14px; line-height: 1.58; text-wrap: pretty; }
    .official-home-v5-head .official-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 16px; }
    .official-home-v5-head .official-button { min-width: 0; min-height: 44px; padding: 10px 8px; font-size: 12px; white-space: nowrap; }
    .official-home-v5-boundary { margin-top: 10px; font-size: 9px; }
    .official-home-v5-stage { --workbench-left: 0%; --workbench-right: 0%; --workbench-height: 236px; --workbench-scale: 1; --workbench-tilt: 0deg; height: 1010px; margin-top: 16px; perspective: none; }
    .official-home-v5-stage::before { left: -28%; right: -28%; top: 78px; height: 340px; transform: rotateX(68deg); }
    .official-home-v5-stage-grid { inset: 0 -30% 22%; }
    .official-home-v5-routes { display: none; }
    .official-home-v5-source-stack { position: absolute; top: 0; left: 0; width: 100%; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; transform: none; }
    .official-home-v5-source, .official-home-v5-source:nth-child(2) { min-height: 70px; margin-left: 0; grid-template-columns: 29px minmax(0, 1fr); gap: 7px; padding: 9px 8px; border-radius: 12px; }
    .official-home-v5-source img { width: 29px; height: 29px; }
    .official-home-v5-source strong { font-size: 9px; }
    .official-home-v5-source p { margin-top: 3px; font-size: 8px; }
    .official-home-v5-core { top: 93px; left: 50%; width: 220px; transform: translateX(-50%) scale(.86); transform-origin: top center; }
    .official-home-v5-core-pet { width: 116px; height: 132px; }
    .official-home-v5-reply { top: 292px; left: 0; width: 100%; min-height: 0; padding: 16px; transform: translateY(15px); }
    .official-home-v5-stage[data-phase="reply"] .official-home-v5-reply,
    .official-home-v5-stage[data-phase="broadcast"] .official-home-v5-reply { transform: translateY(0); }
    .official-home-v5-reply h2 { font-size: 18px; }
    .official-home-v5-reply > p { font-size: 10px; }
    .official-home-v5-broadcast { top: 472px; left: 0; right: auto; width: 100%; min-height: 0; padding: 15px 16px; transform: translateY(15px); }
    .official-home-v5-stage[data-phase="broadcast"] .official-home-v5-broadcast { transform: translateY(0); }
    .official-home-v5-broadcast ul { grid-template-columns: repeat(2, 1fr); column-gap: 14px; }
    .official-home-v5-broadcast li { padding: 8px 0 8px 18px; font-size: 9px; }
    .official-home-v5-broadcast li::before { top: 10px; }
    .official-home-v5-broadcast p { margin-top: 7px; }
    .official-home-v5-workbench { top: 642px; border-radius: 16px 16px 0 0; transform: translateY(var(--workbench-y)); }
    .official-home-v5-workbench-topbar { min-height: 40px; padding-inline: 12px; }
    .official-home-v5-workbench-shell { grid-template-columns: 76px minmax(0, 1fr); }
    .official-home-v5-workbench-nav { gap: 3px; padding: 9px 6px; }
    .official-home-v5-workbench-nav strong, .official-home-v5-workbench-nav span { padding: 7px 6px; font-size: 7px; }
    .official-home-v5-workbench-main { padding: 10px 9px 14px; }
    .official-home-v5-workbench-toolbar { grid-template-columns: 1fr; gap: 7px; }
    .official-home-v5-workbench-toolbar h3 { font-size: 12px; }
    .official-home-v5-workbench-toolbar span { padding: 6px 9px; }
    .official-home-v5-workbench-tabs { gap: 10px; overflow: hidden; margin-top: 8px; }
    .official-home-v5-workbench-tabs span:nth-last-child(-n+2) { display: none; }
    .official-home-v5-workbench-feed { grid-template-columns: 1fr; gap: 7px; padding: 9px 10px 14px; }
    .official-home-v5-workbench-feed article { padding: 8px 9px; }
  }

  @media (prefers-reduced-motion: reduce) {
    .official-home-v5-head h1 > span,
    .official-home-v5-accent,
    .official-home-v5-route,
    .official-home-v5-core-ring,
    .official-home-v5-core-shell,
    .official-home-v5-core-pet,
    .official-home-v5-stage-grid,
    .official-home-v5-broadcast li::before { animation: none !important; }
    .official-home-v5-source,
    .official-home-v5-reply,
    .official-home-v5-broadcast,
    .official-home-v5-workbench { opacity: 1 !important; transform: none !important; transition: none !important; }
    .official-home-v5-workbench { left: 0 !important; right: 0 !important; height: 338px !important; }
    .official-home-v5-workbench-feed { opacity: 1 !important; transform: none !important; }
  }
  .official-home-v5-stage.is-paused *, .official-home-v5-stage.is-paused::before { animation-play-state: paused !important; }

  /* The homepage uses the shared site header; only the hero canvas starts flush to the viewport. */
  .official-site-home .official-home-v4 { overflow: visible; }
  .official-site-home main { padding-top: 0; }
  .official-home-v6-reference {
    --workbench-left: 15%;
    --workbench-right: 12%;
    --workbench-height: 142px;
    --workbench-y: 26px;
    --workbench-scale: .92;
    --workbench-tilt: 11deg;
    --workbench-detail-opacity: 0;
    --workbench-detail-y: 16px;
    --workbench-overlay-opacity: 0;
    --client-left: 10.4%;
    --client-right: 10.2%;
    --client-top: 81.7%;
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 1506 / 1045;
    overflow: hidden;
    background: #f7fbfc;
  }
  .official-home-v6-reference-art { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center top; }
  .official-home-v7-client-crop { position: absolute; z-index: 2; left: var(--client-left); right: var(--client-right); top: var(--client-top); bottom: 0; overflow: hidden; border: 1px solid rgb(186 213 229 / .72); border-bottom: 0; border-radius: 24px 24px 0 0; background: #f7fbff; box-shadow: 0 -14px 40px rgb(51 112 133 / .12); transition: left .08s linear, right .08s linear, top .08s linear; will-change: left, right, top; }
  .official-home-v7-client-crop img { display: block; width: 100%; height: auto; object-fit: cover; object-position: center top; }
  .official-home-v6-reference .official-home-v5-workbench { top: auto; bottom: 34px; z-index: 3; display: grid; grid-template-rows: 76px minmax(0, 1fr); border-radius: 24px; background: rgb(255 255 255 / .97); opacity: var(--workbench-overlay-opacity); box-shadow: 0 28px 80px rgb(31 78 112 / .22); }
  .official-home-v5-workbench-meta { min-width: 0; display: grid; grid-template-columns: minmax(0, 1.35fr) auto; gap: 24px; align-items: center; padding: 13px 20px; border-bottom: 1px solid #e3eaf2; background: linear-gradient(90deg, #fff, #f5fbff 58%, #fff7fb); }
  .official-home-v5-workbench-copy { min-width: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 14px; align-items: center; }
  .official-home-v5-workbench-copy > span { grid-row: 1 / 3; align-self: stretch; display: grid; place-items: center; padding: 0 12px; border-radius: 13px; background: linear-gradient(135deg, #17a5c8, #7585db 58%, #eb8ab5); color: #fff; font-size: 10px; font-weight: 820; letter-spacing: .04em; }
  .official-home-v5-workbench-copy strong { overflow: hidden; color: #172b4d; font-size: 17px; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
  .official-home-v5-workbench-copy p { overflow: hidden; margin: 4px 0 0; color: #65748a; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
  .official-home-v5-workbench-tags { display: flex; gap: 7px; }
  .official-home-v5-workbench-tags span { padding: 7px 9px; border: 1px solid #dbe7ef; border-radius: 999px; background: #fff; color: #4d6b80; font-size: 9px; font-weight: 720; white-space: nowrap; }
  .official-home-v5-workbench-client { display: block; width: 100%; height: 100%; min-height: 0; object-fit: cover; object-position: center top; }
  .official-home-v5-stage .official-home-v5-workbench-meta { display: none; }
  .official-home-v7-tour {
    --tour-left: 1.3%;
    --tour-top: 8.5%;
    --tour-width: 12.8%;
    --tour-height: 88.5%;
    --tour-clip-top: 8.5%;
    --tour-clip-right: 85.9%;
    --tour-clip-bottom: 3%;
    --tour-clip-left: 1.3%;
    position: relative;
    height: 440vh;
    min-height: 2400px;
    background: #071424;
  }
  .official-home-v7-tour-sticky { position: sticky; top: 0; height: 100vh; min-height: 640px; overflow: hidden; isolation: isolate; background: #071424; }
  .official-home-v7-tour-backdrop { position: absolute; z-index: -2; inset: -8%; width: 116%; height: 116%; object-fit: cover; filter: blur(34px) brightness(.44) saturate(.82); transform: scale(1.06); opacity: .72; }
  .official-home-v7-tour-sticky::before { position: absolute; z-index: -1; inset: 0; content: ''; background: radial-gradient(circle at 72% 48%, rgb(54 189 224 / .22), transparent 40%), linear-gradient(90deg, rgb(5 17 31 / .98) 0%, rgb(8 24 41 / .9) 34%, rgb(7 20 36 / .5) 100%); }
  .official-home-v7-tour-sticky::after { position: absolute; inset: 0; pointer-events: none; content: ''; background: linear-gradient(180deg, rgb(215 246 252 / .14), transparent 12%, transparent 86%, rgb(7 20 36 / .72)); }
  .official-home-v7-tour-inner { position: relative; width: min(1320px, calc(100% - 64px)); height: 100%; margin: 0 auto; display: grid; grid-template-columns: minmax(280px, .66fr) minmax(0, 1.58fr); gap: clamp(30px, 4vw, 70px); align-items: center; }
  .official-home-v7-tour-copy { position: relative; z-index: 5; color: #fff; }
  .official-home-v7-tour-kicker { display: flex; align-items: center; justify-content: space-between; gap: 18px; color: #7ee5f8; font-size: 11px; font-weight: 850; letter-spacing: .14em; }
  .official-home-v7-tour-kicker b { color: rgb(255 255 255 / .55); font-size: 10px; letter-spacing: .08em; }
  .official-home-v7-tour-steps { position: relative; min-height: 248px; margin: 22px 0 0; padding: 0; list-style: none; }
  .official-home-v7-tour-step { position: absolute; inset: 0; display: grid; align-content: start; visibility: hidden; opacity: 0; transform: translateY(20px); pointer-events: none; transition: opacity .3s ease, transform .42s cubic-bezier(.2,.8,.2,1); }
  .official-home-v7-tour[data-tour-step="0"] .official-home-v7-tour-step:nth-child(1),
  .official-home-v7-tour[data-tour-step="1"] .official-home-v7-tour-step:nth-child(2),
  .official-home-v7-tour[data-tour-step="2"] .official-home-v7-tour-step:nth-child(3),
  .official-home-v7-tour[data-tour-step="3"] .official-home-v7-tour-step:nth-child(4) { visibility: visible; opacity: 1; transform: translateY(0); pointer-events: auto; }
  .official-home-v7-tour-step > span { width: fit-content; padding: 7px 10px; border: 1px solid rgb(126 229 248 / .34); border-radius: 999px; background: rgb(19 80 103 / .35); color: #9ceafb; font-size: 10px; font-weight: 820; }
  .official-home-v7-tour-step h2 { margin: 18px 0 0; color: #fff; font-size: clamp(34px, 3.4vw, 52px); line-height: .98; letter-spacing: -.058em; white-space: nowrap; }
  .official-home-v7-tour-step p { max-width: 420px; margin: 18px 0 0; color: rgb(226 239 246 / .76); font-size: 14px; line-height: 1.74; }
  .official-home-v7-tour-progress { display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; margin-top: 26px; }
  .official-home-v7-tour-progress i { height: 3px; overflow: hidden; border-radius: 999px; background: rgb(255 255 255 / .15); }
  .official-home-v7-tour-progress i::after { display: block; width: 100%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #2ecde7, #8a9af0 58%, #f08ab8); content: ''; transform: scaleX(0); transform-origin: left; transition: transform .36s ease; }
  .official-home-v7-tour[data-tour-step="0"] .official-home-v7-tour-progress i:nth-child(-n+1)::after,
  .official-home-v7-tour[data-tour-step="1"] .official-home-v7-tour-progress i:nth-child(-n+2)::after,
  .official-home-v7-tour[data-tour-step="2"] .official-home-v7-tour-progress i:nth-child(-n+3)::after,
  .official-home-v7-tour[data-tour-step="3"] .official-home-v7-tour-progress i:nth-child(-n+4)::after { transform: scaleX(1); }
  .official-home-v7-tour-visual { position: relative; z-index: 2; margin: 0; }
  .official-home-v7-tour-frame { position: relative; overflow: hidden; aspect-ratio: 16 / 10; border: 1px solid rgb(202 235 245 / .56); border-radius: 26px; background: rgb(237 248 252 / .9); box-shadow: 0 32px 90px rgb(0 0 0 / .38), 0 0 0 1px rgb(255 255 255 / .15) inset; transform: perspective(1400px) rotateY(-1.8deg); }
  .official-home-v7-tour-image { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; object-position: center top; }
  .official-home-v7-tour-image.base { filter: blur(1.8px) brightness(.55) saturate(.58); transform: scale(1.006); }
  .official-home-v7-tour-image.focus { clip-path: inset(var(--tour-clip-top) var(--tour-clip-right) var(--tour-clip-bottom) var(--tour-clip-left) round 14px); filter: brightness(1.02) saturate(1.04); transition: clip-path .58s cubic-bezier(.2,.75,.2,1); }
  .official-home-v7-tour-focus { position: absolute; z-index: 3; left: var(--tour-left); top: var(--tour-top); width: var(--tour-width); height: var(--tour-height); border: 2px solid #67dff1; border-radius: 15px; box-shadow: 0 0 0 1px rgb(255 255 255 / .8) inset, 0 0 0 999px rgb(4 16 29 / .06), 0 0 34px rgb(52 208 235 / .52); transition: left .58s cubic-bezier(.2,.75,.2,1), top .58s cubic-bezier(.2,.75,.2,1), width .58s cubic-bezier(.2,.75,.2,1), height .58s cubic-bezier(.2,.75,.2,1); pointer-events: none; }
  .official-home-v7-tour-focus span { position: absolute; top: 12px; left: 12px; padding: 7px 10px; border-radius: 999px; background: linear-gradient(135deg, #0daaca, #7b8deb 60%, #ee83b4); box-shadow: 0 8px 20px rgb(12 78 105 / .3); color: #fff; font-size: 10px; font-weight: 820; white-space: nowrap; }
  .official-home-v7-tour-caption { display: flex; justify-content: space-between; gap: 18px; margin-top: 14px; color: rgb(221 237 243 / .55); font-size: 10px; }
  .official-home-v7-tour-caption strong { color: #a7ebf7; font-weight: 760; }
  .official-home-v7-tour + .official-home-v4-section { padding-top: 58px; }

  @media (max-width: 1080px) and (min-width: 761px) {
    .official-home-v7-tour-inner { width: calc(100% - 44px); display: block; }
    .official-home-v7-tour-visual { position: absolute; top: 34px; left: 0; right: 0; }
    .official-home-v7-tour-copy { position: absolute; z-index: 6; left: 18px; bottom: 26px; width: min(370px, calc(100% - 36px)); padding: 19px 20px 16px; border: 1px solid rgb(255 255 255 / .16); border-radius: 20px; background: rgb(6 24 40 / .78); box-shadow: 0 22px 60px rgb(0 0 0 / .3); backdrop-filter: blur(20px); }
    .official-home-v7-tour-steps { min-height: 174px; margin-top: 12px; }
    .official-home-v7-tour-step h2 { margin-top: 13px; font-size: 36px; }
    .official-home-v7-tour-step p { margin-top: 11px; font-size: 12px; line-height: 1.58; }
    .official-home-v7-tour-progress { margin-top: 14px; }
    .official-home-v7-tour-caption { display: none; }
  }
  .official-home-v6-hotspot { position: absolute; z-index: 4; display: block; border-radius: 999px; color: transparent; font-size: 0; }
  .official-home-v6-hotspot:focus-visible { outline: 3px solid #176cf1; outline-offset: 3px; }
  .official-home-v6-hotspot.home { top: 1.6%; left: 10.4%; width: 20%; height: 4.2%; }
  .official-home-v6-hotspot.capabilities { top: 1.7%; left: 38.1%; width: 4.8%; height: 4%; }
  .official-home-v6-hotspot.scenarios { top: 1.7%; left: 43.2%; width: 4.8%; height: 4%; }
  .official-home-v6-hotspot.pricing { top: 1.7%; left: 48.6%; width: 3.2%; height: 4%; }
  .official-home-v6-hotspot.help { top: 1.7%; left: 52%; width: 4.6%; height: 4%; }
  .official-home-v6-hotspot.about { top: 1.7%; left: 56.7%; width: 4.8%; height: 4%; }
  .official-home-v6-hotspot.agent { top: 33.2%; left: 37.7%; width: 11.6%; height: 5.1%; }
  .official-home-v6-hotspot.broadcast { top: 33.2%; left: 50.1%; width: 11.2%; height: 5.1%; }
  .official-home-v6-hotspot.portal { top: 1.8%; left: 81.2%; width: 8%; height: 3.7%; }
  .official-site-home .official-home-v5-hero { display: none; }

  @media (max-width: 760px) {
    .official-site-home .official-header { display: block; }
    .official-site-home main { padding-top: var(--official-nav-offset); }
    .official-home-v6-reference { display: none; }
    .official-site-home .official-home-v5-hero { display: block; }
    .official-home-v7-tour { height: auto; min-height: 0; padding: 48px 0; }
    .official-home-v7-tour-sticky { position: relative; height: auto; min-height: 0; overflow: hidden; }
    .official-home-v7-tour-inner { width: calc(100% - 32px); display: flex; flex-direction: column-reverse; gap: 24px; padding: 22px 0; }
    .official-home-v7-tour-copy { width: 100%; }
    .official-home-v7-tour-kicker { justify-content: flex-start; }
    .official-home-v7-tour-kicker b, .official-home-v7-tour-progress { display: none; }
    .official-home-v7-tour-steps { position: static; min-height: 0; display: grid; gap: 10px; margin-top: 16px; }
    .official-home-v7-tour-step { position: static; display: block; visibility: visible; padding: 15px 16px; border: 1px solid rgb(255 255 255 / .13); border-radius: 17px; background: rgb(255 255 255 / .07); opacity: 1; transform: none; }
    .official-home-v7-tour-step > span { display: inline-flex; }
    .official-home-v7-tour-step h2 { margin-top: 12px; font-size: 26px; }
    .official-home-v7-tour-step p { margin-top: 9px; font-size: 12px; line-height: 1.6; }
    .official-home-v7-tour-frame { border-radius: 18px; transform: none; }
    .official-home-v7-tour-image.base { filter: brightness(.82) saturate(.8); }
    .official-home-v7-tour-image.focus, .official-home-v7-tour-focus { display: none; }
    .official-home-v7-tour-caption { display: block; line-height: 1.6; }
  }

  @media (prefers-reduced-motion: reduce) and (min-width: 761px) {
    .official-home-v6-reference .official-home-v5-workbench { left: 7% !important; right: 7% !important; height: 456px !important; }
    .official-home-v7-tour { height: auto; min-height: 0; padding: 70px 0; }
    .official-home-v7-tour-sticky { position: relative; height: auto; min-height: 680px; }
    .official-home-v7-tour-steps { position: static; min-height: 0; display: grid; gap: 10px; }
    .official-home-v7-tour-step { position: static; display: block; visibility: visible; padding: 14px 15px; border: 1px solid rgb(255 255 255 / .13); border-radius: 16px; background: rgb(255 255 255 / .07); opacity: 1; transform: none; }
    .official-home-v7-tour-step h2 { margin-top: 11px; font-size: 26px; }
    .official-home-v7-tour-step p { margin-top: 8px; font-size: 12px; }
    .official-home-v7-tour-progress { display: none; }
    .official-home-v7-tour-image.base { filter: brightness(.84) saturate(.82); }
    .official-home-v7-tour-image.focus, .official-home-v7-tour-focus { display: none; }
  }

  /* Native, sharp hero and compositor-only workbench story. */
  .official-home-v8-story {
    --story-hero-opacity: 1;
    --story-hero-y: 0px;
    --story-client-shift: 75vh;
    --story-client-scale: 1;
    height: 220vh;
    min-height: 1400px;
    aspect-ratio: auto;
    overflow: visible;
    background: #f6fcff;
  }
  .official-language { position: relative; flex: 0 0 auto; margin-left: 2px; color: #111a38; font-size: 13px; font-weight: 760; white-space: nowrap; }
  .official-language > summary { min-height: 38px; display: inline-flex; align-items: center; gap: 7px; padding: 0 11px 0 7px; border: 1px solid rgb(198 226 235 / .92); border-radius: 999px; background: linear-gradient(112deg, rgb(235 250 255 / .96), rgb(255 255 255 / .98) 58%, rgb(255 241 248 / .82)); box-shadow: inset 0 1px 0 #fff, 0 5px 14px rgb(57 122 151 / .1); cursor: pointer; list-style: none; transition: border-color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease; }
  .official-language > summary::-webkit-details-marker { display: none; }
  .official-language > summary:hover,
  .official-language[open] > summary { border-color: rgb(102 195 217 / .7); background: linear-gradient(112deg, #e7f9ff, #fff 58%, #ffeff7); box-shadow: inset 0 1px 0 #fff, 0 8px 20px rgb(57 122 151 / .15); transform: translateY(-1px); }
  .official-language-globe { width: 25px; height: 25px; flex: 0 0 auto; padding: 4px; border-radius: 50%; background: linear-gradient(135deg, #d9f7ff, #fce8f4); color: #118cab; box-shadow: inset 0 0 0 1px rgb(89 185 209 / .15); }
  .official-language-chevron { width: 22px; height: 22px; flex: 0 0 auto; margin-left: 1px; padding: 5px; border: 1px solid rgb(190 218 228 / .72); border-radius: 50%; background: rgb(255 255 255 / .58); color: #536b82; box-shadow: inset 0 1px 0 rgb(255 255 255 / .94); transition: color .2s ease, transform .2s ease; }
  .official-language[open] .official-language-chevron { transform: rotate(180deg); }
  .official-language-short { display: none; }
  .official-language-panel { position: absolute; top: calc(100% + 9px); right: 0; z-index: 32; width: 184px; padding: 7px; border: 1px solid rgb(193 220 229 / .88); border-radius: 16px; background: rgb(255 255 255 / .98); box-shadow: 0 18px 44px rgb(31 82 105 / .18); }
  .official-language-option { width: 100%; min-height: 42px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 12px; border: 0; border-radius: 11px; background: transparent; color: #152b4b; font: inherit; text-align: left; }
  button.official-language-option { cursor: pointer; }
  button.official-language-option:hover { background: #effafe; }
  .official-language-option[aria-current="true"] { color: #1188aa; }
  .official-language-option[aria-disabled="true"] { color: #8190a2; }
  .official-language-option small { font-size: 10px; font-weight: 700; }
  .official-nav-link[aria-current="page"],
  .official-mobile-panel a[aria-current="page"],
  .official-language-option[aria-current="true"] {
    border: 1px solid rgb(255 255 255 / .72);
    background: linear-gradient(116deg, rgb(220 247 253 / .64), rgb(255 255 255 / .58) 54%, rgb(255 231 243 / .54));
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .92), 0 7px 18px rgb(49 114 144 / .1);
    -webkit-backdrop-filter: blur(16px) saturate(160%);
    backdrop-filter: blur(16px) saturate(160%);
  }
  .official-brand-tagline { color: #7d879c; font-size: 11px; font-weight: 600; white-space: nowrap; }
  @media (min-width: 761px) {
    .official-header { padding-top: 10px; }
    .official-nav { width: min(1200px, calc(100% - 48px)); min-height: 52px; padding: 4px 18px 4px 20px; border-radius: 24px; background: rgb(255 255 255 / .95); box-shadow: 0 9px 28px rgb(39 93 126 / .12); -webkit-backdrop-filter: none; backdrop-filter: none; }
    .official-brand { gap: 7px; font-size: 23px; }
    .official-mark { width: 42px; height: 42px; border-radius: 50%; }
    .official-brand-tagline { margin-left: 4px; }
    .official-links { position: static; margin-left: auto; gap: 3px; }
    .official-nav-link { min-height: 34px; padding-inline: 13px; color: #111a38; font-size: 13px; font-weight: 720; }
    .official-language { margin-left: 2px; }
    .official-header .official-button.primary { min-width: 112px; min-height: 36px; padding: 8px 16px; border-color: rgb(255 255 255 / .82); background: linear-gradient(106deg, #19bde5 0%, #269af0 33%, #9b78ed 66%, #ee68b6 100%); color: #fff; box-shadow: 0 7px 17px rgb(78 132 207 / .24); }
    .official-header .official-button.primary::before { display: none; }
    .official-header .official-button.primary:hover { border-color: rgb(255 255 255 / .92); background: linear-gradient(106deg, #0fb3df 0%, #1d8ee9 33%, #906ce7 66%, #e85bab 100%); color: #fff; }
  }
  .official-home-v8-sticky { position: sticky; top: 0; height: 100vh; min-height: 640px; overflow: hidden; isolation: isolate; contain: paint; background: #fbfdff; }
  .official-home-v8-sticky::before { position: absolute; z-index: -2; inset: 0; content: ''; background: radial-gradient(circle at 10% 25%, rgb(81 202 234 / .11), transparent 31%), radial-gradient(circle at 34% 59%, rgb(47 203 232 / .15), transparent 31%), radial-gradient(circle at 64% 54%, rgb(246 166 203 / .12), transparent 34%), radial-gradient(circle at 88% 39%, rgb(218 188 245 / .11), transparent 29%), linear-gradient(180deg, #fcfdff 0%, #f8fcff 64%, #e9f9fd 100%); }
  .official-home-v8-sticky::after { position: absolute; z-index: -1; inset: auto 0 0; height: 32%; content: ''; background: radial-gradient(ellipse at 50% 100%, rgb(38 196 224 / .18), transparent 64%); pointer-events: none; }
  .official-home-v8-hero { position: absolute; z-index: 1; inset: 0; overflow: hidden; opacity: var(--story-hero-opacity); transform: translate3d(0, var(--story-hero-y), 0); will-change: opacity, transform; pointer-events: none; }
  .official-home-v8-hero::before { position: absolute; z-index: 0; left: 240px; top: 330px; width: 720px; height: 380px; border-radius: 48% 52% 44% 56%; background: radial-gradient(ellipse at 22% 35%, rgb(78 220 243 / .24), transparent 48%), radial-gradient(ellipse at 48% 52%, rgb(75 191 247 / .19), transparent 55%), radial-gradient(ellipse at 70% 58%, rgb(241 132 198 / .19), transparent 49%); filter: blur(20px); content: ''; transform: rotate(-4deg); }
  .official-home-v9-copy { position: absolute; z-index: 7; top: clamp(84px, 10.5vh, 108px); left: 50%; width: min(1040px, 78vw); text-align: center; transform: translateX(-50%); pointer-events: auto; }
  .official-home-v8-story:not([data-story-step="intro"]) .official-home-v9-copy { pointer-events: none; }
  .official-home-v9-copy h1 { margin: 0; color: #000522; font-size: clamp(42px, 4.25vw, 70px); font-weight: 950; line-height: 1.2; letter-spacing: -.065em; -webkit-text-stroke: 1.3px currentColor; paint-order: stroke fill; }
  .official-home-v9-copy h1 span { display: block; white-space: nowrap; transform-origin: center; }
  .official-home-v9-copy h1 span:first-child { transform: translate(-4px, 1px) scale(1.035, 1.08); }
  .official-home-v9-copy h1 span:last-child { transform: translate(-1px, 2px) scale(.969, 1.02); }
  .official-home-v9-copy h1 em { position: relative; color: #10afd0; font-style: normal; }
  .official-home-v9-copy h1 em::after { position: absolute; left: 8%; right: 5%; bottom: -6px; height: 7px; border-radius: 50%; background: linear-gradient(90deg, #ff6aa3, #f7a7c5); content: ''; transform: rotate(-2deg); opacity: .9; }
  .official-home-v9-copy > p { width: min(760px, 70vw); margin: 24px auto 0; color: #1f304f; font-size: clamp(15px, 1.15vw, 18px); font-weight: 650; line-height: 1.55; }
  .official-home-v9-copy > p span { display: block; white-space: nowrap; }
  .official-home-v9-copy > p span:first-child { transform: translateY(-6px) scaleX(1.18); }
  .official-home-v9-copy > p span:last-child { transform: translateY(-1px) scaleX(1.18); }
  .official-home-v9-copy .official-actions { justify-content: center; gap: 14px; margin-top: 20px; }
  .official-home-v9-copy .official-button.primary { border: 0; background: linear-gradient(120deg, #09b9df 0%, #20b7dc 37%, #a381ef 72%, #f16fb5 100%); box-shadow: 0 12px 28px rgb(44 165 211 / .25); }
  .official-home-v9-copy .official-button.primary { min-width: 174px; justify-content: center; }
  .official-home-v9-boundary { display: none !important; }
  .official-home-v9-note { position: absolute; z-index: 3; top: 24%; margin: 0; color: #79a6d4; font-family: "Bradley Hand", "Comic Sans MS", cursive; font-size: clamp(13px, 1.3vw, 20px); font-weight: 650; font-style: italic; line-height: 1.45; letter-spacing: .03em; transform: rotate(-8deg); }
  .official-home-v9-note.left { top: 21.5%; left: 3.4%; width: 220px; }
  .official-home-v9-note.right { top: 15.8%; right: 4.5%; width: 120px; text-align: center; transform: rotate(7deg); }
  .official-home-v9-note.connect { top: auto; bottom: 16.5%; left: 2.2%; width: 210px; transform: rotate(-8deg); }
  .official-home-v9-note.left::after { position: absolute; left: 16px; top: calc(100% + 8px); width: 178px; height: 18px; border-top: 2px solid currentColor; border-radius: 50%; content: ''; transform: rotate(-4deg); opacity: .72; }
  .official-home-v9-note.right::before, .official-home-v9-note.right::after { display: none; }
  .official-home-v9-note.right svg { position: absolute; left: -88px; top: 78px; width: 94px; height: 80px; overflow: visible; transform: rotate(-4deg); }
  .official-home-v9-channels { position: absolute; z-index: 4; left: 2.35vw; top: 38.5%; width: 22.45vw; display: grid; gap: 29px; }
  .official-home-v9-channel { position: relative; min-height: 90px; display: grid; grid-template-columns: clamp(58px, 4.3vw, 68px) minmax(0,1fr); gap: 12px; align-items: center; box-sizing: border-box; padding: 10px clamp(49px, 3.16vw, 50px) 10px 12px; border: 1px solid rgb(255 255 255 / .98); border-radius: 23px; background: linear-gradient(108deg, #fff 0 66%, rgb(252 254 255 / .98) 100%); box-shadow: 0 13px 30px rgb(43 111 145 / .115), 0 3px 8px rgb(48 90 119 / .035), inset 0 1px 0 #fff; transform: rotate(var(--card-rotate)); transform-origin: center; }
  .official-home-v9-channel:nth-child(2) { background: linear-gradient(108deg, #fff 0 62%, rgb(250 253 255 / .97) 100%); }
  .official-home-v9-channel:nth-child(3) { background: linear-gradient(108deg, #fff 0 64%, rgb(252 254 255 / .97) 100%); }
  .official-home-v9-avatar { position: absolute; right: 11px; top: 50%; width: 52px; height: 52px; overflow: hidden; box-sizing: border-box; border: 3px solid #fff; border-radius: 50%; background: #dff2fb; box-shadow: 0 4px 11px rgb(31 94 130 / .16); transform: translateY(-50%); }
  .official-home-v9-avatar > img { position: absolute; display: block; width: 1506px !important; max-width: none; height: 1045px !important; border-radius: 0 !important; box-shadow: none !important; }
  .official-home-v9-avatar.avatar-one > img { left: -305px; top: -423px; }
  .official-home-v9-avatar.avatar-two > img { left: -305px; top: -534px; }
  .official-home-v9-avatar.avatar-three > img { left: -304px; top: -641px; }
  .official-home-v9-channel::before { position: absolute; left: calc(100% + 6px); top: 50%; width: 18px; height: 10px; border-radius: 999px 4px 4px 999px; background: #48df82; box-shadow: 0 0 12px rgb(72 223 130 / .52); content: ''; transform: translateY(-50%); }
  .official-home-v9-channel:nth-child(2)::before { background: #20a9e7; box-shadow: 0 0 12px rgb(32 169 231 / .5); }
  .official-home-v9-channel:nth-child(3)::before { background: #fa78b7; box-shadow: 0 0 12px rgb(250 120 183 / .5); }
  .official-home-v9-channel-icon { display: grid; width: clamp(60px, 4.3vw, 68px); height: clamp(60px, 4.3vw, 68px); overflow: hidden; place-items: center; border: 1px solid rgb(255 255 255 / .84); border-radius: 17px; box-shadow: 0 8px 18px rgb(31 94 130 / .17), inset 0 1px 1px rgb(255 255 255 / .44); }
  .official-home-v9-channel-icon svg { width: 78%; height: 78%; overflow: visible; filter: drop-shadow(0 3px 5px rgb(4 78 109 / .12)); }
  .official-home-v9-channel-icon > img { display: block; width: 100%; height: 100%; border-radius: inherit; object-fit: cover; }
  .official-home-v9-channel-icon.whatsapp { background: linear-gradient(145deg, #61e65b, #08bd42 72%); }
  .official-home-v9-channel-icon.telegram { background: linear-gradient(145deg, #54cfff, #0b91e8 72%); }
  .official-home-v9-channel-icon.line { background: linear-gradient(145deg, #6be251, #0db83d 72%); }
  .official-home-v9-channel div { min-width: 0; }
  .official-home-v9-channel strong { display: block; color: #102d59; font-family: Arial, "PingFang SC", sans-serif; font-size: clamp(14px, 1.14vw, 18px); font-weight: 700; letter-spacing: -.018em; }
  .official-home-v9-channel:first-child strong, .official-home-v9-channel:last-child strong { color: #07922f; }
  .official-home-v9-channel:nth-child(2) strong { color: #0875ca; }
  .official-home-v9-channel p { display: -webkit-box; overflow: hidden; margin: 3px 0 0; color: #29405f; font-family: Arial, "PingFang SC", sans-serif; font-size: clamp(11px, .82vw, 13px); font-weight: 450; line-height: 1.28; letter-spacing: -.018em; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
  .official-home-v9-channel small { position: absolute; right: 16px; bottom: 5px; color: #8299b2; font-family: Arial, sans-serif; font-size: 11px; }
  .official-home-v9-route { position: absolute; z-index: 2; left: 25%; top: 44%; width: 24%; height: 29%; overflow: visible; opacity: .92; filter: drop-shadow(0 0 6px rgb(62 205 232 / .28)); }
  .official-home-v9-route path { fill: none; stroke: #27cde4; stroke-width: 5.5; stroke-linecap: round; stroke-dasharray: 8 11; }
  .official-home-v9-route path:first-child { stroke: #48df82; }
  .official-home-v9-route path:last-child { stroke: #fa78b7; }
  .official-home-v9-agent { position: absolute; z-index: 5; left: 50%; top: 70.5%; width: min(620px, 40vw); aspect-ratio: 1.28; transform: translate(-50%, -50%); }
  .official-home-v9-platform { position: absolute; z-index: 1; left: 49%; bottom: 4%; width: 83%; height: 41%; border: 1px solid rgb(89 220 243 / .72); border-radius: 50%; background: linear-gradient(180deg, rgb(238 254 255 / .98) 0 34%, rgb(149 232 247 / .86) 50%, rgb(218 250 254 / .94) 73%, rgb(105 207 233 / .74)); box-shadow: 0 28px 54px rgb(42 176 210 / .23), inset 0 10px 18px rgb(255 255 255 / .94), inset 0 -11px 18px rgb(26 164 206 / .18); transform: translateX(-50%); }
  .official-home-v9-platform::before { position: absolute; left: 7%; right: 7%; top: -19%; height: 74%; border: 1px solid rgb(91 221 243 / .78); border-radius: 50%; background: radial-gradient(ellipse at 50% 25%, #fff 0 18%, #c8f7fd 45%, #73dcf1 68%, #e8fdff 74%); box-shadow: 0 0 30px rgb(38 205 235 / .3), inset 0 0 0 7px rgb(255 255 255 / .5); content: ''; }
  .official-home-v9-robot-art { position: absolute; z-index: 2; right: 20%; top: 4%; width: 61.5%; height: auto; clip-path: inset(0 0 33% 0); filter: drop-shadow(0 24px 26px rgb(36 162 199 / .2)); }
  .official-home-v9-platform-art { display: none; }
  .official-home-v9-pet { position: absolute; z-index: 3; left: 2.5%; bottom: 51%; width: 33%; height: auto; filter: drop-shadow(0 16px 16px rgb(43 101 126 / .16)); }
  .official-home-v9-pet-label { display: none; }
  .official-home-v9-robot { position: absolute; z-index: 3; right: 4%; bottom: 15%; width: 48%; aspect-ratio: 1.08; border: 2px solid #b9ecfa; border-radius: 46% 46% 38% 38%; background: linear-gradient(145deg, #fff, #e7f8ff 64%, #cbefff); box-shadow: 0 20px 34px rgb(24 139 183 / .25), inset 0 0 0 8px rgb(255 255 255 / .62); }
  .official-home-v9-robot::before { position: absolute; left: 13%; right: 13%; top: 18%; height: 48%; border: 4px solid #93e7fa; border-radius: 44% 44% 38% 38%; background: radial-gradient(circle at 50% 20%, #153a5f, #06192f 66%); box-shadow: inset 0 0 20px rgb(19 221 247 / .45); content: ''; }
  .official-home-v9-robot::after { position: absolute; left: 50%; bottom: 8%; color: #0b315e; content: 'YOYO'; font-size: 12px; font-weight: 900; letter-spacing: .04em; transform: translateX(-50%); }
  .official-home-v9-eye { position: absolute; z-index: 2; top: 38%; width: 22px; height: 12px; border: 4px solid #1ef3ff; border-bottom: 0; border-radius: 22px 22px 0 0; filter: drop-shadow(0 0 6px #18dcea); }
  .official-home-v9-eye.left { left: 27%; }
  .official-home-v9-eye.right { right: 27%; }
  .official-home-v9-agent-badge { position: absolute; z-index: 4; top: -4.5%; left: 50%; min-width: 188px; min-height: 84px; box-sizing: border-box; padding: 13px 17px 15px; border: 1px solid rgb(168 228 246 / .94); border-radius: 999px; background: linear-gradient(180deg, rgb(244 253 255 / .98), rgb(215 247 252 / .91)); color: #10345f; text-align: center; transform: translateX(-50%); box-shadow: 0 9px 24px rgb(38 137 171 / .1), inset 0 1px 0 #fff; }
  .official-home-v9-agent-badge::after { position: absolute; left: 50%; bottom: -10px; width: 20px; height: 20px; border-right: 1px solid rgb(168 228 246 / .94); border-bottom: 1px solid rgb(168 228 246 / .94); background: #d5f6fb; content: ''; transform: translateX(-50%) rotate(45deg); }
  .official-home-v9-agent-badge strong { position: relative; z-index: 1; display: block; font-size: 23px; line-height: 1.12; }
  .official-home-v9-agent-badge span { position: relative; z-index: 1; display: block; margin-top: 6px; color: #578eb1; font-size: 13px; }
  .official-home-v9-tools { position: absolute; z-index: 6; left: 50%; bottom: 29.7%; display: flex; gap: 40px; transform: translateX(-50%); }
  .official-home-v9-tools > span { position: relative; display: grid; width: 84px; height: 80px; grid-template-rows: 44px 19px; place-items: center; box-sizing: border-box; padding-top: 6px; border: 1px solid rgb(120 216 239 / .86); border-radius: 14px 14px 18px 18px; background: linear-gradient(90deg, rgb(230 250 255 / .94) 0%, #fff 48%, rgb(211 244 252 / .94) 100%); color: #0a8ee3; box-shadow: 0 10px 21px rgb(20 145 190 / .17), inset 8px 0 12px rgb(74 213 241 / .1), inset -8px 0 12px rgb(55 176 229 / .09); }
  .official-home-v9-tools > span::before { position: absolute; z-index: -1; left: -1px; right: -1px; top: -8px; height: 17px; border: 1px solid rgb(113 220 241 / .82); border-radius: 50%; background: radial-gradient(ellipse at 50% 30%, #fff 0 34%, #d4f7ff 70%, #9ce8f7 100%); content: ''; box-shadow: 0 2px 7px rgb(52 178 211 / .18); }
  .official-home-v9-tools > span::after { position: absolute; z-index: -1; left: 2px; right: 2px; bottom: -3px; height: 12px; border-radius: 50%; background: rgb(157 230 244 / .32); content: ''; }
  .official-home-v9-tools svg { width: 38px; height: 38px; overflow: visible; }
  .official-home-v9-tools small { display: block; color: #087cbf; font-size: 14px; font-weight: 830; white-space: nowrap; }
  .official-home-v9-platform-copy { position: absolute; z-index: 7; left: 48%; bottom: 18%; color: #058bce; font-size: 21px; font-weight: 850; line-height: 1.2; letter-spacing: .015em; white-space: nowrap; text-shadow: 0 2px 9px rgb(26 166 211 / .14); transform: translateX(-50%); }
  .official-home-v9-reply { position: absolute; z-index: 6; top: 46.5%; right: 23%; width: min(250px, 15.8vw); padding: 14px; border: 1px solid rgb(218 235 243); border-radius: 21px; background: rgb(255 255 255 / .99); box-shadow: 0 15px 31px rgb(47 119 150 / .11), inset 0 1px 0 #fff; transform: rotate(-6.4deg); }
  .official-home-v9-reply::before { position: absolute; z-index: -1; inset: -20px -17px -18px -25px; border: 1.5px solid rgb(151 218 240 / .72); border-radius: 27px; background: linear-gradient(145deg, rgb(226 246 253 / .9), rgb(243 250 255 / .76)); box-shadow: 0 18px 36px rgb(37 133 171 / .11), inset 0 1px 0 rgb(255 255 255 / .86); content: ''; }
  .official-home-v9-reply > header { display: flex; align-items: center; justify-content: space-between; color: #075fbf; font-size: 18px; font-weight: 900; }
  .official-home-v9-reply > header span::first-letter { color: #1e7dff; font-size: 28px; }
  .official-home-v9-reply > header small { color: #1686de; font-size: 13px; font-weight: 850; }
  .official-home-v9-reply p { margin: 7px 0 0; padding: 10px; border-radius: 14px; background: #fff; color: #243b5d; font-family: "Arial Narrow", Arial, sans-serif; font-size: clamp(11px, .82vw, 13px); font-weight: 400; line-height: 1.32; box-shadow: 0 1px 0 rgb(235 243 248); }
  .official-home-v9-reply footer { display: flex; gap: 8px; margin-top: 8px; }
  .official-home-v9-reply footer span { flex: 1; padding: 8px; border: 1px solid #d6e6ee; border-radius: 9px; color: #567084; font-size: clamp(10px, .82vw, 13px); font-weight: 780; text-align: center; }
  .official-home-v9-reply footer span:first-child { border: 0; background: linear-gradient(115deg, #08bfe1, #0ba9e1); color: #fff; }
  .official-home-v9-broadcast { position: absolute; z-index: 4; right: 2.2vw; top: 37.4%; width: 17vw; }
  .official-home-v9-broadcast::before { display: none; }
  .official-home-v9-broadcast-route { position: absolute; z-index: -1; left: -66px; top: 35px; width: 78px; height: 330px; overflow: visible; }
  .official-home-v9-broadcast-route path { fill: none; stroke: #ff6eaf; stroke-width: 2; stroke-linecap: round; stroke-dasharray: 6 6; }
  .official-home-v9-broadcast-node { position: absolute; z-index: 2; left: -58px; top: 46%; display: grid; width: 50px; height: 50px; place-items: center; border: 6px solid rgb(255 255 255 / .92); border-radius: 50%; background: linear-gradient(145deg, #ff7ab6, #f45c9c); box-shadow: 0 12px 24px rgb(235 87 153 / .25); color: #fff; transform: translateY(-50%); }
  .official-home-v9-broadcast-node svg { width: 28px; height: 28px; transform: rotate(-7deg); }
  .official-home-v9-broadcast header { display: flex; align-items: center; gap: 8px; min-height: 43px; padding: 10px 14px; border: 1px solid rgb(255 255 255 / .96); border-radius: 999px; background: linear-gradient(110deg, rgb(255 251 254 / .98), rgb(255 228 242 / .95)); box-shadow: 0 14px 30px rgb(155 86 134 / .14), inset 0 1px 0 #fff; }
  .official-home-v9-broadcast header strong { color: #071f48; font-size: clamp(16px, 1.27vw, 20px); font-weight: 900; }
  .official-home-v9-broadcast header svg { width: 36px; height: 36px; flex: 0 0 auto; color: #112d57; }
  .official-home-v9-broadcast header small { margin-left: auto; color: #b16a8f; font-size: 10px; font-weight: 750; white-space: nowrap; }
  .official-home-v9-broadcast section { box-sizing: border-box; height: 254px; display: grid; gap: 7px; margin-top: 5px; padding: 14px 15px; border: 1px solid rgb(255 255 255 / .96); border-radius: 21px; background: linear-gradient(145deg, rgb(255 255 255 / .97), rgb(255 247 251 / .93)); box-shadow: 0 20px 44px rgb(155 86 134 / .12), inset 0 1px 0 #fff; }
  .official-home-v9-broadcast section div { height: 51px; min-height: 0; display: grid; grid-template-columns: 46px 1fr; gap: 9px; align-items: center; color: #52647a; font-size: clamp(9.5px, .76vw, 12px); font-weight: 680; }
  .official-home-v9-broadcast section i { display: grid; width: 46px; height: 46px; place-items: center; border-radius: 50%; background: #ffe5f1; color: #ef65a6; font-style: normal; font-weight: 900; }
  .official-home-v9-broadcast section div:nth-child(3) i { background: #e2f8ec; color: #18ae64; }
  .official-home-v9-broadcast section div:nth-child(4) i { background: #fff1d7; color: #f1a126; }
  .official-home-v9-broadcast section i svg { width: 27px; height: 27px; }
  .official-home-v9-broadcast section span strong, .official-home-v9-broadcast section span small { display: block; }
  .official-home-v9-broadcast section span strong { color: #13284b; font-size: clamp(14px, 1.08vw, 17px); font-weight: 870; }
  .official-home-v9-broadcast section span small { margin-top: 2px; color: #4f607d; font-size: 14px; font-weight: 640; line-height: 1.16; }
  .official-home-v9-broadcast footer { display: grid; gap: 3px; margin: 12px 10px 0; }
  .official-home-v9-broadcast footer > span { position: relative; display: grid; width: 82%; height: 46px; grid-template-columns: 38px 1fr; gap: 8px; align-items: center; padding: 3px 9px 3px 4px; border: 1px solid rgb(255 255 255 / .94); border-radius: 15px; background: rgb(255 255 255 / .9); box-shadow: 0 7px 16px rgb(96 108 143 / .1); }
  .official-home-v9-broadcast footer > span::after { position: absolute; right: -24px; width: 10px; height: 10px; border-radius: 50%; background: var(--person-state); content: ''; }
  .official-home-v9-broadcast footer b { position: relative; display: block; width: 38px; height: 38px; overflow: hidden; border: 2px solid #fff; border-radius: 50%; background: #e7eef7; box-shadow: 0 3px 8px rgb(42 86 118 / .14); }
  .official-home-v9-broadcast footer b img { position: absolute; display: block; width: 1164px; max-width: none; height: 807px; }
  .official-home-v9-broadcast footer b.avatar-one img { left: -237px; top: -329px; }
  .official-home-v9-broadcast footer b.avatar-two img { left: -237px; top: -415px; }
  .official-home-v9-broadcast footer b.avatar-three img { left: -236px; top: -498px; }
  .official-home-v9-broadcast footer i { position: relative; width: 75px; height: 7px; border-radius: 999px; background: linear-gradient(90deg, #c3d1df 0 64%, #e9eff5 64%); }
  .official-home-v9-broadcast footer i::after { position: absolute; left: 0; top: 12px; width: 54px; height: 6px; border-radius: 999px; background: linear-gradient(90deg, #c7d4e1 0 58%, #edf2f7 58%); content: ''; }
  .official-home-v9-broadcast footer small { margin-top: 2px; color: #d36d9a; font-size: 7px; line-height: 1.35; }
  .official-home-v9-cityline { position: absolute; z-index: 1; left: 0; right: 0; bottom: 0; height: 35%; overflow: hidden; opacity: .64; background: radial-gradient(ellipse at 50% 104%, rgb(74 205 229 / .34), transparent 66%); }
  .official-home-v9-cityline::before { position: absolute; inset: 30% 2% -32%; background: radial-gradient(circle, rgb(59 179 215 / .48) 0 1.2px, transparent 1.6px) 0 0 / 7px 7px; clip-path: ellipse(53% 58% at 50% 100%); content: ''; opacity: .78; }
  .official-home-v9-cityline svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
  .official-home-v8-client { position: absolute; z-index: 4; left: 50%; top: 52%; width: min(1200px, 78vw, 118vh); aspect-ratio: 1.86; margin: 0; overflow: visible; opacity: var(--story-client-opacity, 0); transform: translate3d(-50%, calc(-50% + var(--story-client-shift)), 0) scale(var(--story-client-scale)); transform-origin: center; will-change: opacity, transform; }
  .official-home-v8-client-frame { position: absolute; inset: 0; overflow: hidden; border: 1px solid #cae2ee; border-radius: 23px; background: #f9fcff; box-shadow: 0 30px 80px rgb(36 96 127 / .2), 0 1px 0 #fff inset; contain: paint; }
  .official-home-v8-client-decor { position: absolute; z-index: 2; inset: 0; overflow: hidden; opacity: 0; transition: opacity .35s ease; pointer-events: none; }
  .official-home-v8-story:not([data-story-step="intro"]) .official-home-v8-client-decor { opacity: 1; }
  .official-home-v8-client-decor::before { position: absolute; left: 4%; right: 4%; bottom: 4%; height: 25%; background: radial-gradient(circle, rgb(43 180 220 / .34) 0 1.2px, transparent 1.7px) 0 0 / 8px 8px; clip-path: ellipse(56% 42% at 50% 100%); content: ''; opacity: .58; }
  .official-home-v8-client-decor svg { position: absolute; left: 4%; right: 4%; bottom: 3%; width: 92%; height: 26%; overflow: visible; }
  .official-home-v8-client-note { position: absolute; max-width: 190px; margin: 0; color: #67a9d5; font-family: "Bradley Hand", "Comic Sans MS", cursive; font-size: 17px; font-weight: 650; font-style: italic; line-height: 1.25; letter-spacing: .02em; }
  .official-home-v8-client-note.left { left: 7%; top: 16%; transform: rotate(-7deg); }
  .official-home-v8-client-note.right { right: 6%; top: 18%; text-align: right; transform: rotate(6deg); }
  .official-native-client { height: 100%; display: grid; grid-template-rows: 62px minmax(0,1fr); color: #17345d; font-size: 12px; }
  .official-native-topbar { position: relative; z-index: 2; display: grid; grid-template-columns: 190px minmax(0,1fr) auto; gap: 10px; align-items: center; padding: 6px 12px 6px 96px; border-bottom: 1px solid #e2ebf3; background: #fff; transition: box-shadow .22s ease; }
  .official-native-topbar::before { position: absolute; left: 30px; top: 17px; width: 10px; height: 10px; border-radius: 50%; background: #ff6b67; box-shadow: 17px 0 #ffc43d, 34px 0 #26c65b; content: ''; }
  .official-native-brand { display: flex; align-items: center; gap: 8px; min-width: 0; }
  .official-native-brand img { width: 38px; height: 38px; border-radius: 12px; }
  .official-native-brand strong { font-size: 16px; white-space: nowrap; }
  .official-native-topbar h2 { overflow: hidden; margin: 0; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
  .official-native-status { display: flex; gap: 6px; align-items: center; }
  .official-native-status span { padding: 6px 8px; border: 1px solid #dce8f0; border-radius: 999px; background: #f6faff; color: #557087; font-size: 8px; white-space: nowrap; }
  .official-native-status .on { background: #e9fbf2; color: #21825e; }
  .official-native-body { display: grid; grid-template-columns: 35% minmax(0,1fr) 20%; min-height: 0; }
  .official-native-left { position: relative; display: grid; grid-template-columns: 76px minmax(0,1fr); min-width: 0; border-right: 1px solid #e1eaf2; background: #f8fbff; transition: box-shadow .22s ease; }
  .official-native-rail { display: grid; align-content: start; gap: 5px; padding: 10px 7px; border-right: 1px solid #e5edf3; background: #f6faff; }
  .official-native-rail span { padding: 7px 5px; border-radius: 8px; color: #58708a; font-size: 10px; font-weight: 720; }
  .official-native-rail span.active { background: #e6f4ff; color: #087bbf; }
  .official-native-inbox { min-width: 0; padding: 10px; background: #fff; }
  .official-native-inbox-head { display: flex; align-items: center; justify-content: space-between; }
  .official-native-inbox-head strong { font-size: 13px; }
  .official-native-inbox-head small { color: #6c91ab; font-size: 9px; }
  .official-native-search { margin: 8px 0; padding: 7px 9px; border: 1px solid #dde9f2; border-radius: 9px; color: #9aabba; font-size: 10px; }
  .official-native-tabs { display: flex; gap: 4px; margin-bottom: 7px; }
  .official-native-tabs span { flex: 1; padding: 5px 3px; border-radius: 8px; background: #f2f6fa; color: #778a9d; font-size: 9px; text-align: center; }
  .official-native-tabs span:first-child { background: #2d7cf4; color: #fff; }
  .official-native-contact { display: grid; grid-template-columns: 27px minmax(0,1fr) auto; gap: 7px; align-items: center; padding: 7px 5px; border-radius: 9px; }
  .official-native-contact.active { background: #eaf3ff; box-shadow: inset 2px 0 #2d7cf4; }
  .official-native-avatar { display: grid; width: 27px; height: 27px; place-items: center; border-radius: 50%; background: linear-gradient(145deg, #58a3ff, #655ce9); color: #fff; font-weight: 850; }
  .official-native-contact div { min-width: 0; }
  .official-native-contact strong, .official-native-contact small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .official-native-contact strong { font-size: 10px; }
  .official-native-contact small { margin-top: 2px; color: #7b8fa5; font-size: 8px; }
  .official-native-contact time { color: #8da0b4; font-size: 8px; }
  .official-native-chat { position: relative; min-width: 0; display: grid; grid-template-rows: 45px minmax(0,1fr) 62px; background: linear-gradient(145deg, #f7faf4, #eef5ec); transition: box-shadow .22s ease; }
  .official-native-chat-head { display: flex; align-items: center; justify-content: space-between; padding: 8px 12px; border-bottom: 1px solid #e1e9ed; background: #fff; }
  .official-native-chat-head strong { font-size: 11px; }
  .official-native-chat-head span { padding: 5px 8px; border-radius: 999px; background: #edf5ff; color: #2e73d4; font-size: 7px; }
  .official-native-messages { display: flex; flex-direction: column; gap: 9px; min-height: 0; padding: 14px; }
  .official-native-bubble { max-width: 66%; padding: 9px 10px; border-radius: 11px; background: #fff; color: #334b62; font-size: 10px; line-height: 1.45; box-shadow: 0 4px 12px rgb(39 83 106 / .08); }
  .official-native-bubble.reply { align-self: flex-end; background: #dff8c9; }
  .official-native-bubble small { display: block; margin-top: 5px; color: #708ca0; font-size: 8px; }
  .official-native-compose { margin: 0 10px 10px; padding: 9px 10px; border: 1px solid #dce8ee; border-radius: 11px; background: #fff; color: #94a4b5; font-size: 10px; }
  .official-native-compose footer { display: flex; justify-content: space-between; margin-top: 8px; color: #4a6d98; }
  .official-native-compose b { padding: 4px 9px; border-radius: 8px; background: #4388f7; color: #fff; font-size: 7px; }
  .official-native-right { position: relative; min-width: 0; padding: 10px; background: #fff; transition: box-shadow .22s ease; }
  .official-native-right-head { display: flex; justify-content: space-between; align-items: center; }
  .official-native-right-head strong { font-size: 13px; }
  .official-native-right-head span { color: #2a9d70; font-size: 9px; }
  .official-native-safety { margin-top: 9px; padding: 9px; border: 1px solid #dfe9f0; border-radius: 11px; }
  .official-native-safety > strong { display: block; font-size: 11px; }
  .official-native-score { display: grid; width: 43px; height: 43px; margin: 8px auto; place-items: center; border: 5px solid #43b96d; border-radius: 50%; color: #23844d; font-size: 11px; }
  .official-native-checks { display: grid; gap: 6px; margin-top: 8px; }
  .official-native-checks span { display: flex; justify-content: space-between; color: #677d91; font-size: 9px; }
  .official-native-checks i { color: #27ae60; font-style: normal; }
  .official-native-right button { width: 100%; margin-top: 9px; padding: 7px; border: 1px solid #8ab5ef; border-radius: 9px; background: #f7fbff; color: #3273c7; font-size: 9px; font-weight: 800; }
  .official-native-topbar::after, .official-native-left::after, .official-native-chat::after, .official-native-right::after { position: absolute; z-index: 6; inset: 3px; border: 2px solid #20c8e4; border-radius: 13px; content: ''; opacity: 0; box-shadow: 0 0 0 2px rgb(255 255 255 / .72), 0 0 24px rgb(32 200 228 / .22); transition: opacity .2s ease; pointer-events: none; }
  .official-home-v8-story:is([data-story-step="top"],[data-story-step="sides"],[data-story-step="complete"]) .official-native-topbar::after,
  .official-home-v8-story:is([data-story-step="sides"],[data-story-step="complete"]) .official-native-left::after,
  .official-home-v8-story:is([data-story-step="sides"],[data-story-step="complete"]) .official-native-right::after,
  .official-home-v8-story[data-story-step="complete"] .official-native-chat::after { opacity: 1; }
  .official-home-v8-callouts { position: absolute; z-index: 6; inset: 0; margin: 0; padding: 0; list-style: none; pointer-events: none; }
  .official-home-v8-callout { position: absolute; padding: 13px 14px; border: 1px solid rgb(129 188 214 / .48); border-radius: 15px; background: #fff; color: #17304c; box-shadow: 0 14px 34px rgb(47 102 134 / .12), inset 0 1px 0 #fff; opacity: 0; transform: translateY(8px) scale(.98); transition: opacity .22s ease, transform .28s cubic-bezier(.2,.8,.2,1); }
  .official-home-v8-callout::before { position: absolute; content: ''; background: linear-gradient(90deg, #36c4df, #909ce9, #ea94b7); }
  .official-home-v8-callout.right { right: 12px; top: 43%; width: min(160px, 12vw); }
  .official-home-v8-callout.right::before { right: 100%; top: 24px; width: 28px; height: 1px; }
  .official-home-v8-callout.bottom { left: 50%; bottom: clamp(12px, 2.2vh, 24px); width: min(360px, 34vw); translate: -50% 0; }
  .official-home-v8-callout.bottom::before { left: 50%; bottom: 100%; width: 1px; height: 26px; }
  .official-home-v8-callout.top { left: 50%; top: clamp(74px, 10vh, 94px); width: min(330px, 32vw); translate: -50% 0; }
  .official-home-v8-callout.top::before { left: 50%; top: 100%; width: 1px; height: 26px; }
  .official-home-v8-callout.left { left: 12px; top: 43%; width: min(160px, 12vw); }
  .official-home-v8-callout.left::before { left: 100%; top: 24px; width: 28px; height: 1px; }
  .official-home-v8-callout > span { color: #1686a2; font-size: 9px; font-weight: 850; letter-spacing: .08em; }
  .official-home-v8-callout h2 { margin: 6px 0 5px; color: #102845; font-size: clamp(15px, 1.25vw, 19px); line-height: 1.12; letter-spacing: -.035em; }
  .official-home-v8-callout p { margin: 0; color: #5a6c7d; font-size: 10px; line-height: 1.46; }
  .official-home-v8-story:is([data-story-step="top"],[data-story-step="sides"],[data-story-step="complete"]) .official-home-v8-callout.top,
  .official-home-v8-story:is([data-story-step="sides"],[data-story-step="complete"]) .official-home-v8-callout.left,
  .official-home-v8-story:is([data-story-step="sides"],[data-story-step="complete"]) .official-home-v8-callout.right,
  .official-home-v8-story[data-story-step="complete"] .official-home-v8-callout.bottom { opacity: 1; transform: translateY(0) scale(1); }
  .official-home-v8-story + .official-home-v5-hero + .official-home-v4-section { padding-top: 58px; }

  @media (max-width: 1080px) and (min-width: 761px) {
    .official-home-v8-client { width: min(980px, 82vw, 122vh); }
    .official-home-v9-copy { width: 90vw; }
    .official-home-v9-channels { left: 18px; width: 25vw; }
    .official-home-v9-reply { right: 19%; width: 22vw; }
    .official-home-v9-broadcast { right: 18px; width: 19vw; }
    .official-home-v8-callout { padding: 9px 10px; }
    .official-home-v8-callout.right { right: 8px; width: 13vw; }
    .official-home-v8-callout.left { left: 8px; width: 13vw; }
    .official-home-v8-callout.top { top: 10vh; width: 30vw; }
    .official-home-v8-callout.bottom { bottom: 12px; width: 34vw; }
    .official-home-v8-callout h2 { font-size: 13px; }
    .official-home-v8-callout p { font-size: 8.5px; line-height: 1.38; }
  }

  /* The approved 1586x992 reference is a single canvas. Every desktop/tablet
     element scales together so narrow preview panes cannot recompose it. */
  @media (min-width: 761px) {
    .official-home-v8-story { --story-canvas-scale: 1; }
    .official-home-v8-canvas { position: absolute; top: 0; left: 50%; width: 1586px; height: 992px; transform: translateX(-50%) scale(var(--story-canvas-scale)); transform-origin: top center; }
    .official-home-v8-hero { inset: 0; width: 1586px; height: 992px; }
    .official-home-v9-copy { top: 104px; width: 1040px; }
    .official-home-v9-copy h1 { font-size: 67.4px; }
    .official-home-v9-copy > p { width: 760px; font-size: 18px; }
    .official-home-v9-note { font-size: 20px; }
    .official-home-v9-note.left { top: 208px; left: 54px; width: 220px; }
    .official-home-v9-note.right { top: 157px; right: 99px; width: 160px; font-size: 24px; line-height: 1.18; }
    .official-home-v9-note.right svg { left: -27px; top: 95px; }
    .official-home-v9-note.connect { top: auto; bottom: 176px; left: 35px; width: 210px; font-size: 18px; }
    .official-home-v9-channels { top: 393px; left: 37px; width: 356px; height: 340px; display: block; }
    .official-home-v9-channel { position: absolute; left: 0; width: 100%; min-height: 90px; grid-template-columns: 68px minmax(0,1fr); gap: 12px; padding: 10px 50px 10px 12px; }
    .official-home-v9-channel:nth-child(1) { top: 0; }
    .official-home-v9-channel:nth-child(2) { top: 118px; }
    .official-home-v9-channel:nth-child(3) { top: 239px; }
    .official-home-v9-channel-icon { width: 68px; height: 68px; }
    .official-home-v9-channel strong { font-size: 18px; }
    .official-home-v9-channel p { font-size: 14px; line-height: 1.28; }
    .official-home-v9-route { top: 414px; left: 397px; width: 381px; height: 288px; }
    .official-home-v9-agent { top: 699px; width: 620px; }
    .official-home-v9-platform { display: none; }
    .official-home-v9-robot-art { top: 0; right: auto; left: 50%; width: 100%; clip-path: inset(0 0 44% 0); transform: translateX(-50%); }
    .official-home-v9-copy { left: calc(50% + 5px); }
    .official-home-v9-copy .official-button.primary { min-width: 202px; }
    .official-home-v9-copy .official-button:not(.primary) { min-width: 176px; justify-content: center; }
    .official-home-v9-platform-art { position: absolute; z-index: 1; top: 0; left: 50%; display: block; width: 100%; height: auto; clip-path: inset(44% 0 0); filter: drop-shadow(0 24px 26px rgb(36 162 199 / .2)); transform: translateX(-50%); transform-origin: 50% 50%; }
    .official-home-v9-pet { left: -1.5%; bottom: 39%; width: 42%; transform: scaleY(.84); transform-origin: center; }
    .official-home-v9-pet-label { left: 9%; }
    .official-home-v9-channel:nth-child(2),
    .official-home-v9-channel:nth-child(3) { translate: none; }
    .official-home-v9-agent-badge { top: -20px; left: 50.6%; min-width: 188px; min-height: 84px; }
    .official-home-v9-tools { left: calc(46% + 7px); gap: 36px; }
    .official-home-v9-tools > span { width: 84px; }
    .official-home-v9-platform-copy { bottom: 3.8%; }
    .official-home-v9-reply { top: 459px; right: 365px; width: 250px; box-sizing: border-box; }
    .official-home-v9-reply::before { inset: -20px -17px -18px -25px; }
    .official-home-v9-reply p { font-size: 13px; }
    .official-home-v9-reply footer span { font-size: 12px; }
    .official-home-v9-reply { padding: 14px; }
    .official-home-v9-reply > header { font-size: 14px; }
    .official-home-v9-reply p { margin-top: 7px; padding: 10px; line-height: 1.32; }
    .official-home-v9-reply footer { margin-top: 7px; }
    .official-home-v9-broadcast { top: 371px; right: 30px; width: 270px; }
    .official-home-v9-broadcast header { min-height: 54px; }
    .official-home-v9-broadcast section { margin-top: 4px; }
    .official-home-v9-broadcast section { margin-left: 10px; }
    .official-home-v9-broadcast footer { margin-left: 24px; }
    .official-home-v9-broadcast-node { left: -32px; }
    .official-home-v9-broadcast-route { left: -48px; }
    .official-home-v9-broadcast header strong { font-size: 18px; }
    .official-home-v9-broadcast section div,
    .official-home-v9-broadcast section span strong { font-size: 15px; }
    .official-home-v8-client { top: 516px; width: 1200px; }
    .official-home-v8-callout.right { right: 12px; width: 160px; }
    .official-home-v8-callout.left { left: 12px; width: 160px; }
    .official-home-v8-callout.top { top: 94px; width: 330px; }
    .official-home-v8-callout.bottom { bottom: 24px; width: 360px; }
    .official-home-v8-callout { padding: 13px 14px; }
    .official-home-v8-callout h2 { font-size: 19px; }
    .official-home-v8-callout p { font-size: 10px; line-height: 1.46; }
  }

  @media (prefers-reduced-motion: reduce) and (min-width: 761px) {
    .official-home-v8-story { height: auto; min-height: 0; padding: 110px 0 56px; }
    .official-home-v8-sticky { position: relative; height: auto; min-height: 0; padding: 0 24px; overflow: visible; }
    .official-home-v8-hero { display: none; }
    .official-home-v8-client { position: relative; inset: auto; width: min(1080px, 76vw); margin: 0 auto; transform: none; }
    .official-home-v8-callouts { position: relative; width: min(1080px, 92vw); display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin: 18px auto 0; }
    .official-home-v8-callout, .official-home-v8-callout.right, .official-home-v8-callout.bottom, .official-home-v8-callout.top, .official-home-v8-callout.left { position: relative; inset: auto; width: auto; translate: none; opacity: 1; transform: none; }
    .official-home-v8-callout::before { display: none; }
  }

  /* Homepage v10: every visible block is an independent HTML/CSS/SVG component. */
  .yoyo-v10-home { position: relative; height: 1045px; overflow: hidden; background: #f8fdff; }
  .yoyo-v10-canvas { position: absolute; top: var(--v10-top-offset, 0px); left: 50%; width: 1506px; height: 1045px; overflow: hidden; transform: translateX(-50%) scale(var(--v10-scale, 1)); transform-origin: top center; isolation: isolate; }
  .yoyo-v10-canvas::before { position: absolute; z-index: -3; inset: 0; background: radial-gradient(circle at 20% 52%, rgb(55 211 236 / .22), transparent 30%), radial-gradient(circle at 56% 49%, rgb(93 206 241 / .2), transparent 31%), radial-gradient(circle at 72% 45%, rgb(246 152 201 / .18), transparent 29%), linear-gradient(180deg, #fbfdff 0%, #f7fcff 62%, #e4f8fd 100%); content: ''; }
  .yoyo-v10-canvas::after { position: absolute; z-index: -2; left: 350px; top: 276px; width: 830px; height: 500px; border-radius: 50%; background: radial-gradient(circle at 20% 52%, rgb(37 213 232 / .21), transparent 43%), radial-gradient(circle at 73% 45%, rgb(255 154 200 / .19), transparent 48%); filter: blur(18px); content: ''; transform: rotate(-5deg); }
  .yoyo-v10-background { position: absolute; z-index: 0; inset: 0; pointer-events: none; }
  .yoyo-v10-copy { position: absolute; z-index: 10; top: 85px; left: 50%; width: 1000px; text-align: center; transform: translateX(-50%); }
  .yoyo-v10-copy h1 { margin: 0; color: #030a2a; font-size: 70px; font-weight: 950; line-height: 1.18; letter-spacing: -.065em; -webkit-text-stroke: 1.2px currentColor; paint-order: stroke fill; }
  .yoyo-v10-copy h1 span { display: block; white-space: nowrap; }
  .yoyo-v10-copy h1 em { color: #10afd0; font-style: normal; }
  .yoyo-v10-copy h1 .line-two { position: relative; font-size: 66px; }
  .yoyo-v10-copy h1 .line-two::after { position: absolute; left: 401px; bottom: -4px; width: 148px; height: 7px; border-radius: 50%; background: #ff6fa9; content: ''; transform: rotate(-2deg); opacity: .95; }
  .yoyo-v10-copy > p { margin: 20px auto 0; color: #152846; font-size: 19px; font-weight: 650; line-height: 1.42; }
  .yoyo-v10-copy > p span { display: block; white-space: nowrap; }
  .yoyo-v10-actions { display: flex; justify-content: center; gap: 15px; margin-top: 17px; }
  .yoyo-v10-action { min-width: 182px; min-height: 49px; display: inline-flex; align-items: center; justify-content: center; gap: 14px; border: 2px solid #08b6db; border-radius: 999px; background: rgb(255 255 255 / .76); color: #0a1b3a; font-size: 17px; font-weight: 850; box-shadow: 0 10px 22px rgb(42 139 175 / .1); pointer-events: auto; transition: transform .2s ease, box-shadow .2s ease; }
  .yoyo-v10-action:hover { transform: translateY(-2px); box-shadow: 0 13px 26px rgb(42 139 175 / .16); }
  .yoyo-v10-action.primary { border-color: rgb(255 255 255 / .78); background: linear-gradient(106deg, #19bde5 0%, #269af0 33%, #9b78ed 66%, #ee68b6 100%); color: #fff; box-shadow: 0 11px 25px rgb(78 132 207 / .25); }
  .yoyo-v10-boundary { margin-top: 10px !important; color: #7f90aa !important; font-size: 13px !important; font-weight: 720 !important; }
  .yoyo-v10-note { position: absolute; z-index: 3; margin: 0; color: #7ba6d7; font-family: "Bradley Hand", "Comic Sans MS", cursive; font-weight: 650; font-style: italic; line-height: 1.34; letter-spacing: .02em; }
  .yoyo-v10-note.left { top: 196px; left: 51px; width: 230px; font-size: 20px; transform: rotate(-8deg); }
  .yoyo-v10-note.left::after { position: absolute; left: 22px; top: calc(100% + 7px); width: 180px; height: 18px; border-top: 2px solid currentColor; border-radius: 50%; content: ''; transform: rotate(-5deg); opacity: .75; }
  .yoyo-v10-note.right { top: 142px; right: 60px; width: 128px; font-size: 20px; line-height: 1.18; text-align: center; transform: rotate(6deg); }
  .yoyo-v10-note.right svg { position: absolute; right: 71px; top: 83px; width: 118px; height: 94px; overflow: visible; transform: rotate(-4deg); }
  .yoyo-v10-note.connect { left: 31px; top: 740px; width: 210px; font-size: 18px; transform: rotate(-8deg); }
  .yoyo-v10-channels { position: absolute; z-index: 5; left: 31px; top: 383px; width: 332px; height: 340px; }
  .yoyo-v10-channel { position: absolute; left: 0; width: 332px; height: 94px; display: grid; grid-template-columns: 66px minmax(0,1fr); gap: 12px; align-items: center; box-sizing: border-box; padding: 10px 52px 10px 10px; border: 1px solid rgb(255 255 255 / .98); border-radius: 22px; background: #fff; box-shadow: 0 14px 30px rgb(38 105 139 / .12), inset 0 1px 0 #fff; transform: rotate(var(--tilt)); transform-origin: center; }
  .yoyo-v10-channel:nth-child(1) { top: 0; --tilt: 4.1deg; }
  .yoyo-v10-channel:nth-child(2) { top: 117px; --tilt: 3.2deg; }
  .yoyo-v10-channel:nth-child(3) { top: 236px; --tilt: 2.6deg; }
  .yoyo-v10-channel-icon { width: 64px; height: 64px; overflow: hidden; border-radius: 17px; box-shadow: 0 7px 16px rgb(26 101 139 / .18); }
  .yoyo-v10-channel-icon img { display: block; width: 100%; height: 100%; object-fit: cover; }
  .yoyo-v10-channel-copy { min-width: 0; color: #143158; font-family: Arial, "PingFang SC", sans-serif; }
  .yoyo-v10-channel-copy strong { display: block; font-size: 16px; line-height: 1.1; }
  .yoyo-v10-channel:nth-child(1) strong, .yoyo-v10-channel:nth-child(3) strong { color: #078f31; }
  .yoyo-v10-channel:nth-child(2) strong { color: #087aca; }
  .yoyo-v10-channel-copy p { margin: 5px 0 0; font-size: 13px; line-height: 1.26; white-space: nowrap; }
  .yoyo-v10-channel-copy time { position: absolute; right: 15px; bottom: 7px; color: #8198b1; font-size: 10px; }
  .yoyo-v10-avatar { position: absolute; right: 11px; top: 50%; width: 42px; height: 42px; overflow: hidden; border: 3px solid #fff; border-radius: 50%; background: #e7f3f8; box-shadow: 0 4px 10px rgb(31 94 130 / .16); transform: translateY(-50%); }
  .yoyo-v10-avatar img { display: block; width: 100%; height: 100%; object-fit: cover; }
  .yoyo-v10-channel::before { position: absolute; z-index: 2; left: calc(100% + 11px); top: 50%; width: 6px; height: 22px; border-radius: 999px; background: var(--route-color); box-shadow: 0 0 10px color-mix(in srgb, var(--route-color) 40%, transparent); content: ''; transform: translateY(-50%); }
  .yoyo-v10-channel::after { position: absolute; z-index: 2; left: calc(100% + 8px); top: 50%; width: 16px; height: 8px; border-radius: 999px 4px 4px 999px; background: var(--route-color); box-shadow: 0 0 10px color-mix(in srgb, var(--route-color) 38%, transparent); content: ''; transform: translateY(-50%); }
  .yoyo-v10-channel:nth-child(1) { --route-color:#45df82; }
  .yoyo-v10-channel:nth-child(2) { --route-color:#19a5ea; }
  .yoyo-v10-channel:nth-child(3) { --route-color:#fa75b5; }
  .yoyo-v10-routes { position: absolute; z-index: 2; left: 366px; top: 442px; width: 340px; height: 255px; overflow: visible; }
  .yoyo-v10-routes path { fill: none; stroke: var(--route); stroke-linecap: round; }
  .yoyo-v10-routes .route-glow { stroke-width: 50; opacity: .28; filter: blur(8px); }
  .yoyo-v10-routes .route-glow:nth-of-type(7) { opacity: .36; }
  .yoyo-v10-routes .route-rail { stroke: rgb(255 255 255 / .9); stroke-width: 20; opacity: .74; }
  .yoyo-v10-routes .route-line { stroke-width: 7; stroke-dasharray: 14 10; filter: drop-shadow(0 0 8px color-mix(in srgb, var(--route) 56%, transparent)); }
  .yoyo-v10-pet-note { position: absolute; z-index: 7; left: 462px; top: 420px; margin: 0; color: #6680a5; font-family: "Bradley Hand", "Comic Sans MS", cursive; font-size: 14px; font-weight: 700; line-height: 1.35; transform: rotate(-8deg); }
  .yoyo-v10-pet-note svg { position: absolute; left: 4px; top: 58px; width: 31px; height: 36px; }
  .yoyo-v10-agent { position: absolute; z-index: 5; left: 513px; top: 438px; width: 440px; height: 412px; }
  .yoyo-v10-agent-badge { position: absolute; z-index: 6; left: calc(50% + 18px); top: 0; width: 172px; min-height: 78px; display: grid; place-content: center; box-sizing: border-box; border: 1px solid #afe6f3; border-radius: 999px; background: linear-gradient(180deg, #f5feff, #dff9fd); color: #0d2e5e; text-align: center; box-shadow: 0 8px 20px rgb(39 141 174 / .1); transform: translateX(-50%); }
  .yoyo-v10-agent-badge::after { position: absolute; left: 50%; bottom: -9px; width: 18px; height: 18px; border-right: 1px solid #afe6f3; border-bottom: 1px solid #afe6f3; background: #def8fc; content: ''; transform: translateX(-50%) rotate(45deg); }
  .yoyo-v10-agent-badge strong { position: relative; z-index: 1; font-size: 21px; }
  .yoyo-v10-agent-badge span { position: relative; z-index: 1; margin-top: 4px; color: #518dad; font-size: 12px; }
  .yoyo-v10-agent-art { position: absolute; display: block; object-fit: fill; filter: drop-shadow(0 20px 25px rgb(35 158 196 / .2)); }
  .yoyo-v10-agent-platform-art { z-index: 2; left: -20px; top: 0; width: 480px; height: 405px; clip-path: inset(56% 0 0); filter: saturate(.68) brightness(1.12) contrast(.93) drop-shadow(0 20px 25px rgb(35 158 196 / .16)); transform: translateY(-111px) scaleY(1.37); transform-origin: top center; }
  .yoyo-v10-agent-robot-art { z-index: 3; left: 29px; top: 30px; width: 428px; height: auto; clip-path: inset(0 0 34% 0); }
  .yoyo-v10-pet { position: absolute; z-index: 5; left: -45px; top: 37px; width: 190px; height: 174px; object-fit: fill; filter: drop-shadow(0 13px 14px rgb(40 96 121 / .16)); }
  .yoyo-v10-tools { position: absolute; z-index: 8; left: 76px; top: 262px; display: flex; gap: 39px; }
  .yoyo-v10-tool { position: relative; width: 72px; height: 78px; display: grid; grid-template-rows: 42px 19px; place-items: center; box-sizing: border-box; padding-top: 9px; border: 1px solid #7ed8ee; border-radius: 9px 9px 21px 21px / 8px 8px 13px 13px; background: linear-gradient(90deg, rgb(197 241 252 / .9), rgb(255 255 255 / .98) 48%, rgb(181 233 248 / .88)); color: #087fd1; box-shadow: 0 11px 20px rgb(20 145 190 / .18), inset 11px 0 14px rgb(255 255 255 / .62), inset -10px 0 13px rgb(80 196 229 / .16); }
  .yoyo-v10-tool::before { position: absolute; z-index: 1; left: -1px; right: -1px; top: -8px; height: 16px; border: 1px solid #7ed8ee; border-radius: 50%; background: radial-gradient(ellipse at 50% 26%, #fff 0 32%, #dff9ff 62%, #a5ebf8 100%); box-shadow: inset 0 2px 5px rgb(255 255 255 / .9); content: ''; }
  .yoyo-v10-tool::after { position: absolute; left: 2px; right: 2px; bottom: -2px; height: 15px; border: 1px solid rgb(48 177 216 / .35); border-top: 0; border-radius: 0 0 50% 50%; background: linear-gradient(180deg, transparent, rgb(102 213 238 / .15)); content: ''; }
  .yoyo-v10-tool svg { width: 34px; height: 34px; }
  .yoyo-v10-tool small { font-size: 12px; font-weight: 850; white-space: nowrap; }
  .yoyo-v10-agent-caption { position: absolute; z-index: 8; left: 50%; bottom: 32px; color: #0789ca; font-size: 17px; font-weight: 850; white-space: nowrap; transform: translateX(-50%); }
  .yoyo-v10-reply { position: absolute; z-index: 7; left: 902px; top: 433px; width: 250px; min-height: 268px; box-sizing: border-box; padding: 10px; border: 1px solid #dcebf3; border-radius: 19px; background: rgb(251 254 255 / .96); box-shadow: 0 17px 34px rgb(44 121 153 / .12); transform: perspective(900px) rotateY(-10deg) rotateZ(-6deg); transform-origin: left center; }
  .yoyo-v10-reply::before { position: absolute; z-index: -1; inset: -18px 1px -14px 0; border: 1.5px solid #8edaf0; border-radius: 25px; background: linear-gradient(145deg, rgb(219 243 253 / .98), rgb(246 252 255 / .94)); box-shadow: inset 0 0 0 9px rgb(255 255 255 / .24), 0 18px 38px rgb(35 130 168 / .12); content: ''; }
  .yoyo-v10-reply header { display: flex; align-items: center; justify-content: space-between; color: #075eb9; }
  .yoyo-v10-reply-title { display: inline-flex; align-items: center; gap: 7px; }
  .yoyo-v10-reply-title svg { width: 24px; height: 24px; color: #2485ff; filter: drop-shadow(0 3px 6px rgb(34 132 255 / .2)); }
  .yoyo-v10-reply header strong { font-size: 18px; }
  .yoyo-v10-reply header small { color: #1289df; font-size: 11px; font-weight: 850; }
  .yoyo-v10-reply p { margin: 7px -1px 0; padding: 10px 7px 9px; border-radius: 13px; background: #fff; color: #203b5f; font-family: Arial, sans-serif; font-size: 12.3px; line-height: 1.35; letter-spacing: -.025em; }
  .yoyo-v10-reply footer { display: flex; gap: 8px; margin-top: 7px; }
  .yoyo-v10-reply footer span { flex: 1; padding: 11px 5px; border: 1px solid #d4e5ee; border-radius: 9px; color: #496985; font-size: 12px; font-weight: 800; text-align: center; }
  .yoyo-v10-reply footer span:first-child { border: 0; background: linear-gradient(110deg, #08bde0, #08aaca); color: #fff; }
  .yoyo-v10-input-arrow { position: absolute; z-index: 8; left: 839px; top: 583px; width: 48px; height: 48px; color: #20cce0; filter: drop-shadow(0 0 7px rgb(32 204 224 / .46)); }
  .yoyo-v10-output-arrow { position: absolute; z-index: 8; left: 1139px; top: 582px; width: 48px; height: 48px; color: #ff6fad; filter: drop-shadow(0 0 7px rgb(255 111 173 / .42)); }
  .yoyo-v10-input-arrow path, .yoyo-v10-output-arrow path { fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
  .yoyo-v10-input-arrow circle, .yoyo-v10-output-arrow circle { fill: currentColor; opacity: .9; }
  .yoyo-v10-broadcast { position: absolute; z-index: 7; left: 1215px; top: 371px; width: 260px; }
  .yoyo-v10-broadcast > header { height: 49px; display: flex; align-items: center; gap: 9px; box-sizing: border-box; padding: 7px 15px; border: 1px solid #fff; border-radius: 999px; background: linear-gradient(106deg, #fff 0%, #fff9fc 42%, #fde8f3 100%); box-shadow: 0 13px 30px rgb(157 82 132 / .16), inset 0 1px 0 #fff; }
  .yoyo-v10-broadcast > header svg { width: 42px; height: 42px; flex: 0 0 42px; color: #0c2a56; }
  .yoyo-v10-broadcast > header strong { color: #071f48; font-size: 18.5px; }
  .yoyo-v10-broadcast > header small { margin-left: auto; color: #a96b8d; font-size: 10px; font-weight: 750; }
  .yoyo-v10-broadcast-body { position: relative; height: 246px; display: grid; align-content: center; gap: 5px; margin: 4px 0 0 20px; padding: 11px 14px; box-sizing: border-box; border: 1px solid #fff; border-radius: 21px; background: rgb(255 255 255 / .96); box-shadow: 0 20px 42px rgb(155 86 134 / .14), inset 0 1px 0 #fff; }
  .yoyo-v10-broadcast-body::before { position: absolute; z-index: 0; left: 36px; top: 43px; bottom: 44px; width: 2px; background: linear-gradient(#f2bfd7, #ccecd9 56%, #f5d9a4); content: ''; opacity: .8; }
  .yoyo-v10-broadcast-row { height: 52px; display: grid; grid-template-columns: 45px 1fr; gap: 10px; align-items: center; }
  .yoyo-v10-broadcast-row i { position: relative; z-index: 1; display: grid; width: 44px; height: 44px; place-items: center; border-radius: 50%; background: var(--soft); color: var(--tone); box-shadow: inset 0 1px 0 rgb(255 255 255 / .86); }
  .yoyo-v10-broadcast-row i svg { width: 25px; height: 25px; }
  .yoyo-v10-broadcast-row span strong { display: block; color: #0d284d; font-size: 16px; line-height: 1.12; }
  .yoyo-v10-broadcast-row span small { display: block; margin-top: 3px; color: #5c7492; font-size: 11px; line-height: 1.2; }
  .yoyo-v10-broadcast-track { position: absolute; z-index: 0; left: -50px; top: 13px; width: 70px; height: 430px; overflow: visible; }
  .yoyo-v10-broadcast-track > path { fill: none; stroke: #ff6fad; stroke-width: 3; stroke-linecap: round; stroke-dasharray: 6 7; marker-start: url(#v10-broadcast-arrow); marker-end: url(#v10-broadcast-arrow); }
  .yoyo-v10-broadcast-node { position: absolute; z-index: 3; left: -37px; top: 193px; display: grid; width: 62px; height: 62px; place-items: center; border: 5px solid rgb(255 255 255 / .96); border-radius: 50%; background: linear-gradient(145deg, #ff91c4, #f4539a); box-shadow: 0 12px 25px rgb(231 85 151 / .32), 0 0 22px rgb(255 111 173 / .24); color: #fff; }
  .yoyo-v10-broadcast-node svg { width: 34px; height: 34px; }
  .yoyo-v10-broadcast > header, .yoyo-v10-broadcast-body, .yoyo-v10-people, .yoyo-v10-warm-note { position: relative; z-index: 1; }
  .yoyo-v10-people { position: relative; display: grid; gap: 4px; margin: 15px 0 0 20px; }
  .yoyo-v10-people::after { position: absolute; z-index: -1; left: 164px; top: 2px; width: 76px; height: 116px; background: radial-gradient(circle, #e7f0f7 0 10px, transparent 11px) 0 0 / 30px 40px; content: ''; opacity: .78; }
  .yoyo-v10-person { position: relative; width: 160px; height: 40px; display: flex; align-items: center; gap: 9px; box-sizing: border-box; padding: 3px 11px 3px 4px; border-radius: 999px; background: rgb(255 255 255 / .98); box-shadow: 0 8px 20px rgb(47 100 128 / .1); }
  .yoyo-v10-person img { width: 32px; height: 32px; border: 2px solid #fff; border-radius: 50%; object-fit: cover; box-shadow: 0 2px 6px rgb(42 86 118 / .14); }
  .yoyo-v10-person span { position: relative; width: 84px; height: 6px; border-radius: 999px; background: linear-gradient(90deg, #c3d1df 0 62%, #edf2f7 62%); }
  .yoyo-v10-person span::after { position: absolute; left: 0; top: 11px; width: 66px; height: 5px; border-radius: 999px; background: #d7e1ea; content: ''; }
  .yoyo-v10-person::after { position: absolute; left: calc(100% + 15px); top: 50%; width: 12px; height: 12px; border-radius: 50%; background: var(--state); content: ''; transform: translateY(-50%); }
  .yoyo-v10-warm-note { position: absolute; left: 132px; top: 414px; margin: 0; color: #e06f9f; font-family: "Bradley Hand", "Comic Sans MS", cursive; font-size: 16px; font-style: italic; line-height: 1.18; transform: rotate(-7deg); }
  .yoyo-v10-city { position: absolute; z-index: 1; left: 0; right: 0; bottom: -22px; height: 455px; overflow: hidden; background: radial-gradient(ellipse at 71% 71%, rgb(247 159 208 / .16), transparent 34%), radial-gradient(ellipse at 34% 94%, rgb(74 191 233 / .23), transparent 60%); }
  .yoyo-v10-city::before { position: absolute; inset: 41% -4% -24%; background: radial-gradient(circle, rgb(75 187 224 / .46) 0 1.05px, transparent 1.4px) 0 0 / 7px 7px; clip-path: ellipse(69% 66% at 50% 100%); content: ''; opacity: .47; }
  .yoyo-v10-city svg { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; }
  .yoyo-v10-landmarks-real { position: absolute; z-index: 2; left: 0; top: -125px; width: 100%; height: auto; opacity: .58; filter: saturate(.58) brightness(1.12); pointer-events: none; }
  .yoyo-v10-city .skyline { fill: #aee7f3; opacity: .65; }
  .yoyo-v10-city .skyline-far { fill: none; stroke: #b9f1f6; stroke-width: 7; stroke-linecap: round; opacity: .52; }
  .yoyo-v10-city .landmark { opacity: 1; transform: translateY(24px); transform-box: view-box; }
  .yoyo-v10-city .landmark-real { opacity: .86; filter: url(#v10-landmark-tint) drop-shadow(0 5px 6px rgb(34 137 174 / .18)); }
  .yoyo-v10-city .landmark-coded { color: #63bdd5; fill: #63bdd5; opacity: .88; filter: drop-shadow(0 4px 5px rgb(34 137 174 / .14)); }
  .yoyo-v10-city symbol { color: #79c9df; }
  .yoyo-v10-city symbol path:not(.landmark-detail):not(.landmark-line), .yoyo-v10-city symbol circle:not(.landmark-detail) { fill: #63bdd5; }
  .yoyo-v10-city .landmark-detail { fill: #f3fdff; opacity: .96; }
  .yoyo-v10-city .landmark-line { fill: none; stroke: #55bad1; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
  .yoyo-v10-city .landmark-window { fill: #e8faff; opacity: .8; }
  .yoyo-v10-city .target-orbit { fill: none; stroke: #86d7e8; stroke-width: 1.8; opacity: .58; }
  .yoyo-v10-city .target-orbit.dotted { stroke: #55c4dd; stroke-width: 1.35; stroke-dasharray: 4 7; opacity: .48; }
  .yoyo-v10-city .target-orbit.faint { stroke: #b9eaf3; stroke-width: 1; opacity: .54; }
  .yoyo-v10-city .world-dot-map { fill: url(#v10-world-dot-pattern); opacity: .52; }
  .yoyo-v10-city .globe-fill { fill: url(#v10-globe-fill); opacity: .8; }
  .yoyo-v10-city .globe-fill, .yoyo-v10-city .globe-depth, .yoyo-v10-city .globe-surface, .yoyo-v10-city .globe-inner-rim, .yoyo-v10-city .globe-rim-glow, .yoyo-v10-city .globe-rim { transform: translateY(220px) scaleY(.32); transform-box: view-box; transform-origin: 50% 20px; }
  .yoyo-v10-city .globe-rim { fill: none; stroke: #50bee0; stroke-width: 2.8; opacity: .78; }
  .yoyo-v10-city .globe-rim-glow { fill: none; stroke: #f2fdff; stroke-width: 18; opacity: .88; filter: drop-shadow(0 0 10px rgb(47 180 223 / .48)); }
  .yoyo-v10-city .globe-inner-rim { fill: none; stroke: #a5e9f7; stroke-width: 1.8; opacity: .64; }
  .yoyo-v10-city .globe-grid { fill: none; stroke: #eefcff; stroke-width: 1.05; stroke-dasharray: 3 7; opacity: .34; }
  .yoyo-v10-city .globe-land { fill: #88cee9; stroke: #f2fdff; stroke-width: .7; opacity: .29; filter: drop-shadow(0 2px 2px rgb(28 126 170 / .06)); }
  .yoyo-v10-city .globe-depth { fill: url(#v10-globe-depth); opacity: .56; pointer-events: none; }
  .yoyo-v10-city .globe-specular { fill: url(#v10-globe-specular); opacity: .72; pointer-events: none; }
  .yoyo-v10-city .land { fill: #bdebf5; opacity: .58; }
  .yoyo-v10-city .route { fill: none; stroke: #43bdd9; stroke-width: 1.8; stroke-dasharray: 5 6; opacity: .72; }
  .yoyo-v10-city .route.faint { stroke-width: 1; stroke-dasharray: 2 6; opacity: .34; }
  .yoyo-v10-city .pin { fill: #42c4df; stroke: #fff; stroke-width: 3; }
  .yoyo-v10-city .pin.pink { fill: #f477b5; }
  .yoyo-v10-city .pin-core { fill: #fff; }
  .yoyo-v10-client-peek { position: absolute; z-index: 4; left: 166px; top: 855px; width: 1175px; height: 500px; overflow: hidden; border: 1px solid #cbe2ee; border-radius: 23px 23px 0 0; background: #f9fcff; box-shadow: 0 -14px 42px rgb(43 102 132 / .15); }
  .yoyo-v10-client-top { position: relative; height: 44px; display: grid; grid-template-columns: 150px 1fr auto; align-items: center; padding: 0 24px; border-bottom: 1px solid #e2eaf1; background: #fff; color: #16365d; }
  .yoyo-v10-client-brand { display: flex; align-items: center; gap: 8px; font-size: 13px; }
  .yoyo-v10-client-brand img { width: 27px; height: 27px; border-radius: 9px; }
  .yoyo-v10-client-top h2 { margin: 0; font-size: 16px; }
  .yoyo-v10-client-pet { position: absolute; z-index: 2; left: 288px; top: -1px; width: 58px; height: 58px; filter: drop-shadow(0 6px 7px rgb(74 54 45 / .19)); }
  .yoyo-v10-client-status { display: flex; gap: 7px; white-space: nowrap; }
  .yoyo-v10-client-status span { min-width: 36px; box-sizing: border-box; padding: 6px 8px; border: 1px solid #dce8f0; border-radius: 999px; background: #f7fbff; color: #557087; font-size: 8px; text-align: center; }
  .yoyo-v10-client-status span:nth-child(1), .yoyo-v10-client-status span:nth-child(2) { min-width: 95px; }
  .yoyo-v10-client-status span:nth-child(4) { min-width: 235px; }
  .yoyo-v10-client-status span:nth-child(5) { min-width: 74px; }
  .yoyo-v10-client-status span:nth-child(6) { min-width: 54px; }
  .yoyo-v10-client-status .on { background: #e9fbf2; color: #21825e; }
  .yoyo-v10-client-body { height: calc(100% - 44px); display: grid; grid-template-columns: 150px 245px minmax(0,1fr) 236px; }
  .yoyo-v10-client-rail { display: grid; align-content: start; gap: 7px; padding: 13px 11px; border-right: 1px solid #e4ecf3; background: #f7faff; color: #526d89; font-size: 10px; }
  .yoyo-v10-client-rail strong { color: #087dc0; }
  .yoyo-v10-client-list { padding: 12px; border-right: 1px solid #e1e9f1; background: #fff; }
  .yoyo-v10-client-list header { display: flex; justify-content: space-between; font-size: 11px; }
  .yoyo-v10-client-search { margin-top: 9px; padding: 8px 10px; border: 1px solid #dce8f0; border-radius: 10px; color: #91a4b6; font-size: 9px; }
  .yoyo-v10-client-tabs { display: flex; gap: 4px; margin: 8px 0; }
  .yoyo-v10-client-tabs span { flex: 1; padding: 5px; border-radius: 8px; background: #eef3f8; color: #6e8296; font-size: 8px; text-align: center; }
  .yoyo-v10-client-tabs span:first-child { background: #337ff4; color: #fff; }
  .yoyo-v10-client-contact { display: grid; grid-template-columns: 29px 1fr auto; gap: 7px; align-items: center; padding: 7px 5px; border-radius: 9px; font-size: 8px; }
  .yoyo-v10-client-contact.active { background: #eaf3ff; box-shadow: inset 3px 0 #337ff4; }
  .yoyo-v10-client-contact img { width: 29px; height: 29px; border-radius: 50%; object-fit: cover; }
  .yoyo-v10-client-contact span small { display: block; margin-top: 2px; color: #75899e; }
  .yoyo-v10-client-contact time { color: #8da0b4; font-size: 7px; }
  .yoyo-v10-client-chat { background: linear-gradient(145deg, #f8faf4, #eff5ec); }
  .yoyo-v10-client-chat header { height: 42px; display: flex; align-items: center; justify-content: space-between; padding: 0 12px; border-bottom: 1px solid #e2e9ed; background: #fff; font-size: 10px; }
  .yoyo-v10-client-messages { padding: 14px; }
  .yoyo-v10-client-bubble { width: 62%; margin-bottom: 10px; padding: 9px 10px; border-radius: 11px; background: #fff; color: #344d65; font-size: 9px; line-height: 1.4; box-shadow: 0 4px 12px rgb(39 83 106 / .08); }
  .yoyo-v10-client-bubble.reply { margin-left: auto; background: #def7c8; }
  .yoyo-v10-client-ai { padding: 12px; border-left: 1px solid #e1e9f1; background: #fff; color: #27445f; }
  .yoyo-v10-client-ai header { display: flex; justify-content: space-between; font-size: 11px; }
  .yoyo-v10-client-ai header small { padding: 3px 7px; border-radius: 999px; background: #eaf9ed; color: #32864a; font-size: 7px; }
  .yoyo-v10-client-ai-contact { margin-top: 3px; color: #7890a6; font-size: 8px; }
  .yoyo-v10-client-ai-mode { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 10px; padding-bottom: 9px; border-bottom: 1px solid #e5edf3; }
  .yoyo-v10-client-ai-mode > span { color: #8392a3; font-size: 7px; }
  .yoyo-v10-client-ai-mode strong { display: block; margin-top: 2px; color: #173856; font-size: 11px; }
  .yoyo-v10-client-ai-actions { display: grid; gap: 4px; }
  .yoyo-v10-client-ai-actions span { min-width: 79px; padding: 4px 7px; border: 1px solid #9ec4fa; border-radius: 999px; color: #2976df; font-size: 7px; font-weight: 750; text-align: center; }
  .yoyo-v10-client-ai h3 { margin: 8px 0 0; font-size: 11px; }
  .yoyo-v10-client-score { display: grid; width: 48px; height: 48px; margin: 13px auto; place-items: center; border: 5px solid #40ba6c; border-radius: 50%; color: #24864e; font-size: 11px; }
  .yoyo-v10-client-ai p { color: #6b8094; font-size: 8px; line-height: 1.8; }
  @media (max-width: 760px) {
    .official-site:not([data-review-block]) .yoyo-v10-home { height: auto; min-height: 0; overflow: hidden; padding: 24px 16px 64px; }
    .official-site:not([data-review-block]) .yoyo-v10-canvas { position: relative; left: auto; width: 100%; height: auto; display: flex; flex-direction: column; gap: 18px; transform: none; overflow: visible; }
    .official-site:not([data-review-block]) .yoyo-v10-canvas::after { display: none; }
    .official-site:not([data-review-block]) :is(.yoyo-v10-copy, .yoyo-v10-note, .yoyo-v10-channels, .yoyo-v10-routes, .yoyo-v10-pet-note, .yoyo-v10-agent, .yoyo-v10-reply, .yoyo-v10-input-arrow, .yoyo-v10-output-arrow, .yoyo-v10-broadcast, .yoyo-v10-city, .yoyo-v10-client-peek) { position: relative; inset: auto; left: auto; right: auto; top: auto; bottom: auto; width: auto; height: auto; transform: none; }
    .official-site:not([data-review-block]) .yoyo-v10-copy { order: 1; padding-top: 62px; }
    .official-site:not([data-review-block]) .yoyo-v10-copy h1 { font-size: clamp(39px, 11vw, 56px); line-height: 1.04; }
    .official-site:not([data-review-block]) .yoyo-v10-copy h1 span { white-space: normal; }
    .official-site:not([data-review-block]) .yoyo-v10-copy h1 .line-two { margin-top: 12px; font-size: inherit; }
    .official-site:not([data-review-block]) .yoyo-v10-copy h1 .line-two::after, .official-site:not([data-review-block]) .yoyo-v10-note { display: none; }
    .official-site:not([data-review-block]) .yoyo-v10-copy > p { font-size: 15px; line-height: 1.65; }
    .official-site:not([data-review-block]) .yoyo-v10-copy > p span { display: inline; white-space: normal; }
    .official-site:not([data-review-block]) .yoyo-v10-actions { flex-direction: column; }
    .official-site:not([data-review-block]) .yoyo-v10-action { width: 100%; }
    .official-site:not([data-review-block]) .yoyo-v10-channels { order: 2; display: grid; gap: 12px; }
    .official-site:not([data-review-block]) .yoyo-v10-channel { position: relative; top: auto !important; width: 100%; height: 92px; transform: none; }
    .official-site:not([data-review-block]) .yoyo-v10-channel::before, .official-site:not([data-review-block]) .yoyo-v10-channel::after, .official-site:not([data-review-block]) .yoyo-v10-routes, .official-site:not([data-review-block]) .yoyo-v10-input-arrow, .official-site:not([data-review-block]) .yoyo-v10-output-arrow { display: none; }
    .official-site:not([data-review-block]) .yoyo-v10-agent { order: 3; width: 100%; height: 390px; }
    .official-site:not([data-review-block]) .yoyo-v10-agent-badge { top: 0; }
    .official-site:not([data-review-block]) .yoyo-v10-agent-platform-art { left: 50%; top: 6px; width: min(470px, 118%); height: auto; transform: translateX(-50%); }
    .official-site:not([data-review-block]) .yoyo-v10-agent-robot-art { left: 50%; top: 48px; width: min(410px, 104%); transform: translateX(-50%); }
    .official-site:not([data-review-block]) .yoyo-v10-pet { left: 0; top: 93px; width: 34vw; height: 27vw; }
    .official-site:not([data-review-block]) .yoyo-v10-tools { left: 50%; top: 265px; gap: 16px; transform: translateX(-50%); }
    .official-site:not([data-review-block]) .yoyo-v10-agent-caption { bottom: 0; }
    .official-site:not([data-review-block]) .yoyo-v10-reply { order: 4; width: calc(100% - 34px); margin: 18px auto 0; transform: rotate(-2deg); }
    .official-site:not([data-review-block]) .yoyo-v10-broadcast { order: 5; width: 100%; }
    .official-site:not([data-review-block]) .yoyo-v10-broadcast-track, .official-site:not([data-review-block]) .yoyo-v10-broadcast-node { display: none; }
    .official-site:not([data-review-block]) .yoyo-v10-broadcast-body { margin-left: 0; }
    .official-site:not([data-review-block]) .yoyo-v10-people { margin-left: 12px; }
    .official-site:not([data-review-block]) .yoyo-v10-city { order: 6; display: block; min-height: 180px; }
    .official-site:not([data-review-block]) .yoyo-v10-client-peek { order: 7; width: 100%; min-height: 360px; border-radius: 18px; }
    .official-site:not([data-review-block]) .yoyo-v10-client-top { grid-template-columns: 1fr auto; }
    .official-site:not([data-review-block]) .yoyo-v10-client-top h2, .official-site:not([data-review-block]) .yoyo-v10-client-status { display: none; }
    .official-site:not([data-review-block]) .yoyo-v10-client-body { grid-template-columns: 42% 58%; }
    .official-site:not([data-review-block]) .yoyo-v10-client-rail, .official-site:not([data-review-block]) .yoyo-v10-client-ai { display: none; }
  }
  @media (max-width: 760px) {
    .official-site:not([data-review-block]) .official-brand-tagline { display: none; }
    .official-site:not([data-review-block]) .official-language { margin-left: auto; }
    .official-site:not([data-review-block]) .official-mobile-menu { margin-left: 0; }
  }
  @media (max-width: 420px) {
    .official-language > summary { gap: 5px; padding-inline: 8px; }
    .official-language-full { display: none; }
    .official-language-short { display: inline; }
  }
  .official-site[data-review-block="nav"] {
    min-height: 100vh;
    background:
      radial-gradient(circle at 18% 18%, rgb(76 205 236 / .08), transparent 30%),
      radial-gradient(circle at 82% 22%, rgb(241 164 205 / .07), transparent 31%),
      #f8fdff;
  }
  .official-site[data-review-block="nav"] main,
  .official-site[data-review-block="nav"] .official-footer,
  .official-site[data-review-block="nav"] .official-skip-link { display: none; }
  .official-site[data-review-block="nav"] .official-header { position: fixed; }
  .official-site[data-review-block="nav"] .official-nav { transition: none; }
  .official-site[data-review-block]:not([data-review-block="nav"]) .official-footer,
  .official-site[data-review-block]:not([data-review-block="nav"]) .official-skip-link { display: none; }
  .official-site[data-review-block]:not([data-review-block="nav"]) .yoyo-v10-home { min-height: 0; padding: 0; overflow: hidden; }
  .official-site[data-review-block]:not([data-review-block="nav"]) .yoyo-v10-canvas { position: absolute; top: var(--v10-top-offset, 0px); left: 50%; width: 1506px; height: 1045px; display: block; gap: 0; overflow: hidden; transform: translateX(-50%) scale(var(--v10-scale, 1)); }
  .official-site[data-review-block]:not([data-review-block="nav"]) .yoyo-v10-canvas::after { display: block; }
  .official-site[data-review-block]:not([data-review-block="nav"]) .yoyo-v10-background { position: absolute; inset: 0; width: auto; height: auto; }
  .official-site[data-review-block]:not([data-review-block="nav"]) .yoyo-v10-city { position: absolute; inset: auto 0 -22px; width: auto; height: 455px; min-height: 0; }
  .official-site[data-review-block]:not([data-review-block="nav"]) .yoyo-v10-copy { position: absolute; z-index: 10; inset: auto; top: 85px; left: 50%; width: 1000px; height: auto; padding: 0; text-align: center; transform: translateX(-50%); }
  .official-site[data-review-block]:not([data-review-block="nav"]) .yoyo-v10-copy h1 { font-size: 70px; line-height: 1.18; }
  .official-site[data-review-block]:not([data-review-block="nav"]) .yoyo-v10-copy h1 span { display: block; white-space: nowrap; }
  .official-site[data-review-block]:not([data-review-block="nav"]) .yoyo-v10-copy h1 .line-two { margin-top: 0; font-size: 66px; }
  .official-site[data-review-block]:not([data-review-block="nav"]) .yoyo-v10-copy h1 .line-two::after { display: block; }
  .official-site[data-review-block]:not([data-review-block="nav"]) .yoyo-v10-copy > p { font-size: 19px; line-height: 1.42; }
  .official-site[data-review-block]:not([data-review-block="nav"]) .yoyo-v10-copy > p span { display: block; white-space: nowrap; }
  .official-site[data-review-block]:not([data-review-block="nav"]) .yoyo-v10-actions { flex-direction: row; }
  .official-site[data-review-block]:not([data-review-block="nav"]) .yoyo-v10-action { width: auto; }
  .official-site[data-review-block]:not([data-review-block="nav"]) .yoyo-v10-reply { position: absolute; inset: auto; left: 902px; top: 433px; width: 250px; margin: 0; transform: perspective(900px) rotateY(-10deg) rotateZ(-6deg); transform-origin: left center; }
  .official-site[data-review-block]:not([data-review-block="nav"]) :is(.yoyo-v10-copy, .yoyo-v10-channels, .yoyo-v10-details, .yoyo-v10-agent, .yoyo-v10-reply, .yoyo-v10-broadcast, .yoyo-v10-client-peek) { visibility: hidden; }
  .official-site:is([data-review-block="copy"], [data-review-block="channels"], [data-review-block="agent"], [data-review-block="reply"], [data-review-block="broadcast"], [data-review-block="details"], [data-review-block="client"]) .yoyo-v10-copy { visibility: visible !important; }
  .official-site:is([data-review-block="channels"], [data-review-block="agent"], [data-review-block="reply"], [data-review-block="broadcast"], [data-review-block="details"], [data-review-block="client"]) .yoyo-v10-channels { visibility: visible !important; }
  .official-site:is([data-review-block="agent"], [data-review-block="reply"], [data-review-block="broadcast"], [data-review-block="details"], [data-review-block="client"]) .yoyo-v10-agent { visibility: visible !important; }
  .official-site:is([data-review-block="reply"], [data-review-block="broadcast"], [data-review-block="details"], [data-review-block="client"]) .yoyo-v10-reply { visibility: visible !important; }
  .official-site:is([data-review-block="broadcast"], [data-review-block="details"], [data-review-block="client"]) .yoyo-v10-broadcast { visibility: visible !important; }
  .official-site:is([data-review-block="agent"], [data-review-block="reply"], [data-review-block="broadcast"], [data-review-block="details"], [data-review-block="client"]) .yoyo-v10-details { visibility: visible !important; }
  .official-site[data-review-block="agent"] :is(.yoyo-v10-input-arrow, .yoyo-v10-output-arrow),
  .official-site[data-review-block="reply"] .yoyo-v10-output-arrow { visibility: hidden !important; }
  .official-site[data-review-block="client"] .yoyo-v10-client-peek { visibility: visible !important; }
  .yoyo-journey {
    --journey-navy:#071b45;
    --journey-blue:#168fe4;
    --journey-cyan:#20c9e6;
    --journey-pink:#f66eae;
    --journey-mint:#43d69a;
    --journey-ice:#edfaff;
    position: relative;
    isolation: isolate;
    overflow: hidden;
    margin-top: -150px;
    padding: 140px 0 120px;
    background: linear-gradient(180deg, rgb(237 250 255 / 0) 0, rgb(237 250 255 / .22) 88px, #edfaff 174px, #f9fdff 28%, #fff9fd 48%, #eefaff 72%, #f8fdff 100%);
    color: var(--journey-navy);
  }
  .yoyo-journey::before { position: absolute; z-index: -1; top: 84px; left: 0; width: 100%; height: 220px; background: linear-gradient(180deg, rgb(237 250 255 / 0), rgb(237 250 255 / .78) 48%, #edfaff 100%); content: ''; pointer-events: none; }
  .yoyo-journey::after { position: absolute; z-index: -1; inset: 0; background-image: radial-gradient(circle, rgb(40 172 209 / .22) 1px, transparent 1.5px); background-position: 18px 18px; background-size: 26px 26px; content: ''; opacity: .14; mask-image: linear-gradient(180deg, transparent 0, transparent 20%, #000 28%, transparent 78%, #000); pointer-events: none; }
  .yoyo-journey-seam { position: absolute; z-index: 0; top: 18px; left: 0; width: 100%; height: 170px; pointer-events: none; }
  .yoyo-journey-seam::after { position: absolute; top: 37px; bottom: -4px; left: 50%; border-left: 2px dashed rgb(70 194 226 / .72); content: ''; transform: translateX(-50%); }
  .yoyo-journey-seam svg { width: 100%; height: 100%; overflow: visible; }
  .yoyo-journey-seam .seam-glow { fill: none; stroke: rgb(99 210 237 / .22); stroke-width: 13; filter: blur(8px); }
  .yoyo-journey-seam .seam-rail { fill: none; stroke: rgb(255 255 255 / .94); stroke-width: 3; }
  .yoyo-journey-seam .seam-flow { fill: none; stroke: #53c9e5; stroke-width: 2; stroke-linecap: round; stroke-dasharray: 3 12; animation: yoyo-journey-flow 7s linear infinite; }
  .yoyo-journey-wrap { position: relative; width: min(1220px, calc(100% - 48px)); margin: 0 auto; }
  .yoyo-journey-intro { position: relative; z-index: 2; width: min(780px, 100%); margin: 0 auto 48px; text-align: center; }
  .yoyo-journey-kicker { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 16px; padding: 7px 13px; border: 1px solid rgb(45 172 211 / .22); border-radius: 999px; background: rgb(255 255 255 / .78); color: #168bbd; font-size: 13px; font-weight: 850; box-shadow: 0 10px 24px rgb(31 141 181 / .08); }
  .yoyo-journey-kicker::before { width: 8px; height: 8px; border-radius: 50%; background: linear-gradient(135deg, var(--journey-cyan), var(--journey-pink)); box-shadow: 0 0 0 5px rgb(32 201 230 / .11); content: ''; }
  .yoyo-journey-intro h2 { max-width: 740px; margin: 0 auto; font-size: clamp(42px, 5.2vw, 70px); line-height: 1.03; letter-spacing: -.055em; }
  .yoyo-journey-intro h2 em { color: var(--journey-cyan); font-style: normal; }
  .yoyo-journey-intro > p:last-child { max-width: 670px; margin: 22px auto 0; color: #47627c; font-size: 17px; line-height: 1.75; }
  .yoyo-journey-track { position: absolute; z-index: -1; top: 220px; bottom: 190px; left: 50%; width: 220px; transform: translateX(-50%); pointer-events: none; }
  .yoyo-journey-track::before { position: absolute; top: 0; bottom: 0; left: 50%; width: 22px; border-radius: 999px; background: linear-gradient(180deg, rgb(32 201 230 / .2), rgb(88 143 239 / .13) 38%, rgb(246 110 174 / .18) 72%, rgb(67 214 154 / .13)); filter: blur(12px); content: ''; transform: translateX(-50%); }
  .yoyo-journey-track svg { width: 100%; height: 100%; overflow: visible; }
  .yoyo-journey-track path { fill: none; stroke-linecap: round; }
  .yoyo-journey-track .rail { stroke: rgb(255 255 255 / .92); stroke-width: 10; filter: drop-shadow(0 0 8px rgb(29 180 219 / .2)); }
  .yoyo-journey-track .flow { stroke: url(#journey-gradient); stroke-width: 3; stroke-dasharray: 4 11; animation: yoyo-journey-flow 7s linear infinite; }
  .yoyo-journey-list { position: relative; z-index: 1; display: grid; gap: 34px; }
  .yoyo-journey-card { --journey-accent:var(--journey-cyan); --journey-card-p1:#dcebf1; --journey-card-p2:#a8d3df; --journey-card-p3:#edc7d3; --journey-card-p4:#e9d3ad; position: relative; display: grid; grid-template-columns: minmax(270px, .77fr) minmax(0, 1.23fr); gap: 30px; align-items: stretch; min-height: 510px; padding: 30px; border: 1px solid color-mix(in srgb, var(--journey-card-p2) 46%, white); border-radius: 42px; background: linear-gradient(135deg, color-mix(in srgb, var(--journey-card-p1) 58%, white) 0%, color-mix(in srgb, var(--journey-card-p2) 36%, white) 31%, color-mix(in srgb, var(--journey-card-p3) 38%, white) 67%, color-mix(in srgb, var(--journey-card-p4) 32%, white) 100%); box-shadow: 0 32px 70px rgb(37 119 157 / .12), inset 0 1px rgb(255 255 255 / .95); transform: translateX(-28px); }
  .yoyo-journey-card.official-reveal-in { animation: none; }
  .yoyo-journey-card:not([data-performance-active]) .yoyo-voice-wave i { animation-play-state: paused; }
  .yoyo-journey-card:nth-child(even) { grid-template-columns: minmax(0, 1.23fr) minmax(270px, .77fr); transform: translateX(28px); }
  .yoyo-journey-card:nth-child(even) .yoyo-journey-copy { order: 2; }
  .yoyo-journey-card:nth-child(even) .yoyo-journey-stage { order: 1; }
  .yoyo-journey-card[data-tone="blue"] { --journey-accent:#318eee; }
  .yoyo-journey-card[data-tone="pink"] { --journey-accent:var(--journey-pink); }
  .yoyo-journey-card[data-tone="mint"] { --journey-accent:var(--journey-mint); }
  .yoyo-journey-card[data-skin="coast"] { --journey-card-p1:#dce9ee; --journey-card-p2:#84becb; --journey-card-p3:#b9b4dc; --journey-card-p4:#719eae; }
  .yoyo-journey-card[data-skin="aurora"] { --journey-card-p1:#eee4ef; --journey-card-p2:#c9afd0; --journey-card-p3:#d8cce7; --journey-card-p4:#aebed8; }
  .yoyo-journey-card[data-skin="sage"] { --journey-card-p1:#e5edef; --journey-card-p2:#96b5bd; --journey-card-p3:#f0dcc1; --journey-card-p4:#c49f78; }
  .yoyo-journey-card[data-skin="twilight"] { --journey-card-p1:#d9e4ea; --journey-card-p2:#7f9fb2; --journey-card-p3:#e8b9af; --journey-card-p4:#667f9d; }
  .yoyo-journey-card[data-skin="indigo"] { --journey-card-p1:#f9e8e6; --journey-card-p2:#eab8c3; --journey-card-p3:#e8d9ee; --journey-card-p4:#d8a7b7; }
  .yoyo-journey-card[data-skin="banking"] { --journey-card-p1:#f7d9dc; --journey-card-p2:#de91b1; --journey-card-p3:#9ccfca; --journey-card-p4:#beb3df; }
  .yoyo-journey-card + .yoyo-journey-card { margin-top: -4px; }
  .yoyo-journey-card::before { position: absolute; top: 50%; width: 50px; height: 2px; background: linear-gradient(90deg, transparent, var(--journey-accent)); content: ''; opacity: .65; }
  .yoyo-journey-card:nth-child(odd)::before { right: -51px; }
  .yoyo-journey-card:nth-child(even)::before { left: -51px; transform: rotate(180deg); }
  .yoyo-journey-card::after { position: absolute; top: calc(50% - 8px); width: 14px; height: 14px; border: 2px solid #fff; border-radius: 50%; background: var(--journey-accent); box-shadow: 0 0 0 7px color-mix(in srgb, var(--journey-accent) 15%, transparent), 0 0 22px color-mix(in srgb, var(--journey-accent) 42%, transparent); content: ''; }
  .yoyo-journey-card:nth-child(odd)::after { right: -61px; }
  .yoyo-journey-card:nth-child(even)::after { left: -61px; }
  .yoyo-journey-copy { position: relative; display: flex; flex-direction: column; padding: 12px 2px 6px; }
  .yoyo-journey-meta { display: flex; align-items: center; gap: 10px; }
  .yoyo-journey-index { display: inline-grid; width: 38px; height: 38px; place-items: center; border: 1px solid color-mix(in srgb, var(--journey-accent) 42%, white); border-radius: 13px; background: color-mix(in srgb, var(--journey-accent) 10%, white); color: var(--journey-accent); font: 850 12px/1 ui-monospace, SFMono-Regular, Menlo, monospace; }
  .yoyo-journey-state { padding: 6px 10px; border-radius: 999px; background: color-mix(in srgb, var(--journey-accent) 10%, white); color: color-mix(in srgb, var(--journey-accent) 78%, #17355f); font-size: 12px; font-weight: 820; }
  .yoyo-journey-copy h3 { margin: 22px 0 14px; font-size: clamp(35px, 3.5vw, 52px); line-height: 1.02; letter-spacing: -.045em; }
  .yoyo-journey-copy > p { margin: 0; color: #48647c; font-size: 16px; line-height: 1.72; }
  .yoyo-journey-points { display: grid; gap: 9px; margin: 20px 0 0; padding: 0; list-style: none; }
  .yoyo-journey-points li { display: flex; gap: 9px; align-items: flex-start; color: #304e6b; font-size: 13px; line-height: 1.55; }
  .yoyo-journey-points li::before { flex: 0 0 auto; width: 7px; height: 7px; margin-top: 7px; border-radius: 50%; background: var(--journey-accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--journey-accent) 12%, transparent); content: ''; }
  .yoyo-journey-pet { position: relative; min-height: 145px; margin: auto 0 0; padding: 18px 8px 14px 16px; border: 1px solid rgb(255 255 255 / .86); border-radius: 24px; background: rgb(255 255 255 / .57); box-shadow: inset 0 1px rgb(255 255 255 / .9); }
  .yoyo-journey-pet figcaption { width: calc(100% - 130px); }
  .yoyo-journey-pet img { position: absolute; right: 4px; bottom: -3px; width: 126px; height: 126px; object-fit: contain; filter: drop-shadow(0 13px 16px rgb(49 102 133 / .15)); }
  .yoyo-journey-pet figcaption strong { display: block; color: var(--journey-navy); font-size: 14px; }
  .yoyo-journey-pet figcaption span { display: block; margin-top: 6px; color: #64809a; font-size: 12px; line-height: 1.55; }
  .yoyo-journey-pet.is-error .official-pet-error { display: grid; inset: auto 8px 10px auto; width: 112px; min-height: 38px; padding: 7px 9px; border-radius: 12px; background: rgb(255 255 255 / .88); color: #627b92; font-size: 11px; line-height: 1.35; }
  .yoyo-journey-stage { position: relative; min-width: 0; overflow: hidden; padding: 20px; border: 1px solid rgb(255 255 255 / .94); border-radius: 32px; background: rgb(255 255 255 / .74); box-shadow: inset 0 1px rgb(255 255 255 / .92), 0 20px 42px rgb(52 117 151 / .09); }
  .yoyo-journey-stage::before { position: absolute; top: -80px; right: -70px; width: 210px; height: 210px; border-radius: 50%; background: color-mix(in srgb, var(--journey-accent) 22%, transparent); filter: blur(40px); content: ''; pointer-events: none; }
  .yoyo-journey-stage-head { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 15px; color: #1d4568; font-size: 12px; font-weight: 780; }
  .yoyo-journey-stage-head span:last-child { padding: 5px 9px; border-radius: 999px; background: color-mix(in srgb, var(--journey-accent) 9%, white); color: var(--journey-accent); }
  .yoyo-journey-tabs { position: relative; z-index: 1; display: flex; gap: 7px; overflow-x: auto; padding: 2px 2px 9px; scrollbar-width: none; }
  .yoyo-journey-tabs::-webkit-scrollbar { display: none; }
  .yoyo-journey-tab { min-height: 38px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid #d8e8f1; border-radius: 12px; padding: 7px 11px; background: rgb(255 255 255 / .74); color: #55718a; font-size: 12px; font-weight: 760; white-space: nowrap; cursor: pointer; }
  .yoyo-journey-tab img { width: 22px; height: 22px; object-fit: contain; }
  .yoyo-journey-tab[aria-selected="true"] { border-color: color-mix(in srgb, var(--journey-accent) 48%, white); background: color-mix(in srgb, var(--journey-accent) 10%, white); color: color-mix(in srgb, var(--journey-accent) 70%, #123b66); box-shadow: 0 7px 18px color-mix(in srgb, var(--journey-accent) 12%, transparent); }
  .yoyo-journey-tab:focus-visible, .yoyo-memory-input:focus-visible, .yoyo-memory-action:focus-visible, .yoyo-journey-voice-button:focus-visible { outline: 3px solid color-mix(in srgb, var(--journey-accent) 28%, transparent); outline-offset: 2px; }
  .yoyo-journey-panel { position: relative; z-index: 1; }
  .yoyo-journey-panel[hidden] { display: none; }
  .yoyo-translation-shell { display: grid; gap: 10px; padding: 15px; border-radius: 23px; background: linear-gradient(160deg, #f9fcff, #f1f7fb); box-shadow: inset 0 0 0 1px #edf3f7; }
  .yoyo-translation-message { max-width: 88%; padding: 11px 13px; border: 1px solid #e6eef4; border-radius: 17px 17px 17px 6px; background: #fff; color: #284862; font-size: 13px; line-height: 1.52; box-shadow: 0 7px 17px rgb(60 101 128 / .06); }
  .yoyo-translation-message strong { display: block; margin-bottom: 5px; color: #8295a6; font-size: 10px; letter-spacing: .05em; text-transform: uppercase; }
  .yoyo-translation-message.translation { margin-top: -6px; border-color: #c8eefa; background: #eafaff; color: #11668c; }
  .yoyo-translation-message.reply { margin-left: auto; border-radius: 17px 17px 6px; background: linear-gradient(135deg, #dff8e6, #edffdd); color: #2b6044; }
  .yoyo-translation-preview { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 10px; border-top: 1px solid #e2edf3; color: #637d92; font-size: 11px; }
  .yoyo-translation-preview b { color: var(--journey-accent); }
  .yoyo-context-board { display: grid; grid-template-columns: .9fr 1.1fr; gap: 12px; }
  .yoyo-context-thread, .yoyo-context-summary { min-height: 280px; padding: 16px; border: 1px solid #e3edf4; border-radius: 22px; background: rgb(255 255 255 / .78); }
  .yoyo-context-thread header, .yoyo-context-summary header { display: flex; justify-content: space-between; gap: 8px; margin-bottom: 14px; color: #688096; font-size: 11px; }
  .yoyo-context-bubble { margin-bottom: 9px; padding: 10px 11px; border-radius: 13px; background: #f2f7fb; color: #3e5a70; font-size: 12px; line-height: 1.5; }
  .yoyo-context-bubble:last-child { margin-left: 18px; background: #e8f8ff; }
  .yoyo-context-summary h4 { margin: 0 0 12px; font-size: 18px; }
  .yoyo-context-summary dl { display: grid; gap: 9px; margin: 0; }
  .yoyo-context-summary div { display: grid; grid-template-columns: 72px 1fr; gap: 8px; padding-bottom: 8px; border-bottom: 1px solid #edf2f6; font-size: 12px; line-height: 1.45; }
  .yoyo-context-summary dt { color: #8193a3; }
  .yoyo-context-summary dd { margin: 0; color: #294b67; font-weight: 730; }
  .yoyo-agent-flow { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 12px 0 18px; }
  .yoyo-agent-flow span { position: relative; min-height: 76px; display: grid; place-content: center; border: 1px solid #dcebf3; border-radius: 17px; background: rgb(255 255 255 / .78); color: #668096; font-size: 11px; text-align: center; }
  .yoyo-agent-flow span::after { position: absolute; top: 50%; right: -9px; color: var(--journey-accent); content: '→'; transform: translateY(-50%); }
  .yoyo-agent-flow span:last-child::after { display: none; }
  .yoyo-agent-flow strong { display: block; margin-bottom: 4px; color: #204766; font-size: 13px; }
  .yoyo-agent-source { min-height: 178px; padding: 18px; border: 1px solid #dcebf3; border-radius: 22px; background: linear-gradient(145deg, rgb(255 255 255 / .94), color-mix(in srgb, var(--journey-accent) 7%, white)); }
  .yoyo-agent-source > span { color: var(--journey-accent); font-size: 11px; font-weight: 830; }
  .yoyo-agent-source h4 { margin: 8px 0; font-size: 19px; }
  .yoyo-agent-source p { margin: 0; color: #5d7489; font-size: 13px; line-height: 1.62; }
  .yoyo-memory-card { padding: 18px; border: 1px solid #dbeaf1; border-radius: 22px; background: rgb(255 255 255 / .84); }
  .yoyo-memory-person { display: flex; align-items: center; gap: 11px; margin-bottom: 15px; }
  .yoyo-memory-person img { width: 42px; height: 42px; border-radius: 50%; object-fit: cover; }
  .yoyo-memory-person span { display: grid; gap: 2px; color: #71879a; font-size: 11px; }
  .yoyo-memory-person strong { color: #21425f; font-size: 14px; }
  .yoyo-memory-field { display: grid; gap: 7px; color: #6b8295; font-size: 11px; }
  .yoyo-memory-input { width: 100%; min-height: 44px; border: 1px solid #cde3ec; border-radius: 13px; padding: 10px 12px; background: #f9fdff; color: #23445e; font-size: 13px; }
  .yoyo-memory-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 13px; }
  .yoyo-memory-action, .yoyo-journey-voice-button { min-height: 38px; border: 1px solid color-mix(in srgb, var(--journey-accent) 36%, #d8e5ec); border-radius: 12px; padding: 8px 12px; background: color-mix(in srgb, var(--journey-accent) 9%, white); color: color-mix(in srgb, var(--journey-accent) 74%, #173b5f); font-size: 12px; font-weight: 790; cursor: pointer; }
  .yoyo-memory-card[data-memory-state="revoked"] { opacity: .62; }
  .yoyo-memory-card[data-memory-state="revoked"] .yoyo-memory-input { text-decoration: line-through; }
  .yoyo-memory-status { min-height: 38px; margin: 13px 0 0; padding: 9px 11px; border-radius: 12px; background: #edf9f4; color: #278660; font-size: 11px; line-height: 1.45; }
  .yoyo-memory-status[data-status="error"] { background: #fff0f3; color: #b43d5f; }
  .yoyo-supervision-result { min-height: 205px; padding: 18px; border: 1px solid #ddebf2; border-radius: 22px; background: rgb(255 255 255 / .84); }
  .yoyo-supervision-result span { color: var(--journey-accent); font-size: 11px; font-weight: 840; }
  .yoyo-supervision-result h4 { margin: 8px 0; font-size: 20px; }
  .yoyo-supervision-result p { margin: 0; color: #587086; font-size: 13px; line-height: 1.65; }
  .yoyo-supervision-action { display: flex; align-items: center; gap: 9px; margin-top: 15px; padding: 11px 13px; border-radius: 14px; background: color-mix(in srgb, var(--journey-accent) 10%, white); color: #294d68; font-size: 12px; font-weight: 760; }
  .yoyo-supervision-action i { width: 9px; height: 9px; border-radius: 50%; background: var(--journey-accent); box-shadow: 0 0 0 5px color-mix(in srgb, var(--journey-accent) 14%, transparent); }
  .yoyo-voice-player { padding: 20px; border: 1px solid #f0d9e5; border-radius: 24px; background: linear-gradient(145deg, rgb(255 255 255 / .95), #fff4fa); }
  .yoyo-voice-script { margin-bottom: 16px; padding: 14px; border-radius: 16px; background: #fff; color: #3a5368; font-size: 13px; line-height: 1.6; box-shadow: 0 8px 20px rgb(119 70 101 / .06); }
  .yoyo-voice-wave { height: 84px; display: flex; align-items: center; justify-content: center; gap: 6px; margin: 12px 0; border-radius: 18px; background: linear-gradient(90deg, rgb(246 110 174 / .08), rgb(32 201 230 / .09)); }
  .yoyo-voice-wave i { width: 5px; height: var(--voice-height, 26px); border-radius: 999px; background: linear-gradient(180deg, var(--journey-pink), var(--journey-cyan)); animation: yoyo-voice-pulse 1.2s ease-in-out infinite alternate; animation-delay: var(--voice-delay, 0s); }
  .yoyo-journey-card[data-playing="false"] .yoyo-voice-wave i { animation-play-state: paused; opacity: .48; }
  .yoyo-voice-meta { display: flex; justify-content: space-between; gap: 8px; margin-bottom: 14px; color: #7e7180; font-size: 11px; }
  .yoyo-broadcast-lanes { display: grid; gap: 10px; margin-top: 10px; }
  .yoyo-broadcast-lane { display: grid; grid-template-columns: 30px 1fr auto; gap: 10px; align-items: center; padding: 12px; border: 1px solid #ecdde6; border-radius: 16px; background: rgb(255 255 255 / .86); color: #536d82; font-size: 11px; }
  .yoyo-broadcast-lane b { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 50%; background: #ffebf4; color: var(--journey-pink); }
  .yoyo-broadcast-lane strong { display: block; margin-bottom: 2px; color: #29485f; font-size: 13px; }
  .yoyo-broadcast-lane em { color: #36a778; font-style: normal; font-weight: 780; }
  .yoyo-journey-closing { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr auto; gap: 30px; align-items: center; margin-top: 60px; padding: 42px 46px; border: 1px solid rgb(92 195 221 / .38); border-radius: 40px; background: linear-gradient(115deg, rgb(233 251 255 / .96), rgb(255 245 251 / .96)); box-shadow: 0 28px 65px rgb(46 122 155 / .12); }
  .yoyo-journey-closing::before { position: absolute; top: -61px; left: 50%; width: 2px; height: 61px; background: linear-gradient(var(--journey-pink), transparent); content: ''; }
  .yoyo-journey-closing h2 { margin: 0; font-size: clamp(32px, 4vw, 54px); line-height: 1.05; letter-spacing: -.045em; }
  .yoyo-journey-closing p { max-width: 680px; margin: 13px 0 0; color: #526e83; font-size: 15px; line-height: 1.65; }
  .yoyo-journey-closing-actions { display: flex; gap: 10px; }
  .official-route-hero {
    --route-a:#dcebf1;
    --route-b:#a8d3df;
    --route-c:#edc7d3;
    --route-d:#e9d3ad;
    position:relative;
    min-height:520px;
    display:grid;
    grid-template-columns:minmax(0,1.06fr) minmax(360px,.94fr);
    gap:48px;
    align-items:center;
    margin-top:26px;
    padding:66px;
    overflow:hidden;
    border:1px solid color-mix(in srgb,var(--route-b) 44%,white);
    border-radius:46px;
    background:linear-gradient(135deg,color-mix(in srgb,var(--route-a) 57%,white),color-mix(in srgb,var(--route-b) 34%,white) 32%,color-mix(in srgb,var(--route-c) 38%,white) 68%,color-mix(in srgb,var(--route-d) 30%,white));
    box-shadow:0 32px 80px rgb(38 112 145 / .12),inset 0 1px rgb(255 255 255 / .96);
    isolation:isolate;
  }
  .official-route-hero[data-skin="coast"] { --route-a:#dce9ee; --route-b:#84becb; --route-c:#b9b4dc; --route-d:#719eae; }
  .official-route-hero[data-skin="aurora"] { --route-a:#eee4ef; --route-b:#c9afd0; --route-c:#d8cce7; --route-d:#aebed8; }
  .official-route-hero[data-skin="sage"] { --route-a:#e5edef; --route-b:#96b5bd; --route-c:#f0dcc1; --route-d:#c49f78; }
  .official-route-hero[data-skin="twilight"] { --route-a:#d9e4ea; --route-b:#7f9fb2; --route-c:#e8b9af; --route-d:#667f9d; }
  .official-route-hero[data-skin="indigo"] { --route-a:#f9e8e6; --route-b:#eab8c3; --route-c:#e8d9ee; --route-d:#d8a7b7; }
  .official-route-hero::before { position:absolute; right:-170px; bottom:-310px; z-index:-1; width:720px; height:560px; border:2px solid rgb(255 255 255 / .72); border-radius:50%; box-shadow:0 0 0 28px rgb(94 203 224 / .08),0 0 0 64px rgb(255 255 255 / .22); content:""; transform:rotate(-8deg); }
  .official-route-hero::after { position:absolute; inset:auto 5% 24px 5%; z-index:-1; height:1px; background:linear-gradient(90deg,transparent,rgb(67 184 214 / .45),rgb(244 116 172 / .42),transparent); content:""; }
  .official-route-copy { position:relative; z-index:2; }
  .official-route-kicker { display:inline-flex; align-items:center; gap:9px; margin:0 0 18px; padding:7px 12px; border:1px solid rgb(255 255 255 / .88); border-radius:999px; background:rgb(255 255 255 / .64); color:#227b9e; font-size:12px; font-weight:850; box-shadow:0 8px 24px rgb(37 105 134 / .08); }
  .official-route-kicker::before { width:8px; height:8px; border-radius:50%; background:linear-gradient(135deg,#20c9e6,#f66eae); box-shadow:0 0 0 5px rgb(32 201 230 / .11); content:""; }
  .official-route-title { max-width:650px; margin:0; color:#071b45; font-size:clamp(48px,5.2vw,76px); line-height:.99; letter-spacing:-.06em; }
  .official-route-title span { display:block; }
  .official-route-title em { color:#16bcdc; font-style:normal; }
  .official-route-copy > p { max-width:600px; margin:24px 0 0; color:#45627a; font-size:17px; line-height:1.76; }
  .official-route-copy .official-actions { margin-top:28px; }
  .official-route-signals { display:flex; flex-wrap:wrap; gap:8px; margin:28px 0 0; padding:0; list-style:none; }
  .official-route-signals li { padding:8px 11px; border:1px solid rgb(255 255 255 / .86); border-radius:999px; background:rgb(255 255 255 / .56); color:#49687f; font-size:12px; font-weight:740; }
  .official-route-visual { position:relative; z-index:1; min-height:386px; display:flex; align-items:center; justify-content:center; }
  .official-route-console { position:relative; z-index:2; width:min(100%,430px); padding:22px; border:1px solid rgb(255 255 255 / .94); border-radius:30px; background:rgb(255 255 255 / .76); box-shadow:0 26px 54px rgb(55 102 130 / .15),inset 0 1px rgb(255 255 255 / .98); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); }
  .official-route-console-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; color:#56728a; font-size:11px; font-weight:790; }
  .official-route-console-head strong { color:#163d62; font-size:14px; }
  .official-route-console-head span { padding:5px 8px; border-radius:999px; background:#effaff; color:#1697bf; }
  .official-route-stack { display:grid; gap:10px; }
  .official-route-stack > div { display:grid; grid-template-columns:34px 1fr auto; gap:11px; align-items:center; min-height:62px; padding:10px 12px; border:1px solid #e2edf3; border-radius:17px; background:rgb(255 255 255 / .82); }
  .official-route-stack b { display:grid; width:34px; height:34px; place-items:center; border-radius:12px; background:linear-gradient(135deg,#e6faff,#ffedf6); color:#178ab4; font-size:11px; }
  .official-route-stack strong { display:block; color:#153d61; font-size:13px; }
  .official-route-stack small { display:block; margin-top:3px; color:#71879a; font-size:10px; line-height:1.45; }
  .official-route-stack em { color:#38aa7a; font-size:10px; font-style:normal; font-weight:800; }
  .official-route-pet { position:absolute; right:-34px; bottom:-18px; z-index:3; width:146px; height:146px; margin:0; pointer-events:none; }
  .official-route-pet img { width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 18px 18px rgb(38 93 125 / .17)); }
  .official-route-hero + .official-section .official-agent-section[data-reveal] { content-visibility:visible; }
  .official-route-section { padding:78px 0; }
  .official-route-section.soft { background:linear-gradient(180deg,#f6fcfe,#fff8fc); }
  .official-route-heading { display:grid; grid-template-columns:minmax(0,.85fr) minmax(300px,1.15fr); gap:48px; align-items:end; margin-bottom:34px; }
  .official-route-heading h2 { margin:0; color:#071b45; font-size:clamp(36px,4vw,58px); line-height:1.03; letter-spacing:-.05em; }
  .official-route-heading p { margin:0; color:#587087; font-size:15px; line-height:1.75; }
  .official-about-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
  .official-about-card { min-height:260px; padding:27px; border:1px solid #dbeaf1; border-radius:28px; background:linear-gradient(145deg,rgb(255 255 255 / .92),#f2fbfe); box-shadow:0 18px 40px rgb(44 106 136 / .08); }
  .official-about-card span { color:#19a8ca; font-size:11px; font-weight:850; letter-spacing:.08em; }
  .official-about-card h3 { margin:16px 0 12px; color:#12395d; font-size:24px; }
  .official-about-card p { margin:0; color:#5c7388; font-size:14px; line-height:1.72; }
  .official-about-boundary { display:grid; grid-template-columns:.86fr 1.14fr; gap:22px; padding:32px; border:1px solid #eaddea; border-radius:32px; background:linear-gradient(135deg,#fff4f9,#f2fbff); }
  .official-about-boundary h2 { margin:0; color:#142f55; font-size:34px; line-height:1.08; }
  .official-about-boundary ul { display:grid; gap:10px; margin:0; padding:0; list-style:none; }
  .official-about-boundary li { padding:13px 15px; border-radius:16px; background:rgb(255 255 255 / .78); color:#4b687f; font-size:13px; line-height:1.55; }
  @media (min-width:1021px) {
    .official-links { gap:0; }
    .official-nav-link { padding-inline:8px; font-size:12px; }
  }
  @keyframes yoyo-journey-flow { to { stroke-dashoffset: -120; } }
  @keyframes yoyo-voice-pulse { from { transform: scaleY(.45); } to { transform: scaleY(1); } }
  @media (max-width: 900px) {
    .official-route-hero { grid-template-columns:1fr; gap:30px; min-height:0; padding:44px 38px; border-radius:36px; }
    .official-route-visual { min-height:340px; }
    .official-route-heading { grid-template-columns:1fr; gap:14px; }
    .official-about-grid { grid-template-columns:1fr; }
    .official-about-card { min-height:0; }
    .official-about-boundary { grid-template-columns:1fr; }
    .yoyo-journey { margin-top: -2px; padding: 84px 0 92px; background: radial-gradient(circle at 7% 9%, rgb(53 218 238 / .18), transparent 22%), radial-gradient(circle at 93% 24%, rgb(246 110 174 / .15), transparent 24%), radial-gradient(circle at 16% 63%, rgb(90 151 244 / .13), transparent 27%), linear-gradient(180deg, #edfaff 0%, #f9fdff 18%, #fff9fd 42%, #eefaff 69%, #f8fdff 100%); }
    .yoyo-journey::before { display: none; }
    .yoyo-journey-seam { display: none; }
    .yoyo-journey-wrap { width: min(100% - 30px, 720px); }
    .yoyo-journey-intro { margin-bottom: 48px; }
    .yoyo-journey-track { left: 19px; width: 70px; }
    .yoyo-journey-card, .yoyo-journey-card:nth-child(even) { grid-template-columns: 1fr; min-height: 0; padding: 22px; border-radius: 30px; transform: none; }
    .yoyo-journey-card:nth-child(even) .yoyo-journey-copy, .yoyo-journey-card:nth-child(even) .yoyo-journey-stage { order: initial; }
    .yoyo-journey-card::before, .yoyo-journey-card:nth-child(even)::before { top: 50%; left: -32px; right: auto; width: 31px; transform: rotate(180deg); }
    .yoyo-journey-card::after, .yoyo-journey-card:nth-child(even)::after { top: calc(50% - 8px); left: -38px; right: auto; }
    .yoyo-journey-pet { min-height: 122px; }
    .yoyo-journey-pet figcaption { width: calc(100% - 114px); }
    .yoyo-journey-pet img { width: 108px; height: 108px; }
    .yoyo-journey-stage { min-height: 350px; }
    .yoyo-context-board { grid-template-columns: 1fr; }
    .yoyo-context-thread, .yoyo-context-summary { min-height: 0; }
    .yoyo-journey-closing { grid-template-columns: 1fr; padding: 32px; }
  }
  @media (max-width: 560px) {
    .official-route-hero { width:calc(100% - 24px); margin-top:12px; padding:34px 20px 26px; border-radius:28px; }
    .official-route-title { font-size:43px; }
    .official-route-copy > p { margin-top:18px; font-size:15px; }
    .official-route-copy .official-actions { align-items:stretch; }
    .official-route-copy .official-button { width:100%; }
    .official-route-signals { margin-top:22px; }
    .official-route-visual { min-height:300px; }
    .official-route-console { padding:14px; border-radius:23px; }
    .official-route-stack > div { grid-template-columns:32px 1fr; }
    .official-route-stack em { grid-column:2; margin-top:-7px; }
    .official-route-pet { right:-12px; bottom:-28px; width:105px; height:105px; }
    .official-route-section { padding:58px 0; }
    .official-about-boundary { padding:22px; border-radius:26px; }
    .yoyo-journey { padding-top: 66px; }
    .yoyo-journey-wrap { width: calc(100% - 32px); }
    .yoyo-journey-intro { text-align: left; }
    .yoyo-journey-intro h2 { font-size: 40px; }
    .yoyo-journey-intro > p:last-child { font-size: 15px; }
    .yoyo-journey-track { left: 2px; }
    .yoyo-journey-list { gap: 22px; }
    .yoyo-journey-card, .yoyo-journey-card:nth-child(even) { padding: 17px; border-radius: 26px; }
    .yoyo-journey-card::before, .yoyo-journey-card:nth-child(even)::before { left: -18px; width: 17px; }
    .yoyo-journey-card::after, .yoyo-journey-card:nth-child(even)::after { left: -23px; }
    .yoyo-journey-copy h3 { font-size: 35px; }
    .yoyo-journey-stage { min-height: 0; padding: 13px; border-radius: 23px; }
    .yoyo-journey-stage-head { align-items: flex-start; }
    .yoyo-context-board { grid-template-columns: 1fr; }
    .yoyo-agent-flow { grid-template-columns: repeat(2, 1fr); }
    .yoyo-agent-flow span:nth-child(2)::after { display: none; }
    .yoyo-journey-closing { padding: 25px 20px; border-radius: 28px; }
    .yoyo-journey-closing-actions { flex-direction: column; }
  }
  @media (prefers-reduced-motion: reduce) {
    .yoyo-journey-track .flow, .yoyo-voice-wave i { animation: none !important; }
  }
  @media (min-width: 901px) and (max-width: 1020px) {
    .official-nav { width: calc(100% - 32px); padding-inline: 14px; }
    .official-brand { gap: 6px; font-size: 19px; }
    .official-mark { width: 38px; height: 38px; }
    .official-brand-tagline { display: none; }
    .official-links { position: static; display: flex; margin-left: auto; gap: 0; }
    .official-nav-link { min-height: 32px; padding-inline: 8px; font-size: 11px; }
    .official-language { display: block; font-size: 11px; }
    .official-language > summary { gap: 5px; padding-inline: 8px; }
    .official-language-globe { width: 23px; height: 23px; }
    .official-language-chevron { width: 20px; height: 20px; }
    .official-header .official-button.primary { min-width: 98px; display: inline-flex; padding-inline: 13px; font-size: 12px; }
    .official-mobile-menu { display: none; }
  }

  @media (min-width: 761px) and (max-width: 900px) {
    .official-brand-tagline { display: none; }
    .official-language { margin-left: auto; }
    .official-mobile-menu { margin-left: 0; }
  }

  /* Menu destinations are editorial introductions. The top bar is the only navigation. */
  @media (min-width: 1021px) {
    .official-links { position: static; margin-left: auto; }
  }
  .official-route-hero {
    width: 100%;
    max-width: none;
    min-height: 560px;
    margin-top: 0;
    padding: 84px max(24px, calc((100vw - 1180px) / 2)) 72px;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background:
      radial-gradient(circle at 18% 20%, rgb(255 255 255 / .94), transparent 30%),
      radial-gradient(circle at 84% 34%, color-mix(in srgb, var(--route-c) 54%, white), transparent 34%),
      linear-gradient(128deg, color-mix(in srgb, var(--route-a) 42%, white), #f8fcff 48%, color-mix(in srgb, var(--route-c) 28%, white));
    box-shadow: none;
  }
  .official-route-hero::before { right: -210px; bottom: -350px; opacity: .65; }
  .official-route-hero::after { right: max(24px, calc((100vw - 1180px) / 2)); bottom: 0; left: max(24px, calc((100vw - 1180px) / 2)); }
  .official-route-visual { min-height: 360px; align-items: flex-start; padding-top: 42px; }
  .official-route-console {
    width: 100%;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  .official-route-console-head { margin-bottom: 6px; padding-bottom: 16px; border-bottom: 1px solid rgb(73 126 154 / .2); }
  .official-route-console-head span { background: rgb(255 255 255 / .68); }
  .official-route-stack { gap: 0; }
  .official-route-stack > div {
    min-height: 84px;
    padding: 17px 0;
    border: 0;
    border-bottom: 1px solid rgb(73 126 154 / .18);
    border-radius: 0;
    background: transparent;
  }
  .official-route-stack b { background: rgb(255 255 255 / .72); }
  .official-route-pet { right: -26px; bottom: -16px; }
  .official-site-guide .official-route-visual { min-height: 486px; padding: 24px 0 100px; }
  .official-site-guide .official-route-stack > div { min-height: 66px; padding-block: 11px; }
  .official-site-guide .official-route-pet { right: 0; bottom: 0; width: 94px; height: 94px; }
  .official-route-hero + :is(.official-section, .official-manual-section, .official-route-section) { margin-top: 0; }
  .official-agent-section[data-reveal],
  .official-pet-section[data-reveal] { content-visibility: visible; }

  .official-capability-intro {
    position: relative;
    overflow: clip;
    padding: 82px 0 88px;
    background:
      radial-gradient(circle at 14% 18%, rgb(255 255 255 / .96), transparent 25%),
      radial-gradient(circle at 88% 78%, rgb(246 110 174 / .16), transparent 30%),
      linear-gradient(118deg, #effbff 0%, #f8fcff 48%, #fff5fa 100%);
  }
  .official-capability-intro::after { position: absolute; right: -18%; bottom: -340px; width: 850px; height: 560px; border: 2px solid rgb(32 190 222 / .17); border-radius: 50%; box-shadow: 0 0 0 34px rgb(255 255 255 / .3), 0 0 0 72px rgb(246 110 174 / .05); content: ''; transform: rotate(-7deg); }
  .official-capability-intro .official-wrap { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(430px, .86fr) minmax(560px, 1.14fr); gap: clamp(44px, 5.4vw, 84px); align-items: center; }
  .official-capability-thesis h1 { max-width: 730px; margin: 0; color: #071b45; font-size: clamp(52px, 4.8vw, 74px); line-height: 1.01; letter-spacing: -.06em; }
  .official-capability-thesis h1 span { display: block; }
  .official-capability-thesis h1 em { color: #16bcdc; font-style: normal; }
  .official-capability-thesis > p:not(.official-route-kicker) { max-width: 620px; margin: 25px 0 0; color: #49677e; font-size: 16px; line-height: 1.75; }
  .official-capability-thesis .official-actions { align-items: center; margin-top: 28px; }
  .official-capability-proofline { display: flex; flex-wrap: wrap; gap: 9px 22px; margin: 26px 0 0; padding: 0; list-style: none; }
  .official-capability-proofline li { position: relative; padding-left: 15px; color: #55758b; font-size: 12px; font-weight: 720; }
  .official-capability-proofline li::before { position: absolute; top: .55em; left: 0; width: 6px; height: 6px; border-radius: 50%; background: linear-gradient(135deg, #22c2df, #f66eae); content: ''; }
  .official-capability-product-shot { position: relative; overflow: hidden; min-width: 0; margin: 0; border: 1px solid rgb(78 153 181 / .22); border-radius: 26px; background: #edf8fc; box-shadow: 0 32px 70px rgb(38 101 128 / .18); }
  .official-capability-client-shell { display: grid; grid-template-columns: 132px minmax(0, 1fr); height: 450px; background: #f8fbfd; }
  .official-capability-client-shell > aside { padding: 17px 10px; border-right: 1px solid #d9e4eb; background: rgb(255 255 255 / .92); }
  .official-capability-client-brand { display: flex; align-items: center; gap: 7px; padding: 0 6px 13px; color: #153a5a; font-size: 12px; }
  .official-capability-client-brand img { width: 25px; height: 25px; object-fit: contain; }
  .official-capability-client-shell nav { display: grid; gap: 3px; }
  .official-capability-client-shell nav span { padding: 8px 9px; border-radius: 9px; color: #5e7688; font-size: 9px; font-weight: 720; }
  .official-capability-client-shell nav span.is-active { background: linear-gradient(105deg, #e0f7fc, #fbeef5); color: #138eae; }
  .official-capability-client-shell nav span.is-console { color: #173e61; font-weight: 850; }
  .official-capability-client-main { min-width: 0; padding: 15px; }
  .official-capability-client-main > header { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 5px 4px 15px; }
  .official-capability-client-main > header > div { display: grid; gap: 3px; }
  .official-capability-client-main > header strong { color: #173c5b; font-size: 14px; }
  .official-capability-client-main > header small { color: #7f94a5; font-size: 8px; }
  .official-capability-client-main > header button { padding: 7px 10px; border: 1px solid #cde0e8; border-radius: 999px; background: #fff; color: #168ca9; font-size: 8px; font-weight: 790; }
  .official-capability-client-workspace { display: grid; grid-template-columns: 118px minmax(0, 1fr) 105px; overflow: hidden; height: 356px; border: 1px solid #d4e1e8; border-radius: 16px; background: #fff; }
  .official-capability-client-list { padding: 12px 8px; border-right: 1px solid #d8e4ea; }
  .official-capability-client-list > span { display: block; margin: 0 5px 10px; color: #1894b1; font-size: 8px; font-weight: 820; }
  .official-capability-client-list article { display: flex; gap: 6px; min-width: 0; padding: 8px 6px; border-radius: 10px; }
  .official-capability-client-list article.is-selected { background: #e8f5fc; }
  .official-capability-client-list img { flex: 0 0 auto; width: 23px; height: 23px; border-radius: 50%; object-fit: cover; }
  .official-capability-client-list p { min-width: 0; margin: 0; }
  .official-capability-client-list strong,
  .official-capability-client-list small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .official-capability-client-list strong { color: #244762; font-size: 8px; }
  .official-capability-client-list small { max-width: 68px; margin-top: 3px; color: #8699a7; font-size: 6px; }
  .official-capability-client-chat { position: relative; min-width: 0; padding: 12px; background: linear-gradient(135deg, #f5fbfd, #fdf6f9); }
  .official-capability-client-chat-head { display: flex; justify-content: space-between; gap: 10px; padding-bottom: 10px; border-bottom: 1px solid #d7e5eb; }
  .official-capability-client-chat-head strong { color: #173e5f; font-size: 9px; }
  .official-capability-client-chat-head span { color: #1390ad; font-size: 7px; }
  .official-capability-client-chat > p { max-width: 75%; margin: 18px 0 0; padding: 10px; border-radius: 4px 12px 12px 12px; background: #fff; box-shadow: 0 5px 13px rgb(46 94 121 / .08); color: #23465f; font-size: 8px; line-height: 1.45; }
  .official-capability-client-chat > p.is-outgoing { margin-left: auto; border-radius: 12px 4px 12px 12px; background: #e8f8ef; }
  .official-capability-client-chat > p small { display: block; margin-top: 7px; padding-top: 6px; border-top: 1px solid rgb(83 127 151 / .15); color: #4e7185; font-size: 7px; }
  .official-capability-client-composer { position: absolute; right: 12px; bottom: 12px; left: 12px; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 11px; border: 1px solid #d6e4ea; border-radius: 11px; background: #fff; color: #98a7b2; font-size: 7px; }
  .official-capability-client-composer b { color: #188dad; font-size: 7px; }
  .official-capability-client-assistant { padding: 14px 10px; border-left: 1px solid #d8e4ea; }
  .official-capability-client-assistant > strong { display: block; padding-bottom: 11px; border-bottom: 1px solid #d8e4ea; color: #193e5d; font-size: 9px; }
  .official-capability-client-assistant span { display: block; margin-top: 15px; color: #899ba8; font-size: 7px; }
  .official-capability-client-assistant p { margin: 5px 0 0; color: #1c607c; font-size: 8px; font-weight: 780; }
  .official-capability-product-shot::after { position: absolute; inset: auto 0 0; height: 34%; background: linear-gradient(transparent, rgb(5 29 66 / .72)); content: ''; pointer-events: none; }
  .official-capability-product-shot figcaption { position: absolute; z-index: 1; right: 24px; bottom: 22px; left: 24px; display: flex; align-items: end; justify-content: space-between; gap: 18px; color: #fff; }
  .official-capability-product-shot figcaption span { font-size: 11px; font-weight: 820; letter-spacing: .08em; }
  .official-capability-product-shot figcaption strong { max-width: 310px; text-align: right; font-size: 16px; line-height: 1.35; }

  .official-capability-core { padding: 58px 0 48px; scroll-margin-top: 92px; }
  .official-capability-core.is-translation { background: linear-gradient(128deg, #f2fbff 0%, #fbfcff 48%, #fff7fb 100%); }
  .official-capability-core.is-agent { overflow: hidden; background: radial-gradient(circle at 8% 75%, rgb(56 198 224 / .12), transparent 26%), linear-gradient(128deg, #f1fbff 0%, #fbfcff 48%, #fff5fa 100%); }
  .official-capability-core-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(430px, .82fr); gap: clamp(34px, 4vw, 58px); align-items: center; margin-bottom: 34px; }
  .official-capability-core-head > div > span,
  .official-capability-control header > span,
  .official-capability-extensions header > span { display: block; margin-bottom: 16px; color: #159cbe; font-size: 11px; font-weight: 850; letter-spacing: .1em; }
  .official-capability-core-head h2,
  .official-capability-control h2,
  .official-capability-extensions h2 { margin: 0; color: #08204a; font-size: clamp(42px, 4.2vw, 62px); line-height: 1.03; letter-spacing: -.05em; }
  .official-capability-core-head h2 em,
  .official-capability-control h2 em { color: #18b9d8; font-style: normal; }
  .official-capability-core-head > p { max-width: 520px; margin: 0; color: #55748a; font-size: 15px; line-height: 1.78; }
  .official-capability-translation-layout { display: grid; grid-template-columns: minmax(250px, .55fr) minmax(0, 1.45fr); gap: clamp(50px, 7vw, 100px); align-items: center; }
  .official-capability-feature-copy ol { margin: 0; padding: 0; list-style: none; counter-reset: capability-feature; }
  .official-capability-feature-copy li { position: relative; padding: 23px 0 23px 34px; border-top: 1px solid #d1e2e9; counter-increment: capability-feature; }
  .official-capability-feature-copy li:last-child { border-bottom: 1px solid #d1e2e9; }
  .official-capability-feature-copy li::before { position: absolute; top: 26px; left: 0; color: #18a6c6; font: 800 10px/1 ui-monospace, SFMono-Regular, Menlo, monospace; content: '0' counter(capability-feature); }
  .official-capability-feature-copy strong { display: block; color: #173a5d; font-size: 17px; }
  .official-capability-feature-copy span { display: block; margin-top: 8px; color: #668095; font-size: 13px; line-height: 1.62; }
  .official-capability-feature-copy > a { display: inline-flex; margin-top: 22px; color: #157e9e; font-size: 12px; font-weight: 820; }
  .official-capability-translate-demo { position: relative; min-width: 0; padding: 28px 32px 30px; border: 1px solid rgb(45 158 191 / .18); border-radius: 28px; background: linear-gradient(145deg, rgb(255 255 255 / .94), rgb(235 250 255 / .9) 58%, rgb(255 241 247 / .86)); box-shadow: 0 26px 64px rgb(36 99 131 / .14); }
  .official-capability-demo-bar { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-bottom: 22px; border-bottom: 1px solid #d5e6ec; }
  .official-capability-demo-bar > div { display: flex; gap: 4px; padding: 4px; border-radius: 999px; background: #e9f4f8; }
  .official-capability-demo-bar button { min-height: 38px; padding: 8px 16px; border: 0; border-radius: 999px; background: transparent; color: #607c90; font-size: 12px; font-weight: 790; cursor: pointer; }
  .official-capability-demo-bar button.is-active { background: #fff; color: #0d8eaf; box-shadow: 0 4px 13px rgb(30 112 142 / .12); }
  .official-capability-demo-bar > span { color: #7890a1; font-size: 11px; }
  .official-capability-language-route { display: flex; align-items: center; gap: 12px; padding: 22px 0 16px; color: #617c90; font-size: 12px; font-weight: 760; }
  .official-capability-language-route i { color: #21b7d5; font-style: normal; }
  .official-capability-translation-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: hidden; border: 1px solid #d5e5eb; border-radius: 18px; background: rgb(255 255 255 / .72); }
  .official-capability-translation-pair article { min-height: 190px; padding: 25px; }
  .official-capability-translation-pair article + article { border-left: 1px solid #d5e5eb; }
  .official-capability-translation-pair article.is-result { background: linear-gradient(135deg, rgb(227 249 254 / .86), rgb(255 241 248 / .68)); }
  .official-capability-translation-pair span { color: #7691a4; font-size: 10px; font-weight: 830; letter-spacing: .08em; }
  .official-capability-translation-pair p { margin: 20px 0 0; color: #143858; font-size: clamp(18px, 1.6vw, 23px); font-weight: 680; line-height: 1.52; }
  .official-capability-translate-demo footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-top: 20px; }
  .official-capability-translate-demo footer > span { color: #628096; font-size: 11px; }
  .official-capability-translate-demo footer button,
  .official-capability-agent-editor button { min-height: 42px; padding: 10px 18px; border: 1px solid #cddfe7; border-radius: 999px; background: #fff; color: #31536d; font-size: 12px; font-weight: 820; cursor: pointer; }
  .official-capability-translate-demo footer button,
  .official-capability-agent-editor button.is-primary { border: 0; background: linear-gradient(110deg, #13b9da, #4b9fe2 58%, #f06cac); box-shadow: 0 10px 24px rgb(44 152 196 / .22); color: #fff; }
  .official-capability-translate-demo > img { position: absolute; right: -34px; bottom: -42px; width: 108px; height: 120px; object-fit: contain; filter: drop-shadow(0 14px 18px rgb(38 80 115 / .17)); }
  .official-capability-translate-demo.is-working [data-capability-translated-text] { opacity: .45; }

  .official-capability-agent-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr); gap: clamp(48px, 7vw, 94px); align-items: center; }
  .official-capability-conversation { position: relative; min-width: 0; padding: 30px 34px 32px; border: 1px solid rgb(49 143 177 / .2); border-radius: 30px; background: rgb(255 255 255 / .82); box-shadow: 0 28px 65px rgb(42 101 132 / .14); }
  .official-capability-conversation-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding-bottom: 20px; border-bottom: 1px solid #d7e6ec; color: #173d5f; font-size: 13px; font-weight: 820; }
  .official-capability-conversation-head small { padding: 6px 10px; border-radius: 999px; background: #e5f8fc; color: #1394b3; font-size: 10px; }
  .official-capability-bubbles { display: grid; gap: 10px; padding: 23px 0; }
  .official-capability-bubbles p { width: fit-content; max-width: 76%; margin: 0; padding: 13px 16px; border-radius: 5px 18px 18px 18px; background: #edf6fa; color: #234962; font-size: 14px; line-height: 1.55; }
  .official-capability-bubbles p + p { margin-left: 36px; background: #fdf0f6; }
  .official-capability-bubbles span { display: block; margin-bottom: 5px; color: #879aaa; font-size: 9px; }
  .official-capability-context-line { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid #d6e5eb; border-bottom: 1px solid #d6e5eb; }
  .official-capability-context-line > span { padding: 16px 13px; color: #8296a5; font-size: 9px; }
  .official-capability-context-line > span + span { border-left: 1px solid #d6e5eb; }
  .official-capability-context-line strong { display: block; margin-top: 7px; color: #1d4967; font-size: 12px; }
  .official-capability-agent-editor { padding-top: 22px; }
  .official-capability-agent-editor > label { display: block; margin-bottom: 10px; color: #c25387; font-size: 10px; font-weight: 830; letter-spacing: .08em; }
  .official-capability-agent-editor textarea { width: 100%; min-height: 102px; resize: vertical; padding: 15px 16px; border: 1px solid #d5e4ea; border-radius: 14px; outline: none; background: #fbfdfe; color: #183c5c; font: 650 14px/1.62 ui-sans-serif, system-ui, sans-serif; }
  .official-capability-agent-editor textarea:focus { border-color: #38b9d4; box-shadow: 0 0 0 3px rgb(56 185 212 / .12); }
  .official-capability-agent-editor > div { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding-top: 13px; }
  .official-capability-agent-editor > div > span { color: #718a9c; font-size: 10px; }
  .official-capability-agent-editor > div > div { display: flex; gap: 8px; }
  .official-capability-conversation > img { position: absolute; right: -58px; bottom: -34px; width: 105px; height: 116px; object-fit: contain; filter: drop-shadow(0 14px 20px rgb(43 79 114 / .16)); }
  .official-capability-agent-strengths { display: grid; border-top: 1px solid #cfe0e8; }
  .official-capability-agent-strengths article { position: relative; padding: 27px 0 27px 48px; border-bottom: 1px solid #cfe0e8; }
  .official-capability-agent-strengths article > span { position: absolute; top: 31px; left: 0; color: #1aa0bf; font: 820 10px/1 ui-monospace, SFMono-Regular, Menlo, monospace; }
  .official-capability-agent-strengths h3 { margin: 0; color: #143858; font-size: 19px; }
  .official-capability-agent-strengths p { margin: 9px 0 0; color: #607c90; font-size: 13px; line-height: 1.65; }

  .official-capability-control {
    padding: 44px 0 48px;
    background:
      radial-gradient(circle at 12% 18%, rgb(65 204 225 / .16), transparent 28%),
      radial-gradient(circle at 88% 82%, rgb(242 139 185 / .14), transparent 30%),
      linear-gradient(135deg, #f2fbff 0%, #f8fbff 48%, #fff6fa 100%);
    color: #08204a;
  }
  .official-capability-control header { display: grid; grid-template-columns: minmax(0, 1fr) minmax(310px, .48fr); gap: 70px; align-items: end; }
  .official-capability-control header > span { grid-column: 1 / -1; margin-bottom: -46px; color: #168eae; }
  .official-capability-control h2 { color: #08204a; }
  .official-capability-control h2 em { color: #e85f9b; }
  .official-capability-control header p { margin: 0; color: #55748a; font-size: 14px; line-height: 1.72; }
  .official-capability-control-track { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin: 36px 0 0; padding: 0; border-top: 1px solid rgb(74 159 190 / .3); list-style: none; }
  .official-capability-control-track li { position: relative; padding: 25px 24px 0 0; }
  .official-capability-control-track li::before { position: absolute; top: -6px; left: 0; width: 11px; height: 11px; border: 2px solid #f5fbff; border-radius: 50%; background: linear-gradient(135deg, #30bfd9, #ed75aa); box-shadow: 0 0 0 1px rgb(62 151 186 / .42); content: ''; }
  .official-capability-control-track span { display: block; color: #648297; font-size: 10px; }
  .official-capability-control-track strong { display: block; margin-top: 8px; color: #143858; font-size: 15px; }

  .official-capability-extensions { padding: 48px 0 56px; background: linear-gradient(128deg, #f3fbff 0%, #fbfcff 48%, #fff7fb 100%); }
  .official-capability-extensions > .official-wrap > header { display: flex; align-items: end; justify-content: space-between; gap: 40px; }
  .official-capability-extensions header > span { margin-bottom: 10px; }
  .official-capability-extensions h2 { font-size: clamp(36px, 3.6vw, 52px); }
  .official-capability-extension-list { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 28px; border-top: 1px solid #cee0e8; border-bottom: 1px solid #cee0e8; }
  .official-capability-extension-list article { position: relative; min-height: 238px; padding: 30px 32px 28px 0; }
  .official-capability-extension-list article + article { padding-left: 32px; border-left: 1px solid #cee0e8; }
  .official-capability-extension-list h3 { margin: 28px 0 0; color: #173b5c; font-size: 20px; }
  .official-capability-extension-list p { max-width: 320px; margin: 11px 0 0; color: #668095; font-size: 13px; line-height: 1.65; }
  .official-capability-platform-marks { display: flex; gap: 9px; }
  .official-capability-platform-marks img { width: 39px; height: 39px; border-radius: 11px; box-shadow: 0 8px 17px rgb(43 104 135 / .13); }
  .official-capability-wave { display: flex; align-items: center; gap: 6px; height: 40px; }
  .official-capability-wave i { width: 6px; height: 18px; border-radius: 99px; background: linear-gradient(#20c8e1, #f671ac); }
  .official-capability-wave i:nth-child(2) { height: 31px; }
  .official-capability-wave i:nth-child(3) { height: 22px; }
  .official-capability-wave i:nth-child(4) { height: 38px; }
  .official-capability-wave i:nth-child(5) { height: 15px; }
  .official-capability-extension-pet { position: absolute; top: 10px; right: 6px; width: 92px; height: 92px; object-fit: contain; }
  .official-capability-cta { display: flex; align-items: center; justify-content: space-between; gap: 38px; margin-top: 32px; padding: 24px 28px; border: 1px solid rgb(44 159 192 / .18); border-radius: 24px; background: linear-gradient(112deg, rgb(220 248 254 / .82), rgb(255 255 255 / .92) 48%, rgb(255 231 242 / .8)); }
  .official-capability-cta > div > span { color: #168eae; font-size: 11px; font-weight: 830; letter-spacing: .08em; }
  .official-capability-cta h2 { max-width: 760px; margin-top: 8px; font-size: clamp(25px, 2.4vw, 34px); line-height: 1.2; }

  .official-capability-demo-bar button:focus-visible,
  .official-capability-translate-demo footer button:focus-visible,
  .official-capability-agent-editor button:focus-visible { outline: 3px solid rgb(26 179 210 / .26); outline-offset: 2px; }

  @media (max-width: 900px) {
    .official-route-hero { grid-template-columns: 1fr; gap: 20px; min-height: 0; padding: 58px 38px 48px; border-radius: 0; }
    .official-route-visual { min-height: 0; padding-top: 12px; }
    .official-route-pet { right: 0; bottom: -28px; }
    .official-site-guide .official-route-visual { min-height: 0; padding: 12px 0 98px; }
    .official-site-guide .official-route-pet { right: 0; bottom: 0; width: 88px; height: 88px; }
    .official-capability-intro .official-wrap { grid-template-columns: 1fr; gap: 46px; }
    .official-capability-client-shell { height: 420px; }
    .official-capability-core-head { grid-template-columns: 1fr; gap: 20px; }
    .official-capability-translation-layout,
    .official-capability-agent-layout { grid-template-columns: 1fr; gap: 46px; }
    .official-capability-agent-strengths { grid-template-columns: repeat(3, 1fr); }
    .official-capability-agent-strengths article { padding: 23px 20px 23px 30px; }
    .official-capability-agent-strengths article + article { border-left: 1px solid #cfe0e8; }
    .official-capability-control header { grid-template-columns: 1fr; gap: 18px; }
    .official-capability-control header > span { grid-column: auto; margin-bottom: 0; }
  }
  @media (max-width: 560px) {
    .official-route-hero { width: 100%; margin-top: 0; padding: 38px 20px 34px; border-radius: 0; }
    .official-route-console { padding: 0; border-radius: 0; }
    .official-route-stack > div { min-height: 74px; }
    .official-capability-intro { padding: 42px 0 52px; }
    .official-capability-intro .official-wrap { width: calc(100% - 32px); gap: 34px; }
    .official-capability-thesis h1 { font-size: 41px; line-height: 1.03; }
    .official-capability-thesis > p:not(.official-route-kicker) { margin-top: 20px; font-size: 15px; }
    .official-capability-thesis .official-actions { align-items: stretch; flex-direction: column; }
    .official-capability-thesis .official-button { justify-content: center; width: 100%; }
    .official-capability-proofline { gap: 8px 14px; }
    .official-capability-product-shot { border-radius: 19px; }
    .official-capability-client-shell { grid-template-columns: 84px minmax(0, 1fr); height: 278px; }
    .official-capability-client-shell > aside { padding: 10px 6px; }
    .official-capability-client-brand { padding: 0 3px 8px; font-size: 0; }
    .official-capability-client-brand img { width: 22px; height: 22px; }
    .official-capability-client-shell nav span { padding: 5px 6px; font-size: 7px; }
    .official-capability-client-main { padding: 8px; }
    .official-capability-client-main > header { padding-bottom: 8px; }
    .official-capability-client-main > header small,
    .official-capability-client-main > header button { display: none; }
    .official-capability-client-workspace { grid-template-columns: 72px minmax(0, 1fr); height: 224px; border-radius: 11px; }
    .official-capability-client-assistant { display: none; }
    .official-capability-client-list { padding: 8px 4px; }
    .official-capability-client-list article { padding: 6px 3px; }
    .official-capability-client-list img { width: 18px; height: 18px; }
    .official-capability-client-list strong { font-size: 6px; }
    .official-capability-client-list small { max-width: 37px; font-size: 5px; }
    .official-capability-client-chat { padding: 8px; }
    .official-capability-client-chat > p { margin-top: 10px; padding: 7px; font-size: 6px; }
    .official-capability-client-chat > p small { margin-top: 4px; padding-top: 4px; font-size: 5px; }
    .official-capability-client-composer { right: 8px; bottom: 8px; left: 8px; padding: 8px; }
    .official-capability-product-shot figcaption { right: 15px; bottom: 14px; left: 15px; align-items: flex-start; flex-direction: column; gap: 5px; }
    .official-capability-product-shot figcaption strong { max-width: 260px; text-align: left; font-size: 13px; }
    .official-capability-core { padding: 42px 0 44px; scroll-margin-top: 72px; }
    .official-capability-core > .official-wrap,
    .official-capability-control > .official-wrap,
    .official-capability-extensions > .official-wrap { width: calc(100% - 32px); }
    .official-capability-core-head { margin-bottom: 34px; }
    .official-capability-core-head h2,
    .official-capability-control h2 { font-size: 38px; }
    .official-capability-core-head > p { font-size: 14px; }
    .official-capability-translation-layout,
    .official-capability-agent-layout { gap: 34px; }
    .official-capability-translate-demo { padding: 18px 16px 22px; border-radius: 20px; }
    .official-capability-demo-bar { align-items: flex-start; flex-direction: column; gap: 10px; padding-bottom: 16px; }
    .official-capability-demo-bar button { min-height: 40px; padding-inline: 14px; }
    .official-capability-language-route { padding: 17px 0 13px; }
    .official-capability-translation-pair { grid-template-columns: 1fr; border-radius: 14px; }
    .official-capability-translation-pair article { min-height: 140px; padding: 20px 17px; }
    .official-capability-translation-pair article + article { border-top: 1px solid #d5e5eb; border-left: 0; }
    .official-capability-translation-pair p { margin-top: 13px; font-size: 18px; }
    .official-capability-translate-demo footer { align-items: stretch; flex-direction: column; gap: 12px; }
    .official-capability-translate-demo footer button { width: 100%; }
    .official-capability-translate-demo > img { right: 9px; bottom: 5px; width: 72px; height: 80px; pointer-events: none; opacity: .92; }
    .official-capability-translate-demo footer button { padding-right: 82px; }
    .official-capability-conversation { padding: 21px 17px 23px; border-radius: 20px; }
    .official-capability-bubbles p { max-width: 91%; }
    .official-capability-context-line { grid-template-columns: 1fr; }
    .official-capability-context-line > span { padding: 11px 8px; }
    .official-capability-context-line > span + span { border-top: 1px solid #d6e5eb; border-left: 0; }
    .official-capability-agent-editor > div { align-items: flex-start; flex-direction: column; }
    .official-capability-agent-editor > div > div { width: 100%; }
    .official-capability-agent-editor button { flex: 1; }
    .official-capability-conversation > img { right: -5px; bottom: 42px; width: 72px; height: 80px; pointer-events: none; }
    .official-capability-agent-strengths { grid-template-columns: 1fr; }
    .official-capability-agent-strengths article { padding: 22px 0 22px 38px; }
    .official-capability-agent-strengths article + article { border-left: 0; }
    .official-capability-control { padding: 42px 0 44px; }
    .official-capability-control-track { grid-template-columns: 1fr 1fr; row-gap: 28px; margin-top: 32px; }
    .official-capability-control-track li { padding-right: 12px; }
    .official-capability-extensions { padding: 42px 0 48px; }
    .official-capability-extensions > .official-wrap > header { align-items: flex-start; flex-direction: column; gap: 4px; }
    .official-capability-extensions h2 { font-size: 34px; }
    .official-capability-extension-list { grid-template-columns: 1fr; margin-top: 30px; }
    .official-capability-extension-list article,
    .official-capability-extension-list article + article { min-height: 0; padding: 24px 0; border-left: 0; }
    .official-capability-extension-list article + article { border-top: 1px solid #cee0e8; }
    .official-capability-extension-pet { top: 8px; right: 0; width: 78px; height: 78px; }
    .official-capability-cta { align-items: stretch; flex-direction: column; gap: 24px; margin-top: 36px; padding: 26px 22px; border-radius: 19px; }
    .official-capability-cta .official-button { justify-content: center; width: 100%; }
  }

  /* 产品能力页使用当前客户端的聚合消息结构，不再用抽象营销缩略图。 */
  .official-capability-intro { padding: 34px 0 38px; }
  .official-capability-intro .official-wrap { display: block; }
  .official-capability-thesis { display: block; max-width: none; }
  .official-capability-thesis h1 { max-width: none; font-size: clamp(46px, 4.1vw, 62px); white-space: nowrap; }
  .official-capability-thesis h1 span { display: inline; }
  .official-capability-thesis h1 span + span { margin-left: .2em; }
  .official-capability-thesis-support { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px 34px; min-width: 0; margin-top: 20px; }
  .official-capability-thesis-support > p { max-width: 58em; margin: 0; color: #49677e; font-size: 15px; line-height: 1.65; text-wrap: pretty; }
  .official-capability-thesis-support .official-actions { justify-content: flex-end; margin: 0; }
  .official-capability-thesis-support .official-capability-proofline { grid-column: 1 / -1; margin-top: 2px; }
  .official-capability-product-shot { margin-top: 30px; overflow: hidden; border-radius: 28px; background: #f4f7fa; box-shadow: 0 34px 80px rgb(28 71 98 / .2); scroll-margin-top: 86px; }
  .official-capability-product-shot::after { content: none; }
  .official-capability-product-note { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 46px; padding: 10px 18px; border-bottom: 1px solid #d7e1e8; background: rgb(255 255 255 / .94); color: #63798a; font-size: 11px; }
  .official-capability-product-note span { display: inline-flex; align-items: center; gap: 8px; color: #173c5d; font-weight: 820; }
  .official-capability-product-note i { width: 8px; height: 8px; border-radius: 50%; background: #22c8a1; box-shadow: 0 0 0 4px rgb(34 200 161 / .12); }
  .official-capability-client-shell { grid-template-columns: 158px minmax(0, 1fr); height: 592px; background: #f5f7fa; }
  .official-capability-client-shell > aside { padding: 16px 11px 14px; border-right-color: #d9e1e8; background: #fff; }
  .official-capability-client-brand { gap: 9px; padding: 0 7px 16px; font-size: 12px; }
  .official-capability-client-brand img { width: 28px; height: 28px; }
  .official-capability-client-shell nav { gap: 3px; }
  .official-capability-client-shell nav span { display: flex; align-items: center; gap: 9px; min-height: 36px; padding: 7px 9px; border-radius: 9px; font-size: 10px; }
  .official-capability-client-shell nav span b { display: inline-flex; align-items: center; justify-content: center; width: 18px; color: #708697; font-size: 12px; }
  .official-capability-client-shell nav span.is-active { background: #eaf4ff; color: #1670cd; }
  .official-capability-client-shell nav span.is-active b { color: #1670cd; }
  .official-capability-client-main { display: grid; grid-template-rows: 58px minmax(0, 1fr); min-width: 0; padding: 0; }
  .official-capability-client-main > header { min-height: 58px; padding: 9px 15px; border-bottom: 1px solid #d9e1e8; background: rgb(255 255 255 / .94); }
  .official-capability-client-main > header > div:first-child { display: grid; gap: 2px; }
  .official-capability-client-main > header strong { font-size: 13px; }
  .official-capability-client-main > header small { font-size: 8px; }
  .official-capability-client-main > header > div:last-child { display: flex; align-items: center; gap: 6px; }
  .official-capability-client-main > header span,
  .official-capability-client-main > header b { padding: 6px 8px; border: 1px solid #d8e2e8; border-radius: 8px; background: #fff; color: #607789; font-size: 8px; font-weight: 760; }
  .official-capability-client-main > header b { border-color: #c7eee2; color: #15916f; }
  .official-capability-client-workspace { grid-template-columns: 202px minmax(300px, 1fr) 242px; height: auto; border: 0; border-radius: 0; background: #fff; }
  .official-capability-client-list { padding: 0; border-right-color: #d9e1e8; background: #fbfcfd; }
  .official-client-list-head { display: grid; gap: 2px; padding: 14px 14px 10px; }
  .official-client-list-head strong { color: #193c5b; font-size: 12px; }
  .official-client-list-head small { color: #8294a2; font-size: 8px; }
  .official-capability-client-list label { display: flex; align-items: center; gap: 6px; margin: 0 10px; padding: 7px 9px; border: 1px solid #dbe4e9; border-radius: 8px; background: #fff; color: #8093a2; }
  .official-capability-client-list input { width: 100%; min-width: 0; border: 0; outline: 0; background: transparent; color: #23445e; font: 500 8px/1.2 inherit; }
  .official-client-filter { display: flex; gap: 13px; padding: 11px 14px 8px; color: #8093a2; font-size: 8px; }
  .official-client-filter b { color: #1872c9; }
  .official-capability-client-list > button { position: relative; display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 9px; width: calc(100% - 12px); margin: 2px 6px; padding: 9px 8px; border: 0; border-radius: 9px; background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer; }
  .official-capability-client-list > button.is-selected { background: #e9f3fc; }
  .official-capability-client-list > button img { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; }
  .official-capability-client-list > button p { position: relative; min-width: 0; margin: 0; padding-right: 30px; }
  .official-capability-client-list > button strong,
  .official-capability-client-list > button span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .official-capability-client-list > button strong { color: #24445d; font-size: 9px; }
  .official-capability-client-list > button span { margin-top: 4px; color: #758a99; font-size: 7px; }
  .official-capability-client-list > button small { position: absolute; top: 1px; right: 0; color: #94a3ae; font-size: 6px; }
  .official-capability-client-chat { display: grid; grid-template-rows: 55px minmax(0, 1fr) auto; min-width: 0; padding: 0; background: linear-gradient(145deg, #f6fafc, #fdf8fa); }
  .official-capability-client-chat-head { align-items: center; padding: 10px 13px; border-bottom-color: #d9e2e8; background: rgb(255 255 255 / .88); }
  .official-capability-client-chat-head > div { display: flex; align-items: center; gap: 8px; }
  .official-capability-client-chat-head img { width: 30px; height: 30px; border-radius: 50%; object-fit: cover; }
  .official-capability-client-chat-head span { display: grid; gap: 2px; }
  .official-capability-client-chat-head strong { font-size: 10px; }
  .official-capability-client-chat-head small { color: #8395a3; font-size: 7px; }
  .official-capability-client-chat-head > button { border: 0; background: transparent; color: #7890a1; font-size: 10px; }
  .official-capability-client-messages { display: flex; flex-direction: column; gap: 12px; min-height: 0; padding: 17px 18px; overflow: hidden; }
  .official-capability-client-messages article { width: fit-content; max-width: 79%; padding: 11px 12px 9px; border: 1px solid #dae4e9; border-radius: 5px 13px 13px 13px; background: #fff; box-shadow: 0 5px 14px rgb(40 77 101 / .06); }
  .official-capability-client-messages article.is-outgoing { align-self: flex-end; border-radius: 13px 5px 13px 13px; background: #edf8f2; }
  .official-client-message-meta { display: flex; gap: 7px; margin-bottom: 7px; color: #8193a1; font-size: 7px; }
  .official-capability-client-messages article > p { margin: 0; color: #24465e; font-size: 10px; line-height: 1.48; }
  .official-client-inline-translation { margin-top: 9px; padding-top: 8px; border-top: 1px solid #dde6eb; }
  .official-client-inline-translation > span { display: block; margin-bottom: 4px; color: #e64073; font-size: 7px; font-weight: 820; }
  .official-client-inline-translation p { margin: 0; color: #416579; font-size: 9px; line-height: 1.48; }
  .official-capability-client-messages article footer { display: flex; justify-content: flex-end; gap: 5px; margin-top: 7px; }
  .official-capability-client-messages article footer button { padding: 3px 6px; border: 0; border-radius: 5px; background: #edf5f8; color: #39708a; font-size: 6px; font-weight: 750; cursor: pointer; }
  .official-capability-client-composer { position: static; display: block; margin: 0 12px 12px; padding: 0; border: 1px solid #d7e2e8; border-radius: 11px; background: #fff; color: #8093a2; font-size: 8px; }
  .official-client-binding { display: flex; align-items: center; gap: 6px; padding: 7px 10px 0; color: #668194; font-size: 7px; }
  .official-client-binding i { width: 6px; height: 6px; border-radius: 50%; background: #22bf91; }
  .official-capability-client-composer textarea { width: 100%; min-height: 55px; padding: 8px 10px; border: 0; outline: 0; resize: none; background: transparent; color: #23455e; font: 600 9px/1.45 inherit; }
  .official-capability-client-composer footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 7px 8px; border-top: 1px solid #e2e8ec; }
  .official-capability-client-composer footer div { display: flex; gap: 5px; }
  .official-capability-client-composer button { padding: 5px 8px; border: 1px solid #d7e2e8; border-radius: 7px; background: #fff; color: #607789; font-size: 7px; font-weight: 780; cursor: pointer; }
  .official-capability-client-composer button.is-ai { border-color: #c8e8ef; color: #1887a4; }
  .official-capability-client-composer button.is-send { border-color: #d9e2e8; background: #e8edf0; color: #9aa8b2; cursor: not-allowed; }
  .official-capability-client-assistant { display: grid; grid-template-rows: 55px minmax(0, 1fr); min-width: 0; padding: 0; border-left-color: #d9e1e8; background: #fbfcfd; }
  .official-client-assistant-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 10px; border-bottom: 1px solid #d9e1e8; }
  .official-client-assistant-head > span { display: grid; gap: 2px; }
  .official-client-assistant-head strong { color: #193d5b; font-size: 10px; }
  .official-client-assistant-head small { color: #8496a4; font-size: 6px; }
  .official-client-assistant-head b { padding: 4px 5px; border-radius: 5px; background: #e8f7fb; color: #188aa6; font-size: 6px; }
  .official-client-assistant-body { display: grid; grid-template-columns: 46px minmax(0, 1fr); min-height: 0; }
  .official-client-assistant-body > nav { display: grid; align-content: start; gap: 5px; padding: 9px 6px; border-right: 1px solid #dde5ea; }
  .official-client-assistant-body > nav button { display: grid; place-items: center; gap: 2px; min-height: 43px; padding: 4px; border: 0; border-radius: 7px; background: transparent; color: #718695; font-size: 9px; cursor: pointer; }
  .official-client-assistant-body > nav button span { font-size: 6px; }
  .official-client-assistant-body > nav button.is-active { background: #eaf5fb; color: #147fa2; }
  .official-client-assistant-panel { min-width: 0; padding: 15px 12px; }
  .official-client-context-label { color: #df5c91; font-size: 7px; font-weight: 820; }
  .official-client-assistant-panel h3 { margin: 7px 0 0; color: #193e5d; font-size: 12px; }
  .official-client-assistant-panel > p { margin: 8px 0 0; color: #617b8f; font-size: 8px; line-height: 1.55; }
  .official-client-assistant-panel dl { display: grid; gap: 7px; margin: 14px 0 0; }
  .official-client-assistant-panel dl div { padding: 8px; border: 1px solid #dfe7eb; border-radius: 8px; background: #fff; }
  .official-client-assistant-panel dt { color: #8596a3; font-size: 6px; }
  .official-client-assistant-panel dd { margin: 4px 0 0; color: #28506a; font-size: 8px; font-weight: 760; }
  .official-client-suggestion { margin-top: 12px; padding: 9px; border-radius: 9px; background: linear-gradient(135deg, #eaf9fd, #fff1f7); }
  .official-client-suggestion span { color: #168aa8; font-size: 6px; font-weight: 820; }
  .official-client-suggestion p { margin: 6px 0 0; color: #315a72; font-size: 8px; line-height: 1.48; }
  .official-client-assistant-panel > button { width: 100%; margin-top: 10px; padding: 8px; border: 0; border-radius: 8px; background: linear-gradient(105deg, #16b7d5, #dd69a1); color: #fff; font-size: 8px; font-weight: 820; cursor: pointer; }
  .official-capability-product-shot figcaption { position: static; align-items: center; padding: 15px 18px; border-top: 1px solid #d6e1e7; background: #fff; color: #5d7587; }
  .official-capability-product-shot figcaption span { font-size: 9px; letter-spacing: .03em; }
  .official-capability-product-shot figcaption strong { max-width: 560px; color: #173e5d; font-size: 12px; }

  .official-capability-editorial { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(260px, .65fr); gap: clamp(48px, 7vw, 100px); align-items: stretch; }
  .official-capability-editorial ol { margin: 0; padding: 0; border-top: 1px solid #d1e2e9; list-style: none; }
  .official-capability-editorial li { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 14px; padding: 24px 0; border-bottom: 1px solid #d1e2e9; }
  .official-capability-editorial li > span { padding-top: 3px; color: #1ba2c0; font: 820 10px/1 ui-monospace, SFMono-Regular, Menlo, monospace; }
  .official-capability-editorial strong { color: #173a5d; font-size: 18px; }
  .official-capability-editorial p { margin: 8px 0 0; color: #637f93; font-size: 13px; line-height: 1.65; }
  .official-capability-editorial aside { display: flex; flex-direction: column; justify-content: center; padding: 28px; border: 1px solid #d2e5ec; border-radius: 22px; background: linear-gradient(145deg, #e8faff, #fff4f8); }
  .official-capability-editorial aside span { color: #718a9c; font-size: 10px; font-weight: 800; }
  .official-capability-editorial aside strong { margin-top: 13px; font-size: 16px; }
  .official-capability-editorial aside a { margin-top: 22px; color: #1485a4; font-size: 11px; font-weight: 820; }
  .official-capability-agent-story { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr); gap: clamp(50px, 7vw, 104px); align-items: center; }
  .official-capability-agent-story > div { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid #cfe0e8; border-bottom: 1px solid #cfe0e8; }
  .official-capability-agent-story article { padding: 28px 25px 28px 0; }
  .official-capability-agent-story article + article { padding-left: 25px; border-left: 1px solid #cfe0e8; }
  .official-capability-agent-story article span { color: #168fac; font-size: 9px; font-weight: 850; letter-spacing: .08em; }
  .official-capability-agent-story h3 { margin: 12px 0 0; color: #153a59; font-size: 18px; line-height: 1.35; }
  .official-capability-agent-story p { margin: 10px 0 0; color: #617d91; font-size: 12px; line-height: 1.65; }
  .official-capability-agent-story aside { position: relative; overflow: hidden; min-height: 310px; padding: 34px 32px; border: 1px solid rgb(57 163 194 / .18); border-radius: 25px; background: linear-gradient(138deg, rgb(255 255 255 / .9), rgb(225 248 254 / .86) 56%, rgb(255 235 244 / .82)); }
  .official-capability-agent-story aside img { position: absolute; right: -18px; bottom: -20px; width: 150px; height: 166px; object-fit: contain; }
  .official-capability-agent-story aside span { color: #c45487; font-size: 10px; font-weight: 830; }
  .official-capability-agent-story aside h3 { max-width: 270px; margin-top: 13px; font-size: 22px; }
  .official-capability-agent-story aside a { position: relative; z-index: 1; display: inline-flex; margin-top: 24px; color: #1485a4; font-size: 11px; font-weight: 820; }
  .official-capability-agent-story .official-capability-agent-console { min-height: 0; padding: 22px; }
  .official-capability-agent-console-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 15px; border-bottom: 1px solid #d1e4eb; }
  .official-capability-agent-console-head > div { display: grid; gap: 5px; }
  .official-capability-agent-console-head > div > span { color: #c45487; font-size: 10px; font-weight: 830; }
  .official-capability-agent-console-head strong { color: #173a59; font-size: 15px; }
  .official-capability-agent-story .official-capability-agent-console-head img { position: static; width: 58px; height: 64px; object-fit: contain; filter: drop-shadow(0 9px 12px rgb(43 79 114 / .14)); }
  .official-capability-agent-console-context { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding-top: 14px; }
  .official-capability-agent-console-context > span { display: grid; gap: 4px; padding: 9px 10px; border: 1px solid #d8e7ed; border-radius: 11px; background: rgb(255 255 255 / .68); color: #7890a1; font-size: 8px; }
  .official-capability-agent-console-context strong { color: #31556e; font-size: 10px; }
  .official-capability-agent-console-reply { margin-top: 10px; padding: 12px 13px; border-radius: 12px; background: linear-gradient(135deg, rgb(230 249 253 / .92), rgb(255 240 247 / .82)); }
  .official-capability-agent-console-reply > span { color: #168fac; font-size: 8px; font-weight: 830; }
  .official-capability-agent-console-reply p { min-height: 43px; margin: 7px 0 0; color: #244b63; font-size: 11px; font-weight: 660; line-height: 1.55; }
  .official-capability-agent-console-guard { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
  .official-capability-agent-console-guard > span { padding: 5px 8px; border: 1px solid #d5e5eb; border-radius: 999px; background: rgb(255 255 255 / .72); color: #527187; font-size: 8px; font-weight: 760; }
  .official-capability-agent-console-actions { display: flex; align-items: center; gap: 8px; margin-top: 13px; }
  .official-capability-agent-console-actions button,
  .official-capability-agent-console-actions a { box-sizing: border-box; height: 42px; min-height: 42px; display: inline-flex; flex: 1 1 0; align-items: center; justify-content: center; margin: 0; border-radius: 999px; padding: 0 15px; font-size: 10px; font-weight: 820; line-height: 1; cursor: pointer; }
  .official-capability-agent-console-actions button { border: 0; background: linear-gradient(110deg, #178eae, #5f83bd 58%, #b95d8c); color: #fff; box-shadow: 0 7px 16px rgb(61 123 161 / .2); }
  .official-capability-agent-console-actions button:hover { background: linear-gradient(110deg, #117f9e, #5477ae 58%, #aa517f); }
  .official-capability-agent-console-actions button:active { transform: scale(.98); }
  .official-capability-agent-console-actions button:focus-visible,
  .official-capability-agent-console-actions a:focus-visible { outline: 3px solid rgb(26 179 210 / .24); outline-offset: 2px; }
  .official-capability-agent-story .official-capability-agent-console-actions a { margin-top: 0; border: 1px solid #cfe1e9; background: rgb(255 255 255 / .72); color: #31566f; }

  [data-client-original][hidden] { display: none; }
  [data-capability-client-demo].is-working [data-client-translation],
  [data-capability-client-demo].is-working [data-client-suggestion] { opacity: .45; }
  [data-capability-client-demo] button:focus-visible,
  [data-capability-client-demo] textarea:focus-visible,
  [data-capability-client-demo] input:focus-visible { outline: 2px solid rgb(28 164 199 / .45); outline-offset: 1px; }

  .official-capability-product-shot.is-real-client .official-capability-client-shell { display: none; }
  .official-capability-real-frame { display: block; width: 100%; height: 720px; border: 0; background: #f4f7fb; }
  .official-capability-shot-viewport { --shot-rx: 0deg; --shot-ry: 0deg; position: relative; overflow: hidden; padding: 8px; background: linear-gradient(135deg, #e7f7ff, #f9edf5); perspective: 1500px; }
  .official-capability-shot-stage { position: relative; overflow: hidden; border-radius: 15px; background: #eff5fb; }
  .official-capability-shot-stage > img { display: block; width: 100%; height: auto; aspect-ratio: 1586 / 992; object-fit: cover; }
  .official-capability-shot-hotspot { --spot-color: #208ce9; position: absolute; left: var(--spot-x); top: var(--spot-y); z-index: 2; width: 22px; height: 22px; padding: 0; border: 4px solid rgb(255 255 255 / .96); border-radius: 50%; background: var(--spot-color); box-shadow: 0 0 0 0 color-mix(in srgb, var(--spot-color) 42%, transparent), 0 5px 18px rgb(19 65 105 / .25); cursor: pointer; transform: translate(-50%, -50%); transition: scale 180ms ease, box-shadow 180ms ease; }
  .official-capability-shot-hotspot::before { position: absolute; inset: -5px; border: 1px solid color-mix(in srgb, var(--spot-color) 45%, white); border-radius: inherit; content: ''; animation: official-capability-pulse 2.2s ease-out infinite; }
  .official-capability-shot-hotspot span { position: absolute; left: 50%; bottom: calc(100% + 10px); width: max-content; max-width: 130px; padding: 6px 9px; border: 1px solid rgb(255 255 255 / .8); border-radius: 999px; background: rgb(17 49 82 / .9); color: #fff; font-size: 9px; font-weight: 800; opacity: 0; pointer-events: none; translate: -50% 4px; transition: opacity 160ms ease, translate 160ms ease; }
  .official-capability-shot-hotspot:hover,
  .official-capability-shot-hotspot:focus-visible,
  .official-capability-shot-hotspot.is-active { scale: 1.16; box-shadow: 0 0 0 8px color-mix(in srgb, var(--spot-color) 18%, transparent), 0 7px 22px rgb(19 65 105 / .28); outline: none; }
  .official-capability-shot-hotspot:hover span,
  .official-capability-shot-hotspot:focus-visible span,
  .official-capability-shot-hotspot.is-active span { opacity: 1; translate: -50% 0; }
  .official-capability-shot-hotspot.is-pet { --spot-color: #df7f44; width: 7%; height: 10%; }
  .official-capability-shot-hotspot.is-translation { --spot-color: #20a6dc; }
  .official-capability-shot-hotspot.is-reply { --spot-color: #7069e8; }
  .official-capability-shot-hotspot.is-supervision { --spot-color: #38b678; }
  .official-capability-shot-stage > img { transition: filter 240ms ease; }
  .official-capability-shot-hotspot { width: 11%; height: 11%; border: 1px solid transparent; border-radius: 13px; background: transparent; box-shadow: none; }
  .official-capability-shot-hotspot.is-translation { width: 17%; height: 13%; }
  .official-capability-shot-hotspot.is-reply { width: 8%; height: 6%; }
  .official-capability-shot-hotspot.is-supervision { width: 17%; height: 86%; }
  .official-capability-shot-hotspot.is-navigation { --spot-color: #3486df; width: 12%; height: 5.2%; }
  .official-capability-shot-hotspot.is-pet span { top: calc(100% + 8px); bottom: auto; min-width: 76px; padding: 7px 11px; font-size: 11px; line-height: 1.2; text-align: center; }
  .official-capability-shot-hotspot::before { inset: 8px 8px auto auto; width: 9px; height: 9px; border: 3px solid #fff; background: var(--spot-color); box-shadow: 0 0 0 0 color-mix(in srgb, var(--spot-color) 44%, transparent); animation: official-capability-control-pulse 2.2s ease-out infinite; }
  .official-capability-shot-hotspot:hover,
  .official-capability-shot-hotspot:focus-visible,
  .official-capability-shot-hotspot.is-active { border-color: color-mix(in srgb, var(--spot-color) 58%, white); background: color-mix(in srgb, var(--spot-color) 10%, transparent); box-shadow: inset 0 0 0 1px rgb(255 255 255 / .75), 0 7px 22px rgb(19 65 105 / .16); scale: 1; }
  .official-capability-shot-hotspot span { bottom: calc(100% + 5px); }
  @keyframes official-capability-control-pulse { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--spot-color) 38%, transparent); } 70%, 100% { box-shadow: 0 0 0 9px transparent; } }
  @keyframes official-capability-pulse { 0% { opacity: .8; scale: .7; } 75%, 100% { opacity: 0; scale: 1.75; } }

  @media (max-width: 1020px) {
    .official-capability-thesis h1 { font-size: 46px; }
    .official-capability-thesis-support { grid-template-columns: 1fr; gap: 14px; }
    .official-capability-thesis-support .official-actions { justify-content: flex-start; }
    .official-capability-thesis-support .official-capability-proofline { grid-column: auto; margin-top: 0; }
    .official-capability-client-shell { grid-template-columns: 120px minmax(0, 1fr); height: 560px; }
    .official-capability-client-workspace { grid-template-columns: 165px minmax(270px, 1fr) 190px; }
    .official-capability-client-shell nav span { gap: 6px; padding-inline: 7px; font-size: 8px; }
    .official-capability-agent-story { grid-template-columns: 1fr; }
  }

  @media (max-width: 760px) {
    .official-capability-intro { padding: 34px 0 38px; }
    .official-capability-intro .official-wrap { width: calc(100% - 28px); }
    .official-capability-thesis h1 { font-size: 43px; white-space: normal; }
    .official-capability-thesis h1 span { display: block; }
    .official-capability-thesis h1 span + span { margin-left: 0; }
    .official-capability-thesis-support .official-actions { align-items: stretch; flex-direction: column; }
    .official-capability-thesis-support .official-button { justify-content: center; width: 100%; }
    .official-capability-product-shot { margin-top: 26px; border-radius: 20px; }
    .official-capability-product-note { align-items: flex-start; flex-direction: column; gap: 4px; padding: 11px 13px; }
    .official-capability-client-shell { grid-template-columns: 56px minmax(0, 1fr); height: auto; }
    .official-capability-client-shell > aside { padding: 10px 6px; }
    .official-capability-client-brand { justify-content: center; padding: 0 0 11px; }
    .official-capability-client-brand strong { display: none; }
    .official-capability-client-brand img { width: 25px; height: 25px; }
    .official-capability-client-shell nav span { justify-content: center; min-height: 36px; padding: 6px; font-size: 0; }
    .official-capability-client-shell nav span b { width: auto; font-size: 12px; }
    .official-capability-client-main { grid-template-rows: auto auto; }
    .official-capability-client-main > header { min-height: 54px; padding: 8px 10px; }
    .official-capability-client-main > header span:first-child { display: none; }
    .official-capability-client-workspace { display: block; height: auto; }
    .official-capability-client-list { display: none; }
    .official-capability-client-chat { min-height: 490px; }
    .official-capability-client-messages { min-height: 252px; padding: 14px 11px; }
    .official-capability-client-messages article { max-width: 92%; }
    .official-capability-client-composer { margin: 0 8px 9px; }
    .official-capability-client-assistant { display: grid; min-height: 330px; border-top: 1px solid #d9e1e8; border-left: 0; }
    .official-client-assistant-body { grid-template-columns: 50px minmax(0, 1fr); }
    .official-capability-product-shot figcaption { align-items: flex-start; flex-direction: column; gap: 5px; padding: 12px 14px; }
    .official-capability-product-shot figcaption strong { text-align: left; }
    .official-capability-shot-viewport { padding: 4px; }
    .official-capability-shot-stage { border-radius: 12px; }
    .official-capability-shot-hotspot { min-width: 42px; min-height: 34px; border-width: 1px; }
    .official-capability-shot-hotspot span { display: none; }
    .official-capability-shot-hotspot.is-active span { display: block; padding: 5px 7px; font-size: 8px; }
    .official-capability-shot-hotspot.is-pet span { top: calc(100% + 4px); min-width: 60px; }
    .official-capability-editorial,
    .official-capability-agent-story { grid-template-columns: 1fr; gap: 32px; }
    .official-capability-agent-story > div { grid-template-columns: 1fr; }
    .official-capability-agent-story article,
    .official-capability-agent-story article + article { padding: 22px 0; border-left: 0; }
    .official-capability-agent-story article + article { border-top: 1px solid #cfe0e8; }
    .official-capability-agent-console-actions { align-items: stretch; flex-direction: column; }
    .official-capability-agent-console-actions button,
    .official-capability-agent-console-actions a { width: 100%; }
  }

  /* 与 src/renderer 的默认 tokens、Apple grouped shell 和 UnifiedInbox 保持一致。 */
  .official-capability-product-shot {
    --kt-primary: #356ae6;
    --kt-primary-light: #edf2ff;
    --kt-bg-main: #f5f6f8;
    --kt-bg-surface: #fff;
    --kt-bg-subtle: #f3f5f7;
    --kt-bg-elevated: #fff;
    --kt-bg-hover: #eceff3;
    --kt-border: #dfe3e8;
    --kt-border-light: #eaedf0;
    --kt-border-strong: #cbd2da;
    --kt-text-primary: #172033;
    --kt-text-secondary: #4b5565;
    --kt-text-muted: #6b7280;
    --kt-radius-control: 14px;
    --kt-radius-panel: 20px;
    --kt-radius-overlay: 24px;
    --telegram-canvas: #e5ece1;
    border-color: var(--kt-border);
    background: #f4f7fb;
  }
  .official-capability-client-shell {
    grid-template-columns: 176px minmax(0, 1fr);
    gap: 10px;
    height: 650px;
    padding: 10px;
    background: #f4f7fb;
  }
  .official-capability-client-shell > aside {
    height: 100%;
    overflow: hidden;
    padding: 10px 7px;
    border: 0;
    border-radius: 20px;
    background:
      radial-gradient(circle at 14% 5%, rgba(83, 143, 255, .1), transparent 24%),
      radial-gradient(circle at 92% 52%, rgba(126, 94, 255, .06), transparent 32%),
      linear-gradient(156deg, rgba(255, 255, 255, .82), rgba(242, 247, 255, .68) 54%, rgba(248, 246, 255, .72));
    box-shadow: 8px 0 30px rgba(45, 66, 105, .055), inset -1px 0 0 rgba(91, 119, 166, .08), inset 0 1px 0 rgba(255, 255, 255, .92);
  }
  .official-capability-client-brand { justify-content: flex-start; padding: 0 5px 10px; }
  .official-capability-client-brand img { width: 40px; height: 40px; border-radius: 12px; object-fit: cover; }
  .official-capability-client-brand strong { display: block; color: var(--kt-text-primary); font-size: 14px; }
  .official-capability-client-shell nav { justify-items: stretch; gap: 3px; }
  .official-capability-client-shell nav span {
    position: relative;
    display: flex;
    width: 100%;
    min-height: 39px;
    padding: 4px 8px;
    border: 0;
    border-radius: 14px;
    background: transparent;
    color: var(--kt-text-primary);
    font-size: 10px;
    box-shadow: none;
  }
  .official-capability-client-shell nav span:nth-child(3) { color: #1aac64; border-color: rgba(26,172,100,.22); }
  .official-capability-client-shell nav span:nth-child(4) { color: #188dcc; border-color: rgba(24,141,204,.22); }
  .official-capability-client-shell nav span:nth-child(5) { color: #16a466; border-color: rgba(22,164,102,.22); }
  .official-capability-client-shell nav span:nth-child(7) { color: #7265e6; border-color: rgba(114,101,230,.22); }
  .official-capability-client-shell nav span:nth-child(8) { color: #715ce0; border-color: rgba(113,92,224,.22); }
  .official-capability-client-shell nav span:nth-child(9) { color: #159b86; border-color: rgba(21,155,134,.22); }
  .official-capability-client-shell nav span b { display: grid; width: 30px; height: 30px; flex: 0 0 30px; place-items: center; border: 1px solid color-mix(in srgb, currentColor 24%, #fff); border-radius: 50%; background: radial-gradient(circle at 30% 18%, #fff 0 12%, rgba(255,255,255,.42) 30%, transparent 52%), linear-gradient(145deg, color-mix(in srgb, currentColor 7%, #fff), color-mix(in srgb, currentColor 14%, #f5f8ff)); color: inherit; font-size: 10px; font-weight: 820; box-shadow: 0 2px 7px color-mix(in srgb, currentColor 11%, transparent), inset 0 1px 0 rgba(255,255,255,.92); }
  .official-capability-client-shell nav span:nth-child(5) b { font-size: 5px; }
  .official-capability-client-shell nav span.is-active {
    background: #e8eef8;
    color: #356ae6;
    box-shadow: none;
  }
  .official-capability-client-shell nav span.is-active::before {
    position: absolute;
    top: 5px;
    bottom: 5px;
    left: -8px;
    width: 3px;
    border-radius: 2px;
    background: #356ae6;
    content: '';
  }
  .official-capability-client-main { grid-template-rows: 64px minmax(0, 1fr); gap: 10px; }
  .official-capability-client-main > header {
    min-height: 64px;
    padding: 10px 14px;
    border: 0;
    border-radius: 20px;
    background:
      radial-gradient(circle at 18% -60%, rgba(64,130,255,.14), transparent 34%),
      radial-gradient(circle at 72% -90%, rgba(126,94,255,.1), transparent 32%),
      linear-gradient(112deg, rgba(255,255,255,.86), rgba(245,249,255,.78) 52%, rgba(252,248,255,.82));
    box-shadow: 0 8px 28px rgba(40,59,94,.055), inset 0 -1px 0 rgba(84,111,158,.09), inset 0 1px 0 rgba(255,255,255,.94);
  }
  .official-capability-client-main > header strong { color: var(--kt-text-primary); font-size: 16px; }
  .official-capability-client-main > header small { color: var(--kt-text-muted); font-size: 8px; }
  .official-capability-client-main > header span,
  .official-capability-client-main > header b { border-color: var(--kt-border); border-radius: var(--kt-radius-control); background: rgba(255,255,255,.78); color: var(--kt-text-secondary); }
  .official-capability-client-main > header span:first-child { border-color: #c9d8ff; background: #edf2ff; color: #356ae6; }
  .official-capability-client-workspace {
    grid-template-columns: 252px minmax(300px, 1fr) 260px;
    gap: 0;
    min-height: 0;
    overflow: hidden;
    padding: 0;
    border: 1px solid color-mix(in srgb, var(--kt-border) 78%, #fff);
    border-radius: 20px;
    background: color-mix(in srgb, var(--kt-bg-surface) 94%, var(--kt-bg-main));
    box-shadow: 0 1px 0 rgba(255,255,255,.68), 0 10px 30px rgba(32,49,74,.075);
  }
  .official-capability-client-list { overflow: hidden; border-right: 1px solid color-mix(in srgb, var(--kt-border-light) 82%, var(--kt-bg-main)); border-radius: 15px 0 0 15px; background: transparent; box-shadow: inset -1px 0 0 color-mix(in srgb, var(--kt-bg-main) 46%, transparent); }
  .official-capability-client-list label { border-color: var(--kt-border); border-radius: 12px; background: var(--kt-bg-surface); }
  .official-client-filter b { padding: 6px 12px; border-radius: 12px; background: #176cf1; color: #fff; }
  .official-client-filter span { padding: 6px 10px; border-radius: 12px; background: var(--kt-bg-subtle); }
  .official-capability-client-list > button { width: auto; margin: 0 6px 6px; border-radius: 15px; background: color-mix(in srgb, var(--kt-bg-surface) 96%, transparent); }
  .official-capability-client-list > button.is-selected { padding-left: 7px; border-left: 3px solid #176cf1; background: color-mix(in srgb, var(--kt-primary-light) 74%, var(--kt-bg-surface)); }
  .official-capability-client-chat { grid-template-rows: 58px minmax(0, 1fr) auto; background: transparent; }
  .official-capability-client-chat-head { margin: 6px 6px 0; padding: 9px 12px; border: 0; border-radius: 15px; background: var(--kt-bg-surface); box-shadow: 0 12px 26px -25px rgba(25,42,66,.8); }
  .official-capability-client-messages { margin: 6px 6px 0; padding: 17px 18px; border-radius: 15px 15px 0 0; background: var(--telegram-canvas); }
  .official-capability-client-messages article { min-inline-size: min(18rem, 100%); max-width: min(90%, 620px); padding: 0; border: 0; border-radius: 12px 12px 12px 4px; background: #fff; box-shadow: 0 1px 2px rgba(39,61,34,.18); }
  .official-capability-client-messages article.is-outgoing { border-radius: 12px 12px 4px 12px; background: #dcf8c9; }
  .official-client-message-meta { margin: 0; padding: 6px 9px 0; color: #71806a; font-size: 7px; }
  .official-capability-client-messages article > p { padding: 4px 9px; color: #26344c; font-size: 10px; }
  .official-client-inline-translation { margin: 4px 9px 0; padding: 7px 2px 5px 10px; border: 0; border-left: 3px solid #e64073; }
  .official-client-inline-translation > span { display: none; }
  .official-client-inline-translation p { color: var(--kt-text-primary); }
  .official-capability-client-messages article footer { padding: 2px 9px 8px; }
  .official-capability-client-messages article footer button { border: 1px solid color-mix(in srgb, #e64073 52%, transparent); border-radius: 999px; background: color-mix(in srgb, var(--kt-bg-surface) 82%, transparent); color: #e64073; }
  .official-capability-client-composer { margin: 0 6px 6px; padding: 5px 6px; border: 0; border-radius: 0 0 15px 15px; background: var(--telegram-canvas); box-shadow: none; }
  .official-capability-client-composer textarea { height: 50px; min-height: 50px; margin-top: 4px; padding: 10px 12px 6px; border-radius: 18px; background: #fff; color: #26344c; box-shadow: 0 1px 3px rgba(39,61,34,.2); }
  .official-capability-client-composer footer { margin-top: 4px; padding: 5px 6px; border: 0; border-radius: 18px; background: #fff; box-shadow: 0 1px 3px rgba(39,61,34,.2); }
  .official-capability-client-composer button { border-color: var(--kt-border-strong); border-radius: 999px; background: #f8fafc; color: #61728c; }
  .official-capability-client-composer button.is-ai { border-color: #c7d7ff; background: #edf2ff; color: #356ae6; }
  .official-capability-client-assistant { grid-template-rows: 58px minmax(0, 1fr); overflow: hidden; border-left: 1px solid var(--kt-border-light); background: transparent; }
  .official-client-assistant-head { margin: 6px 6px 0; padding: 9px 10px; border: 0; border-radius: 15px; background: var(--kt-bg-surface); }
  .official-client-assistant-body { grid-template-columns: 44px minmax(0, 1fr); gap: 8px; padding: 6px; }
  .official-client-assistant-body > nav { gap: 8px; padding: 8px 4px; border: 0; background: transparent; }
  .official-client-assistant-body > nav button { width: 32px; min-height: 32px; height: 32px; padding: 0; border: 1px solid color-mix(in srgb, #356ae6 28%, #fff); border-radius: 50%; background: radial-gradient(circle at 30% 18%, #fff 0 12%, rgba(255,255,255,.42) 30%, transparent 52%), linear-gradient(145deg, #f7f9ff, #e9efff); color: #356ae6; box-shadow: 0 2px 7px rgba(53,106,230,.12), inset 0 1px 0 rgba(255,255,255,.92); }
  .official-client-assistant-body > nav button span { display: none; }
  .official-client-assistant-body > nav button:nth-child(2) { color: #1e91bd; border-color: rgba(30,145,189,.28); }
  .official-client-assistant-body > nav button:nth-child(3) { color: #249b6e; border-color: rgba(36,155,110,.28); }
  .official-client-assistant-body > nav button.is-active { box-shadow: 0 0 0 3px rgba(53,106,230,.1), 0 4px 11px rgba(53,106,230,.15), inset 0 1px 0 #fff; }
  .official-client-assistant-panel { overflow: hidden; padding: 13px 10px; border: 1px solid color-mix(in srgb, var(--kt-border) 78%, #fff); border-radius: 14px; background: var(--kt-bg-surface); }
  .official-client-assistant-panel dl div { border-color: var(--kt-border); border-radius: 14px; background: var(--kt-bg-surface); }
  .official-client-suggestion { border: 1px solid #c7d5f6; border-radius: 14px; background: #f2f5ff; }
  .official-client-suggestion { position: relative; min-height: 98px; padding-right: 64px; }
  .official-client-suggestion::after { position: absolute; right: -2px; bottom: -4px; width: 68px; height: 68px; background: url('/official-assets/b14-maltese-boy-chibi-upright.png') center / contain no-repeat; content: ''; filter: drop-shadow(0 6px 8px rgba(38,74,103,.14)); pointer-events: none; }

  @media (max-width: 1020px) and (min-width: 761px) {
    .official-capability-client-shell { grid-template-columns: 150px minmax(0, 1fr); height: 610px; }
    .official-capability-client-workspace { grid-template-columns: 190px minmax(260px, 1fr) 210px; }
    .official-capability-client-shell nav span { gap: 6px; padding-inline: 6px; font-size: 8px; }
  }

  @media (max-width: 760px) {
    .official-capability-client-shell { grid-template-columns: 48px minmax(0, 1fr); gap: 6px; height: auto; padding: 6px; }
    .official-capability-client-shell > aside { padding: 8px 4px; border-radius: 15px; }
    .official-capability-client-brand img { width: 34px; height: 34px; }
    .official-capability-client-brand strong { display: none; }
    .official-capability-client-shell nav { gap: 6px; }
    .official-capability-client-shell nav span { justify-content: center; width: 30px; min-height: 30px; padding: 0; font-size: 0; }
    .official-capability-client-shell nav span b { width: 30px; height: 30px; flex-basis: 30px; }
    .official-capability-client-shell nav span.is-active::before { left: -7px; }
    .official-capability-client-main { gap: 6px; }
    .official-capability-client-main > header { border-radius: 15px; }
    .official-capability-client-main > header > div:last-child span { display: none; }
    .official-capability-client-workspace { display: block; border-radius: 15px; }
    .official-capability-client-chat { min-height: 500px; }
    .official-capability-client-assistant { display: grid; min-height: 350px; border-top: 1px solid var(--kt-border-light); border-left: 0; }
    .official-capability-real-frame { height: 760px; }
  }

  .official-future-v2 {
    --scenario-accent: #18b9d8;
    --scenario-accent-deep: #087f9d;
    --scenario-glow: rgb(104 222 239 / .3);
    color: #08204a;
    background:
      radial-gradient(circle at 8% 11%, rgb(113 215 235 / .23), transparent 23rem),
      radial-gradient(circle at 92% 16%, rgb(246 177 211 / .24), transparent 25rem),
      linear-gradient(180deg, #f7fcff 0%, #f3fbff 36%, #fff8fc 72%, #f8fcff 100%);
  }
  .official-site:not(.official-site-home) main { padding-top: 0; }
  .official-site-future .official-future-v2-hero,
  .official-site-capabilities .official-capability-intro,
  .official-site-pricing .official-route-hero,
  .official-site-download .official-route-hero,
  .official-site-guide .official-route-hero,
  .official-site-about .official-route-hero,
  .official-site-translation .official-page-hero,
  .official-site-pets .official-pets-hero,
  .official-site-legal .official-legal { padding-top: calc(var(--official-nav-offset) + 14px); }
  .official-future-v2[data-active-mode="sales"] {
    --scenario-accent: #4b9fe2;
    --scenario-accent-deep: #2f68bd;
    --scenario-glow: rgb(103 158 234 / .3);
  }
  .official-future-v2[data-active-mode="service"] {
    --scenario-accent: #ef6fac;
    --scenario-accent-deep: #b5437c;
    --scenario-glow: rgb(240 111 172 / .28);
  }
  .official-future-v2 button,
  .official-future-v2 textarea { font: inherit; }
  .official-future-v2 button:focus-visible,
  .official-future-v2 textarea:focus-visible { outline: 3px solid color-mix(in srgb, var(--scenario-accent) 35%, transparent); outline-offset: 3px; }
  .official-future-v2-hero {
    position: relative;
    overflow: hidden;
    padding: clamp(52px, 7vw, 88px) 0 54px;
  }
  .official-future-v2-hero::after {
    position: absolute;
    right: -11vw;
    bottom: -25rem;
    width: min(72vw, 920px);
    aspect-ratio: 1;
    border: 1px solid rgb(84 189 222 / .24);
    border-radius: 50%;
    box-shadow: 0 0 0 38px rgb(255 255 255 / .28), 0 0 0 39px rgb(239 128 183 / .1);
    content: '';
    pointer-events: none;
  }
  .official-future-v2-hero-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, .92fr) minmax(460px, 1.08fr);
    gap: clamp(36px, 6vw, 88px);
    align-items: center;
  }
  .official-future-v2-kicker {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin: 0;
    color: #127f9f;
    font-size: 13px;
    font-weight: 820;
    letter-spacing: .08em;
  }
  .official-future-v2-kicker::before {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: linear-gradient(135deg, #20c6dc, #f06cac);
    box-shadow: 0 0 0 7px rgb(72 200 221 / .12);
    content: '';
  }
  .official-future-v2-hero h1 {
    max-width: 9.5em;
    margin: 22px 0 0;
    font-size: clamp(3rem, 5vw, 4.7rem);
    line-height: .98;
    letter-spacing: -.055em;
    text-wrap: balance;
  }
  .official-future-v2-hero h1 > span { display: block; white-space: nowrap; }
  .official-future-v2-hero h1 em { color: var(--scenario-accent); font-style: normal; }
  .official-future-v2-hero-copy > p:not(.official-future-v2-kicker) {
    max-width: 38em;
    margin: 24px 0 0;
    color: #55748a;
    font-size: clamp(1rem, 1.35vw, 1.125rem);
    line-height: 1.75;
  }
  .official-future-v2-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
  .official-future-v2-hero-actions a {
    display: inline-flex;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    padding: 0 22px;
    border: 1px solid rgb(73 150 187 / .24);
    border-radius: 999px;
    background: rgb(255 255 255 / .72);
    color: #17466f;
    font-weight: 780;
    text-decoration: none;
    box-shadow: 0 12px 30px rgb(47 105 145 / .1);
  }
  .official-future-v2-hero-actions a:first-child { border-color: transparent; background: linear-gradient(110deg, #18b9d8, #5e9fe8 64%, #ef83b7); color: #fff; }
  .official-future-v2-principles { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 24px; }
  .official-future-v2-principles span { padding: 8px 11px; border: 1px solid rgb(129 187 208 / .22); border-radius: 999px; background: rgb(255 255 255 / .54); color: #55748a; font-size: 12px; font-weight: 720; }
  .official-future-v2-orbit {
    position: relative;
    min-height: 474px;
    isolation: isolate;
  }
  .official-future-v2-orbit::before,
  .official-future-v2-orbit::after {
    position: absolute;
    inset: 49% 7% auto;
    height: 57%;
    border: 1px solid rgb(68 190 219 / .3);
    border-radius: 50%;
    content: '';
    transform: translateY(-50%) rotate(-7deg);
  }
  .official-future-v2-orbit::after { inset: 43% 16% auto; height: 42%; border-color: rgb(239 111 172 / .2); transform: translateY(-50%) rotate(10deg); }
  .official-future-v2-core {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    width: 260px;
    height: 300px;
    transform: translate(-50%, -50%);
  }
  .official-future-v2-core::before {
    position: absolute;
    inset: 44px 7px 12px;
    border-radius: 50%;
    background: radial-gradient(circle, rgb(255 255 255 / .95), rgb(190 235 245 / .42) 53%, transparent 72%);
    filter: blur(2px);
    content: '';
  }
  .official-future-v2-core img { position: relative; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 24px 25px rgb(35 106 145 / .18)); }
  .official-future-v2-core span {
    position: absolute;
    right: -18px;
    bottom: 29px;
    z-index: 3;
    padding: 9px 13px;
    border: 1px solid rgb(255 255 255 / .86);
    border-radius: 999px;
    background: rgb(255 255 255 / .82);
    color: #17476f;
    font-size: 12px;
    font-weight: 800;
    box-shadow: 0 12px 30px rgb(35 87 124 / .14);
    backdrop-filter: blur(15px);
  }
  .official-future-v2-orbit-node {
    position: absolute;
    z-index: 3;
    display: grid;
    grid-template-columns: 62px auto;
    min-width: 174px;
    min-height: 76px;
    align-items: center;
    gap: 10px;
    padding: 6px 15px 6px 7px;
    border: 1px solid rgb(255 255 255 / .9);
    border-radius: 28px;
    background: rgb(255 255 255 / .7);
    color: #46667e;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 16px 36px rgb(53 91 130 / .12);
    backdrop-filter: blur(16px) saturate(130%);
    transition: transform .28s cubic-bezier(.16,1,.3,1), border-color .2s ease, box-shadow .2s ease;
  }
  .official-future-v2-orbit-node:hover { transform: translateY(-4px); box-shadow: 0 20px 40px rgb(53 91 130 / .17); }
  .official-future-v2-orbit-node[data-scenario-mode="persona"] { top: 15px; left: 2%; }
  .official-future-v2-orbit-node[data-scenario-mode="sales"] { top: 72px; right: 0; }
  .official-future-v2-orbit-node[data-scenario-mode="service"] { right: 3%; bottom: 25px; }
  .official-future-v2-orbit-node[aria-pressed="true"] { border-color: color-mix(in srgb, var(--scenario-accent) 62%, #fff); box-shadow: 0 18px 42px var(--scenario-glow); }
  .official-future-v2-orbit-node img { width: 62px; height: 62px; object-fit: contain; }
  .official-future-v2-orbit-node strong { display: block; color: #12375d; font-size: 14px; }
  .official-future-v2-orbit-node small { display: block; margin-top: 3px; color: #6a8295; font-size: 11px; }

  .official-future-v2-workbench-section { position: relative; padding: 36px 0 64px; }
  .official-future-v2-section-head { display: grid; grid-template-columns: minmax(0, .86fr) minmax(290px, .64fr); gap: clamp(32px, 7vw, 96px); align-items: end; }
  .official-future-v2-section-head h2 { max-width: 12em; margin: 0; font-size: clamp(2.25rem, 4.8vw, 4.4rem); line-height: 1.02; letter-spacing: -.045em; }
  .official-future-v2-section-head h2 span,
  .official-future-v2-boundary-head h2 span { display: block; white-space: nowrap; }
  .official-future-v2-section-head p { max-width: 42em; margin: 0; color: #55748a; font-size: 1rem; line-height: 1.72; }
  .official-scenario-workbench {
    position: relative;
    display: grid;
    grid-template-columns: 194px minmax(0, 1fr) 298px;
    min-height: 610px;
    margin-top: 30px;
    overflow: hidden;
    border: 1px solid rgb(111 188 214 / .3);
    border-radius: 26px;
    background: rgb(255 255 255 / .78);
    box-shadow: 0 34px 80px rgb(51 91 126 / .13), inset 0 1px 0 rgb(255 255 255 / .9);
    backdrop-filter: blur(22px) saturate(130%);
  }
  .official-scenario-rail { padding: 20px 12px; border-right: 1px solid #dbe9ef; background: linear-gradient(180deg, rgb(244 252 255 / .9), rgb(255 246 251 / .74)); }
  .official-scenario-rail > span { display: block; padding: 0 10px 12px; color: #7390a3; font-size: 11px; font-weight: 800; letter-spacing: .08em; }
  .official-scenario-tab {
    position: relative;
    width: 100%;
    min-height: 82px;
    margin-top: 7px;
    padding: 13px 12px 13px 20px;
    border: 1px solid transparent;
    border-radius: 18px;
    background: transparent;
    color: #60798c;
    text-align: left;
    cursor: pointer;
    transition: transform .24s cubic-bezier(.16,1,.3,1), color .2s ease, background .2s ease, border-color .2s ease;
  }
  .official-scenario-tab::before { position: absolute; top: 18px; bottom: 18px; left: 8px; width: 4px; border-radius: 999px; background: var(--tab-accent); opacity: .38; content: ''; }
  .official-scenario-tab strong { display: block; color: inherit; font-size: 15px; }
  .official-scenario-tab span { display: block; margin-top: 6px; color: inherit; font-size: 11px; line-height: 1.42; }
  .official-scenario-tab:hover { transform: translateX(3px); background: rgb(255 255 255 / .66); color: #234c73; }
  .official-scenario-tab[aria-selected="true"] { border-color: color-mix(in srgb, var(--tab-accent) 35%, #fff); background: rgb(255 255 255 / .92); color: #12375d; box-shadow: 0 10px 28px color-mix(in srgb, var(--tab-accent) 15%, transparent); }
  .official-scenario-tab[aria-selected="true"]::before { opacity: 1; }
  .official-scenario-main { min-width: 0; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; background: linear-gradient(145deg, rgb(255 255 255 / .95), rgb(248 252 255 / .8)); }
  .official-scenario-main-head { display: flex; min-height: 72px; align-items: center; justify-content: space-between; gap: 14px; padding: 14px 20px; border-bottom: 1px solid #dce9ef; }
  .official-scenario-contact { display: flex; align-items: center; gap: 11px; min-width: 0; }
  .official-scenario-contact b { display: grid; width: 38px; height: 38px; flex: 0 0 auto; place-items: center; border-radius: 50%; background: linear-gradient(135deg, var(--scenario-accent), #7e8fec); color: #fff; font-size: 15px; }
  .official-scenario-contact strong { display: block; overflow: hidden; color: #132f51; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
  .official-scenario-contact span { display: block; margin-top: 3px; color: #7890a0; font-size: 11px; }
  .official-scenario-mode-state { display: inline-flex; align-items: center; gap: 7px; padding: 8px 10px; border-radius: 999px; background: color-mix(in srgb, var(--scenario-accent) 9%, #fff); color: var(--scenario-accent-deep); font-size: 11px; font-weight: 800; }
  .official-scenario-mode-state::before { width: 7px; height: 7px; border-radius: 50%; background: var(--scenario-accent); box-shadow: 0 0 0 5px color-mix(in srgb, var(--scenario-accent) 13%, transparent); content: ''; }
  .official-scenario-thread { padding: 24px clamp(18px, 3vw, 34px); background: radial-gradient(circle at 85% 20%, var(--scenario-glow), transparent 18rem), linear-gradient(150deg, #f7fbf7, #f5f9ff 58%, #fff8fb); }
  .official-scenario-incoming { max-width: 78%; padding: 15px 16px; border-radius: 18px 18px 18px 5px; background: #fff; color: #243a56; box-shadow: 0 8px 22px rgb(50 83 108 / .1); }
  .official-scenario-incoming > span { display: block; color: #758a9c; font-size: 10px; font-weight: 760; }
  .official-scenario-incoming p { margin: 7px 0 0; font-size: 13px; line-height: 1.58; }
  .official-scenario-translation { margin-top: 10px; padding: 10px 0 0 12px; border-top: 1px solid #e4edf2; border-left: 3px solid var(--scenario-accent); color: #36536d; }
  .official-scenario-draft { max-width: 84%; margin: 22px 0 0 auto; padding: 14px; border: 1px solid color-mix(in srgb, var(--scenario-accent) 22%, #dbe6eb); border-radius: 18px 18px 5px 18px; background: color-mix(in srgb, var(--scenario-accent) 8%, #fff); }
  .official-scenario-draft label { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--scenario-accent-deep); font-size: 11px; font-weight: 800; }
  .official-scenario-draft label span:last-child { color: #8193a0; font-size: 10px; font-weight: 700; }
  .official-scenario-draft textarea { width: 100%; min-height: 118px; margin-top: 9px; resize: vertical; border: 0; background: transparent; color: #193653; font-size: 13px; line-height: 1.6; outline: 0; }
  .official-scenario-composer { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 13px 18px; border-top: 1px solid #dce9ef; background: #fff; }
  .official-scenario-composer p { min-width: 0; margin: 0; color: #6d8597; font-size: 11px; line-height: 1.45; }
  .official-scenario-composer-actions { display: flex; flex: 0 0 auto; gap: 8px; }
  .official-scenario-composer button { min-height: 40px; padding: 0 14px; border: 1px solid #d7e5eb; border-radius: 999px; background: #fff; color: #547084; font-size: 12px; font-weight: 780; cursor: pointer; }
  .official-scenario-composer button:first-child { border-color: transparent; background: var(--scenario-accent); color: #fff; }
  .official-scenario-composer button:disabled { cursor: wait; opacity: .62; }
  .official-scenario-inspector { position: relative; display: flex; min-width: 0; flex-direction: column; padding: 20px 18px; border-left: 1px solid #dbe9ef; background: linear-gradient(180deg, rgb(250 253 255 / .86), rgb(255 249 252 / .9)); }
  .official-scenario-inspector-top { min-height: 0; padding-right: 0; }
  .official-scenario-inspector-top > span { color: var(--scenario-accent-deep); font-size: 10px; font-weight: 820; letter-spacing: .07em; }
  .official-scenario-inspector-top h3 { margin: 9px 0 0; color: #123455; font-size: 20px; line-height: 1.24; letter-spacing: -.025em; }
  .official-scenario-inspector-top p { margin: 9px 0 0; color: #657f92; font-size: 12px; line-height: 1.55; }
  .official-scenario-pet { position: relative; width: 100%; height: 150px; margin: 8px 0 12px; pointer-events: none; }
  .official-scenario-pet[hidden] { display: none; }
  .official-scenario-pet img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 12px 12px rgb(39 85 111 / .14)); transition: opacity .2s ease, transform .3s cubic-bezier(.16,1,.3,1); }
  .official-scenario-pet .is-resting { opacity: 0; transform: translateY(5px) scale(.96); }
  .official-future-v2[data-pet-state="thinking"] .official-scenario-pet .is-active { opacity: 0; transform: translateY(5px) scale(.96); }
  .official-future-v2[data-pet-state="thinking"] .official-scenario-pet .is-resting { opacity: 1; transform: none; }
  .official-scenario-facts { margin: 4px 0 0; }
  .official-scenario-facts div { padding: 12px 0; border-top: 1px solid #dce8ee; }
  .official-scenario-facts dt { color: #6e8798; font-size: 10px; font-weight: 760; }
  .official-scenario-facts dd { margin: 5px 0 0; color: #27445e; font-size: 12px; line-height: 1.48; }
  .official-scenario-stop { margin-top: auto; padding: 13px 14px; border: 1px solid color-mix(in srgb, var(--scenario-accent) 21%, #e1e9ed); border-radius: 14px; background: color-mix(in srgb, var(--scenario-accent) 7%, #fff); }
  .official-scenario-stop span { color: var(--scenario-accent-deep); font-size: 10px; font-weight: 820; }
  .official-scenario-stop p { margin: 6px 0 0; color: #526d81; font-size: 12px; line-height: 1.5; }
  .official-scenario-disclaimer { margin: 13px 2px 0; color: #718b9c; font-size: 11px; line-height: 1.55; }

  .official-future-v2-boundaries { padding: 54px 0 70px; }
  .official-future-v2-boundary-head { display: flex; align-items: end; justify-content: space-between; gap: 32px; padding-bottom: 24px; border-bottom: 1px solid rgb(110 188 213 / .28); }
  .official-future-v2-boundary-head h2 { max-width: 13em; margin: 0; font-size: clamp(2rem, 4vw, 3.7rem); line-height: 1.05; letter-spacing: -.04em; }
  .official-future-v2-boundary-head p { max-width: 34em; margin: 0; color: #607b8f; line-height: 1.65; }
  .official-future-v2-boundary-table { width: 100%; border-collapse: collapse; }
  .official-future-v2-boundary-table th,
  .official-future-v2-boundary-table td { padding: 17px 14px; border-bottom: 1px solid rgb(120 190 213 / .24); text-align: left; vertical-align: top; }
  .official-future-v2-boundary-table th { color: #70899a; font-size: 11px; font-weight: 800; letter-spacing: .05em; }
  .official-future-v2-boundary-table td { color: #527085; font-size: 13px; line-height: 1.58; }
  .official-future-v2-boundary-table td:first-child { color: #12375d; font-size: 15px; font-weight: 820; }
  .official-future-v2-closing { padding: 0 0 76px; }
  .official-future-v2-closing-inner { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 32px; padding: clamp(28px, 4vw, 46px); border: 1px solid rgb(103 189 216 / .25); border-radius: 26px; background: linear-gradient(112deg, rgb(222 249 253 / .82), rgb(238 245 255 / .86) 52%, rgb(255 233 244 / .78)); box-shadow: 0 24px 55px rgb(58 99 130 / .1); }
  .official-future-v2-closing-inner { padding: 24px 28px; border-radius: 24px; }
  .official-future-v2-closing-inner > div > span { color: #168eae; font-size: 11px; font-weight: 830; letter-spacing: .08em; }
  .official-future-v2-closing h2 { max-width: none; margin: 8px 0 0; font-size: clamp(25px, 2.4vw, 34px); line-height: 1.2; letter-spacing: -.035em; }
  .official-future-v2-closing p { max-width: 58em; margin: 8px 0 0; color: #56748a; font-size: 13px; line-height: 1.55; }
  .official-future-v2-closing a { display: inline-flex; min-height: 50px; align-items: center; justify-content: center; padding: 0 22px; border-radius: 999px; background: linear-gradient(110deg, #18b9d8, #5e9fe8 64%, #ef83b7); color: #fff; font-weight: 800; text-decoration: none; box-shadow: 0 16px 32px rgb(53 134 176 / .2); }

  @media (max-width: 1020px) {
    .official-future-v2-hero-grid { grid-template-columns: minmax(0, .86fr) minmax(390px, 1.14fr); gap: 24px; }
    .official-future-v2-hero h1 { font-size: clamp(3rem, 5vw, 3.45rem); }
    .official-future-v2-orbit { min-height: 430px; }
    .official-future-v2-core { width: 220px; height: 270px; }
    .official-future-v2-orbit-node { grid-template-columns: 52px auto; min-width: 158px; }
    .official-future-v2-orbit-node img { width: 52px; height: 52px; }
    .official-scenario-workbench { grid-template-columns: 176px minmax(0, 1fr); }
    .official-scenario-inspector { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, .82fr) 156px minmax(0, 1fr); gap: 18px; border-top: 1px solid #dbe9ef; border-left: 0; }
    .official-scenario-inspector-top { min-height: 0; padding-right: 0; }
    .official-scenario-pet { height: 142px; margin: 0; }
    .official-scenario-facts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 16px; margin: 0; }
    .official-scenario-stop { grid-column: 1 / -1; margin-top: 0; align-self: stretch; }
  }

  @media (max-width: 760px) {
    .official-site-home main { padding-top: 0; }
    .official-site-future .official-future-v2-hero,
    .official-site-capabilities .official-capability-intro,
    .official-site-pricing .official-route-hero,
    .official-site-download .official-route-hero,
    .official-site-guide .official-route-hero,
    .official-site-about .official-route-hero,
    .official-site-translation .official-page-hero,
    .official-site-pets .official-pets-hero,
    .official-site-legal .official-legal { padding-top: calc(var(--official-nav-offset) + 10px); }
    .official-future-v2-hero { padding-bottom: 32px; }
    .official-future-v2-hero-grid { grid-template-columns: 1fr; }
    .official-future-v2-hero h1 { max-width: 9em; font-size: clamp(2.8rem, 14vw, 4.3rem); }
    .official-future-v2-orbit { min-height: 390px; }
    .official-future-v2-core { top: 48%; width: 188px; height: 228px; }
    .official-future-v2-core span { right: -12px; bottom: 15px; }
    .official-future-v2-orbit-node { grid-template-columns: 45px auto; min-width: 144px; min-height: 62px; padding-right: 10px; }
    .official-future-v2-orbit-node img { width: 45px; height: 45px; }
    .official-future-v2-orbit-node[data-scenario-mode="persona"] { top: 2px; left: 0; }
    .official-future-v2-orbit-node[data-scenario-mode="sales"] { top: 44px; right: 0; }
    .official-future-v2-orbit-node[data-scenario-mode="service"] { right: 0; bottom: 1px; }
    .official-future-v2-workbench-section { padding: 26px 0 44px; }
    .official-future-v2-section-head { grid-template-columns: 1fr; gap: 13px; }
    .official-scenario-workbench { display: block; min-height: 0; margin-top: 22px; border-radius: 20px; }
    .official-scenario-rail { display: flex; gap: 7px; overflow-x: auto; padding: 10px; border-right: 0; border-bottom: 1px solid #dbe9ef; scroll-snap-type: x proximity; }
    .official-scenario-rail > span { display: none; }
    .official-scenario-tab { min-width: 142px; min-height: 66px; margin: 0; padding: 10px 10px 10px 18px; scroll-snap-align: start; }
    .official-scenario-tab::before { top: 13px; bottom: 13px; left: 7px; }
    .official-scenario-main-head { min-height: 66px; padding: 11px 14px; }
    .official-scenario-thread { padding: 18px 13px; }
    .official-scenario-incoming,
    .official-scenario-draft { max-width: 95%; }
    .official-scenario-draft textarea { min-height: 138px; }
    .official-scenario-composer { align-items: stretch; flex-direction: column; padding: 12px 13px; }
    .official-scenario-composer-actions { width: 100%; }
    .official-scenario-composer button { flex: 1; }
    .official-scenario-inspector { display: block; padding: 18px 14px; border-top: 1px solid #dbe9ef; border-left: 0; }
    .official-scenario-inspector-top { min-height: 0; padding-right: 0; }
    .official-scenario-pet { width: 100%; height: 156px; margin: 10px 0 12px; }
    .official-scenario-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
    .official-scenario-stop { margin-top: 8px; }
    .official-future-v2-boundaries { padding: 42px 0 50px; }
    .official-future-v2-boundary-head { align-items: flex-start; flex-direction: column; gap: 12px; }
    .official-future-v2-boundary-table { display: block; overflow-x: auto; white-space: normal; }
    .official-future-v2-boundary-table th,
    .official-future-v2-boundary-table td { min-width: 138px; padding: 14px 10px; }
    .official-future-v2-boundary-table th:first-child,
    .official-future-v2-boundary-table td:first-child { min-width: 92px; }
    .official-future-v2-closing { padding-bottom: 48px; }
    .official-future-v2-closing-inner { grid-template-columns: 1fr; gap: 20px; border-radius: 20px; }
    .official-future-v2-closing a { width: 100%; }
  }

  /* Pricing v2: shared capability story followed by four concise commercial tiers. */
  .official-pricing-v2-page {
    --pricing-ink: #122d52;
    --pricing-copy: #58758b;
    --pricing-line: rgb(91 172 199 / .24);
    color: var(--pricing-ink);
    background:
      radial-gradient(circle at 8% 8%, rgb(105 200 217 / .2), transparent 24rem),
      radial-gradient(circle at 92% 19%, rgb(239 175 199 / .22), transparent 25rem),
      linear-gradient(145deg, #f6fcfd 0%, #fbfbff 48%, #fff8fb 100%);
  }
  .official-pricing-v2-page .official-button { min-height: 48px; }
  .official-pricing-v2-hero { padding: calc(var(--official-nav-offset) + clamp(34px, 5vw, 68px)) 0 clamp(42px, 5vw, 68px); }
  .official-pricing-v2-hero-grid { display: grid; grid-template-columns: minmax(0, .92fr) minmax(420px, .88fr); gap: clamp(36px, 6vw, 88px); align-items: center; }
  .official-pricing-v2-kicker,
  .official-pricing-v2-common-head > div > span,
  .official-pricing-v2-section-head > div > span { display: inline-flex; align-items: center; gap: 9px; color: #1785a6; font-size: 12px; font-weight: 840; letter-spacing: .08em; }
  .official-pricing-v2-kicker::before,
  .official-pricing-v2-common-head > div > span::before,
  .official-pricing-v2-section-head > div > span::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: linear-gradient(135deg, #35c9d8, #d889bc); box-shadow: 0 0 0 6px rgb(92 201 216 / .13); }
  .official-pricing-v2-hero h1 { max-width: 10.5em; margin: 22px 0 0; font-size: clamp(3.7rem, 6.1vw, 6.7rem); line-height: .98; letter-spacing: -.055em; }
  .official-pricing-v2-hero h1 em { color: #178eb0; font-style: normal; }
  .official-pricing-v2-hero-copy > p { max-width: 41em; margin: 25px 0 0; color: var(--pricing-copy); font-size: 16px; line-height: 1.75; text-wrap: pretty; }
  .official-pricing-v2-hero-copy .official-actions { margin-top: 28px; }
  .official-pricing-v2-supervision { position: relative; min-height: 380px; overflow: hidden; padding: clamp(30px, 4vw, 48px); border: 1px solid rgb(255 255 255 / .88); border-radius: 34px; background: linear-gradient(145deg, rgb(255 255 255 / .78), rgb(236 250 252 / .72) 54%, rgb(255 238 246 / .75)); box-shadow: 0 28px 70px rgb(49 92 121 / .14), inset 0 1px 0 rgb(255 255 255 / .9); backdrop-filter: blur(22px) saturate(135%); }
  .official-pricing-v2-supervision::before { content: ""; position: absolute; width: 260px; height: 260px; right: -92px; top: -102px; border: 1px solid rgb(87 190 211 / .28); border-radius: 50%; box-shadow: 0 0 0 34px rgb(239 175 199 / .08); }
  .official-pricing-v2-supervision-copy { position: relative; z-index: 2; max-width: 27em; }
  .official-pricing-v2-supervision-copy > span { display: inline-flex; min-height: 28px; align-items: center; padding: 0 12px; border: 1px solid rgb(50 181 202 / .23); border-radius: 999px; background: rgb(255 255 255 / .67); color: #157f9f; font-size: 11px; font-weight: 820; }
  .official-pricing-v2-supervision-copy h2 { max-width: 10em; margin: 20px 0 0; font-size: clamp(2rem, 3vw, 3.25rem); line-height: 1.05; letter-spacing: -.04em; }
  .official-pricing-v2-supervision-copy p { max-width: 31em; margin: 15px 0 0; color: var(--pricing-copy); font-size: 14px; line-height: 1.68; }
  .official-pricing-v2-supervision-status { position: absolute; z-index: 2; left: clamp(30px, 4vw, 48px); right: 152px; bottom: 34px; display: flex; flex-wrap: wrap; gap: 8px; }
  .official-pricing-v2-supervision-status span { display: inline-flex; min-height: 32px; align-items: center; gap: 7px; padding: 0 11px; border: 1px solid rgb(255 255 255 / .9); border-radius: 999px; background: rgb(255 255 255 / .64); color: #476b83; font-size: 11px; font-weight: 760; backdrop-filter: blur(12px); }
  .official-pricing-v2-supervision-status i { width: 7px; height: 7px; border-radius: 50%; background: #30bfa4; box-shadow: 0 0 0 4px rgb(48 191 164 / .12); }
  .official-pricing-v2-supervision img { position: absolute; z-index: 1; right: 10px; bottom: -25px; width: 152px; height: auto; filter: drop-shadow(0 20px 24px rgb(45 76 111 / .18)); }
  .official-pricing-v2-common { padding: 0 0 54px; }
  .official-pricing-v2-common-head,
  .official-pricing-v2-section-head { display: grid; grid-template-columns: minmax(470px, .9fr) minmax(520px, 1.1fr); align-items: center; gap: clamp(28px, 4vw, 58px); padding-bottom: 18px; border-bottom: 1px solid var(--pricing-line); }
  .official-pricing-v2-common-head h2,
  .official-pricing-v2-section-head h2 { margin: 13px 0 0; font-size: clamp(2.1rem, 4vw, 3.8rem); line-height: 1.04; letter-spacing: -.04em; }
  .official-pricing-v2-common-head > p,
  .official-pricing-v2-section-actions > p { max-width: 43em; margin: 0; color: var(--pricing-copy); line-height: 1.7; }
  .official-pricing-v2-section-actions { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 22px; }
  .official-pricing-v2-section-actions > p { padding: 0; }
  .official-pricing-v2-section-actions > .official-pricing-v2-period { grid-column: 2; justify-self: end; }
  .official-pricing-v2-period { display: inline-flex; gap: 4px; padding: 4px; border: 1px solid rgb(255 255 255 / .9); border-radius: 999px; background: rgb(255 255 255 / .57); box-shadow: 0 10px 24px rgb(57 99 126 / .08); backdrop-filter: blur(16px); }
  .official-pricing-v2-period button { min-width: 72px; min-height: 36px; border: 0; border-radius: 999px; background: transparent; color: #617d91; font: inherit; font-size: 12px; font-weight: 780; cursor: pointer; }
  .official-pricing-v2-period button.is-active { background: linear-gradient(115deg, rgb(84 193 211 / .9), rgb(153 146 219 / .86) 60%, rgb(221 134 180 / .88)); color: #fff; box-shadow: 0 8px 18px rgb(77 116 153 / .2), inset 0 1px 0 rgb(255 255 255 / .62); }
  .official-pricing-v2-period button:focus-visible { outline: 3px solid rgb(52 178 205 / .25); outline-offset: 2px; }
  .official-pricing-v2-common-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; margin-top: 18px; border: 1px solid rgb(255 255 255 / .9); border-radius: 24px; background: rgb(255 255 255 / .68); box-shadow: 0 18px 42px rgb(57 99 126 / .08); backdrop-filter: blur(18px); }
  .official-pricing-v2-common-grid > div { min-height: 130px; display: grid; grid-template-columns: 32px minmax(0, 1fr); align-content: center; gap: 5px 12px; padding: 24px; }
  .official-pricing-v2-common-grid > div + div { border-left: 1px solid var(--pricing-line); }
  .official-pricing-v2-common-grid b { grid-row: 1 / span 2; color: #6fc8d5; font-size: 12px; }
  .official-pricing-v2-common-grid strong { font-size: 15px; }
  .official-pricing-v2-common-grid span { color: var(--pricing-copy); font-size: 12px; line-height: 1.52; }
  .official-pricing-v2-plans { padding: 54px 0 62px; border-top: 1px solid rgb(91 172 199 / .12); background: linear-gradient(180deg, rgb(255 255 255 / .3), rgb(237 249 251 / .66) 48%, rgb(255 246 250 / .58)); scroll-margin-top: calc(var(--official-nav-offset) + 10px); }
  .official-pricing-v2-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin-top: 20px; overflow: hidden; border: 1px solid rgb(255 255 255 / .92); border-radius: 28px; background: rgb(255 255 255 / .64); box-shadow: 0 28px 70px rgb(58 91 121 / .12), inset 0 1px 0 #fff; backdrop-filter: blur(22px) saturate(125%); }
  .official-pricing-v2-card { --plan-accent: #58b8ca; position: relative; min-width: 0; min-height: 610px; display: flex; flex-direction: column; padding: 27px 24px 23px; border: 0; background: linear-gradient(180deg, rgb(226 249 252 / .48), rgb(255 255 255 / .36) 38%); box-shadow: none; transition: background .22s ease; }
  .official-pricing-v2-card + .official-pricing-v2-card { border-left: 1px solid rgb(91 172 199 / .19); }
  .official-pricing-v2-card:hover { background: linear-gradient(180deg, color-mix(in srgb, var(--plan-accent) 13%, #fff), rgb(255 255 255 / .7) 43%); }
  .official-pricing-v2-card.is-standard { --plan-accent: #8f8bd8; }
  .official-pricing-v2-card.is-advanced { --plan-accent: #db88b4; }
  .official-pricing-v2-card.is-character { --plan-accent: #35b7a5; }
  .official-pricing-v2-card.is-recommended { background: linear-gradient(155deg, rgb(224 249 252 / .78), rgb(255 255 255 / .72) 47%, rgb(250 231 245 / .72)); box-shadow: inset 0 4px 0 color-mix(in srgb, var(--plan-accent) 70%, #68c6d3), inset 0 0 45px rgb(255 255 255 / .36); }
  .official-pricing-v2-card.is-recommended:hover { background: linear-gradient(155deg, rgb(217 247 251 / .92), rgb(255 255 255 / .84) 47%, rgb(249 225 242 / .86)); }
  .official-pricing-v2-title-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 19px; }
  .official-pricing-v2-recommend { flex: 0 0 auto; min-height: 27px; display: inline-flex; align-items: center; padding: 0 11px; border: 1px solid rgb(255 255 255 / .74); border-radius: 999px; background: linear-gradient(115deg, #4bbbd0, #9992db 58%, #dd86b4); color: #fff; font-size: 10px; font-weight: 820; box-shadow: 0 8px 18px rgb(91 122 165 / .18); }
  .official-pricing-v2-card-head { min-height: 36px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
  .official-pricing-v2-card-head > div { display: flex; align-items: center; gap: 9px; }
  .official-pricing-v2-card-head b { width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid color-mix(in srgb, var(--plan-accent) 28%, #fff); border-radius: 10px; background: color-mix(in srgb, var(--plan-accent) 11%, #fff); color: color-mix(in srgb, var(--plan-accent) 83%, #20415c); font-size: 10px; }
  .official-pricing-v2-card-head span { color: color-mix(in srgb, var(--plan-accent) 86%, #20415c); font-size: 10px; font-weight: 820; letter-spacing: .07em; }
  .official-pricing-v2-card-head strong { color: #718899; font-size: 10px; font-weight: 730; text-align: right; }
  .official-pricing-v2-card h3 { margin: 0; font-size: clamp(2rem, 2.35vw, 2.75rem); line-height: 1.05; letter-spacing: -.035em; }
  .official-pricing-v2-audience { min-height: 64px; margin: 12px 0 0; color: var(--pricing-copy); font-size: 13px; line-height: 1.65; }
  .official-pricing-v2-price { min-height: 82px; display: flex; flex-direction: column; justify-content: end; gap: 7px; margin-top: 4px; padding: 16px 0 14px; border-top: 1px solid var(--pricing-line); border-bottom: 1px solid var(--pricing-line); }
  .official-pricing-v2-price > div { display: grid; gap: 6px; }
  .official-pricing-v2-price > div[hidden] { display: none; }
  .official-pricing-v2-price strong { font-size: clamp(1.7rem, 2.1vw, 2.35rem); line-height: 1.02; letter-spacing: -.035em; }
  .official-pricing-v2-price strong small { color: #627f93; font-size: 11px; font-weight: 740; letter-spacing: 0; }
  .official-pricing-v2-price b { color: #274d68; font-size: 12px; font-weight: 780; }
  .official-pricing-v2-price.is-pending strong,
  .official-pricing-v2-price.is-metered strong { font-size: clamp(1.8rem, 2vw, 2.2rem); letter-spacing: -.03em; }
  .official-pricing-v2-price.is-pending strong { color: #526f84; }
  .official-pricing-v2-price.is-metered strong { color: #237d72; }
  .official-pricing-v2-price span { overflow-wrap: anywhere; color: #758b9b; font-size: 10px; line-height: 1.5; }
  .official-pricing-v2-spec { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 15px 1px 0; }
  .official-pricing-v2-spec span { color: #718899; font-size: 11px; font-weight: 720; }
  .official-pricing-v2-spec strong { color: var(--pricing-ink); font-size: 14px; }
  .official-pricing-v2-points { position: relative; overflow: hidden; margin-top: 15px; padding: 14px; border: 1px solid color-mix(in srgb, var(--plan-accent) 22%, #e5edf0); border-radius: 16px; background: linear-gradient(135deg, color-mix(in srgb, var(--plan-accent) 10%, #fff), rgb(255 255 255 / .74)); }
  .official-pricing-v2-points::after { content: ""; position: absolute; width: 72px; height: 72px; right: -28px; bottom: -32px; border-radius: 50%; background: color-mix(in srgb, var(--plan-accent) 14%, transparent); }
  .official-pricing-v2-points > span { color: #6c8597; font-size: 10px; font-weight: 760; }
  .official-pricing-v2-points > strong { display: block; margin-top: 4px; color: var(--pricing-ink); font-size: 23px; line-height: 1; }
  .official-pricing-v2-points small { color: #6c8597; font-size: 10px; font-weight: 720; }
  .official-pricing-v2-points p { margin: 7px 0 0; color: #698194; font-size: 10px; line-height: 1.45; }
  .official-pricing-v2-card ul { display: grid; gap: 10px; margin: 18px 0 16px; padding: 0; list-style: none; }
  .official-pricing-v2-card li { display: grid; grid-template-columns: 15px minmax(0, 1fr); gap: 8px; color: #49687f; font-size: 12px; line-height: 1.5; }
  .official-pricing-v2-card li::before { content: ""; width: 8px; height: 5px; margin-top: 4px; border-bottom: 2px solid var(--plan-accent); border-left: 2px solid var(--plan-accent); transform: rotate(-45deg); }
  .official-pricing-v2-supervisor { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: auto 0 14px; padding: 11px 12px; border-radius: 13px; background: #eef9f6; color: #3d6c65; font-size: 11px; }
  .official-pricing-v2-supervisor span { font-weight: 720; }
  .official-pricing-v2-supervisor strong { color: #218f7b; font-size: 11px; }
  .official-pricing-v2-card .official-button { width: 100%; justify-content: center; }
  .official-pricing-v2-guide { padding: 58px 0 72px; }
  .official-pricing-v2-guide-grid { display: grid; grid-template-columns: repeat(3, 1fr); overflow: hidden; border: 1px solid rgb(255 255 255 / .9); border-radius: 24px; background: rgb(255 255 255 / .62); box-shadow: 0 16px 42px rgb(57 99 126 / .07); backdrop-filter: blur(18px); }
  .official-pricing-v2-guide-grid article { min-height: 165px; padding: 27px; }
  .official-pricing-v2-guide-grid article + article { border-left: 1px solid var(--pricing-line); }
  .official-pricing-v2-guide-grid span { color: #1787a6; font-size: 11px; font-weight: 820; letter-spacing: .08em; }
  .official-pricing-v2-guide-grid h3 { margin: 13px 0 0; font-size: 19px; }
  .official-pricing-v2-guide-grid p { margin: 10px 0 0; color: var(--pricing-copy); font-size: 13px; line-height: 1.62; }
  .official-pricing-v2-compare { margin-top: 22px; overflow: hidden; border: 1px solid rgb(255 255 255 / .9); border-radius: 24px; background: rgb(255 255 255 / .7); box-shadow: 0 16px 42px rgb(57 99 126 / .07); backdrop-filter: blur(18px); }
  .official-pricing-v2-compare-head { min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 22px; padding: 0 27px; border-bottom: 1px solid var(--pricing-line); }
  .official-pricing-v2-compare-head h2 { margin: 0; font-size: 20px; }
  .official-pricing-v2-compare-head span { display: inline-flex; min-height: 28px; align-items: center; padding: 0 11px; border-radius: 999px; background: #e8f8f3; color: #238d79; font-size: 11px; font-weight: 780; }
  .official-pricing-v2-table-wrap { overflow-x: auto; }
  .official-pricing-v2-compare table { width: 100%; min-width: 720px; border-collapse: collapse; }
  .official-pricing-v2-compare th,
  .official-pricing-v2-compare td { padding: 15px 20px; border-bottom: 1px solid rgb(91 172 199 / .15); color: #567287; font-size: 12px; text-align: left; }
  .official-pricing-v2-compare thead th { color: #71899a; font-size: 10px; font-weight: 820; letter-spacing: .05em; }
  .official-pricing-v2-compare tbody th { color: var(--pricing-ink); font-weight: 760; }
  .official-pricing-v2-compare tbody tr:last-child th,
  .official-pricing-v2-compare tbody tr:last-child td { border-bottom: 0; }
  .official-pricing-v2-note { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 30px; margin-top: 22px; padding: 25px 27px; border: 1px solid var(--pricing-line); border-radius: 22px; background: linear-gradient(115deg, rgb(225 249 252 / .68), rgb(255 255 255 / .68) 55%, rgb(255 237 246 / .64)); }
  .official-pricing-v2-note strong { font-size: 15px; }
  .official-pricing-v2-note p { max-width: 63em; margin: 7px 0 0; color: var(--pricing-copy); font-size: 12px; line-height: 1.6; }

  @media (max-width: 1100px) {
    .official-pricing-v2-hero-grid { grid-template-columns: minmax(0, 1fr) minmax(360px, .9fr); gap: 34px; }
    .official-pricing-v2-section-head { grid-template-columns: minmax(390px, .9fr) minmax(0, 1.1fr); }
    .official-pricing-v2-section-actions { grid-template-columns: 1fr auto; }
    .official-pricing-v2-section-actions > p { grid-column: 1 / -1; grid-row: auto; padding-top: 0; }
    .official-pricing-v2-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .official-pricing-v2-card:nth-child(odd) { border-left: 0; }
    .official-pricing-v2-card:nth-child(n + 3) { border-top: 1px solid rgb(91 172 199 / .19); }
    .official-pricing-v2-card { min-height: 610px; }
  }

  @media (max-width: 760px) {
    .official-site-pricing main { padding-top: 0; }
    .official-pricing-v2-hero { padding: calc(var(--official-nav-offset) + 18px) 0 34px; }
    .official-pricing-v2-hero-grid { grid-template-columns: 1fr; gap: 24px; }
    .official-pricing-v2-hero h1 { margin-top: 18px; font-size: clamp(3.05rem, 14vw, 4.5rem); }
    .official-pricing-v2-hero-copy > p { margin-top: 19px; font-size: 14px; }
    .official-pricing-v2-hero-copy .official-actions { margin-top: 22px; }
    .official-pricing-v2-supervision { min-height: 330px; padding: 26px 23px; border-radius: 24px; }
    .official-pricing-v2-supervision-copy { max-width: 22em; }
    .official-pricing-v2-supervision-copy h2 { max-width: 9em; font-size: 2.25rem; }
    .official-pricing-v2-supervision-copy p { max-width: 21em; font-size: 12px; }
    .official-pricing-v2-supervision-status { right: 110px; bottom: 22px; left: 23px; }
    .official-pricing-v2-supervision-status span { min-height: 28px; padding: 0 9px; }
    .official-pricing-v2-supervision img { right: -12px; bottom: -17px; width: 126px; }
    .official-pricing-v2-common { padding-bottom: 38px; }
    .official-pricing-v2-common-head,
    .official-pricing-v2-section-head { grid-template-columns: 1fr; gap: 13px; padding-bottom: 19px; }
    .official-pricing-v2-section-actions { grid-template-columns: 1fr; gap: 12px; }
    .official-pricing-v2-section-actions > p { grid-column: 1 / -1; }
    .official-pricing-v2-section-actions > .official-pricing-v2-period { grid-column: 1; justify-self: start; }
    .official-pricing-v2-common-head h2,
    .official-pricing-v2-section-head h2 { font-size: 2.45rem; }
    .official-pricing-v2-common-head > p,
    .official-pricing-v2-section-actions > p { font-size: 13px; }
    .official-pricing-v2-common-grid { grid-template-columns: 1fr 1fr; border-radius: 19px; }
    .official-pricing-v2-common-grid > div { min-height: 116px; padding: 18px 15px; }
    .official-pricing-v2-common-grid > div + div { border-left: 0; }
    .official-pricing-v2-common-grid > div:nth-child(even) { border-left: 1px solid var(--pricing-line); }
    .official-pricing-v2-common-grid > div:nth-child(n + 3) { border-top: 1px solid var(--pricing-line); }
    .official-pricing-v2-common-grid b { grid-row: auto; }
    .official-pricing-v2-common-grid strong,
    .official-pricing-v2-common-grid span { grid-column: 1 / -1; }
    .official-pricing-v2-plans { padding: 40px 0 44px; }
    .official-pricing-v2-grid { grid-template-columns: 1fr; gap: 14px; margin-top: 24px; }
    .official-pricing-v2-grid { gap: 12px; overflow: visible; border: 0; border-radius: 0; background: transparent; box-shadow: none; backdrop-filter: none; }
    .official-pricing-v2-card,
    .official-pricing-v2-card.is-recommended { min-height: 0; padding: 23px 19px 20px; border: 1px solid rgb(121 170 190 / .24); border-radius: 20px; background: rgb(255 255 255 / .76); box-shadow: 0 16px 38px rgb(52 88 126 / .08); }
    .official-pricing-v2-card + .official-pricing-v2-card,
    .official-pricing-v2-card:nth-child(n + 3) { border: 1px solid rgb(121 170 190 / .24); }
    .official-pricing-v2-card.is-recommended { background: linear-gradient(155deg, rgb(224 249 252 / .82), rgb(255 255 255 / .78) 47%, rgb(250 231 245 / .76)); box-shadow: inset 0 4px 0 color-mix(in srgb, var(--plan-accent) 70%, #68c6d3), 0 16px 38px rgb(52 88 126 / .08); }
    .official-pricing-v2-audience { min-height: 0; }
    .official-pricing-v2-price { min-height: 0; }
    .official-pricing-v2-supervisor { margin-top: 0; }
    .official-pricing-v2-guide { padding: 42px 0 52px; }
    .official-pricing-v2-guide-grid { grid-template-columns: 1fr; border-radius: 20px; }
    .official-pricing-v2-guide-grid article { min-height: 0; padding: 22px 20px; }
    .official-pricing-v2-guide-grid article + article { border-top: 1px solid var(--pricing-line); border-left: 0; }
    .official-pricing-v2-compare { border-radius: 20px; }
    .official-pricing-v2-compare-head { min-height: 0; align-items: flex-start; flex-direction: column; gap: 10px; padding: 20px; }
    .official-pricing-v2-note { grid-template-columns: 1fr; gap: 18px; padding: 21px 20px; border-radius: 20px; }
    .official-pricing-v2-note .official-button { width: 100%; justify-content: center; }
  }

  @media (prefers-reduced-motion: reduce) {
    .official-future-v2-orbit-node,
    .official-scenario-pet img,
    .official-pricing-v2-card { transition: none; }
  }

  /* About page and server-managed Telegram contact */
  .official-about-story { padding: 86px 0; background: #fff; }
  .official-about-story-grid { display: grid; grid-template-columns: minmax(0, .92fr) minmax(420px, 1.08fr); gap: clamp(56px, 8vw, 120px); align-items: center; }
  .official-about-origin h2 { max-width: 11em; margin: 0; color: #071b45; font-size: clamp(36px, 4vw, 58px); line-height: 1.08; letter-spacing: -.05em; }
  .official-about-origin > p:not(.official-route-kicker) { max-width: 39em; margin: 22px 0 0; color: #587087; font-size: 15px; line-height: 1.8; }
  .official-about-principles { border-left: 1px solid #dcebf2; }
  .official-about-principles > div { min-height: 126px; display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 20px; align-items: start; padding: 24px 0 24px 34px; border-bottom: 1px solid #e2edf2; }
  .official-about-principles > div:first-child { border-top: 1px solid #e2edf2; }
  .official-about-principles b { color: #1aafd0; font-size: 12px; letter-spacing: .08em; }
  .official-about-principles span { display: grid; gap: 8px; }
  .official-about-principles strong { color: #143a60; font-size: 21px; }
  .official-about-principles small { max-width: 40em; color: #668095; font-size: 14px; line-height: 1.7; }
  .official-about-belief { padding: 70px 0 76px; background: linear-gradient(180deg, #f6fbfd, #fff9fc); }
  .official-about-belief-line { display: grid; grid-template-columns: auto minmax(44px, 1fr) auto minmax(44px, 1fr) auto; align-items: center; gap: 18px; margin-top: 38px; }
  .official-about-belief-line span { color: #13385d; font-size: clamp(26px, 3.2vw, 44px); font-weight: 860; letter-spacing: -.04em; }
  .official-about-belief-line i { height: 1px; background: linear-gradient(90deg, #86d4e4, #e7a4c6); }
  .official-about-contact-section { padding: 82px 0 94px; background: #fff; }
  .official-about-contact-grid { display: grid; grid-template-columns: minmax(300px, .82fr) minmax(520px, 1.18fr); gap: clamp(48px, 7vw, 96px); align-items: center; }
  .official-about-contact-grid h2 { max-width: 9em; margin: 0; color: #071b45; font-size: clamp(36px, 4vw, 58px); line-height: 1.05; letter-spacing: -.05em; }
  .official-about-contact-grid > div:first-child > p:not(.official-route-kicker) { max-width: 38em; margin: 20px 0 0; color: #587087; font-size: 15px; line-height: 1.75; }
  .official-about-contact-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: hidden; border: 1px solid #dce9f0; border-radius: 26px; background: linear-gradient(135deg, #f5fcff, #fff8fc); box-shadow: 0 20px 48px rgb(45 93 126 / .08); }
  .official-about-contact-entry { min-width: 0; min-height: 148px; display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; gap: 16px; align-items: center; border: 0; padding: 26px; background: transparent; color: inherit; font: inherit; text-align: left; text-decoration: none; cursor: pointer; }
  .official-about-contact-entry + .official-about-contact-entry { border-left: 1px solid #dce9f0; }
  .official-about-contact-entry:hover { background: rgb(255 255 255 / .68); }
  .official-about-contact-entry > span:nth-child(2) { min-width: 0; display: grid; gap: 7px; }
  .official-about-contact-entry strong { color: #112f54; font-size: 17px; }
  .official-about-contact-entry small { overflow-wrap: anywhere; color: #6b8295; font-size: 12px; line-height: 1.55; }
  .official-about-contact-entry b { color: #1a9fca; font-size: 20px; }
  .official-about-contact-entry.is-disabled { cursor: default; opacity: .66; }
  .official-contact-mark { width: 42px; height: 42px; display: grid; place-items: center; flex: 0 0 auto; }
  .official-contact-mark svg { width: 100%; height: 100%; display: block; }
  .official-contact { position: fixed; top: calc(50% - 33px); right: 6px; z-index: 190; }
  .official-contact-trigger { position: relative; width: 66px; height: 66px; display: grid; place-items: center; border: 0; padding: 0; background: transparent; cursor: pointer; }
  .official-contact-pet { position: relative; z-index: 2; width: 64px; height: 64px; display: grid; place-items: center; }
  .official-contact-pet img { width: 64px; height: 64px; object-fit: contain; filter: drop-shadow(0 10px 14px rgb(32 95 130 / .2)); }
  .official-contact-bubble { position: absolute; right: 36px; bottom: 68px; z-index: 1; min-width: max-content; padding: 7px 10px; border: 1px solid #dce9f0; border-radius: 12px; background: #fff; color: #193a5d; font-size: 11px; font-weight: 780; line-height: 1; opacity: 0; pointer-events: none; box-shadow: 0 10px 24px rgb(37 84 116 / .12); transform: translateY(5px); transition: opacity .16s ease, transform .16s ease; }
  .official-contact-bubble::after { position: absolute; right: 10px; bottom: -6px; width: 10px; height: 10px; border-right: 1px solid #dce9f0; border-bottom: 1px solid #dce9f0; background: #fff; content: ""; transform: rotate(45deg); }
  .official-contact-trigger:hover .official-contact-bubble, .official-contact-trigger:focus-visible .official-contact-bubble { opacity: 1; transform: translateY(0); }
  .official-contact-panel { position: absolute; top: 33px; right: 76px; width: 340px; max-height: min(560px, calc(100vh - 120px)); overflow: hidden; border: 1px solid #d8e6ee; border-radius: 24px; background: rgb(255 255 255 / .98); box-shadow: 0 28px 70px rgb(22 57 88 / .22); transform: translateY(-50%); }
  .official-contact-panel[hidden], .official-contact-backdrop[hidden] { display: none; }
  .official-contact-panel header { min-height: 72px; display: grid; grid-template-columns: 46px minmax(0, 1fr) 34px; gap: 12px; align-items: center; padding: 14px 16px; border-bottom: 1px solid #e3edf2; }
  .official-contact-panel header > img { width: 44px; height: 44px; object-fit: contain; border-radius: 50%; background: #eefaff; }
  .official-contact-panel header > span { min-width: 0; display: grid; gap: 4px; }
  .official-contact-panel header strong { color: #102f54; font-size: 16px; }
  .official-contact-panel header small { color: #71879a; font-size: 11px; line-height: 1.35; }
  .official-contact-panel header button { width: 34px; height: 34px; border: 0; border-radius: 50%; background: transparent; color: #526d83; font-size: 24px; line-height: 1; cursor: pointer; }
  .official-contact-panel header button:hover { background: #eff7fa; }
  .official-contact-list { max-height: min(464px, calc(100vh - 206px)); overflow-y: auto; overscroll-behavior: contain; padding: 7px 16px 12px; }
  .official-contact-item, .official-contact-channel { min-height: 68px; display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; gap: 12px; align-items: center; border-bottom: 1px solid #e7eef2; color: inherit; text-decoration: none; }
  .official-contact-item > span:nth-child(2), .official-contact-channel > span:nth-child(2) { min-width: 0; display: grid; gap: 3px; }
  .official-contact-item strong, .official-contact-channel strong { overflow: hidden; color: #153655; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
  .official-contact-item small, .official-contact-channel small { overflow: hidden; color: #768a9b; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
  .official-contact-item b, .official-contact-channel b { color: #2a6686; font-size: 18px; }
  .official-contact-item:hover, .official-contact-channel:hover { background: #f7fbfd; }
  .official-contact-divider { margin-top: 6px; border-top: 1px solid #ccdee7; }
  .official-contact-channel { border-bottom: 0; }
  .official-contact-empty { display: grid; gap: 7px; padding: 28px 12px 22px; text-align: center; }
  .official-contact-empty strong { color: #173a5d; font-size: 14px; }
  .official-contact-empty span { color: #758a9b; font-size: 11px; line-height: 1.55; }
  .official-contact-backdrop { display: none; }
  [data-official-contact][data-open] .official-contact-bubble { opacity: 0; pointer-events: none; }
  /* Shared public-site typography: stronger contrast with a visible title/body hierarchy. */
  .official-site {
    --official-ink: #07152f;
    --official-copy: #334960;
    --official-muted: #566a7e;
  }
  .official-site h1 { font-weight: 950; }
  .official-site h2 { font-weight: 880; }
  .official-site h3 { font-weight: 820; }
  .official-site p, .official-site li, .official-site dd, .official-site td { font-weight: 620; }
  .official-site strong, .official-site b, .official-site dt, .official-site th { font-weight: 820; }
  .official-site small, .official-site figcaption { font-weight: 680; }
  .official-links { color: #07152f; font-weight: 820; }
  .official-nav-link { color: #07152f; font-weight: 820; }
  .official-brand-name { position: relative; display: inline-flex; align-items: center; gap: 7px; color: #6980c9; line-height: 1; }
  .official-brand-latin { display: inline-block; background: linear-gradient(108deg, #20b8db 0%, #6f9ce7 52%, #e48ab8 100%); background-clip: text; font-family: "Avenir Next", "Arial Rounded MT Bold", Arial, sans-serif; font-size: 1em; font-weight: 900; letter-spacing: -.045em; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
  .official-brand-cn { display: inline-block; flex: 0 0 auto; font-family: "STHeiti", "PingFang SC", "Microsoft YaHei UI", sans-serif; font-size: .9em; font-weight: 900; letter-spacing: 0; white-space: nowrap; transform: none; }
  .official-brand-tagline { color: #53677b; font-weight: 680; }
  .official-language, .official-language-option { color: #07152f; font-weight: 800; }
  .official-mobile-panel a { color: #07152f; font-weight: 780; }
  .official-footer a { color: #334960; font-weight: 680; }
  .official-logo-review { min-height: calc(100dvh - var(--official-nav-offset)); padding: clamp(58px, 7vw, 94px) 0 96px; background: radial-gradient(circle at 16% 10%, rgb(118 220 240 / .2), transparent 30%), radial-gradient(circle at 86% 14%, rgb(242 167 206 / .2), transparent 32%), #fbfdff; }
  .official-logo-review-head { max-width: 760px; margin: 0 auto 44px; text-align: center; }
  .official-logo-review-head .official-route-kicker { margin-inline: auto; }
  .official-logo-review-head h1 { margin: 18px 0 0; color: #526fae; font-size: clamp(42px, 5.3vw, 70px); line-height: 1.02; letter-spacing: -.05em; }
  .official-logo-review-head > p:last-child { max-width: 44em; margin: 20px auto 0; color: #71839a; font-size: 15px; line-height: 1.75; }
  .official-logo-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
  .official-logo-option { min-width: 0; overflow: hidden; border: 1px solid rgb(143 196 219 / .28); border-radius: 26px; background: rgb(255 255 255 / .88); box-shadow: 0 18px 48px rgb(69 119 158 / .09); }
  .official-logo-option-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 22px 14px; }
  .official-logo-option-head span { color: #7890aa; font-size: 11px; font-weight: 820; letter-spacing: .08em; }
  .official-logo-option-head strong { color: #5a75aa; font-size: 18px; }
  .official-logo-sample-nav { min-height: 132px; display: flex; align-items: center; justify-content: center; padding: 26px; border-block: 1px solid rgb(156 205 224 / .24); background: linear-gradient(112deg, #f0fbff, #fff 49%, #fff2f9); }
  .official-logo-sample-brand { display: inline-flex; align-items: center; gap: 12px; }
  .official-logo-sample-brand > img { width: 50px; height: 50px; border-radius: 50%; object-fit: cover; }
  .official-logo-sample-brand .official-brand-name { gap: 9px; font-size: clamp(29px, 3vw, 38px); }
  .official-logo-option p { min-height: 72px; margin: 0; padding: 17px 22px 21px; color: #72859c; font-size: 13px; line-height: 1.65; }
  .official-wordmark-original { gap: 4px; color: #33445f; }
  .official-wordmark-original .official-brand-latin { background: none; color: #33445f; font-family: "Avenir Next", Arial, sans-serif; font-weight: 900; letter-spacing: -.045em; -webkit-text-fill-color: currentColor; }
  .official-wordmark-original .official-brand-cn { color: #33445f; font-family: "PingFang SC", "Microsoft YaHei UI", sans-serif; font-weight: 900; }
  .official-wordmark-geometric .official-brand-latin { font-family: "Arial Black", "Avenir Next", sans-serif; font-weight: 900; letter-spacing: -.065em; }
  .official-wordmark-geometric .official-brand-cn { font-family: "PingFang SC", "Microsoft YaHei UI", sans-serif; font-weight: 900; }
  .official-wordmark-ocean .official-brand-latin { background: linear-gradient(100deg, #28c6dc, #68abea 54%, #d68cce); background-clip: text; font-family: "Avenir Next Condensed", "Arial Narrow", sans-serif; font-weight: 800; letter-spacing: .015em; -webkit-background-clip: text; }
  .official-wordmark-ocean .official-brand-cn { color: #8b8bd5; font-family: "STKaiti", "KaiTi", "PingFang SC", sans-serif; font-weight: 800; }
  .official-wordmark-speed .official-brand-latin { background: linear-gradient(108deg, #28bfe4, #8794ea 58%, #ec8ab9); background-clip: text; font-family: "Avenir Next", "Arial Black", sans-serif; font-weight: 900; letter-spacing: -.035em; -webkit-background-clip: text; transform: skewX(-9deg); transform-origin: center; }
  .official-wordmark-speed .official-brand-cn { color: #748ed6; font-family: "STHeiti", "SimHei", "PingFang SC", sans-serif; font-weight: 900; }
  .official-wordmark-rounded .official-brand-latin { background: linear-gradient(105deg, #36c9dc, #85a4ed 52%, #ef9ac5); background-clip: text; font-family: "Arial Rounded MT Bold", "Avenir Next", sans-serif; font-weight: 900; letter-spacing: -.02em; -webkit-background-clip: text; }
  .official-wordmark-rounded .official-brand-cn { color: #ba84c8; font-family: "Yuanti SC", "YouYuan", "PingFang SC", sans-serif; font-weight: 800; }
  @media (max-width: 900px) {
    .official-about-story-grid, .official-about-contact-grid { grid-template-columns: 1fr; gap: 38px; }
    .official-about-principles { border-left: 0; }
    .official-about-principles > div { padding-left: 0; }
    .official-about-contact-options { grid-template-columns: 1fr; }
    .official-about-contact-entry { min-height: 116px; }
    .official-about-contact-entry + .official-about-contact-entry { border-top: 1px solid #dce9f0; border-left: 0; }
    .official-logo-grid { grid-template-columns: 1fr; }
  }
  @media (max-width: 600px) {
    .official-about-story, .official-about-contact-section { padding: 58px 0 64px; }
    .official-about-belief { padding: 54px 0 58px; }
    .official-about-belief-line { gap: 9px; margin-top: 28px; }
    .official-contact { top: calc(50% - 33px); right: 3px; bottom: auto; }
    .official-contact-bubble { right: 8px; bottom: 72px; }
    .official-logo-review { padding: 42px 0 68px; }
    .official-logo-review-head { margin-bottom: 28px; text-align: left; }
    .official-logo-review-head .official-route-kicker { margin-inline: 0; }
    .official-logo-review-head h1 { font-size: 42px; }
    .official-logo-sample-nav { min-height: 112px; padding: 22px 16px; }
    .official-logo-sample-brand { gap: 9px; }
    .official-logo-sample-brand > img { width: 44px; height: 44px; }
    .official-logo-sample-brand .official-brand-name { gap: 7px; font-size: 28px; }
    .official-contact-panel { position: fixed; top: auto; right: 12px; bottom: max(12px, env(safe-area-inset-bottom)); left: 12px; width: auto; max-height: 70vh; z-index: 202; border-radius: 24px; transform: none; }
    .official-contact-list { max-height: calc(70vh - 74px); padding-bottom: max(12px, env(safe-area-inset-bottom)); }
    .official-contact-backdrop { position: fixed; inset: 0; z-index: 201; display: block; background: rgb(8 29 56 / .46); }
    .official-contact-trigger { z-index: 203; }
    [data-official-contact][data-open] .official-contact-trigger { visibility: hidden; }
  }
  @media (prefers-reduced-motion: reduce) {
    .official-contact-panel, .official-contact-bubble { transition: none; }
  }
