/* One canvas surrounds every rounded surface. The panels may change tone; the page does not. */
:root { --paper:#f5f6f7; }
html,body { background:var(--paper); }
main,.hero,.product-metrics,.agents,.brains,.business-scenarios.case-section,.learning.restored-learning,.pricing { background:transparent!important; }

/* Navigation has one shell. All expansions have exactly the same left/right bounds. */
.island,.island.float {
  --nav-bg:#10232f;--nav-fg:#edf5f9;--nav-muted:#c0d1dd;--hc:var(--nav-fg);--hc-dim:var(--nav-muted);
  position:fixed;left:50%;top:var(--page-edge);width:calc(100% - 4*var(--page-edge));
  transform:translateX(-50%);background:var(--nav-bg);border:0;backdrop-filter:none;-webkit-backdrop-filter:none;
  border-radius:999px;box-shadow:0 6px 24px #0d222f0d;animation:none;
  transition:background-color 200ms,border-radius 350ms var(--ease-quality),color 200ms;
}
.island[data-theme=on-dark] { --nav-bg:#f8fafb;--nav-fg:#17313f;--nav-muted:#445f70; }
.island.is-menu-open,.island.is-mobile-open { border-radius:30px; }
.island .bar,.island.float .bar { height:64px;padding:0 24px;gap:24px;margin:0;max-width:none; }
.island .sw-logo { display:flex;align-items:center;gap:12px; }
.island .sw-logo svg { display:block;flex:none; }
.island .sw-logo svg path,.island.float .sw-logo svg path { fill:#16a4ff; }
.island .sw-logo .prod { display:flex;align-items:center;height:25px;line-height:25px;transform:none;font-size:16px; }
.island .sw-logo .divider { align-self:center; }
.island .navigation-links { display:flex;align-items:center;justify-content:center;gap:18px;flex:1; }
.nav-trigger { display:inline-flex;align-items:center;gap:7px;min-height:44px;font-size:14px;line-height:1;padding:10px 12px;border:0;background:none;color:var(--nav-muted);border-radius:18px; }
.nav-trigger>.ui-icon { width:15px;height:15px;transition:transform 250ms var(--ease-quality); }
.nav-trigger[aria-expanded=true] { color:var(--nav-fg);background:color-mix(in srgb,var(--nav-fg) 7%,transparent); }
.nav-trigger[aria-expanded=true]>.ui-icon { transform:rotate(180deg); }
.island .navigation-links .nav-price { min-height:44px;display:flex;align-items:center;font-size:14px;padding:10px 12px;color:var(--nav-muted); }
.island .actions { gap:10px; }
.btn-login { color:var(--nav-fg);border-color:color-mix(in srgb,var(--nav-fg) 25%,transparent); }
.navigation-expansion { height:0;overflow:auto;opacity:0;transition:height 350ms var(--ease-quality),opacity 180ms;scrollbar-width:thin; }
.is-menu-open .navigation-expansion { opacity:1;border-top:1px solid color-mix(in srgb,var(--nav-fg) 12%,transparent); }
.navigation-panel { display:grid;padding:26px 24px 30px;gap:24px; }
.products-panel,.developers-panel { grid-template-columns:.92fr 1fr 1fr; }
.solutions-panel { grid-template-columns:repeat(4,minmax(0,1fr));gap:30px; }
.navigation-panel h3 { font-size:12px;font-weight:500;color:var(--nav-muted);margin:4px 0 13px; }
.nav-feature>a { display:flex;flex-direction:column;color:var(--nav-fg); }
.nav-feature img { width:100%;height:155px;object-fit:cover;border-radius:16px;margin-bottom:14px; }
.nav-feature a>span,.nav-feature-copy p { font-size:12px;color:var(--nav-muted);margin:0 0 8px; }
.nav-feature strong { font-size:22px;font-weight:450;line-height:1.4;margin:0 0 8px; }
.nav-feature small,.nav-feature-copy span { font-size:13px;color:var(--nav-muted);line-height:1.7; }
.nav-feature-copy { padding:32px 24px;border-radius:18px;background:color-mix(in srgb,var(--nav-fg) 6%,transparent);display:flex;flex-direction:column;justify-content:center; }
.island .navigation-panel .nav-destination { display:flex;gap:12px;align-items:center;padding:12px 10px;border-radius:12px;color:var(--nav-fg);min-height:62px; }
.nav-destination-icon { width:28px;height:28px;display:grid;place-items:center;flex:none;color:#7ecbe8; }
.nav-destination-icon img { width:24px;height:24px;object-fit:contain; }
.nav-destination>span:nth-child(2) { flex:1;min-width:0; }
.nav-destination b { display:block;font-weight:450;font-size:14px;line-height:1.4; }
.nav-destination small { display:block;font-size:12px;line-height:1.5;color:var(--nav-muted);margin-top:3px; }
.nav-destination>.ui-icon { width:15px;height:15px;opacity:.65; }
.island .navigation-panel .nav-simple-destination { display:flex;align-items:center;justify-content:space-between;min-height:44px;padding:10px 0;font-size:14px;color:var(--nav-fg);border-radius:0; }
.nav-simple-destination>.ui-icon { width:15px;height:15px;opacity:.6; }
.island .navigation-panel a:hover { background:color-mix(in srgb,var(--nav-fg) 7%,transparent);color:var(--nav-fg); }
.island .nav-feature a:hover { background:transparent; }
.nav-mobile-toggle { display:none; }

/* Portraits own the right side, recording cards use the left-hand space below the introduction. */
.role-scene { height:680px;min-height:680px; }
.role-scene .scene-copy { top:54px;left:6%;width:42%;max-width:450px; }
.role-scene .scene-role { margin:0 0 20px;font-size:12px; }
.role-scene .scene-copy h3 { font-size:40px;line-height:1.25;margin-bottom:17px; }
.role-scene .scene-description { font-size:16px;line-height:1.7;margin:0; }
.role-scene .scene-buttons { margin-top:24px; }
.role-scene .staff-player { left:6%;right:auto;bottom:62px;width:min(390px,40%);padding:18px 22px 16px; }
.role-scene .scene-picture { width:100%;object-position:70% 30%; }
.role-scene[data-persona=skye] .scene-picture,.role-scene[data-persona=zhou] .scene-picture { left:auto;right:0;width:56%;object-position:center 26%; }
.role-scene[data-persona=skye]:after,.role-scene[data-persona=zhou]:after { background:linear-gradient(90deg,var(--scene-color) 0%,var(--scene-color) 43%,transparent 70%),linear-gradient(0deg,#122d3baf,transparent 45%); }
.role-scene .scene-name { bottom:20px; }

/* The learning scene opens through an aperture, sharing the physical entrance of the five brains. */
.learning.restored-learning { height:175svh;min-height:1250px;position:relative;overflow:visible; }
.learning-entry { position:absolute;top:112px;left:24px;right:24px;text-align:center;pointer-events:none;z-index:5;transition:opacity 500ms,transform 650ms var(--ease-quality); }
.learning-entry p { font-size:12px;color:#5c7584;margin:0 0 18px; }
.learning-entry strong { display:block;font-weight:450;font-size:50px;line-height:1.25;letter-spacing:-.025em; }
.is-learning-open .learning-entry { opacity:0;transform:translateY(-20px); }
.learning-trigger { position:absolute;top:55svh;left:50%;width:1px;height:1px;pointer-events:none; }
.learning-sticky { position:sticky;top:0;height:100svh;min-height:700px;margin:0;width:100%;border:0;border-radius:0;background:#0c1d29;padding:92px var(--gutter) 26px;overflow:hidden;clip-path:inset(38% calc(50% - 200px) 13% round 100px);transition:clip-path 1300ms cubic-bezier(.83,0,.17,1); }
.is-learning-open .learning-sticky { clip-path:inset(0 var(--page-edge) round var(--surface-radius)); }
.restored-learning .learning-copy h2 { color:#e8f3f8; }
.restored-learning .section-kicker { color:#a7c8d9; }
.restored-learning .learning-copy>p:not(.section-kicker) { color:#b5ccda; }
.restored-learning .conversion-proof>b { color:#8ccde2; }
.restored-learning .conversion-proof strong { color:#c5dfeb; }
.restored-learning .conversion-proof span { color:#a7c4d6; }
.restored-learning .learning-center { background:#0c1d29b8; }
.restored-learning .learning-center b { color:#d2eaf5; }
.restored-learning .learning-center span,.restored-learning .loop-node,.learning-focus { color:#a6c9dc; }
.restored-learning .loop-node.is-current { color:#e2f4fc; }
.restored-learning .loop-node i { border-color:#8dd0e4;background:#0c1d29; }
.restored-learning .learning-day-badge { color:#b5e3f4; }
.restored-learning .learning-orbit { stroke:#8ebcce; }
.learning-time { background:transparent;border:0;border-top:1px solid #9ebdce33;border-radius:0;padding:20px 0 0;margin-top:8px; }
.learning-time-copy h3 { color:#d3e9f3; }
.learning-time-copy p { color:#b3ccdb; }
.learning-time-controls .growth-milestones button { color:#b0cdda; }
.learning-time-controls input { accent-color:#8bcade; }
.learning-time .growth-controls>span,.growth-controls>button,.learning-time-source { color:#a2c0d2; }

/* The scenario is the photograph, not another copy of a result card. */
.case-visual { min-height:480px; }
.case-visual>img { filter:none;opacity:1; }
.case-visual:after { background:linear-gradient(0deg,#13324565,transparent 45%); }
.case-photo-note { font-size:11px; }
.pricing-copy h2 { font-size:48px; }
.plan-inclusions { margin:22px 0 26px; }
.plan-clarity { margin-bottom:0; }

@media(max-width:940px) {
  .island .bar { padding:0 18px;gap:16px;height:58px; }
  .island .navigation-links { display:none;position:absolute;top:58px;left:0;right:0;height:52px;padding:0 18px;gap:8px;grid-template-columns:repeat(4,minmax(0,1fr)); }
  .island.is-mobile-open .navigation-links { display:grid; }
  .island.is-mobile-open .navigation-expansion { margin-top:52px; }
  .nav-mobile-toggle { display:grid;place-items:center;width:44px;height:44px;border:0;background:transparent;color:var(--nav-fg);padding:0; }
  .nav-trigger { font-size:13px;justify-content:center;padding:8px 4px;gap:3px; }
  .nav-trigger>.ui-icon { width:12px;height:12px; }
  .island .navigation-links .nav-price { justify-content:center;padding:8px 4px;font-size:13px; }
  .navigation-panel { padding:22px 20px;gap:18px; }
  .products-panel,.developers-panel { grid-template-columns:1fr 1fr; }
  .nav-feature { grid-column:1/-1; }
  .nav-feature>a { display:grid;grid-template-columns:120px 1fr;column-gap:16px; }
  .nav-feature img { grid-row:span 3;height:100px;margin:0; }
  .nav-feature strong { font-size:20px; }
  .nav-feature-copy { min-height:130px; }
  .solutions-panel { grid-template-columns:1fr 1fr; }
  .nav-destination small { display:none; }
}
@media(max-width:760px) {
  .role-scene { height:750px;min-height:750px; }
  .role-scene .scene-copy { top:46px;left:7%;right:7%;width:auto;max-width:280px; }
  .role-scene .scene-copy h3 { font-size:31px;line-height:1.35;margin-bottom:15px; }
  .role-scene .scene-description { font-size:15px; }
  .role-scene .staff-player { left:7%;right:7%;width:auto;bottom:58px;padding:18px; }
  .role-scene[data-persona] .scene-picture { width:100%;object-position:68% 24%; }
  .role-scene[data-persona=skye]:after,.role-scene[data-persona=zhou]:after { background:linear-gradient(0deg,#122d3bf0,transparent 75%),linear-gradient(90deg,#102c3bc7,transparent 85%); }
  .learning.restored-learning { height:auto;min-height:0; }
  .learning-sticky { position:relative;height:auto;min-height:0;padding:94px 28px 50px;overflow:visible;clip-path:inset(32% calc(50% - 130px) 16% round 74px); }
  .is-learning-open .learning-sticky { clip-path:inset(0 var(--page-edge) round var(--surface-radius)); }
  .learning-entry { top:110px; }
  .learning-entry strong { font-size:36px; }
  .learning-time { padding:20px 0 0;gap:20px; }
  .case-visual { min-height:360px; }
  .pricing-copy h2 { font-size:36px; }
  .btn-login { display:none; }
}
@media(max-width:380px) {
  .island .bar { padding:0 12px;gap:8px; }
  .island .actions { gap:4px; }
  .btn-try { font-size:12px;padding:9px 12px; }
  .role-scene { height:780px;min-height:780px; }
  .navigation-panel { padding:20px 14px;gap:12px; }
  .nav-destination b { font-size:12px; }
  .island .navigation-panel .nav-destination { gap:7px;padding:10px 4px; }
}
@media(prefers-reduced-motion:reduce) {
  .learning-entry { display:none; }
  .learning-sticky { transition:none;clip-path:inset(0 var(--page-edge) round var(--surface-radius))!important; }
  .navigation-expansion,.island,.nav-trigger>.ui-icon { transition:none; }
}
.role-scene .staff-player { bottom:54px; }
.learning-portal { position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;z-index:4;opacity:1;transition:opacity 450ms; }
.learning-portal svg { width:min(600px,92vw);height:360px;fill:none;stroke:#86c4dc66;stroke-width:1; }
.learning-portal>span { position:absolute;top:calc(50% + 2px);font-size:14px;color:#bdddeb; }
.portal-learning-flow { stroke:#98d5e8;stroke-width:1.5;stroke-dasharray:60 920;animation:portalLearning 6s linear infinite; }
@keyframes portalLearning { to { stroke-dashoffset:-980; } }
.learning:not(.is-learning-open) .learning-main,.learning:not(.is-learning-open) .learning-time,.learning:not(.is-learning-open) .learning-time-source { opacity:0;visibility:hidden; }
.is-learning-open .learning-portal { opacity:0; }
.is-learning-open .learning-main,.is-learning-open .learning-time,.is-learning-open .learning-time-source { opacity:1;visibility:visible;transition:opacity 650ms 300ms; }
@media(max-width:760px) { .role-scene .staff-player { bottom:58px; } }
@media(prefers-reduced-motion:reduce) { .learning-portal { display:none; }.portal-learning-flow { animation:none; } }
@media(max-width:760px) {
  .island .navigation-links { padding:0 10px;gap:4px; }
  .nav-trigger { font-size:12px;padding:8px 0;gap:2px;white-space:nowrap; }
  .nav-trigger>.ui-icon { width:9px;height:9px; }
  .nav-destination>.ui-icon { display:none; }
  .island .navigation-panel .nav-destination { padding:10px 4px;gap:9px; }
  .nav-destination-icon { width:24px; }
}