/* Shared connection paint. Stroke width is the fixed 2.4px geometry contract. */
:root {
  --connection-stroke-width: 2.4px;
  --connection-source-color: var(--color-success);
  --connection-target-color: var(--color-primary);
  --connection-line-opacity: .88;
  --connection-highlight-width: 6px;
  --connection-highlight-opacity: .14;
  --connection-flow-color: #d7fff1;
  --connection-flow-width: 1.2px;
  --connection-motion-duration: 3200ms;
  --connection-transmit-duration: 1550ms;
  --connection-port-halo-opacity: .16;
  --connection-port-paint-size: 80px;
}

/* Shared fusion palette and motion; the retired chapter is not loaded. */
.liquid-lab__material--out{color:var(--lab-green)}.liquid-lab__material--in{color:var(--lab-blue)}
@keyframes liquid-lab-breathe{0%,100%{opacity:.16}50%{opacity:.5}}
@keyframes liquid-lab-emit{0%,35%,100%{opacity:.12}12%{opacity:.85}22%{opacity:.4}}
@keyframes liquid-lab-receive{0%,58%,100%{opacity:.12}78%{opacity:.85}88%{opacity:.45}}
@keyframes liquid-lab-absorb{0%,58%{opacity:0;transform:scale(.8)}78%{opacity:.9;transform:scale(1)}92%{opacity:.3;transform:scale(1.18)}98%,100%{opacity:0;transform:scale(1.25)}}
@keyframes liquid-lab-flow{0%,12%{stroke-dashoffset:3;opacity:0}16%{opacity:.9}74%{opacity:.9}78%,100%{stroke-dashoffset:-100;opacity:0}}

@keyframes liquid-lab-port-breathe{0%,100%{opacity:.8;transform:scale(.92)}50%{opacity:1;transform:scale(1.1)}}

@property --p-rim-angle {
  syntax: '<angle>';
  inherits: false;
  initial-value: -24deg;
}
:root {
  color-scheme: light;
  --p-ink: #282b30;
  --p-muted: #69717b;
  --p-blue: #356d98;
  --p-line: rgba(110, 133, 155, .14);
  /* Shared workspace identities; isolated page keeps the pearl surface palette. */
  --color-primary: #185ADB;
  --color-success: #167443;
  --lab-blue: var(--connection-target-color);
  --lab-green: var(--connection-source-color);
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
  font-synthesis: none;
}
* { box-sizing: border-box; }
html { min-width: 320px; scroll-behavior: smooth; }
body.pearl-home {
  margin: 0;
  color: var(--p-ink);
  background: #eef2f6 url('assets/website-pearl/pearl-backdrop.png') center top / cover fixed no-repeat;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
img { display: block; max-width: 100%; }
button:focus-visible, a:focus-visible, [tabindex='-1']:focus-visible { outline: 3px solid #356d98; outline-offset: 6px; }
.p-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.p-skip { position: fixed; z-index: 20; left: 24px; top: 12px; padding: 12px 18px; background: white; border-radius: 20px; transform: translateY(-160%); }
.p-skip:focus { transform: none; }
.p-optical-defs { position: absolute; width: 0; height: 0; pointer-events: none; }
.p-shell { max-width: 1520px; min-height: 100svh; margin: auto; padding: 28px 40px 24px; }
.p-glass {
  background: rgba(255,255,255,.62);
  border: 1px solid rgba(255,255,255,.92);
  box-shadow: inset 0 1px 1px rgba(255,255,255,.98), inset 0 -1px 1px rgba(155,173,189,.09), 0 12px 25px -12px rgba(46,63,82,.25), 0 2px 4px rgba(57,71,93,.035);
  -webkit-backdrop-filter: blur(22px) saturate(115%);
  backdrop-filter: blur(22px) saturate(115%);
}
.p-icon { width: 18px; height: 18px; flex-shrink: 0; }
.p-nav { position: relative; z-index: 3; max-width: 1280px; height: 60px; margin: auto; padding: 8px 12px 8px 24px; border-radius: 999px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.p-brand { display: inline-flex; align-items: center; gap: 11px; font-size: 23px; font-weight: 650; letter-spacing: -.055em; white-space: nowrap; }
.p-brand > img { width: 50px; height: 27px; object-fit: contain; }
.p-brand-cn { margin-left: 7px; font-size: 14px; letter-spacing: .02em; }
.p-nav-links { display: flex; gap: 27px; font-size: 13px; color: var(--p-muted); }
.p-nav-links [aria-current] { color: var(--p-ink); font-weight: 600; }
.p-nav-actions { display: flex; align-items: center; gap: 22px; font-size: 13px; font-weight: 600; }
.p-workspace { height: 42px; display: inline-flex; align-items: center; gap: 15px; padding: 0 21px; border-radius: 999px; }
.p-hero { max-width: 1280px; margin: clamp(32px,4.4svh,44px) auto 0; }
.p-eyebrow { display: flex; align-items: center; justify-content: center; gap: 7px; width: max-content; height: 30px; margin: 0 auto 18px; padding: 0 14px; border-radius: 999px; color: #57616d; font-size: 11px; font-weight: 500; box-shadow: inset 0 1px 1px white, 0 7px 16px -10px rgba(46,63,82,.22); }
.p-eyebrow .p-icon { width: 15px; height: 15px; }
.p-stage { --p-stage-height: clamp(320px,42svh,380px); position: relative; display: grid; grid-template-columns: 1fr 1.55fr 1fr; align-items: center; gap: clamp(28px,4vw,64px); height: var(--p-stage-height); --p-float-strength: 1; isolation: isolate; }
.p-wires { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
/* The workspace's rounded tube, green output and blue input. */
.p-wire, .p-wire-travel { fill: none; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.p-wire { stroke-width: var(--connection-stroke-width); opacity: var(--connection-line-opacity); }
.p-wire-travel { stroke: var(--connection-flow-color); stroke-width: var(--connection-flow-width); opacity: 0; stroke-dasharray: 3 97; }
.p-stage.is-transmitting .p-wire-travel { animation: liquid-lab-flow var(--connection-transmit-duration) linear both; }
.p-stage.is-transmitting .p-wire-travel-output { animation-delay: 160ms; }
/* Stable local port paint: no full-surface blur, opacity pulse or overflowing filter. */
.p-fusion-paint { position: absolute; width: var(--connection-port-paint-size); height: var(--connection-port-paint-size); overflow: hidden; contain: paint; transform: translate(-1px,-1px); pointer-events: none; z-index: 0; }
.p-fusion-root { pointer-events: none; }
.p-fusion-halo { opacity: var(--connection-port-halo-opacity); }
.p-fusion-outline { fill: none; stroke-width: 1px; stroke-linejoin: round; }
.p-fusion-orb { position: absolute; left: 2%; top: 2%; width: 96%; height: 96%; pointer-events: none; z-index: 1; }
.p-fusion-orb .p-fusion-paint { transform: none; }
.p-fusion-orb .p-fusion-outline { display: none; }
.p-systems .p-node-head, .p-systems .p-node-body, .p-app-symbol, .p-app-copy { position: relative; z-index: 1; }
.p-systems { position: relative; max-width: 280px; width: 100%; height: 100%; }
.p-system-node { position: absolute; display: block; width: calc(100% - 26px); padding: 10px 12px 8px; border-radius: 22px; border-color: transparent; transform: translate(var(--p-float-x,0px),var(--p-float-y,0px)) translateY(var(--p-card-shift-y,0)) rotate(var(--p-card-angle,0deg)) scale(var(--p-card-scale,1)); transform-origin: center; }
.p-system-node:nth-child(1) { top: 4px; left: 0; --p-card-angle: -.8deg; --p-card-scale: .96; z-index: 1; background: rgba(255,255,255,.54); }
.p-system-node:nth-child(2) { top: 50%; left: 24px; --p-card-shift-y: -50%; --p-card-angle: .6deg; z-index: 3; background: rgba(255,255,255,.72); box-shadow: inset 0 1px 1px white, 0 14px 27px -13px rgba(46,63,82,.29), 0 3px 5px rgba(57,71,93,.035); }
.p-system-node:nth-child(3) { bottom: 8px; left: -8px; --p-card-angle: -.4deg; --p-card-scale: .97; z-index: 2; background: rgba(255,255,255,.58); }
.p-node-head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; font-size: 11px; font-weight: 600; }
.p-type-icon { width: 22px; height: 22px; border-radius: 7px; display: grid; place-items: center; box-shadow: inset 0 1px 1px rgba(255,255,255,.4), 0 2px 4px rgba(26,51,72,.13); }
.p-type-icon .p-icon { width: 16px; height: 16px; filter: brightness(0) invert(1); }
.p-type-blue { background: #54799f; }
.p-type-teal { background: #4f8e85; }
.p-type-slate { background: #747f91; }
.p-node-body { min-height: 42px; padding: 5px 10px; display: flex; align-items: center; gap: 11px; background: rgba(255,255,255,.5); border: 1px solid rgba(255,255,255,.88); border-radius: 13px; }
.p-node-body strong { display: block; font-size: 14px; font-weight: 650; line-height: 1.4; }
.p-node-body small { display: block; margin-top: 3px; color: var(--p-muted); font-size: 10px; white-space: nowrap; }
.p-system-mark { width: 37px; height: 25px; object-fit: contain; }
.p-system-symbol { width: 37px; display: grid; place-items: center; color: var(--p-blue); }
.p-system-symbol .p-icon { width: 24px; height: 24px; opacity: .75; }
/* Droplets sit on the surface boundary; the tube mouth extends beyond them. */
.p-node-port, .p-app-port { position: absolute; top: calc(50% - 5px); width: 10px; height: 10px; border-radius: 50%; background: radial-gradient(circle at 32% 28%,white,var(--port-color) 72%); box-shadow: 0 0 0 3px color-mix(in srgb,var(--port-color) 16%,transparent), 0 0 12px color-mix(in srgb,var(--port-color) 55%,transparent); z-index: 2; }
.p-node-port { --port-color: var(--connection-source-color); left: calc(100% - 4px); }
.p-app-port { --port-color: var(--connection-target-color); left: -6px; }
.p-core { position: relative; display: flex; justify-content: center; align-items: center; }
.p-liquid-orb {
  --p-light-x: 34%; --p-light-y: 23%; --p-tilt-x: 0deg; --p-tilt-y: 0deg;
  position: relative; display: block; width: min(100%,380px,calc(var(--p-stage-height) - 8px)); aspect-ratio: 1; padding: 0;
  border: 0; border-radius: 50%; background: transparent; isolation: isolate;
  touch-action: pan-y;
}
.p-orb-ground { position: absolute; inset: auto 10% -3%; height: 13%; border-radius: 50%; background: rgba(73,104,129,.13); filter: blur(14px); transform: scale(.88); z-index: -1; }
.p-orb-material { position: absolute; inset: 2%; border-radius: 50%; filter: url('#p-liquid-warp'); transform: perspective(800px) rotateX(var(--p-tilt-x)) rotateY(var(--p-tilt-y)); }
.p-orb-body, .p-orb-spectrum, .p-orb-rim, .p-orb-inner-edge, .p-orb-reflection, .p-orb-glint { position: absolute; display: block; border-radius: 50%; pointer-events: none; }
.p-orb-body {
  inset: 0;
  background:
    radial-gradient(ellipse at var(--p-light-x) var(--p-light-y), rgba(255,255,255,.86), rgba(255,255,255,.27) 26%, transparent 54%),
    radial-gradient(ellipse at 65% 78%, rgba(157,191,207,.21), transparent 67%),
    radial-gradient(ellipse at 50% 54%, rgba(239,247,251,.05) 55%, rgba(109,160,191,.17) 78%, rgba(219,239,248,.54) 95%),
    linear-gradient(145deg, rgba(255,255,255,.48), rgba(221,235,247,.13) 49%, rgba(192,218,235,.27));
  border: 1px solid rgba(255,255,255,.84);
  box-shadow: inset 4px 5px 11px rgba(255,255,255,.91), inset -7px -8px 16px rgba(121,161,194,.26), 0 12px 28px -15px rgba(63,94,116,.23);
  -webkit-backdrop-filter: blur(3px) saturate(135%);
  backdrop-filter: blur(3px) saturate(135%);
}
.p-orb-spectrum {
  inset: -.5%;
  background: conic-gradient(from var(--p-rim-angle), #9dc7e7 0deg, #f3faff 42deg, #a6b1e7 83deg, #f6f9fc 124deg, #c8e9f3 164deg, #70bbd2 198deg, #f9d2a7 225deg, #effaff 258deg, #a1c4e6 286deg, #f2d1cd 316deg, #9dc7e7 360deg);
  -webkit-mask-image: radial-gradient(circle, transparent 60%, rgba(0,0,0,.22) 65%, #000 68%, #000 69%, transparent 71%);
  mask-image: radial-gradient(circle, transparent 60%, rgba(0,0,0,.22) 65%, #000 68%, #000 69%, transparent 71%);
  filter: blur(.9px); opacity: .9;
}
.p-orb-rim { inset: 1.6%; border: 1.4px solid rgba(255,255,255,.9); box-shadow: inset 0 1px 3px white, 0 1px 4px rgba(137,186,213,.44); }
.p-orb-inner-edge { inset: 6.5%; border: 1px solid rgba(255,255,255,.47); box-shadow: 1px 2px 3px rgba(96,151,174,.15), inset -1px -1px 3px rgba(222,231,249,.65); }
.p-orb-reflection { inset: 5%; background: radial-gradient(ellipse at var(--p-light-x) var(--p-light-y), rgba(255,255,255,.83), transparent 47%); -webkit-mask-image: linear-gradient(135deg,#000,transparent 65%); mask-image: linear-gradient(135deg,#000,transparent 65%); }
.p-orb-glint { width: 57%; height: 14%; top: 8%; left: 12%; border-top: 4px solid rgba(255,255,255,.94); filter: blur(2px); transform: rotate(-33deg); opacity: .9; }
.p-liquid-orb[data-pressed='true'] .p-orb-material { transform: perspective(800px) rotateX(var(--p-tilt-x)) rotateY(var(--p-tilt-y)) scale(.98,.96); }
/* The supplied identity is the only content in the glass, followed by the build entry. */
.p-orb-content { position: absolute; inset: 18% 10% 13%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; z-index: 2; }
.p-orb-logo { width: 78%; height: auto; aspect-ratio: 960 / 509; object-fit: contain; pointer-events: none; }
.p-orb-wordmark { font-size: clamp(20px,2.3vw,30px); font-weight: 650; letter-spacing: -.045em; line-height: 1.1; color: #285b98; }
.p-orb-content .p-orb-cta { margin-top: 2px; gap: 18px; height: 46px; padding: 4px 6px 4px 22px; font-size: 14px; white-space: nowrap; }
.p-orb-cta .p-dark-icon { width: 36px; height: 36px; }
/* Four output forms remain external, with restrained icons and brief descriptions. */
.p-outputs { position: relative; width: 100%; height: 100%; }
.p-applications { position: relative; width: 100%; height: 100%; list-style: none; margin: 0; padding: 0; }
.p-app-card { position: absolute; display: flex; align-items: center; gap: 10px; padding: 12px 14px; min-height: 66px; border-radius: 20px; border-color: transparent; transform: translate(var(--p-float-x,0px),var(--p-float-y,0px)) rotate(var(--p-card-angle,0deg)) scale(var(--p-card-scale,1)); transform-origin: left center; }
.p-app-workbench { top: 0; left: 0; width: 180px; --p-card-angle: .5deg; z-index: 3; }
.p-app-dashboard { top: 27%; left: 78px; width: 174px; --p-card-angle: -.6deg; --p-card-scale: .96; z-index: 2; background: rgba(255,255,255,.54); }
.p-app-workflow { top: 53%; left: 8px; width: 178px; --p-card-angle: .4deg; --p-card-scale: .97; z-index: 2; }
.p-app-assistant { bottom: 8px; left: 58px; width: 174px; --p-card-angle: -.5deg; --p-card-scale: .96; z-index: 1; background: rgba(255,255,255,.55); }
.p-app-symbol { display: grid; place-items: center; flex: 0 0 32px; width: 32px; height: 32px; border-radius: 10px; background: #e5eefb; }
.p-app-symbol .p-icon { width: 22px; height: 22px; }
.p-app-symbol-dashboard { background: #f0ecf7; }
.p-app-symbol-workflow { background: #e8f5f1; }
.p-app-symbol-assistant { background: #f0ecf7; }
.p-app-copy strong { display: block; font-size: 13px; line-height: 1.4; font-weight: 600; white-space: nowrap; }
.p-app-copy small { display: block; margin-top: 3px; font-size: 10px; color: var(--p-muted); white-space: nowrap; }
.p-more-apps { position: absolute; top: 68%; right: -10px; display: flex; align-items: center; gap: 5px; color: var(--p-muted); padding: 5px 10px; border-radius: 999px; font-size: 10px; line-height: 16px; white-space: nowrap; box-shadow: 0 5px 16px -12px rgba(46,63,82,.25); }
.p-more-apps .p-icon { width: 11px; height: 11px; }

.p-hero-copy { margin-top: 24px; text-align: center; }
h1 { margin: 0; font-size: clamp(24px,2.8vw,34px); font-weight: 650; line-height: 1.35; letter-spacing: -.035em; }
h1 span { color: var(--p-blue); }
.p-cta { display: inline-flex; align-items: center; gap: 22px; margin-top: 14px; height: 48px; padding: 5px 7px 5px 25px; border-radius: 999px; font-size: 14px; font-weight: 600; }
.p-dark-icon { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--p-ink); box-shadow: inset 0 1px 2px rgba(255,255,255,.35), 0 4px 6px rgba(23,30,36,.15); }
.p-dark-icon .p-icon { filter: brightness(0) invert(1); }
.p-ecosystem { max-width: 1280px; margin: 30px auto 0; }
.p-ecosystem-head { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; margin-bottom: 4px; min-height: 24px; }
.p-quiet-rule { height: 1px; background: var(--p-line); }
.p-ecosystem h2 { margin: 0; color: var(--p-muted); font-size: 10px; font-weight: 400; letter-spacing: .16em; }
.p-motion-toggle { justify-self: end; display: inline-flex; align-items: center; gap: 5px; height: 28px; padding: 0 8px; border-radius: 14px; border: 1px solid transparent; background: transparent; color: var(--p-muted); font-size: 10px; }
.p-motion-toggle .p-icon { width: 12px; height: 12px; }
.p-motion-toggle:hover { border-color: rgba(135,153,174,.2); background: rgba(255,255,255,.45); }
.p-marquee { height: 34px; overflow: hidden; -webkit-mask-image: linear-gradient(to right,transparent,#000 7%,#000 93%,transparent); mask-image: linear-gradient(to right,transparent,#000 7%,#000 93%,transparent); }
.p-marquee + .p-marquee { margin-top: 0; }
.p-logo-track { display: flex; width: max-content; animation: p-marquee var(--p-marquee-duration,42s) linear infinite; }
.p-marquee[data-direction='right'] .p-logo-track { animation-direction: reverse; }
.p-logo-group { flex-shrink: 0; display: flex; justify-content: space-around; align-items: center; list-style: none; margin: 0; padding: 0 50px 0 0; gap: 50px; min-width: max(1120px,100vw); height: 34px; }
.p-logo { display: flex; align-items: center; gap: 8px; min-width: 104px; color: #424c59; opacity: .83; white-space: nowrap; font-size: 16px; font-weight: 600; letter-spacing: -.02em; }
.p-logo img { width: 26px; height: 26px; object-fit: contain; }
.p-logo-system { min-width: 110px; font-size: 19px; font-weight: 550; letter-spacing: .06em; color: #687789; }
@keyframes p-marquee { to { transform: translateX(-50%); } }
.p-marquee:hover .p-logo-track, .p-marquee:focus-within .p-logo-track { animation-play-state: paused; }
body[data-motion='paused'] .p-logo-track, body[data-motion='paused'] .p-orb-spectrum, body[data-hidden='true'] .p-logo-track, body[data-hidden='true'] .p-orb-spectrum { animation-play-state: paused; }
body[data-motion='paused'] .p-wire-travel, body[data-hidden='true'] .p-wire-travel { animation: none; }
@media (prefers-reduced-motion: no-preference) {
  .p-liquid-orb { transition: transform 180ms ease-out; }
  .p-orb-material, .p-orb-content { transition: transform 240ms cubic-bezier(.2,.7,.2,1); }
  .p-orb-spectrum { animation: p-liquid-turn 24s ease-in-out infinite alternate; }
  .p-system-node, .p-cta, .p-workspace { transition: background-color 180ms, box-shadow 180ms; }
  .p-system-node:hover, .p-cta:hover, .p-workspace:hover { background-color: rgba(255,255,255,.87); }
}
@keyframes p-liquid-turn { to { --p-rim-angle: 75deg; } }
/* The same left → center → right hierarchy survives narrow and short viewports. */
@media (max-height: 780px) and (min-width: 761px) {
  .p-shell { padding-top: 18px; padding-bottom: 18px; }
  .p-nav { height: 54px; }
  .p-workspace { height: 38px; }
  .p-hero { margin-top: 28px; }
  .p-eyebrow { height: 28px; margin-bottom: 16px; }
  .p-stage { --p-stage-height: clamp(280px,40svh,312px); --p-float-strength: .7; }
  .p-liquid-orb { max-width: 300px; }
  .p-hero-copy { margin-top: 18px; }
  h1 { font-size: clamp(23px,2.6vw,31px); }
  .p-ecosystem { margin-top: 22px; }
  .p-ecosystem-head { margin-bottom: 2px; min-height: 24px; }
  .p-marquee, .p-logo-group { height: 30px; }
  .p-app-card { min-height: 60px; padding: 9px 10px; }
  .p-orb-content { gap: 8px; }
  .p-orb-wordmark { font-size: 24px; }
  .p-orb-content .p-orb-cta { height: 42px; padding-left: 18px; gap: 14px; font-size: 13px; }
  .p-orb-cta .p-dark-icon { width: 32px; height: 32px; }
}
@media (max-width: 1100px) {
  .p-shell { padding-left: 28px; padding-right: 28px; }
  .p-stage { gap: 32px; }
  .p-node-body { gap: 7px; padding-left: 8px; padding-right: 8px; }
  .p-node-body strong { font-size: 13px; }
  .p-app-card { padding: 10px; width: 156px; }
  .p-app-dashboard { left: 50px; }
  .p-app-assistant { left: 44px; }
  .p-app-symbol { flex-basis: 26px; width: 26px; height: 26px; }
  .p-app-symbol .p-icon { width: 18px; height: 18px; }
  .p-app-copy strong { font-size: 12px; }
  .p-app-copy small { font-size: 9px; }
  .p-more-apps { right: -4px; top: 74%; }
}
@media (max-width: 900px) {
  .p-stage { grid-template-columns: 1fr 1.45fr .95fr; gap: 24px; }
  .p-nav-links { gap: 19px; }
  .p-brand { font-size: 21px; }
  .p-nav-actions { gap: 17px; }
  .p-app-card { width: 146px; gap: 6px; padding: 8px; }
  .p-app-dashboard { left: 26px; }
  .p-app-assistant { left: 20px; }
  .p-app-copy strong { font-size: 11px; }
  .p-more-apps { top: auto; bottom: -20px; right: 10px; }
}
@media (max-width: 760px) {
  .p-shell { padding: 20px; }
  .p-nav { height: 56px; padding-left: 18px; gap: 12px; }
  .p-nav-links, .p-login { display: none; }
  .p-workspace { padding: 0 14px; gap: 9px; font-size: 11px; height: 38px; }
  .p-brand { font-size: 20px; gap: 8px; }
  .p-brand > img { width: 36px; height: 20px; }
  .p-brand-cn { font-size: 11px; margin-left: 5px; }
  .p-hero { margin-top: 28px; }
  .p-eyebrow { height: 28px; margin-bottom: 20px; font-size: 10px; }
  .p-stage { --p-stage-height: 280px; --p-float-strength: .45; grid-template-columns: .9fr 1.5fr .8fr; gap: 16px; }
  .p-system-node { width: calc(100% - 12px); border-radius: 17px; padding: 8px; }
  .p-system-node:nth-child(2) { left: 10px; }
  .p-system-node:nth-child(3) { left: -3px; }
  .p-node-head { font-size: 9px; gap: 5px; margin-bottom: 5px; }
  .p-type-icon { width: 19px; height: 19px; border-radius: 6px; }
  .p-type-icon .p-icon { width: 12px; height: 12px; }
  .p-node-body { padding: 6px; gap: 5px; }
  .p-system-mark, .p-system-symbol { width: 27px; }
  .p-system-symbol .p-icon { width: 18px; height: 18px; }
  .p-node-body strong { font-size: 11px; }
  .p-node-body small { font-size: 8px; }
  .p-app-card { width: calc(100% - 10px); min-height: 52px; padding: 7px; border-radius: 15px; }
  .p-app-workbench { left: 0; }
  .p-app-dashboard { top: 26%; left: 6px; }
  .p-app-workflow { top: 52%; left: -2px; }
  .p-app-assistant { bottom: 12px; left: 5px; }
  .p-app-symbol { flex-basis: 22px; width: 22px; height: 22px; border-radius: 7px; }
  .p-app-symbol .p-icon { width: 16px; height: 16px; }
  .p-app-copy strong { font-size: 10px; }
  .p-app-copy small { display: none; }
  .p-more-apps { bottom: -14px; right: 0; font-size: 9px; gap: 2px; padding: 3px 6px; }
  .p-more-apps .p-icon { width: 10px; height: 10px; }
  .p-orb-content { gap: 7px; inset: 18% 8% 12%; }
  .p-orb-wordmark { font-size: clamp(16px,3vw,22px); }
  .p-orb-content .p-orb-cta { height: 42px; font-size: 12px; padding-left: 14px; gap: 10px; }
  .p-orb-cta .p-dark-icon { width: 30px; height: 30px; }
  .p-hero-copy { margin-top: 24px; }
  h1 { font-size: clamp(21px,3.5vw,28px); }
  .p-ecosystem { margin-top: 22px; }
  .p-ecosystem-head { gap: 14px; }
  .p-logo-group { min-width: 960px; gap: 38px; padding-right: 38px; }
  .p-logo { font-size: 14px; }
  .p-logo img { width: 23px; height: 23px; }
  .p-logo-system { font-size: 17px; }
}
@media (max-width: 600px) {
  .p-orb-content { inset: 0; gap: 7px; }
  .p-orb-logo { width: 64%; }
  .p-orb-content .p-orb-cta { position: absolute; top: calc(100% + 8px); left: 50%; transform: translateX(-50%); margin-top: 0; height: 44px; padding: 5px 6px 5px 14px; gap: 10px; }
  .p-app-card { flex-direction: column; justify-content: center; gap: 3px; padding: 6px 4px; }
  .p-app-symbol { flex-basis: auto; width: 20px; height: 20px; }
}
@media (max-width: 480px) {
  .p-shell { padding: 18px 14px; }
  .p-nav { padding-left: 12px; gap: 8px; }
  .p-brand { font-size: 16px; gap: 6px; }
  .p-brand-cn { display: none; }
  .p-brand > img { width: 29px; height: 16px; }
  .p-workspace { font-size: 10px; padding: 0 10px; gap: 5px; }
  .p-workspace .p-icon { width: 15px; }
  .p-eyebrow { margin-bottom: 16px; }
  .p-stage { --p-stage-height: 300px; grid-template-columns: .85fr 1.6fr .7fr; gap: 10px; }
  .p-system-node { width: calc(100% - 8px); padding: 7px; border-radius: 14px; }
  .p-system-node:nth-child(1) { top: 18px; }
  .p-system-node:nth-child(2) { left: 6px; }
  .p-system-node:nth-child(3) { left: -2px; bottom: 18px; }
  .p-node-head > span:last-child { display: none; }
  .p-node-body { min-height: 30px; padding: 6px 3px; border-radius: 8px; }
  .p-system-mark, .p-system-symbol { display: none; }
  .p-node-body strong { font-size: 10px; }
  .p-node-body small { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .p-app-copy strong { font-size: 9px; }
  .p-app-card { min-height: 46px; }
  .p-app-workbench { top: 16px; }
  .p-app-assistant { bottom: 22px; }
  .p-more-apps { bottom: -8px; }
  h1 { font-size: 23px; line-height: 1.45; }
  h1 span { display: block; }
  .p-orb-wordmark { font-size: 16px; }
  .p-ecosystem { margin-top: 20px; }
  .p-ecosystem h2 { font-size: 8px; letter-spacing: .08em; }
  .p-marquee, .p-logo-group { height: 32px; }
}
@media (prefers-reduced-motion: no-preference) {
  .p-app-card { transition: background-color 180ms, box-shadow 180ms; }
  .p-app-card:hover { background-color: rgba(255,255,255,.88); }
}
body[data-scene='offscreen'] .p-orb-spectrum { animation-play-state: paused; }
body[data-scene='offscreen'] .p-wire-travel { animation: none; }
body[data-logos='offscreen'] .p-logo-track { animation-play-state: paused; }
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .p-glass, .p-app-card { background: rgba(252,253,255,.94); }
}
@media (prefers-reduced-transparency: reduce) {
  .p-glass, .p-app-card { background: #fafdff; backdrop-filter: none; -webkit-backdrop-filter: none; }
  .p-orb-body { background: #edf4f8; backdrop-filter: none; -webkit-backdrop-filter: none; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .p-logo-track { animation-play-state: paused; }
  body[data-user-motion='enabled'][data-motion='running']:not([data-hidden='true']):not([data-logos='offscreen']) .p-marquee:not(:hover):not(:focus-within) .p-logo-track { animation-play-state: running; }
  .p-stage.is-transmitting .p-wire-travel { animation: none; }
}
@media (forced-colors: active) {
  body.pearl-home { background: Canvas; }
  .p-glass, .p-system-node, .p-app-card, .p-cta, .p-workspace { background: Canvas; border-color: CanvasText; box-shadow: none; }
  .p-orb-body { background: Canvas; border: 2px solid CanvasText; box-shadow: none; }
  .p-orb-spectrum, .p-orb-inner-edge, .p-orb-reflection, .p-orb-glint, .p-orb-ground, .p-fusion-paint { display: none; }
  .p-wire { stroke: CanvasText; }
}