:root{
  --bg:#edf4fb;
  --bg-elev:#f8fbff;
  --surface:rgba(255,255,255,.72);
  --surface-strong:rgba(255,255,255,.9);
  --line:rgba(123,153,193,.22);
  --line-strong:rgba(123,153,193,.32);
  --text:#0e1726;
  --muted:#677b96;
  --blue:#2d7ef5;
  --shadow:0 18px 60px rgba(66,106,156,.14);
  --radius:28px;
  --header-offset:110px;
}
html[data-theme="dark"]{
  --bg:#081320;
  --bg-elev:#0f1d2d;
  --surface:rgba(14,26,40,.78);
  --surface-strong:rgba(17,31,48,.92);
  --line:rgba(138,174,218,.18);
  --line-strong:rgba(138,174,218,.28);
  --text:#eff6ff;
  --muted:#a4b8d1;
  --blue:#7db5ff;
  --shadow:0 24px 80px rgba(0,0,0,.34);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font:16px/1.6 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:linear-gradient(180deg,var(--bg) 0%,var(--bg-elev) 100%);color:var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button{font:inherit}
.skip-link{position:fixed;left:18px;top:18px;z-index:1000;background:#0d1523;color:#fff;padding:10px 14px;border-radius:14px;transform:translateY(-160%);transition:transform .24s ease}
.skip-link:focus{transform:translateY(0)}

.site-header{position:fixed;inset:14px 14px auto;z-index:50}
.nav-shell{max-width:1480px;margin:0 auto;min-height:78px;padding:10px 16px;border-radius:34px;background:rgba(255,255,255,.72);backdrop-filter:blur(18px) saturate(1.25);border:1px solid rgba(255,255,255,.56);box-shadow:0 16px 40px rgba(70,96,130,.12);display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:20px}
html[data-theme="dark"] .nav-shell{background:rgba(9,22,37,.72);border-color:rgba(159,193,230,.14);box-shadow:0 16px 40px rgba(0,0,0,.34)}
.brand{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:-.02em}.brand img{width:38px;height:38px}.brand span{font-size:19px}
.nav-links{list-style:none;margin:0;padding:0;display:flex;justify-content:center;gap:12px;align-items:center}
.nav-links a{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 20px;border-radius:999px;color:var(--muted);font-weight:760;transition:background .24s ease,color .24s ease,transform .24s ease}
.nav-links a:hover{color:var(--text);transform:translateY(-1px)}
.nav-links a.active{background:rgba(255,255,255,.82);color:var(--text);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 8px 20px rgba(76,103,137,.08)}
html[data-theme="dark"] .nav-links a.active{background:rgba(255,255,255,.1)}
.nav-actions{display:flex;align-items:center;gap:10px}
.icon-button{width:50px;height:50px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.42);display:grid;place-items:center;color:var(--text);backdrop-filter:blur(10px);cursor:pointer}
html[data-theme="dark"] .icon-button{background:rgba(255,255,255,.04)}
.icon-button svg{width:22px;height:22px}
.theme-icon-sun{display:none}
html[data-theme="dark"] .theme-icon-moon{display:none}
html[data-theme="dark"] .theme-icon-sun{display:block}
.menu-button{display:none}

.story-section{position:relative;height:640svh}
.story-sticky{position:sticky;top:0;height:100svh;overflow:hidden;--p:0;--mx:0px;--my:0px;--scene-dim:0;--scene-fade:1;--copy-o:1;--bubble-o:0;--bubble-rise:80px;--boat-y:0px;--boat-scale:1;--hero-o:0;--progress:0;--ambient-o:0;--haze-o:.16;background:linear-gradient(180deg,#eef8ff 0%,#d8e9fb 44%,#d4e4f6 100%)}
.story-stage,.story-fog,.story-copy,.story-bubbles,.ambient-bubbles,.boat-craft,.story-progress,.hero-shell,.story-water-sheen{position:absolute;inset:0}
.story-stage{background-position:center center;background-repeat:no-repeat;background-size:cover;will-change:transform,opacity,filter}
.story-layer-far{background-image:linear-gradient(90deg,rgba(255,255,255,.55),rgba(255,255,255,0) 34%),url('journey-far.webp');opacity:var(--far-o,1);transform:translate3d(calc(var(--mx)*.16),calc(var(--my)*.08 + var(--far-y,0vh)),0) scale(var(--far-s,1.02));filter:saturate(1.04) brightness(1.03)}
.story-layer-approach{background-image:linear-gradient(90deg,rgba(255,255,255,.42),rgba(255,255,255,0) 30%),url('journey-approach.webp');opacity:var(--approach-o,0);transform:translate3d(calc(var(--mx)*.22),calc(var(--my)*.1 + var(--approach-y,0vh)),0) scale(var(--approach-s,1.04));filter:saturate(1.02) brightness(1.02)}
.story-layer-island{background-image:linear-gradient(90deg,rgba(255,255,255,.25),rgba(255,255,255,0) 26%),url('island-approach.webp');opacity:var(--island-o,0);transform:translate3d(calc(var(--mx)*.34),calc(var(--my)*.14 + var(--island-y,0vh)),0) scale(var(--island-s,1.08));filter:saturate(1.03)}
.story-layer-near{background-image:linear-gradient(90deg,rgba(255,255,255,.18),rgba(255,255,255,0) 24%),url('island-near.webp');opacity:var(--near-o,0);transform:translate3d(calc(var(--mx)*.46),calc(var(--my)*.18 + var(--near-y,0vh)),0) scale(var(--near-s,1.1));filter:saturate(1.06)}
.story-layer-close{background-image:linear-gradient(90deg,rgba(255,255,255,.15),rgba(255,255,255,0) 20%),url('island-close.webp');opacity:var(--close-o,0);transform:translate3d(calc(var(--mx)*.56 + var(--close-x,0vw)),calc(var(--my)*.22 + var(--close-y,0vh)),0) scale(var(--close-s,1.12));filter:saturate(1.07) brightness(1.01)}
.story-sticky::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.02) 0%,rgba(0,0,0,calc(var(--scene-dim)*.16)) 100%);pointer-events:none}
.story-water-sheen{pointer-events:none;z-index:6;opacity:var(--scene-fade)}
.story-water-sheen::before,.story-water-sheen::after{content:"";position:absolute;inset:auto -12% -4%;height:42%;background-repeat:repeat-x;background-size:1000px 100%;filter:blur(.4px)}
.story-water-sheen::before{background-image:radial-gradient(circle at 50% 140%, rgba(255,255,255,.26) 0 2px, rgba(255,255,255,0) 2px 28px);opacity:.18;animation:driftSheen 16s linear infinite}
.story-water-sheen::after{background:linear-gradient(180deg,rgba(255,255,255,0),rgba(255,255,255,.16) 22%,rgba(135,185,244,.08) 48%,rgba(46,94,152,.18) 84%,rgba(12,26,48,.14));opacity:.84}
@keyframes driftSheen{from{transform:translateX(0)}to{transform:translateX(-360px)}}
.story-fog{pointer-events:none;z-index:8;opacity:var(--haze-o)}
.story-fog::before{content:"";position:absolute;border-radius:999px;background:radial-gradient(circle,rgba(255,255,255,.78) 0%,rgba(255,255,255,.4) 38%,rgba(255,255,255,0) 72%);filter:blur(18px)}
.fog-a::before{width:48vw;height:16vw;left:-10vw;bottom:12vh;animation:fogA 16s ease-in-out infinite}
.fog-b::before{width:42vw;height:14vw;right:-10vw;bottom:22vh;animation:fogB 18s ease-in-out infinite}
.fog-c::before{width:56vw;height:18vw;left:22vw;bottom:6vh;animation:fogC 20s ease-in-out infinite}
@keyframes fogA{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(4vw,-1vh,0)}}
@keyframes fogB{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(-4vw,1vh,0)}}
@keyframes fogC{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(2vw,-2vh,0)}}
.story-copy{z-index:12;display:grid;place-content:center;text-align:center;padding:0 24px;bottom:11vh;opacity:var(--copy-o);transform:translateY(calc((1 - var(--copy-o))*40px));transition:none;pointer-events:none}
.story-kicker{display:inline-flex;align-items:center;gap:10px;margin:0 auto 18px;padding:10px 18px;border-radius:999px;background:rgba(64,95,136,.24);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.44);font-size:15px;font-weight:760;color:#fff;text-shadow:0 2px 14px rgba(0,0,0,.14)}
.story-kicker::before{content:"";width:12px;height:12px;border-radius:50%;background:#cfe84f;box-shadow:0 0 0 8px rgba(207,232,79,.16)}
.story-copy strong{display:block;font-size:clamp(52px,6.4vw,104px);line-height:1.02;letter-spacing:-.06em;color:#fff;text-shadow:0 10px 50px rgba(29,61,99,.28);max-width:10ch;margin:0 auto 18px}
.story-copy small{display:block;font-size:clamp(14px,1.6vw,22px);line-height:1.55;color:rgba(255,255,255,.94);text-shadow:0 4px 22px rgba(19,45,78,.28)}

.story-bubbles{z-index:14;opacity:var(--bubble-o);pointer-events:none;transform:translateY(var(--bubble-rise))}
.story-bubble{position:absolute;display:flex;gap:14px;align-items:center;padding:18px 18px 18px 14px;min-width:260px;max-width:min(32vw,420px);border-radius:30px;background:linear-gradient(180deg,rgba(255,255,255,.4),rgba(255,255,255,.16));backdrop-filter:blur(14px) saturate(1.2);border:1px solid rgba(255,255,255,.42);color:#fff;box-shadow:0 20px 50px rgba(45,95,150,.12),inset 0 1px 0 rgba(255,255,255,.72), inset 0 -30px 40px rgba(113,190,255,.08)}
.story-bubble::before{content:"";position:absolute;inset:auto 18px 14px;width:42px;height:42px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.92),rgba(255,255,255,0) 72%);filter:blur(3px);opacity:.22}
.story-bubble::after{content:"";position:absolute;left:14px;right:14px;top:8px;height:18%;border-radius:999px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.52),transparent);filter:blur(2px);animation:bubbleSweep 4.5s ease-in-out infinite}
.bubble-search{left:6vw;bottom:26vh}
.bubble-local{right:6vw;bottom:32vh}
.bubble-download{left:50%;bottom:14vh;transform:translateX(-50%)}
.bubble-icon{flex:0 0 52px;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.3)}
.bubble-icon svg{width:26px;height:26px}
.story-bubble strong{display:block;font-size:20px;line-height:1.15;margin-bottom:2px}
.story-bubble small{display:block;font-size:14px;line-height:1.45;color:rgba(255,255,255,.88)}
@keyframes bubbleSweep{0%,100%{transform:translateX(-28%);opacity:.18}50%{transform:translateX(24%);opacity:.66}}

.ambient-bubbles{z-index:13;opacity:var(--ambient-o);pointer-events:none}
.ambient-bubble{position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.4);background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.75),rgba(255,255,255,.18) 40%,rgba(255,255,255,0) 72%);box-shadow:0 0 0 1px rgba(255,255,255,.06), inset 0 0 18px rgba(255,255,255,.16)}
.a1{left:10%;bottom:-10%;width:10px;height:10px;animation:riseA 10s linear infinite}.a2{left:16%;bottom:-8%;width:14px;height:14px;animation:riseB 13s linear infinite}.a3{left:28%;bottom:-14%;width:8px;height:8px;animation:riseC 11s linear infinite}.a4{right:20%;bottom:-8%;width:12px;height:12px;animation:riseA 12s linear infinite}.a5{right:12%;bottom:-14%;width:18px;height:18px;animation:riseB 14s linear infinite}.a6{left:42%;bottom:-10%;width:9px;height:9px;animation:riseC 9s linear infinite}.a7{right:34%;bottom:-14%;width:11px;height:11px;animation:riseA 11s linear infinite}.a8{left:60%;bottom:-8%;width:15px;height:15px;animation:riseB 15s linear infinite}
@keyframes riseA{0%{transform:translate3d(0,0,0);opacity:0}12%{opacity:.66}100%{transform:translate3d(1vw,-88vh,0);opacity:0}}
@keyframes riseB{0%{transform:translate3d(0,0,0);opacity:0}10%{opacity:.5}100%{transform:translate3d(-1.2vw,-96vh,0);opacity:0}}
@keyframes riseC{0%{transform:translate3d(0,0,0);opacity:0}10%{opacity:.58}100%{transform:translate3d(.6vw,-80vh,0);opacity:0}}

.boat-craft{z-index:15;display:grid;place-items:end center;padding-bottom:7vh;pointer-events:none;opacity:calc(.84 * var(--scene-fade));transform:translateY(var(--boat-y)) scale(var(--boat-scale));transition:none}
.boat-craft svg{width:min(28vw,440px);height:auto;filter:drop-shadow(0 14px 40px rgba(18,43,77,.16))}
.wake-ring{position:absolute;left:50%;bottom:6.5vh;transform:translateX(-50%);border-radius:50%;border:1.5px solid rgba(255,255,255,.32)}
.wake-1{width:min(38vw,580px);height:min(12vw,180px);opacity:.58}
.wake-2{width:min(52vw,760px);height:min(16vw,230px);opacity:.28}

.story-progress{z-index:17;display:grid;place-content:end center;padding-bottom:2.1vh;pointer-events:none}
.story-progress-track{position:relative;width:min(760px,calc(100vw - 48px));height:5px;border-radius:999px;background:rgba(255,255,255,.28);box-shadow:inset 0 1px 0 rgba(255,255,255,.24)}
.story-progress-fill{position:absolute;left:50%;transform:translateX(-50%);bottom:2.1vh;width:min(760px,calc(100vw - 48px));height:5px;border-radius:999px;overflow:hidden}
.story-progress-fill::before{content:"";display:block;height:100%;width:calc(var(--progress) * 100%);background:linear-gradient(90deg,rgba(194,223,255,.24),rgba(255,255,255,.95));border-radius:999px;transition:none}
.story-progress-boat{position:absolute;left:calc(50% - min(760px,calc(100vw - 48px))/2 + (min(760px,calc(100vw - 48px)) * var(--progress)));bottom:calc(2.1vh - 14px);width:44px;height:44px;transform:translateX(-50%);filter:drop-shadow(0 8px 16px rgba(25,55,88,.2))}
.story-progress-labels{display:flex;justify-content:space-between;gap:16px;width:min(760px,calc(100vw - 48px));padding-top:18px;font-size:12px;font-weight:700;letter-spacing:.08em;color:rgba(255,255,255,.94);text-transform:uppercase;text-shadow:0 4px 20px rgba(19,45,78,.24)}

.hero-shell{z-index:18;display:grid;grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);align-items:center;gap:44px;padding:calc(var(--header-offset) + 40px) clamp(18px,4vw,60px) 44px;opacity:var(--hero-o);transform:translateY(calc((1 - var(--hero-o))*38px));pointer-events:none}
.hero-copy,.hero-device{pointer-events:auto}
.hero-copy h1{margin:0 0 16px;font-size:clamp(62px,7vw,118px);line-height:.94;letter-spacing:-.075em}
.hero-copy h1 span{display:block;color:var(--blue)}
.hero-copy p{max-width:560px;margin:0 0 28px;font-size:clamp(18px,1.8vw,28px);color:var(--muted)}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:22px}
.button{min-height:56px;padding:0 22px;border-radius:18px;background:rgba(255,255,255,.82);border:1px solid var(--line);display:inline-flex;align-items:center;justify-content:center;font-weight:760;box-shadow:0 14px 34px rgba(69,95,126,.08)}
.button-primary{background:#0c1523;color:#fff;border-color:#0c1523}
.button-quiet{background:transparent}
.hero-tags{display:flex;flex-wrap:wrap;gap:10px}.hero-tags span{padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.65);border:1px solid var(--line);font-size:14px;color:var(--muted);font-weight:720}
.hero-device{position:relative;min-height:520px}
.device-glow{position:absolute;inset:10% 8% 8%;background:radial-gradient(circle at 50% 50%,rgba(114,180,255,.2),rgba(114,180,255,0) 60%);filter:blur(22px)}
.browser-mock{position:relative;max-width:640px;margin-left:auto;padding:18px;border-radius:34px;background:linear-gradient(180deg,rgba(255,255,255,.76),rgba(255,255,255,.56));border:1px solid rgba(255,255,255,.62);backdrop-filter:blur(16px);box-shadow:var(--shadow);transform:translate3d(calc(var(--mx)*.18),calc(var(--my)*.12),0)}
html[data-theme="dark"] .browser-mock{background:linear-gradient(180deg,rgba(18,31,48,.78),rgba(14,27,42,.66));border-color:rgba(154,184,220,.16)}
.browser-top{height:58px;border-radius:20px;background:rgba(255,255,255,.68);border:1px solid var(--line);display:flex;align-items:center;gap:10px;padding:0 18px;color:#7b8ea6}
html[data-theme="dark"] .browser-top{background:rgba(255,255,255,.04)}
.browser-top i{width:10px;height:10px;border-radius:50%;background:#c0ccdd}
.browser-top span{margin-left:8px}
.browser-body{display:grid;grid-template-columns:74px 1fr;gap:14px;margin-top:14px}
.browser-side{padding:14px 10px;border-radius:22px;background:rgba(255,255,255,.64);border:1px solid var(--line);display:grid;gap:12px;align-content:start}
html[data-theme="dark"] .browser-side{background:rgba(255,255,255,.04)}
.browser-side span{height:48px;border-radius:16px;background:rgba(213,224,240,.92)}
.browser-side span.active{background:linear-gradient(180deg,#dce8ff,#bfd5ff)}
.browser-main{padding:16px;border-radius:26px;background:rgba(255,255,255,.68);border:1px solid var(--line)}
html[data-theme="dark"] .browser-main{background:rgba(255,255,255,.04)}
.browser-title{display:flex;align-items:center;gap:12px}.browser-title img{width:34px;height:34px}.browser-title small{display:block;color:#8294ab}.browser-title em{margin-left:auto;padding:8px 12px;border-radius:999px;background:#dce9bf;color:#5d6e2d;font-style:normal;font-weight:800;font-size:12px;letter-spacing:.08em}
.browser-search{margin:20px 0;padding:18px;border-radius:22px;background:#fff;border:1px solid var(--line);color:#8a99ad;display:flex;justify-content:space-between;align-items:center}.browser-search kbd{padding:8px 12px;border-radius:12px;border:1px solid var(--line);background:#edf4ff;color:#6b7d97}
.browser-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.browser-card{min-height:120px;padding:18px;border-radius:22px;border:1px solid var(--line);background:rgba(255,255,255,.88);display:flex;align-items:flex-end;color:#6a7b92;font-weight:760}
html[data-theme="dark"] .browser-card, html[data-theme="dark"] .browser-search{background:rgba(255,255,255,.05);color:var(--muted)}

.site-main{position:relative;z-index:2}.page{max-width:1360px;margin:0 auto;padding:0 18px}
.section{padding:96px 0;border-top:1px solid rgba(89,120,162,.12)}
.section-grid{display:grid;grid-template-columns:220px minmax(0,1fr);gap:44px;align-items:start}
.section-index{font-size:14px;font-weight:800;letter-spacing:.14em;color:#8c99ac;text-transform:uppercase}
.section-body h2,.section-head h2,.page-heading-main h1{margin:0 0 18px;font-size:clamp(38px,5vw,72px);line-height:1.04;letter-spacing:-.05em}
.lead{font-size:clamp(18px,2.1vw,28px);line-height:1.5;color:var(--text);max-width:980px}.lead strong{color:var(--blue)}
.manifest-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:34px}
.manifest-card,.feature-card,.feature-row,.version-card,.faq-item{padding:24px;border-radius:28px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow)}
.manifest-card span,.card-num,.row-num,.faq-qmark{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;background:rgba(44,105,255,.08);color:var(--blue);font-weight:800;margin-bottom:16px}
.manifest-card h3{margin:0 0 10px;font-size:22px}.manifest-card p{margin:0;color:var(--muted)}
.section-head{display:grid;grid-template-columns:220px 1fr;gap:44px;align-items:end;margin-bottom:30px}.section-head p{margin:8px 0 0;color:var(--muted);max-width:700px}
.bento{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.feature-card{position:relative;min-height:240px;overflow:hidden}.feature-card::after{content:"";position:absolute;right:-40px;top:-40px;width:160px;height:160px;background:radial-gradient(circle at center, rgba(134,198,255,.18), transparent 70%)}
.card-num{margin-bottom:16px}.feature-card h3{margin:0 0 12px;font-size:26px;line-height:1.15}.feature-card p{margin:0;color:var(--muted);max-width:540px}

.subpage-hero{position:relative;padding-top:120px}.horizon{position:absolute;inset:0 0 auto;height:340px;background:linear-gradient(180deg,#eaf4fe 0%,rgba(234,244,254,0) 100%)}html[data-theme="dark"] .horizon{background:linear-gradient(180deg,#112236 0%,rgba(17,34,54,0) 100%)}
.subpage-logo{position:absolute;right:6vw;top:138px;width:min(26vw,280px);opacity:.08}.page-heading{display:grid;grid-template-columns:220px 1fr;gap:44px;padding:44px 0 28px}.page-content{padding-bottom:80px}
.features-list,.version-list,.faq-list{display:grid;gap:18px}
.feature-row{display:grid;grid-template-columns:88px minmax(0,1fr) minmax(260px,.8fr);gap:24px;align-items:start}.row-num{width:54px;height:54px}
.feature-row h2,.version-card h2{margin:0 0 12px;font-size:30px;line-height:1.1}.feature-row p,.version-card li,.faq-answer p{color:var(--muted)}.feature-row p,.faq-answer p{margin:0}.feature-visual{min-height:100%;display:grid;align-items:center}
.demo-search,.demo-tabs,.theme-control,.privacy-map{min-height:140px;border-radius:24px;border:1px solid var(--line);background:rgba(255,255,255,.86);display:grid;place-items:center;color:#7c8ea5;padding:20px}
html[data-theme="dark"] .demo-search,html[data-theme="dark"] .demo-tabs,html[data-theme="dark"] .theme-control,html[data-theme="dark"] .privacy-map{background:rgba(255,255,255,.04);color:var(--muted)}
.demo-tabs{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.demo-tabs div{padding:10px 14px;border-radius:999px;background:#edf4ff}.demo-tabs i{display:inline-block;width:10px;height:10px;border-radius:999px;background:#bfd5ff;margin-right:8px}.theme-control{display:flex;gap:12px}.theme-control span{padding:12px 18px;border-radius:999px;background:#edf4ff}.theme-control .dark-option{background:#101a28;color:#fff}.privacy-map{position:relative;overflow:hidden}.privacy-device{width:110px;height:160px;border-radius:22px;border:1px solid var(--line);background:#fff;display:grid;place-items:center}.privacy-lines{position:absolute;inset:50% auto auto 54%;display:grid;gap:14px;transform:translateY(-50%)}.privacy-lines span{display:block;width:110px;height:10px;border-radius:999px;background:linear-gradient(90deg,#dce9ff,transparent)}
.faq-layout,.changelog-layout{display:grid;grid-template-columns:220px 1fr;gap:44px}.faq-question{width:100%;background:none;border:none;padding:0;display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;text-align:left;color:inherit;cursor:pointer}.faq-answer{padding-top:10px}.faq-item:not(.is-open) .faq-answer{display:none}.faq-plus,.version-build,.latest-badge{display:inline-flex;align-items:center;justify-content:center;border-radius:999px}.faq-plus{width:36px;height:36px;border:1px solid var(--line);position:relative}.faq-plus::before,.faq-plus::after{content:"";position:absolute;width:14px;height:2px;background:currentColor}.faq-plus::after{transform:rotate(90deg)}.faq-item.is-open .faq-plus::after{opacity:0}
.version-build{padding:7px 12px;background:rgba(44,105,255,.08);color:var(--blue);font-size:13px;font-weight:700}.latest-badge{padding:7px 12px;background:#0c1321;color:#fff;font-size:12px;font-weight:800;letter-spacing:.08em}.version-card>div:first-child{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}.version-notes{margin:0;padding-left:18px;display:grid;gap:12px}

.site-footer{padding:34px 0 42px;border-top:1px solid rgba(89,120,162,.12)}.footer-inner{max-width:1360px;margin:0 auto;padding:0 18px;display:flex;justify-content:space-between;gap:22px;flex-wrap:wrap;color:var(--muted)}.footer-brand{display:flex;align-items:center;gap:12px;font-weight:760;color:var(--text);margin-bottom:6px}.footer-brand img{width:28px;height:28px}.footer-meta{display:flex;gap:16px;flex-wrap:wrap}

.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}.reveal.is-visible{opacity:1;transform:none}
body.menu-open .nav-shell{border-bottom-left-radius:26px;border-bottom-right-radius:26px}

@media (max-width: 1100px){
  .hero-shell,.section-grid,.section-head,.page-heading,.faq-layout,.changelog-layout{grid-template-columns:1fr;gap:22px}
  .hero-shell{padding-inline:20px;gap:24px}
  .hero-copy h1{font-size:clamp(48px,11vw,74px)}
  .browser-mock{max-width:none}
  .manifest-points,.bento{grid-template-columns:1fr}
  .feature-row{grid-template-columns:1fr;gap:16px}
}
@media (max-width: 920px){
  .site-header{inset:8px 8px auto}.nav-shell{grid-template-columns:auto auto;justify-content:space-between}.nav-shell nav{grid-column:1 / -1;order:10;width:100%;display:none}.menu-button{display:grid}.nav-links{flex-direction:column;align-items:stretch;padding-top:8px}.nav-links a{justify-content:center;border-radius:18px}.nav-actions{justify-self:end}.menu-open .nav-shell nav{display:block}
  .story-section{height:700svh}
  .story-copy strong{font-size:clamp(34px,10vw,56px)}
  .story-bubble{min-width:auto;max-width:80vw;padding:14px 14px 14px 12px}
  .bubble-search{left:4vw;bottom:28vh}.bubble-local{right:4vw;bottom:34vh}.bubble-download{bottom:16vh}
  .boat-craft svg{width:min(44vw,340px)}
}
@media (max-width: 680px){
  .brand span{font-size:16px}.brand img{width:32px;height:32px}.nav-shell{min-height:64px;padding-inline:14px}
  .story-copy{padding-inline:18px;bottom:28vh}.story-kicker{font-size:13px}.story-copy small{font-size:13px}
  .story-progress-track,.story-progress-fill,.story-progress-labels{width:calc(100vw - 34px)}
  .story-progress-labels{font-size:10px;gap:6px}
  .hero-shell{padding-top:calc(var(--header-offset) + 12px);padding-bottom:26px;align-content:start}.hero-device{min-height:360px}
  .browser-body{grid-template-columns:56px 1fr}.browser-cards{grid-template-columns:1fr 1fr}.browser-card{min-height:92px}
  .hero-actions{flex-direction:column}.button{width:100%}
  .story-bubble strong{font-size:15px}.story-bubble small{font-size:12px}.bubble-icon{width:40px;height:40px;flex-basis:40px}
}
@media (max-width: 540px){
  .section,.site-footer{padding-inline:0}
  .story-section{height:760svh}
  .bubble-search{left:3vw;bottom:30vh}.bubble-local{right:3vw;bottom:37vh}.bubble-download{bottom:19vh}
  .boat-craft{padding-bottom:10vh}.wake-1{width:68vw;height:18vw}.wake-2{width:84vw;height:24vw}
}

/* =========================================================
   Video Journey V1 — scroll-scrub cinematic opening
   Uses the two approved concept videos as the visual source.
   No duplicate HTML feature bubbles, no low-poly island/portal.
   ========================================================= */
.story-video-journey{height:760svh;position:relative;background:#d9ebfb}
.story-video-journey .story-sticky{position:sticky;top:0;height:100svh;overflow:hidden;isolation:isolate;background:#d8eaf9;--journey-p:0;--blue-o:1;--gate-o:0;--fog-o:0;--intro-o:1;--journey-ui-o:1;--hero-o:0;--scene-scale:1.025;--scene-x:0px;--scene-y:0px}
.video-world{position:absolute;inset:0;z-index:1;background:#d8eaf9;overflow:hidden}
.journey-video{position:absolute;inset:-2%;width:104%;height:104%;object-fit:cover;object-position:center center;display:block;pointer-events:none;will-change:opacity,transform,filter;transform:translate3d(var(--scene-x),var(--scene-y),0) scale(var(--scene-scale));backface-visibility:hidden}
.journey-video-blue{z-index:1;opacity:var(--blue-o);filter:saturate(1.03) contrast(1.015) brightness(1.02)}
.journey-video-gate{z-index:2;opacity:var(--gate-o);filter:saturate(.9) contrast(.97) brightness(1.08)}
.video-vignette{position:absolute;inset:0;z-index:5;pointer-events:none;background:linear-gradient(180deg,rgba(9,25,44,.05) 0%,transparent 22%,transparent 66%,rgba(6,18,34,.16) 100%),radial-gradient(circle at 50% 44%,transparent 44%,rgba(5,18,34,.08) 100%)}
.transition-fog{position:absolute;z-index:4;pointer-events:none;opacity:var(--fog-o);filter:blur(32px);border-radius:999px;background:radial-gradient(ellipse at center,rgba(255,255,255,.95) 0%,rgba(246,251,255,.86) 35%,rgba(235,246,255,.46) 62%,rgba(255,255,255,0) 78%);mix-blend-mode:screen;will-change:transform,opacity}
.fog-left{width:66vw;height:24vw;left:-16vw;top:34vh;animation:videoFogLeft 10s ease-in-out infinite alternate}
.fog-right{width:62vw;height:22vw;right:-18vw;top:42vh;animation:videoFogRight 12s ease-in-out infinite alternate}
.fog-center{width:78vw;height:30vw;left:11vw;top:26vh;opacity:calc(var(--fog-o)*.82);animation:videoFogCenter 14s ease-in-out infinite alternate}
@keyframes videoFogLeft{to{transform:translate3d(6vw,-2vh,0) scale(1.06)}}
@keyframes videoFogRight{to{transform:translate3d(-6vw,2vh,0) scale(1.08)}}
@keyframes videoFogCenter{to{transform:translate3d(2vw,-3vh,0) scale(1.05)}}

.journey-intro{position:absolute;z-index:8;left:50%;bottom:14vh;transform:translateX(-50%) translateY(calc((1 - var(--intro-o))*28px));opacity:var(--intro-o);display:grid;place-items:center;text-align:center;color:#fff;pointer-events:none;width:min(800px,calc(100vw - 36px));text-shadow:0 6px 28px rgba(20,56,92,.25)}
.journey-intro .story-kicker{margin:0 0 12px;padding:8px 14px;font-size:13px;background:rgba(22,51,80,.28);border-color:rgba(255,255,255,.34)}
.journey-intro strong{font-size:clamp(42px,6vw,92px);line-height:.96;letter-spacing:-.055em}
.journey-intro small{margin-top:12px;font-size:clamp(12px,1.25vw,16px);font-weight:650;letter-spacing:.04em;color:rgba(255,255,255,.9)}

.journey-progress{position:absolute;z-index:12;left:50%;bottom:18px;transform:translateX(-50%);width:min(1120px,calc(100vw - 40px));height:86px;opacity:var(--journey-ui-o);pointer-events:none}
.journey-track{position:absolute;left:10px;right:10px;bottom:27px;height:4px;border-radius:999px;background:rgba(225,240,255,.42);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 0 18px rgba(117,176,233,.12)}
.journey-fill{display:block;height:100%;width:calc(var(--journey-p)*100%);border-radius:inherit;background:linear-gradient(90deg,rgba(172,214,255,.75),#fff 68%,#d7ebff);box-shadow:0 0 18px rgba(205,232,255,.56)}
.journey-paperboat{position:absolute;left:calc(10px + (100% - 20px)*var(--journey-p));bottom:5px;width:70px;height:52px;transform:translateX(-50%);filter:drop-shadow(0 7px 14px rgba(14,56,96,.28));animation:journeyBoatFloat 2.2s ease-in-out infinite}
.journey-paperboat svg{width:100%;height:100%}
@keyframes journeyBoatFloat{50%{translate:0 -4px;rotate:.3deg}}
.journey-labels{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;gap:12px;color:rgba(255,255,255,.92);font-size:11px;font-weight:700;letter-spacing:.06em;text-shadow:0 3px 10px rgba(7,30,56,.48)}

.story-video-journey .hero-shell{z-index:10;position:absolute;inset:0;opacity:var(--hero-o);transform:translateY(calc((1 - var(--hero-o))*32px));background:radial-gradient(circle at 72% 32%,rgba(142,198,255,.18),transparent 30%),linear-gradient(180deg,#f6faff 0%,#eef5fd 100%);pointer-events:none;will-change:opacity,transform}
.story-video-journey .hero-shell::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 42%,rgba(255,255,255,.42),transparent 38%);pointer-events:none}
.story-video-journey.home-active .hero-shell{pointer-events:auto}
.story-video-journey .hero-shell>*{position:relative;z-index:1}
html[data-theme="dark"] .story-video-journey .hero-shell{background:radial-gradient(circle at 72% 32%,rgba(67,117,170,.17),transparent 30%),linear-gradient(180deg,#0b1725 0%,#0a1420 100%)}

body.journey-cinematic .nav-shell{background:rgba(23,39,57,.32);border-color:rgba(255,255,255,.2);box-shadow:0 12px 38px rgba(3,16,31,.15);backdrop-filter:blur(18px) saturate(125%)}
body.journey-cinematic .brand,body.journey-cinematic .nav-links a,body.journey-cinematic .icon-button{color:#f7fbff}
body.journey-cinematic .nav-links a.active{background:rgba(255,255,255,.92);color:#142031}
body.journey-cinematic .icon-button{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.15)}

@media(max-width:900px){
  .story-video-journey{height:820svh}
  .journey-video{inset:-4%;width:108%;height:108%}
  .journey-progress{width:calc(100vw - 24px);bottom:10px}
  .journey-labels{display:none}
  .journey-intro{bottom:20vh}
}
@media(max-width:600px){
  .story-video-journey{height:880svh}
  .journey-video{object-position:center center}
  .journey-paperboat{width:60px}
  .journey-progress{height:64px}
  .journey-track{bottom:20px}
  .journey-paperboat{bottom:-2px}
}
@media(prefers-reduced-motion:reduce){
  .transition-fog,.journey-paperboat{animation:none}
}
.journey-video-combined{z-index:2;opacity:var(--scene-o,1);filter:saturate(1.01) contrast(1.01) brightness(1.025)}
.story-video-journey:not(.home-active) .hero-shell,.story-video-journey:not(.home-active) .hero-shell *{pointer-events:none!important}
.story-video-journey.home-active .hero-shell,.story-video-journey.home-active .hero-shell *{pointer-events:auto}

/* =========================================================
   Video Journey V2 — sharper cinematic source + first-gate homepage reveal
   - progress UI removed
   - generated bubbles are reinforced with crisp live glass overlays
   - the first stone gate becomes the mask that reveals the actual homepage
   ========================================================= */
.story-video-journey{height:720svh}
.story-video-journey .story-sticky{
  --scene-o:1;
  --scene-scale:1.022;
  --portal-o:0;
  --portal-side:44%;
  --portal-top:29%;
  --portal-bottom:17%;
  --portal-radius:8px;
  --portal-scale:1.055;
  --b1-o:0;--b1-x:25;--b1-y:56;--b1-s:.86;
  --b2-o:0;--b2-x:50;--b2-y:70;--b2-s:.66;
  --b3-o:0;--b3-x:82;--b3-y:54;--b3-s:.72;
}
.journey-video-combined{
  opacity:var(--scene-o,1);
  filter:saturate(1.035) contrast(1.035) brightness(1.018);
  transform:translate3d(var(--scene-x),var(--scene-y),0) scale(var(--scene-scale));
}

/* Crisp live glass bubbles sit exactly over the softer generated bubbles.
   Their translucency keeps the water/reflection from the rendered shot visible. */
.bubble-clarity-layer{position:absolute;inset:0;z-index:7;pointer-events:none;overflow:hidden}
.clarity-bubble{
  position:absolute;
  width:clamp(170px,21.5vw,340px);
  aspect-ratio:1;
  border-radius:50%;
  display:grid;
  place-content:center;
  justify-items:center;
  text-align:center;
  padding:17%;
  color:rgba(255,255,255,.98);
  border:1.5px solid rgba(255,255,255,.72);
  background:
    radial-gradient(circle at 30% 20%,rgba(255,255,255,.72) 0 4%,rgba(255,255,255,.15) 18%,transparent 33%),
    radial-gradient(circle at 62% 70%,rgba(43,111,171,.26),transparent 47%),
    linear-gradient(145deg,rgba(255,255,255,.30),rgba(164,210,248,.12) 44%,rgba(20,70,118,.20));
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.22),
    inset -20px -26px 46px rgba(46,116,176,.15),
    inset 22px 16px 38px rgba(255,255,255,.12),
    0 20px 46px rgba(31,70,110,.14),
    0 0 18px rgba(225,245,255,.20);
  backdrop-filter:blur(7px) saturate(1.28) contrast(1.03);
  -webkit-backdrop-filter:blur(7px) saturate(1.28) contrast(1.03);
  transform-origin:center;
  will-change:transform,opacity,left,top;
  text-shadow:0 2px 12px rgba(30,70,108,.24);
}
.clarity-bubble::before{
  content:"";
  position:absolute;
  inset:7%;
  border-radius:50%;
  border-top:2px solid rgba(255,255,255,.65);
  border-left:1px solid rgba(255,255,255,.24);
  transform:rotate(-18deg);
  filter:blur(.2px);
}
.clarity-bubble::after{
  content:"";
  position:absolute;
  left:20%;right:20%;top:9%;height:16%;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.70),transparent);
  filter:blur(2px);
  opacity:.6;
  animation:clarityBubbleSheen 3.8s ease-in-out infinite;
}
@keyframes clarityBubbleSheen{0%,100%{transform:translateX(-16%) rotate(-8deg);opacity:.34}50%{transform:translateX(18%) rotate(-8deg);opacity:.76}}
.clarity-icon{width:clamp(34px,3.2vw,48px);height:clamp(34px,3.2vw,48px);border-radius:50%;display:grid;place-items:center;margin-bottom:9px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.32);box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
.clarity-icon svg{width:54%;height:54%}
.clarity-bubble strong{font-size:clamp(14px,1.3vw,20px);line-height:1.15;white-space:nowrap;font-weight:770;letter-spacing:-.02em}
.clarity-bubble small{display:block;margin-top:5px;font-size:clamp(9px,.78vw,12px);line-height:1.42;color:rgba(244,250,255,.88);max-width:13em}
.bubble-trail{position:absolute;left:50%;top:91%;width:34%;height:78%;transform:translateX(-50%);background:
  radial-gradient(circle at 48% 8%,rgba(255,255,255,.82) 0 3px,transparent 4px),
  radial-gradient(circle at 64% 24%,rgba(255,255,255,.65) 0 2px,transparent 3px),
  radial-gradient(circle at 38% 39%,rgba(255,255,255,.74) 0 3px,transparent 4px),
  radial-gradient(circle at 58% 60%,rgba(255,255,255,.58) 0 2px,transparent 3px),
  radial-gradient(circle at 44% 80%,rgba(255,255,255,.42) 0 2px,transparent 3px);
  filter:blur(.3px);
  opacity:.74;
}
.clarity-bubble-search{left:calc(var(--b1-x)*1%);top:calc(var(--b1-y)*1%);opacity:var(--b1-o);transform:translate(-50%,-50%) scale(var(--b1-s))}
.clarity-bubble-download{left:calc(var(--b2-x)*1%);top:calc(var(--b2-y)*1%);opacity:var(--b2-o);transform:translate(-50%,-50%) scale(var(--b2-s))}
.clarity-bubble-local{left:calc(var(--b3-x)*1%);top:calc(var(--b3-y)*1%);opacity:var(--b3-o);transform:translate(-50%,-50%) scale(var(--b3-s))}

/* The homepage is already the real DOM. During the first-gate approach it is
   revealed only inside the gate opening, then the mask expands until the page is full-screen. */
.story-video-journey .hero-shell{
  z-index:9;
  opacity:var(--portal-o);
  clip-path:inset(var(--portal-top) var(--portal-side) var(--portal-bottom) var(--portal-side) round var(--portal-radius));
  -webkit-clip-path:inset(var(--portal-top) var(--portal-side) var(--portal-bottom) var(--portal-side) round var(--portal-radius));
  transform:scale(var(--portal-scale));
  transform-origin:center center;
  will-change:clip-path,opacity,transform;
  transition:none;
  box-shadow:none;
}
.story-video-journey .hero-shell::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  box-shadow:inset 0 0 50px rgba(255,255,255,calc((1 - var(--portal-o))*.15));
}
.story-video-journey.home-active .hero-shell{pointer-events:auto}
.story-video-journey:not(.home-active) .hero-shell,.story-video-journey:not(.home-active) .hero-shell *{pointer-events:none!important}
.story-video-journey.home-active .hero-shell,.story-video-journey.home-active .hero-shell *{pointer-events:auto}

/* No progress track, labels, or decorative paper-boat progress UI in V2. */
.journey-progress{display:none!important}

@media(max-width:900px){
  .story-video-journey{height:770svh}
  .clarity-bubble{width:clamp(145px,28vw,230px)}
  .story-video-journey .story-sticky{--portal-side:42%;--portal-top:28%;--portal-bottom:20%}
}
@media(max-width:600px){
  .story-video-journey{height:820svh}
  .clarity-bubble{width:clamp(132px,38vw,190px);padding:15%}
  .clarity-bubble small{display:none}
  .story-video-journey .story-sticky{--portal-side:39%;--portal-top:27%;--portal-bottom:22%}
}

/* =========================================================
   Video Journey V3 — exact fixes requested
   1) no progress UI at all
   2) generated bubble body/text is fully covered by crisp DOM bubbles
   3) video stops at the FIRST gate
   4) the REAL homepage appears inside that first gate and the aperture expands forward
   5) sharper 1440p intra-frame cinematic source
   ========================================================= */
.story-video-journey{height:760svh}
.story-video-journey .story-sticky{
  --portal-o:0;
  --portal-lt:45.4%;--portal-rt:54.7%;
  --portal-lb:45.7%;--portal-rb:54.2%;
  --portal-top:27.2%;--portal-bottom:62%;
  --portal-scale:.62;
}

/* The new source has already been upscaled/sharpened offline. Do not soften it again in CSS. */
.journey-video-combined{
  opacity:var(--scene-o,1)!important;
  filter:saturate(1.012) contrast(1.012) brightness(1.004)!important;
  transform:translate3d(var(--scene-x),var(--scene-y),0) scale(var(--scene-scale))!important;
  transform-origin:49.2% 43.5%!important;
  image-rendering:auto;
}

/* Absolutely no progress line, paper boat, labels or old story progress. */
.journey-progress,.story-progress,.journey-track,.journey-fill,.journey-paperboat,.journey-labels,
.story-progress-track,.story-progress-fill,.story-progress-boat,.story-progress-labels{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}

/* Crisp replacement bubbles. The sphere is intentionally much more opaque than V2:
   it covers the blurry AI-generated sphere underneath instead of merely reinforcing it. */
.bubble-clarity-layer{z-index:8!important;overflow:visible!important}
.clarity-bubble{
  width:clamp(250px,30vw,480px)!important;
  aspect-ratio:1!important;
  padding:17%!important;
  border-radius:50%!important;
  color:#fff!important;
  border:2px solid rgba(255,255,255,.92)!important;
  background:
    radial-gradient(circle at 27% 19%,rgba(255,255,255,.98) 0 3.6%,rgba(255,255,255,.58) 7%,rgba(255,255,255,.08) 20%,transparent 31%),
    radial-gradient(circle at 72% 78%,rgba(18,76,132,.42) 0%,rgba(76,146,201,.30) 30%,transparent 58%),
    radial-gradient(circle at 50% 46%,rgba(170,211,241,.96) 0%,rgba(140,190,228,.95) 46%,rgba(91,151,201,.92) 68%,rgba(215,238,255,.94) 84%,rgba(255,255,255,.98) 99%)!important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.42),
    inset -34px -42px 70px rgba(25,88,145,.28),
    inset 28px 22px 54px rgba(255,255,255,.28),
    0 18px 44px rgba(29,73,116,.20),
    0 0 24px rgba(232,248,255,.48)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  text-shadow:0 2px 8px rgba(23,62,102,.34)!important;
  isolation:isolate;
}
.clarity-bubble::before{
  inset:5.8%!important;
  border-top:3px solid rgba(255,255,255,.9)!important;
  border-left:1.5px solid rgba(255,255,255,.38)!important;
  filter:none!important;
}
.clarity-bubble::after{
  left:18%!important;right:18%!important;top:8%!important;height:14%!important;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.92),transparent)!important;
  filter:blur(1px)!important;
  opacity:.68!important;
}
.clarity-icon{
  width:clamp(52px,4.3vw,68px)!important;
  height:clamp(52px,4.3vw,68px)!important;
  margin-bottom:14px!important;
  background:rgba(255,255,255,.13)!important;
  border:1.5px solid rgba(255,255,255,.72)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.52),0 4px 16px rgba(19,66,105,.11)!important;
}
.clarity-icon svg{width:55%!important;height:55%!important;stroke-width:1.8}
.clarity-bubble strong{
  font-size:clamp(20px,1.7vw,28px)!important;
  line-height:1.08!important;
  font-weight:820!important;
  letter-spacing:-.035em!important;
  white-space:nowrap!important;
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
}
/* Keep the generated-bubble idea visually clean; the key label is now actually readable. */
.clarity-bubble small{display:none!important}
.bubble-trail{
  top:92%!important;width:30%!important;height:66%!important;opacity:.82!important;
  filter:none!important;
}
/* A crisp flattened reflection under each sphere. */
.clarity-bubble .bubble-trail::after{
  content:"";
  position:absolute;
  left:50%;top:-10%;
  width:190%;height:32%;
  transform:translateX(-50%);
  border-radius:50%;
  background:radial-gradient(ellipse,rgba(222,242,255,.34),rgba(97,158,209,.16) 42%,transparent 72%);
  filter:blur(2px);
}

/* First-gate homepage mask. No floating rectangle, no border, no second gate.
   The polygon is updated every frame to follow the actual gate opening. */
.story-video-journey .hero-shell{
  z-index:10!important;
  opacity:var(--portal-o)!important;
  clip-path:polygon(
    var(--portal-lt) var(--portal-top),
    var(--portal-rt) var(--portal-top),
    var(--portal-rb) var(--portal-bottom),
    var(--portal-lb) var(--portal-bottom)
  )!important;
  -webkit-clip-path:polygon(
    var(--portal-lt) var(--portal-top),
    var(--portal-rt) var(--portal-top),
    var(--portal-rb) var(--portal-bottom),
    var(--portal-lb) var(--portal-bottom)
  )!important;
  transform:none!important;
  transform-origin:center center!important;
  border-radius:0!important;
  box-shadow:none!important;
  will-change:clip-path,opacity!important;
}
/* Make the homepage read as a complete world behind the doorway instead of a random crop. */
.story-video-journey .hero-shell>.hero-copy,
.story-video-journey .hero-shell>.hero-device{
  transform:scale(var(--portal-scale));
  transform-origin:center center;
  transition:none!important;
  will-change:transform;
}
.story-video-journey .hero-shell::after{display:none!important}

/* Hide live bubbles as soon as the river/gate sequence takes over. */
.story-video-journey .bubble-clarity-layer{transition:none!important}

@media(max-width:900px){
  .story-video-journey{height:820svh}
  .clarity-bubble{width:clamp(210px,39vw,350px)!important}
  .clarity-bubble strong{font-size:clamp(17px,3vw,24px)!important}
}
@media(max-width:600px){
  .story-video-journey{height:860svh}
  .clarity-bubble{width:clamp(190px,54vw,280px)!important}
  .clarity-icon{width:46px!important;height:46px!important}
  .clarity-bubble strong{font-size:17px!important}
}

/* V3 portal content wrapper: keep the clipping aperture aligned to the stone gate,
   while the whole real homepage can scale behind it as one coherent page. */
.story-video-journey .hero-shell{display:block!important;padding:0!important}
.story-video-journey .hero-content-stage{
  position:absolute;
  inset:0;
  display:grid;
  grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);
  align-items:center;
  gap:44px;
  padding:calc(var(--header-offset) + 40px) clamp(18px,4vw,60px) 44px;
  transform:scale(var(--portal-scale));
  transform-origin:center center;
  will-change:transform;
}
.story-video-journey .hero-shell>.hero-copy,
.story-video-journey .hero-shell>.hero-device{transform:none!important}
@media(max-width:1100px){
  .story-video-journey .hero-content-stage{grid-template-columns:1fr;gap:24px;padding-inline:20px}
}
@media(max-width:680px){
  .story-video-journey .hero-content-stage{padding-top:calc(var(--header-offset) + 12px);padding-bottom:26px;align-content:start}
}


/* 2026-08-09: user-requested hard removal of the three live replacement bubbles.
   The cinematic video's own native bubbles remain untouched. */
.story-video-journey .bubble-clarity-layer,
.story-video-journey .clarity-bubble,
.story-video-journey [data-clarity-bubble]{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}

/* =========================================================
   Home content expansion v3.1
   The cinematic opening above is intentionally untouched.
   ========================================================= */
.home-rich{background:linear-gradient(180deg,rgba(255,255,255,.22),transparent 22%)}
.home-rich .section{position:relative}
.home-rich .section-kicker{margin:0 0 14px;color:var(--blue);font-size:12px;font-weight:850;letter-spacing:.18em;text-transform:uppercase}
.home-feature-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:18px}
.home-feature-grid .feature-card{grid-column:span 6;min-height:280px;display:flex;flex-direction:column}
.home-feature-grid .feature-card-wide{grid-column:span 12;min-height:260px}
.home-feature-grid .feature-card p{max-width:700px}
.feature-demo,.mini-tabs,.download-mini,.theme-pills,.account-free,.clean-lines,.platform-strip{position:relative;z-index:1;margin-top:auto;padding-top:24px}
.search-demo{display:flex;align-items:center;gap:12px;padding:16px 18px;margin-top:auto;border-radius:18px;background:rgba(255,255,255,.82);border:1px solid var(--line);color:var(--muted)}
.search-demo .search-glass{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(45,126,245,.09);color:var(--blue);font-size:23px}.search-demo b{font-weight:700}.search-demo kbd{margin-left:auto;padding:6px 9px;border-radius:9px;border:1px solid var(--line);background:var(--bg);color:var(--muted)}
html[data-theme="dark"] .search-demo{background:rgba(255,255,255,.05)}
.mini-tabs{display:flex;gap:8px;align-items:flex-end}.mini-tabs i{font-style:normal;padding:10px 13px;border:1px solid var(--line);border-radius:14px 14px 8px 8px;background:rgba(255,255,255,.75);color:var(--muted);font-size:12px}.mini-tabs i:nth-child(2){transform:translateY(-7px);background:rgba(45,126,245,.1);color:var(--blue)}
html[data-theme="dark"] .mini-tabs i{background:rgba(255,255,255,.05)}
.download-mini{display:grid;gap:8px}.download-mini>div{display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.62);border:1px solid var(--line)}.download-mini span{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:rgba(45,126,245,.08);color:var(--blue)}.download-mini b{font-size:13px}.download-mini em{font-style:normal;font-size:12px;color:var(--muted)}
html[data-theme="dark"] .download-mini>div{background:rgba(255,255,255,.04)}
.privacy-orbit{position:absolute;right:22px;bottom:20px;width:126px;height:126px;border-radius:50%;border:1px solid rgba(45,126,245,.22);display:grid;place-items:center;color:var(--blue)}.privacy-orbit::before,.privacy-orbit::after{content:"";position:absolute;border-radius:50%;border:1px solid rgba(45,126,245,.13)}.privacy-orbit::before{inset:15px}.privacy-orbit::after{inset:30px}.privacy-orbit i{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--blue)}.privacy-orbit i:first-child{top:14px;left:32px}.privacy-orbit i:nth-child(2){right:12px;bottom:34px}.privacy-orbit strong{font-size:12px;letter-spacing:.12em}
.theme-pills{display:flex;gap:10px}.theme-pills span{padding:10px 16px;border-radius:999px;background:rgba(255,255,255,.76);border:1px solid var(--line);font-size:13px}.theme-pills span:last-child{background:#101927;color:#fff;border-color:#101927}
.account-free{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.account-free span{padding:8px 12px;border-radius:999px;background:rgba(45,126,245,.1);color:var(--blue);font-size:12px;font-weight:800}.account-free b{font-size:13px;color:var(--muted)}
.clean-lines{display:grid;grid-template-columns:1.5fr 1fr;gap:8px;max-width:280px}.clean-lines i{height:10px;border-radius:999px;background:linear-gradient(90deg,rgba(45,126,245,.22),rgba(45,126,245,.04))}.clean-lines i:nth-child(3){grid-column:1/-1;width:74%}.clean-lines i:nth-child(4){width:44%}
.platform-strip{display:flex;gap:9px;flex-wrap:wrap}.platform-strip span{padding:9px 13px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.58);font-size:12px;font-weight:760;color:var(--muted)}
html[data-theme="dark"] .platform-strip span{background:rgba(255,255,255,.04)}

.privacy-board{padding:18px;border-radius:36px;background:linear-gradient(135deg,rgba(45,126,245,.08),rgba(255,255,255,.34));border:1px solid var(--line);box-shadow:var(--shadow)}
.privacy-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.privacy-item{min-height:230px;padding:26px;border-radius:26px;background:var(--surface-strong);border:1px solid rgba(255,255,255,.55)}.privacy-item>span{display:inline-flex;margin-bottom:28px;color:var(--blue);font-weight:850;font-size:13px;letter-spacing:.1em}.privacy-item h3{margin:0 0 10px;font-size:24px;letter-spacing:-.03em}.privacy-item p{margin:0;color:var(--muted)}
html[data-theme="dark"] .privacy-board{background:linear-gradient(135deg,rgba(75,137,211,.08),rgba(255,255,255,.02))}.privacy-item{border-color:var(--line)}
.principle-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.principle-card{min-height:310px;padding:28px;border-radius:30px;border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow);display:flex;flex-direction:column;justify-content:flex-end;position:relative;overflow:hidden}.principle-card::before{content:"";position:absolute;left:-8%;top:-16%;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(83,153,249,.17),transparent 68%)}.principle-card small{position:relative;margin-bottom:auto;color:var(--blue);font-weight:850;letter-spacing:.14em}.principle-card h3{position:relative;margin:48px 0 10px;font-size:30px;letter-spacing:-.04em}.principle-card p{position:relative;margin:0;color:var(--muted)}
.roadmap-list{display:grid;gap:12px}.roadmap-item{display:grid;grid-template-columns:70px minmax(0,1fr) auto;gap:22px;align-items:center;padding:24px 26px;border-radius:26px;background:var(--surface);border:1px solid var(--line);box-shadow:0 12px 34px rgba(66,106,156,.08)}.roadmap-num{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:rgba(45,126,245,.09);color:var(--blue);font-weight:850}.roadmap-item h3{margin:0 0 6px;font-size:23px}.roadmap-item p{margin:0;color:var(--muted)}.roadmap-state{white-space:nowrap;padding:8px 12px;border-radius:999px;background:rgba(45,126,245,.08);color:var(--blue);font-size:12px;font-weight:820}
.contact-panel{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);gap:40px;align-items:center;padding:46px;border-radius:38px;background:linear-gradient(125deg,#0e1a2b 0%,#173a63 62%,#2d7ef5 140%);color:#fff;box-shadow:0 30px 90px rgba(39,88,149,.24);overflow:hidden;position:relative}.contact-panel::after{content:"";position:absolute;right:-100px;top:-120px;width:360px;height:360px;border-radius:50%;border:1px solid rgba(255,255,255,.14);box-shadow:0 0 0 50px rgba(255,255,255,.025),0 0 0 100px rgba(255,255,255,.018)}.contact-panel .section-index{color:rgba(255,255,255,.56);margin-bottom:18px}.contact-panel h2{margin:0 0 12px;font-size:clamp(40px,5vw,72px);line-height:1;letter-spacing:-.055em}.contact-panel p{margin:0;max-width:720px;color:rgba(255,255,255,.73)}.contact-meta{display:flex;gap:9px;flex-wrap:wrap;margin-top:22px}.contact-meta span{padding:8px 11px;border-radius:999px;border:1px solid rgba(255,255,255,.18);font-size:12px;color:rgba(255,255,255,.76)}.contact-actions{position:relative;z-index:1;display:grid;gap:10px}.contact-actions .button{width:100%;justify-content:center}.contact-actions .button-primary{background:#fff;color:#0f1c2e;border-color:#fff}.contact-actions .button:not(.button-primary){border-color:rgba(255,255,255,.24);color:#fff;background:rgba(255,255,255,.08)}.contact-actions .button-quiet{background:transparent!important;color:rgba(255,255,255,.72)!important}

@media (max-width:1100px){
  .home-feature-grid{grid-template-columns:1fr 1fr}.home-feature-grid .feature-card,.home-feature-grid .feature-card-wide{grid-column:auto}.privacy-grid{grid-template-columns:1fr 1fr}.principle-grid{grid-template-columns:1fr}.principle-card{min-height:240px}.contact-panel{grid-template-columns:1fr}.roadmap-item{grid-template-columns:58px 1fr}.roadmap-state{grid-column:2}
}
@media (max-width:680px){
  .home-feature-grid,.privacy-grid{grid-template-columns:1fr}.home-feature-grid .feature-card{min-height:240px}.privacy-orbit{opacity:.48;transform:scale(.82);transform-origin:right bottom}.roadmap-item{grid-template-columns:48px 1fr;padding:20px 18px;gap:14px}.roadmap-num{width:42px;height:42px}.contact-panel{padding:28px 22px;border-radius:30px}.contact-panel h2{font-size:clamp(38px,12vw,56px)}
}

/* =========================================================
   Home editorial expansion v4.0
   2026-08-09 — content below the locked cinematic only.
   Avoids repetitive bento/card-list composition in favor of
   editorial scenes, interface objects, rails, orbits and type.
   ========================================================= */
.home-editorial{position:relative;overflow:hidden;background:
  radial-gradient(circle at 12% 8%,rgba(85,153,247,.12),transparent 24%),
  radial-gradient(circle at 86% 27%,rgba(86,181,189,.09),transparent 20%),
  linear-gradient(180deg,var(--bg-elev),var(--bg) 42%,var(--bg-elev) 100%)}
.home-canvas{position:relative}
.home-canvas::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.24;background-image:linear-gradient(rgba(74,111,158,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(74,111,158,.045) 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(180deg,transparent 0,black 12%,black 84%,transparent 100%)}
.home-opening,.scene,.control-section,.download-section,.local-section,.harmony-section,.capability-index,.timeline-section,.future-section,.final-cta{position:relative;max-width:1480px;margin:0 auto;padding:clamp(96px,10vw,160px) clamp(22px,4.8vw,72px)}
.scene-no{display:block;margin-bottom:24px;color:var(--blue);font-size:11px;font-weight:900;letter-spacing:.18em;text-transform:uppercase}
.scene-kicker{margin:0 0 14px;color:var(--muted);font-size:14px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}

/* Opening manifesto */
.home-opening{padding-top:clamp(120px,14vw,210px);padding-bottom:clamp(110px,12vw,180px)}
.opening-index{position:absolute;left:clamp(22px,4.8vw,72px);top:72px;color:var(--muted);font-size:11px;font-weight:850;letter-spacing:.18em}
.opening-statement{max-width:1180px}
.opening-overline{display:inline-flex;margin:0 0 22px;padding:8px 0;border-bottom:1px solid var(--line-strong);font-size:13px;font-weight:820;letter-spacing:.08em;color:var(--muted)}
.opening-statement h2{margin:0;font-size:clamp(54px,8.8vw,138px);line-height:.9;letter-spacing:-.072em;font-weight:860;max-width:10.8ch}
.opening-statement h2 span{color:transparent;-webkit-text-stroke:1.3px color-mix(in srgb,var(--text) 34%,transparent);text-stroke:1.3px color-mix(in srgb,var(--text) 34%,transparent)}
.opening-lead{max-width:850px;margin:42px 0 0 22%;font-size:clamp(18px,2vw,27px);line-height:1.55;color:var(--muted);letter-spacing:-.02em}
.opening-metrics{margin-top:90px;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-strong);border-bottom:1px solid var(--line-strong)}
.opening-metrics>div{min-height:150px;padding:30px 26px;border-right:1px solid var(--line-strong);display:flex;flex-direction:column;justify-content:space-between}.opening-metrics>div:last-child{border-right:0}
.opening-metrics strong{font-size:clamp(36px,4.6vw,72px);line-height:1;letter-spacing:-.055em}.opening-metrics span{font-size:13px;color:var(--muted)}
.opening-river{margin-top:26px;display:flex;gap:34px;overflow:hidden;white-space:nowrap;color:color-mix(in srgb,var(--muted) 54%,transparent);font-size:11px;font-weight:850;letter-spacing:.18em}.opening-river span{position:relative;padding-right:34px}.opening-river span::after{content:"•";position:absolute;right:0;color:var(--blue)}

/* Shared scene layout */
.scene{display:grid;grid-template-columns:minmax(320px,.78fr) minmax(0,1.22fr);gap:clamp(50px,7vw,110px);align-items:center;min-height:900px}
.scene-copy{position:relative;z-index:2;max-width:620px}.scene-copy-right{justify-self:end;max-width:580px}
.scene-copy h2,.control-head h2,.harmony-copy h2,.index-title h2,.timeline-head h2,.future-copy h2{margin:0 0 28px;font-size:clamp(48px,5.4vw,86px);line-height:.96;letter-spacing:-.06em;font-weight:850}
.scene-copy p:not(.scene-kicker),.control-copy-left p,.control-copy-right p,.harmony-copy>p,.index-title>p,.future-copy>p{margin:0;color:var(--muted);font-size:clamp(17px,1.45vw,21px);line-height:1.72}
.inline-feature-list{margin-top:34px;display:flex;gap:8px 16px;flex-wrap:wrap}.inline-feature-list span{position:relative;padding-left:14px;color:var(--text);font-size:13px;font-weight:720}.inline-feature-list span::before{content:"";position:absolute;left:0;top:.72em;width:5px;height:5px;border-radius:50%;background:var(--blue)}

/* Browser object */
.browser-stage{position:relative;min-height:620px;display:grid;place-items:center;perspective:1400px}
.stage-shadow{position:absolute;left:10%;right:5%;bottom:4%;height:100px;border-radius:50%;background:rgba(27,71,118,.18);filter:blur(34px);transform:rotate(-4deg)}
.stage-window{position:relative;width:min(920px,100%);aspect-ratio:1.48;border-radius:30px;overflow:hidden;background:color-mix(in srgb,var(--surface-strong) 95%,#fff);border:1px solid rgba(255,255,255,.7);box-shadow:0 50px 120px rgba(40,79,126,.2),0 8px 28px rgba(43,75,114,.1),inset 0 1px 0 rgba(255,255,255,.8);transform:rotateY(-5deg) rotateX(2deg) rotateZ(-1deg);transform-origin:center}
html[data-theme="dark"] .stage-window{background:#0d1a29;border-color:rgba(170,201,234,.15)}
.stage-tabbar{height:58px;display:flex;align-items:end;gap:7px;padding:12px 15px 0;background:color-mix(in srgb,var(--bg) 72%,#fff);border-bottom:1px solid var(--line)}
.stage-dot{width:12px;height:12px;border-radius:50%;background:var(--blue);margin:0 8px 17px 3px;box-shadow:20px 0 0 rgba(109,159,218,.42),40px 0 0 rgba(109,159,218,.24)}
.stage-tab{min-width:150px;height:40px;padding:0 14px;border-radius:13px 13px 0 0;display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--muted);font-size:12px}.stage-tab.is-active{background:var(--surface-strong);color:var(--text);border:1px solid var(--line);border-bottom:0}.stage-tab i{font-style:normal;color:var(--muted)}.stage-tabbar>b{margin:0 0 10px 4px;color:var(--muted);font-size:18px}
.stage-address{height:64px;padding:10px 16px;display:flex;gap:8px;align-items:center;border-bottom:1px solid var(--line);background:var(--surface-strong)}.stage-address button,.stage-address em{border:0;background:transparent;color:var(--muted);font-style:normal;font-size:20px}.stage-address>div{flex:1;height:42px;display:flex;align-items:center;gap:10px;padding:0 16px;border-radius:14px;background:var(--bg);border:1px solid var(--line);color:var(--muted);font-size:12px}.stage-address>div span{color:var(--blue);font-size:19px}
.stage-page{position:relative;min-height:440px;padding:62px 9% 46px;background:radial-gradient(circle at 78% 18%,rgba(45,126,245,.12),transparent 26%),linear-gradient(160deg,var(--bg-elev),var(--bg))}.stage-brand{display:grid;grid-template-columns:52px 1fr;column-gap:14px;align-items:center}.stage-brand img{width:52px;height:52px;grid-row:1/3}.stage-brand small{color:var(--muted);letter-spacing:.14em;font-weight:850}.stage-brand strong{font-size:clamp(28px,3.2vw,44px);letter-spacing:-.05em}.stage-search{height:64px;margin-top:36px;padding:0 20px;display:flex;align-items:center;border-radius:22px;background:var(--surface-strong);border:1px solid var(--line);box-shadow:0 14px 38px rgba(54,91,135,.09);color:var(--muted)}.stage-search kbd{margin-left:auto;padding:5px 8px;border-radius:8px;background:var(--bg);border:1px solid var(--line);font-size:11px}.stage-shortcuts{margin-top:24px;display:flex;gap:16px;flex-wrap:wrap}.stage-shortcuts span{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line);background:rgba(255,255,255,.34);font-size:11px;color:var(--muted)}
.stage-status{position:absolute;left:20px;right:20px;bottom:15px;display:flex;justify-content:space-between;color:var(--muted);font-size:10px;letter-spacing:.12em}
.stage-floating{position:absolute;padding:12px 16px;border-radius:999px;background:rgba(255,255,255,.78);border:1px solid rgba(255,255,255,.72);box-shadow:0 18px 40px rgba(50,82,122,.14);backdrop-filter:blur(14px);font-size:12px;font-weight:760;color:#28476b}.stage-floating-a{left:-2%;top:15%}.stage-floating-b{right:-3%;bottom:16%}
html[data-theme="dark"] .stage-floating{background:rgba(17,33,51,.83);border-color:rgba(165,194,228,.14);color:#c7d8ec}

/* Content tools editorial spread */
.scene-content{grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);background:linear-gradient(110deg,transparent 0 6%,rgba(45,126,245,.055) 6% 50%,transparent 50%)}
.content-canvas{position:relative;min-height:720px;display:grid;place-items:center}
.content-paper{position:relative;width:min(640px,82%);min-height:650px;padding:clamp(42px,5vw,72px);background:#f6f0df;color:#24231e;box-shadow:0 48px 100px rgba(39,52,65,.16);transform:rotate(-2.2deg);overflow:hidden}.content-paper::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(97,73,31,.04) 1px,transparent 1px);background-size:11px 100%;opacity:.3;pointer-events:none}.paper-meta{font-size:10px;font-weight:900;letter-spacing:.19em;color:#77705e}.content-paper h3{margin:70px 0 28px;font-family:Georgia,"Times New Roman",serif;font-size:clamp(44px,5vw,72px);line-height:.98;letter-spacing:-.05em}.content-paper p{font-family:Georgia,"Times New Roman",serif;font-size:18px;line-height:1.78;color:#48453b}.paper-ghost{opacity:.3;font-style:italic}.paper-lines{display:grid;gap:10px;margin-top:38px}.paper-lines i{height:2px;background:#7d7562;opacity:.18}.paper-lines i:nth-child(2){width:86%}.paper-lines i:nth-child(4){width:76%}.paper-lines i:nth-child(6){width:58%}
.content-tools{position:absolute;left:2%;top:22%;display:grid;gap:8px}.content-tools button{width:80px;height:44px;border-radius:999px;border:1px solid var(--line);background:color-mix(in srgb,var(--surface-strong) 78%,transparent);color:var(--muted);backdrop-filter:blur(14px);cursor:pointer;transition:.22s ease}.content-tools button.is-active{background:var(--text);color:var(--bg-elev);border-color:var(--text);transform:translateX(10px)}
.content-mode-panel{position:absolute;right:0;bottom:17%;width:min(330px,42%);padding:20px 22px;border-radius:24px;background:rgba(12,28,47,.92);color:#fff;box-shadow:0 28px 70px rgba(24,61,101,.24);backdrop-filter:blur(16px)}.content-mode-panel strong{display:block;margin-bottom:6px;font-size:20px}.content-mode-panel span{font-size:12px;color:rgba(255,255,255,.68)}
.content-orbit-word{position:absolute;color:color-mix(in srgb,var(--muted) 55%,transparent);font-size:11px;font-weight:860;letter-spacing:.14em;text-transform:uppercase}.word-a{right:9%;top:13%;transform:rotate(8deg)}.word-b{left:15%;bottom:7%;transform:rotate(-8deg)}.word-c{right:3%;top:42%;transform:rotate(90deg)}
.scene-note{margin-top:32px;padding:18px 0;border-top:1px solid var(--line-strong);border-bottom:1px solid var(--line-strong);color:var(--muted);font-size:13px;line-height:1.7}

/* Site control orbit */
.control-section{max-width:none;padding-left:0;padding-right:0;overflow:hidden}
.control-head{max-width:1336px;margin:0 auto;padding:0 clamp(22px,4.8vw,72px)}.control-head h2{max-width:1200px}.control-head h2 span{color:var(--muted);font-weight:600}
.control-world{position:relative;max-width:1480px;min-height:820px;margin:20px auto 0;display:grid;grid-template-columns:1fr minmax(520px,1.35fr) 1fr;align-items:center;gap:40px;padding:0 clamp(22px,4.8vw,72px)}
.control-copy-left,.control-copy-right{max-width:300px}.control-copy-right{justify-self:end}.control-copy-left strong,.control-copy-right strong{display:block;margin-bottom:12px;font-size:22px}.control-copy-left p,.control-copy-right p{font-size:15px}
.site-orbit{position:relative;aspect-ratio:1;display:grid;place-items:center;min-width:560px}.orbit-ring{position:absolute;border:1px solid var(--line-strong);border-radius:50%}.ring-1{inset:10%}.ring-2{inset:22%;border-style:dashed}.ring-3{inset:35%}.orbit-core{position:relative;width:220px;height:220px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle at 35% 28%,rgba(255,255,255,.95),rgba(229,241,255,.86));border:1px solid rgba(255,255,255,.86);box-shadow:0 35px 80px rgba(41,91,147,.2),inset 0 0 0 12px rgba(45,126,245,.045);text-align:center}.orbit-core small{font-size:9px;letter-spacing:.15em;color:var(--muted)}.orbit-core strong{margin:6px 0;font-size:23px;letter-spacing:-.03em}.orbit-core span{font-size:12px;color:var(--blue);font-weight:820}.orbit-item{position:absolute;display:grid;place-items:center;min-width:64px;height:34px;padding:0 12px;border-radius:999px;background:var(--surface-strong);border:1px solid var(--line);box-shadow:0 10px 24px rgba(52,89,133,.09);font-size:11px;font-weight:760;color:var(--muted)}.oi-1{left:4%;top:32%}.oi-2{left:15%;bottom:18%}.oi-3{right:7%;top:28%}.oi-4{right:16%;bottom:16%}.oi-5{left:35%;top:4%}.oi-6{right:20%;top:58%}.oi-7{left:29%;bottom:4%}.oi-8{left:7%;top:61%}
html[data-theme="dark"] .orbit-core{background:radial-gradient(circle at 35% 28%,rgba(28,50,76,.98),rgba(10,25,41,.95));border-color:rgba(161,193,229,.16)}
.rule-stream{max-width:1480px;margin:0 auto;padding:20px clamp(22px,4.8vw,72px);display:flex;gap:11px;overflow:hidden;border-top:1px solid var(--line-strong);border-bottom:1px solid var(--line-strong);white-space:nowrap}.rule-stream span{font:700 11px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;color:var(--muted)}.rule-stream span:nth-child(odd){color:var(--blue)}

/* Downloads / offline dark scene */
.download-section{max-width:none;background:#0b1727;color:#f4f8ff;overflow:hidden;padding-left:max(clamp(22px,4.8vw,72px),calc((100vw - 1480px)/2 + 72px));padding-right:max(clamp(22px,4.8vw,72px),calc((100vw - 1480px)/2 + 72px));display:grid;grid-template-columns:minmax(320px,.82fr) minmax(0,1.18fr);gap:clamp(50px,7vw,120px);align-items:center;min-height:940px}
.download-backdrop{position:absolute;left:-2vw;right:0;top:50%;transform:translateY(-52%);font-size:clamp(110px,18vw,320px);font-weight:950;letter-spacing:-.085em;line-height:.8;color:transparent;-webkit-text-stroke:1px rgba(160,199,247,.08);white-space:nowrap;pointer-events:none}
.download-copy{position:relative;z-index:2}.download-copy .scene-no{color:#79b5ff}.download-copy .scene-kicker{color:#849cb8}.download-copy h2{margin:0 0 28px;font-size:clamp(52px,5.6vw,92px);line-height:.94;letter-spacing:-.06em}.download-copy p{margin:0;max-width:620px;color:#95a9c0;font-size:18px;line-height:1.75}
.download-rail{position:relative;z-index:2;border-top:1px solid rgba(154,190,231,.18);border-bottom:1px solid rgba(154,190,231,.18)}.download-row{display:grid;grid-template-columns:54px 1fr auto;gap:18px;align-items:center;min-height:118px;padding:18px 0;border-bottom:1px solid rgba(154,190,231,.13)}.download-row:last-child{border-bottom:0}.download-row .d-icon{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(146,187,231,.24);color:#8abfff;font:800 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace}.download-row>div{position:relative;padding-bottom:15px}.download-row strong{display:block;margin-bottom:2px;font-size:16px}.download-row small{display:block;color:#738aa4}.download-row i{position:absolute;left:0;right:0;bottom:0;height:2px;background:rgba(125,162,205,.16);overflow:hidden}.download-row i::after{content:"";display:block;width:var(--value);height:100%;background:linear-gradient(90deg,#5aa3ff,#90d1ff)}.download-row em{font-style:normal;color:#87a2bf;font-size:12px}.download-row.is-live em{color:#83bfff}
.download-tags{position:absolute;left:max(clamp(22px,4.8vw,72px),calc((100vw - 1480px)/2 + 72px));right:max(clamp(22px,4.8vw,72px),calc((100vw - 1480px)/2 + 72px));bottom:52px;display:flex;gap:18px;white-space:nowrap;overflow:hidden;color:#5f7691;font-size:11px;font-weight:790;letter-spacing:.08em}.download-tags span{padding-right:18px;border-right:1px solid rgba(145,182,224,.14)}

/* Local-first orbit */
.local-section{display:grid;grid-template-columns:minmax(0,1.06fr) minmax(360px,.94fr);gap:clamp(60px,8vw,120px);align-items:center;min-height:940px}
.local-visual{position:relative;aspect-ratio:1;display:grid;place-items:center}.local-ring{position:absolute;border-radius:50%;border:1px solid var(--line-strong)}.lr-1{inset:6%}.lr-2{inset:19%;border-style:dashed}.lr-3{inset:32%}.local-core{position:relative;width:230px;height:230px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--surface-strong);border:1px solid rgba(255,255,255,.72);box-shadow:0 35px 90px rgba(42,89,143,.16);text-align:center}.local-core img{width:54px;height:54px;margin-bottom:12px}.local-core strong{font-size:27px;letter-spacing:.12em}.local-core small{max-width:160px;margin-top:5px;color:var(--muted);font-size:9px;line-height:1.5}.local-node{position:absolute;color:var(--muted);font-size:12px;font-weight:780}.ln-1{top:10%;left:45%}.ln-2{top:28%;right:7%}.ln-3{bottom:18%;right:12%}.ln-4{bottom:7%;left:43%}.ln-5{bottom:22%;left:10%}.ln-6{top:33%;left:2%}.ln-7{top:12%;right:20%}
.privacy-lines{margin-top:38px;border-top:1px solid var(--line-strong)}.privacy-lines span{display:flex;align-items:center;gap:16px;padding:14px 0;border-bottom:1px solid var(--line);font-size:14px;color:var(--muted)}.privacy-lines b{color:var(--blue);font:800 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace}

/* HarmonyOS / API */
.harmony-section{max-width:none;min-height:900px;display:grid;grid-template-columns:minmax(360px,.8fr) minmax(0,1.2fr);gap:80px;align-items:center;padding-left:max(clamp(22px,4.8vw,72px),calc((100vw - 1480px)/2 + 72px));padding-right:max(clamp(22px,4.8vw,72px),calc((100vw - 1480px)/2 + 72px));background:linear-gradient(150deg,rgba(45,126,245,.07),transparent 55%)}
.api-ghost{position:absolute;right:-2vw;top:50%;transform:translateY(-51%);font-size:clamp(300px,47vw,760px);line-height:.72;font-weight:950;letter-spacing:-.12em;color:color-mix(in srgb,var(--blue) 6%,transparent);pointer-events:none}
.harmony-copy{position:relative;z-index:2}.harmony-copy>p{max-width:720px}.harmony-tech{display:flex;flex-wrap:wrap;gap:9px;margin-top:34px}.harmony-tech span{padding:8px 12px;border-radius:999px;border:1px solid var(--line-strong);font-size:11px;font-weight:780;color:var(--muted);backdrop-filter:blur(10px)}
.device-family{position:relative;z-index:2;min-height:580px;display:flex;align-items:flex-end;justify-content:center;gap:clamp(10px,2vw,28px);perspective:1200px}.device-shape{position:relative;background:linear-gradient(145deg,#112237,#0b1523);border:2px solid rgba(183,211,245,.25);box-shadow:0 35px 80px rgba(42,77,118,.22);border-radius:32px;padding:10px;transform:rotateY(-5deg)}.device-shape i{display:block;width:100%;height:100%;border-radius:22px;background:radial-gradient(circle at 70% 20%,rgba(92,161,255,.28),transparent 30%),linear-gradient(150deg,#e8f4ff 0%,#bcd9f6 52%,#80afd8 100%)}.device-shape span{position:absolute;left:50%;bottom:-34px;transform:translateX(-50%);font-size:10px;font-weight:850;letter-spacing:.13em;color:var(--muted)}.device-shape.phone{width:160px;height:340px}.device-shape.tablet{width:300px;height:410px;border-radius:28px}.device-shape.twoinone{width:360px;height:300px;border-radius:24px;transform:rotateY(-5deg) rotateX(-3deg)}.device-shape.twoinone::after{content:"";position:absolute;left:-8%;right:-8%;bottom:-34px;height:34px;border-radius:4px 4px 18px 18px;background:linear-gradient(180deg,#23384e,#0a1420);border:1px solid rgba(183,211,245,.15)}

/* Dense capability index — lines, not cards */
.capability-index{padding-top:clamp(120px,13vw,190px);padding-bottom:clamp(120px,13vw,190px)}
.index-title{display:grid;grid-template-columns:1.2fr .8fr;gap:70px;align-items:end;margin-bottom:70px}.index-title .scene-no{grid-column:1/-1}.index-title h2{margin:0}.index-title>p{font-size:16px;align-self:end}
.cap-lines{border-top:1px solid var(--line-strong)}.cap-lines>div{display:grid;grid-template-columns:150px 1fr;gap:20px;padding:22px 0;border-bottom:1px solid var(--line-strong)}.cap-lines strong{font-size:14px}.cap-lines>div>span{display:inline-block;margin:0 14px 8px 0;color:var(--muted);font-size:13px}.cap-lines>div>span::after{content:" /";color:color-mix(in srgb,var(--muted) 36%,transparent)}
.text-link{display:inline-flex;align-items:center;gap:12px;margin-top:32px;font-weight:820;color:var(--text);border-bottom:1px solid var(--text);padding-bottom:5px}.text-link span{color:var(--blue)}

/* Timeline */
.timeline-section{max-width:none;padding-left:max(clamp(22px,4.8vw,72px),calc((100vw - 1480px)/2 + 72px));padding-right:max(clamp(22px,4.8vw,72px),calc((100vw - 1480px)/2 + 72px));background:linear-gradient(180deg,transparent,rgba(45,126,245,.055),transparent)}
.timeline-head{max-width:1100px;margin-bottom:80px}.timeline-track{position:relative;max-width:1260px;margin-left:auto}.timeline-track::before{content:"";position:absolute;left:112px;top:14px;bottom:14px;width:1px;background:linear-gradient(var(--blue),var(--line-strong) 30%,var(--line-strong) 80%,var(--blue))}.timeline-track article{position:relative;display:grid;grid-template-columns:90px 1fr 1.5fr;gap:34px;align-items:start;padding:28px 0 44px}.timeline-track article::before{content:"";position:absolute;left:106px;top:34px;width:13px;height:13px;border-radius:50%;background:var(--bg-elev);border:2px solid var(--line-strong);z-index:1}.timeline-track article.is-current::before{background:var(--blue);border-color:var(--blue);box-shadow:0 0 0 8px color-mix(in srgb,var(--blue) 12%,transparent)}.timeline-track time{font:800 10px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--muted);letter-spacing:.08em}.timeline-track strong{font-size:24px;letter-spacing:-.03em}.timeline-track p{margin:0;color:var(--muted);font-size:15px;line-height:1.7}.timeline-track .is-current strong{color:var(--blue)}

/* Future */
.future-section{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:80px;align-items:center;min-height:720px}.future-copy>p{max-width:650px}.future-words{display:flex;align-content:center;justify-content:center;flex-wrap:wrap;gap:10px;min-height:430px;padding:50px;border-radius:50%;border:1px solid var(--line-strong);position:relative}.future-words::before,.future-words::after{content:"";position:absolute;border-radius:50%;border:1px dashed var(--line);pointer-events:none}.future-words::before{inset:12%}.future-words::after{inset:26%}.future-words span{position:relative;z-index:1;padding:10px 14px;border-radius:999px;background:var(--surface-strong);border:1px solid var(--line);font-size:11px;font-weight:760;color:var(--muted);box-shadow:0 8px 20px rgba(52,87,130,.06)}.future-words span:nth-child(3n){color:var(--blue)}

/* Final CTA */
.final-cta{max-width:1400px;margin-bottom:90px;min-height:620px;border-radius:54px;background:linear-gradient(125deg,#0c1726 0%,#132c49 50%,#245c9e 100%);color:#fff;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:60px;align-items:end;overflow:hidden;box-shadow:0 44px 120px rgba(31,75,127,.25)}
.final-cta-copy,.final-cta-actions{position:relative;z-index:2}.final-cta-copy small{font-size:10px;font-weight:850;letter-spacing:.18em;color:rgba(255,255,255,.56)}.final-cta-copy h2{margin:20px 0 24px;font-size:clamp(58px,7.3vw,114px);line-height:.88;letter-spacing:-.07em}.final-cta-copy p{margin:0;max-width:720px;color:rgba(255,255,255,.65);font-size:17px}.final-cta-actions{display:grid;gap:10px}.final-cta-actions .button{width:100%;justify-content:center;border-color:rgba(255,255,255,.2);color:#fff;background:rgba(255,255,255,.08)}.final-cta-actions .button-primary{background:#fff;color:#11223a;border-color:#fff}.final-cta-orbit{position:absolute;right:-10%;top:-34%;width:700px;height:700px;border-radius:50%;border:1px solid rgba(255,255,255,.08)}.final-cta-orbit::before,.final-cta-orbit::after{content:"";position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.07)}.final-cta-orbit::before{inset:14%}.final-cta-orbit::after{inset:29%}.final-cta-orbit i{position:absolute;width:9px;height:9px;border-radius:50%;background:#8bc0ff;box-shadow:0 0 25px rgba(139,192,255,.75)}.final-cta-orbit i:nth-child(1){left:8%;top:48%}.final-cta-orbit i:nth-child(2){right:21%;top:12%}.final-cta-orbit i:nth-child(3){right:12%;bottom:28%}

/* Reveal tuned for large editorial objects */
.home-editorial .reveal{transform:translateY(26px);opacity:0;transition:opacity .75s cubic-bezier(.2,.7,.2,1),transform .85s cubic-bezier(.2,.7,.2,1)}.home-editorial .reveal.is-visible{transform:none;opacity:1}

@media (max-width:1180px){
  .opening-lead{margin-left:8%}.opening-metrics{grid-template-columns:repeat(2,1fr)}.opening-metrics>div:nth-child(2){border-right:0}.opening-metrics>div:nth-child(-n+2){border-bottom:1px solid var(--line-strong)}
  .scene,.scene-content,.local-section,.harmony-section,.future-section{grid-template-columns:1fr;min-height:auto}.scene-copy-right{justify-self:start}.scene-content{background:linear-gradient(180deg,rgba(45,126,245,.05),transparent 50%)}.content-canvas{order:2}.scene-content .scene-copy{order:1}
  .control-world{grid-template-columns:1fr;justify-items:center}.control-copy-left,.control-copy-right{max-width:660px;justify-self:center;text-align:center}.site-orbit{width:min(720px,100%);min-width:0}
  .download-section{grid-template-columns:1fr;padding-top:130px;padding-bottom:150px}.download-tags{position:relative;left:auto;right:auto;bottom:auto;grid-column:1/-1;margin-top:20px}
  .harmony-section{padding-top:130px;padding-bottom:150px}.device-family{min-height:480px}
  .index-title{grid-template-columns:1fr;gap:22px}.index-title .scene-no{grid-column:auto}.timeline-track{margin-left:0}.final-cta{grid-template-columns:1fr;align-items:end}.final-cta-actions{max-width:440px}
}
@media (max-width:760px){
  .home-opening,.scene,.control-section,.local-section,.capability-index,.future-section{padding-left:20px;padding-right:20px}.opening-index{left:20px}.opening-statement h2{font-size:clamp(50px,16vw,82px)}.opening-lead{margin-left:0;margin-top:30px}.opening-metrics{grid-template-columns:1fr 1fr;margin-top:58px}.opening-metrics>div{min-height:118px;padding:22px 14px}.opening-metrics strong{font-size:34px}.opening-river{gap:18px}
  .scene{gap:48px;padding-top:100px;padding-bottom:100px}.scene-copy h2,.control-head h2,.harmony-copy h2,.index-title h2,.timeline-head h2,.future-copy h2{font-size:clamp(44px,13vw,68px)}
  .browser-stage{min-height:430px}.stage-window{aspect-ratio:.92;border-radius:24px;transform:none}.stage-tabbar{overflow:hidden}.stage-tab{min-width:125px}.stage-tab:nth-of-type(3){display:none}.stage-page{min-height:360px;padding:46px 7% 34px}.stage-shortcuts span{width:52px;height:52px}.stage-floating{display:none}
  .content-canvas{min-height:610px}.content-paper{width:88%;min-height:560px;padding:38px 30px}.content-paper h3{margin-top:50px;font-size:44px}.content-paper p{font-size:15px}.content-tools{left:0;top:11%}.content-tools button{width:64px;height:38px;font-size:12px}.content-mode-panel{right:0;bottom:9%;width:48%;padding:16px}.content-mode-panel strong{font-size:15px}.content-mode-panel span{font-size:10px}.word-c{display:none}
  .control-head{padding:0 20px}.control-world{min-height:680px;padding:0 20px}.site-orbit{width:100%;max-width:520px}.orbit-core{width:156px;height:156px}.orbit-core strong{font-size:18px}.orbit-item{min-width:48px;height:29px;padding:0 9px;font-size:9px}.rule-stream{padding-left:20px;padding-right:20px}
  .download-section{padding-left:20px;padding-right:20px;min-height:auto}.download-copy h2{font-size:clamp(48px,13vw,68px)}.download-row{grid-template-columns:44px 1fr auto;gap:12px;min-height:102px}.download-row .d-icon{width:38px;height:38px}.download-tags{gap:12px}
  .local-visual{max-width:560px;width:100%;justify-self:center}.local-core{width:170px;height:170px}.local-core img{width:44px;height:44px}.local-node{font-size:10px}
  .harmony-section{padding-left:20px;padding-right:20px}.api-ghost{font-size:90vw}.device-family{min-height:390px;gap:8px;overflow:hidden}.device-shape.phone{width:86px;height:210px;border-radius:18px;padding:6px}.device-shape.tablet{width:150px;height:245px;border-radius:18px;padding:6px}.device-shape.twoinone{width:175px;height:190px;border-radius:16px;padding:6px}.device-shape i{border-radius:12px}
  .cap-lines>div{grid-template-columns:1fr;gap:8px}.cap-lines>div>span{margin-right:9px}.timeline-section{padding-left:20px;padding-right:20px}.timeline-track::before{left:16px}.timeline-track article{grid-template-columns:1fr;padding-left:50px;gap:8px}.timeline-track article::before{left:10px}.timeline-track time{position:absolute;right:0;top:30px}.timeline-track strong{padding-right:100px}.future-words{min-height:330px;border-radius:38px;padding:35px 18px}
  .final-cta{margin:0 14px 56px;padding:64px 24px;border-radius:36px;min-height:580px}.final-cta-copy h2{font-size:clamp(54px,15vw,80px)}.final-cta-orbit{right:-70%;top:-22%;width:600px;height:600px}
}
@media (max-width:480px){
  .opening-metrics{grid-template-columns:1fr}.opening-metrics>div{border-right:0!important;border-bottom:1px solid var(--line-strong)!important}.opening-metrics>div:last-child{border-bottom:0!important}.opening-metrics strong{font-size:40px}
  .content-tools{top:5%;grid-template-columns:repeat(4,1fr);left:7%;right:7%}.content-tools button{width:auto}.content-mode-panel{width:68%}
  .orbit-item.oi-6,.orbit-item.oi-8{display:none}.control-world{min-height:600px}.local-node.ln-6,.local-node.ln-7{display:none}.download-row small{font-size:10px}.download-row strong{font-size:13px}.download-row em{font-size:10px}
}

/* =========================================================
   V5 — editorial interaction pass
   Inspired by asymmetrical bento composition and micro-interaction references.
   Opening journey/video styles intentionally untouched.
   ========================================================= */

/* 01. Homepage toolbox portal — remove the long catalogue from home */
.feature-portal{position:relative;max-width:1480px;margin:0 auto;padding:clamp(110px,12vw,180px) clamp(22px,4.8vw,72px);display:grid;grid-template-columns:minmax(0,.9fr) minmax(440px,1.1fr);gap:clamp(64px,8vw,130px);align-items:center;overflow:hidden}
.feature-portal-copy h2{margin:0 0 30px;font-size:clamp(56px,6.2vw,100px);line-height:.92;letter-spacing:-.065em}.feature-portal-copy h2 span{color:var(--muted);font-weight:590}.feature-portal-copy>p{max-width:620px;font-size:17px;line-height:1.75}.feature-portal-link{display:inline-flex;align-items:center;justify-content:space-between;gap:32px;min-width:250px;margin-top:34px;padding:16px 18px 16px 22px;border:1px solid var(--line-strong);border-radius:999px;background:color-mix(in srgb,var(--surface-strong) 76%,transparent);box-shadow:0 18px 44px rgba(48,83,126,.08);font-weight:820;color:var(--text);transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s ease,border-color .28s ease}.feature-portal-link b{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--blue);color:white;font-size:14px;transition:transform .32s cubic-bezier(.2,.8,.2,1)}.feature-portal-link:hover{transform:translateY(-3px);box-shadow:0 24px 56px rgba(48,83,126,.13);border-color:color-mix(in srgb,var(--blue) 30%,var(--line-strong))}.feature-portal-link:hover b{transform:rotate(45deg)}
.feature-portal-visual{position:relative;aspect-ratio:1;display:grid;place-items:center;min-height:620px;color:var(--text);isolation:isolate}.portal-orbit{position:absolute;border-radius:50%;border:1px solid var(--line-strong);transition:transform .7s cubic-bezier(.2,.8,.2,1)}.po-1{inset:5%}.po-2{inset:20%;border-style:dashed}.po-3{inset:35%;border-color:color-mix(in srgb,var(--blue) 26%,var(--line))}.feature-portal-visual:hover .po-1{transform:rotate(12deg) scale(1.02)}.feature-portal-visual:hover .po-2{transform:rotate(-18deg) scale(.98)}.portal-core{position:relative;z-index:2;width:210px;height:210px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(230,241,253,.72));border:1px solid rgba(255,255,255,.9);box-shadow:0 35px 90px rgba(38,84,137,.16),inset 0 0 0 12px rgba(45,126,245,.035);backdrop-filter:blur(18px)}html[data-theme="dark"] .portal-core{background:linear-gradient(145deg,rgba(28,47,68,.96),rgba(13,28,45,.92));border-color:rgba(161,193,229,.12)}.portal-core img{width:50px;height:50px;margin-bottom:11px}.portal-core strong{font-size:24px;letter-spacing:.11em}.portal-core small{max-width:160px;margin-top:5px;color:var(--muted);font-size:9px;line-height:1.45}.portal-chip{position:absolute;z-index:3;padding:9px 13px;border-radius:999px;border:1px solid var(--line);background:color-mix(in srgb,var(--surface-strong) 78%,transparent);backdrop-filter:blur(12px);box-shadow:0 10px 25px rgba(51,89,134,.08);font-size:11px;font-weight:780;color:var(--muted);transition:transform .3s ease,color .3s ease,border-color .3s ease}.feature-portal-visual:hover .portal-chip{color:var(--blue);border-color:color-mix(in srgb,var(--blue) 24%,var(--line))}.pc-1{left:7%;top:31%}.pc-2{top:9%;left:43%}.pc-3{right:5%;top:28%}.pc-4{right:11%;bottom:21%}.pc-5{left:14%;bottom:15%}.pc-6{left:35%;bottom:5%}.feature-portal-visual:hover .pc-1{transform:translate(-7px,-3px)}.feature-portal-visual:hover .pc-3{transform:translate(8px,-4px)}.feature-portal-visual:hover .pc-4{transform:translate(5px,6px)}.portal-cursor-dot{position:absolute;width:9px;height:9px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 8px color-mix(in srgb,var(--blue) 12%,transparent),0 0 32px color-mix(in srgb,var(--blue) 42%,transparent);left:62%;top:57%;animation:portalDrift 6s ease-in-out infinite alternate}@keyframes portalDrift{to{transform:translate(-94px,58px)}}

/* 02. Fix the old .privacy-lines selector collision from the legacy feature demo. */
.local-section .privacy-lines{position:static;inset:auto;display:block;gap:0;transform:none;margin-top:38px;border-top:1px solid var(--line-strong)}
.local-section .privacy-lines span{display:flex;width:auto;height:auto;border-radius:0;background:none;align-items:center;gap:16px;padding:14px 0;border-bottom:1px solid var(--line);font-size:14px;color:var(--muted)}
.local-section .privacy-lines b{flex:0 0 auto;color:var(--blue);font:800 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace}
.local-section .scene-copy{position:relative;z-index:4}.local-section .scene-copy h2{max-width:680px}

/* 03. Downloads stay in the same palette in light mode; dark mode remains distinct. */
.download-section{background:linear-gradient(135deg,color-mix(in srgb,var(--blue) 8%,var(--bg-elev)) 0%,var(--bg-elev) 42%,color-mix(in srgb,var(--blue) 4%,var(--bg)) 100%);color:var(--text);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.download-backdrop{-webkit-text-stroke:1px color-mix(in srgb,var(--blue) 12%,transparent)}.download-copy .scene-no{color:var(--blue)}.download-copy .scene-kicker{color:var(--muted)}.download-copy p{color:var(--muted)}.download-rail{border-color:var(--line-strong)}.download-row{border-color:var(--line)}.download-row .d-icon{border-color:var(--line-strong);color:var(--blue);background:color-mix(in srgb,var(--surface) 84%,transparent)}.download-row small,.download-row em{color:var(--muted)}.download-row i{background:var(--line)}.download-row i::after{background:linear-gradient(90deg,var(--blue),#8fc6ff)}.download-tags{color:var(--muted)}.download-tags span{border-color:var(--line)}
html[data-theme="dark"] .download-section{background:linear-gradient(135deg,#102237 0%,#0b1727 58%,#11283f 100%);color:#f2f7ff;border-color:rgba(151,188,229,.12)}html[data-theme="dark"] .download-copy p,html[data-theme="dark"] .download-row small,html[data-theme="dark"] .download-row em,html[data-theme="dark"] .download-tags{color:#8fa8c3}html[data-theme="dark"] .download-rail,html[data-theme="dark"] .download-row{border-color:rgba(154,190,231,.15)}html[data-theme="dark"] .download-row .d-icon{border-color:rgba(146,187,231,.22);background:rgba(26,48,72,.5);color:#8abfff}
.download-row{transition:transform .26s ease,background .26s ease,padding .26s ease}.download-row:hover{transform:translateX(8px);background:color-mix(in srgb,var(--blue) 4%,transparent);padding-left:14px;padding-right:14px}.download-row i::after{transform-origin:left;animation:railGlow 3.4s ease-in-out infinite alternate}@keyframes railGlow{from{filter:saturate(.85);opacity:.72}to{filter:saturate(1.2);opacity:1}}

/* 04. Harmony device proportions + NEXT visual system. */
.device-family-v5{min-height:610px;align-items:center;gap:clamp(24px,3.2vw,50px);overflow:visible}.device-v5{position:relative;flex:0 0 auto;filter:drop-shadow(0 30px 42px rgba(45,82,126,.16));transition:transform .45s cubic-bezier(.2,.8,.2,1),filter .45s ease;transform-style:preserve-3d}.device-v5:hover{transform:translateY(-10px) rotateX(2deg) rotateY(-3deg);filter:drop-shadow(0 42px 54px rgba(45,82,126,.23))}.device-v5-screen{position:relative;overflow:hidden;width:100%;height:100%;border:clamp(7px,.75vw,11px) solid #14263b;background:radial-gradient(circle at 50% 38%,rgba(255,255,255,.9) 0 4%,rgba(197,225,255,.72) 24%,rgba(102,167,231,.34) 50%,rgba(60,129,202,.16) 70%,transparent 72%),linear-gradient(145deg,#eff7ff,#d9edff 42%,#9dc9ef 100%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.6),0 0 0 1px rgba(31,55,80,.2)}.device-v5-phone{width:148px;aspect-ratio:74.3/157.6}.device-v5-phone .device-v5-screen{border-radius:31px}.device-v5-tablet{width:340px;aspect-ratio:271.25/182.53}.device-v5-tablet .device-v5-screen{border-radius:25px}.device-v5-laptop{width:390px;aspect-ratio:3/2;margin-bottom:42px}.device-v5-laptop .device-v5-screen{border-radius:18px}.device-v5-base{position:absolute;left:-6%;right:-6%;height:38px;bottom:-35px;border-radius:3px 3px 19px 19px;background:linear-gradient(180deg,#2f455c,#0f1c2a);box-shadow:0 14px 18px rgba(22,44,66,.18)}.device-v5-base::before{content:"";position:absolute;left:12%;right:12%;top:7px;height:1px;background:rgba(255,255,255,.18)}.device-v5-base span{position:absolute;width:58px;height:5px;border-radius:0 0 8px 8px;background:#586d82;left:50%;top:0;transform:translateX(-50%)}.device-v5-label{position:absolute;left:50%;bottom:-58px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--text);font-size:11px;font-weight:840;letter-spacing:.12em;white-space:nowrap}.device-v5-label em{font-style:normal;font-size:8px;letter-spacing:.05em;color:var(--muted);font-weight:650}.device-v5-laptop .device-v5-label{bottom:-84px}
.hmos-mark{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;isolation:isolate}.hmos-mark::before,.hmos-mark::after{content:"";position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.72);box-shadow:0 0 42px rgba(97,163,233,.18)}.hmos-mark::before{width:38%;aspect-ratio:1;animation:hmosRing 8s linear infinite}.hmos-mark::after{width:58%;aspect-ratio:1;border-style:dashed;opacity:.48;animation:hmosRing 13s linear infinite reverse}.hmos-mark b{position:relative;z-index:3;font-size:clamp(8px,1.1vw,14px);letter-spacing:.1em;color:#17446f;text-shadow:0 1px 0 rgba(255,255,255,.5)}.hmos-mark small{position:relative;z-index:3;margin-top:3px;font-size:clamp(6px,.7vw,9px);font-weight:900;letter-spacing:.23em;color:#3d7cb7}.hmos-mark>i{position:absolute;width:4px;height:4px;border-radius:50%;background:white;box-shadow:0 0 12px #bfe0ff,0 0 24px #70b7ff;animation:hmosStar 3.5s ease-in-out infinite}.hmos-mark>i:nth-child(1){left:27%;top:32%;animation-delay:-1.2s}.hmos-mark>i:nth-child(2){right:24%;top:42%;width:6px;height:6px;animation-delay:-2.1s}.hmos-mark>i:nth-child(3){left:47%;bottom:26%;animation-delay:-.4s}.hmos-particle{position:absolute;border-radius:50%;background:rgba(255,255,255,.86);box-shadow:0 0 10px rgba(118,183,247,.9);pointer-events:none;animation:particleFloat var(--dur,5s) ease-in-out infinite alternate;animation-delay:var(--delay,0s)}@keyframes hmosRing{to{transform:rotate(360deg)}}@keyframes hmosStar{0%,100%{transform:scale(.7);opacity:.35}50%{transform:scale(1.55);opacity:1}}@keyframes particleFloat{to{transform:translate(var(--dx,8px),var(--dy,-10px)) scale(1.35);opacity:.25}}
html[data-theme="dark"] .device-v5-screen{background:radial-gradient(circle at 50% 38%,rgba(128,189,255,.32),rgba(53,111,168,.22) 35%,rgba(22,51,82,.92) 72%),linear-gradient(145deg,#183552,#0d2135);border-color:#07121e}.device-family-v5::after{content:"";position:absolute;left:12%;right:8%;bottom:13%;height:1px;background:linear-gradient(90deg,transparent,var(--line-strong),transparent);transform:perspective(500px) rotateX(70deg);filter:blur(.1px)}

/* 05. Final CTA keeps impact without becoming a black slab in light theme. */
.final-cta{background:linear-gradient(125deg,#e9f4ff 0%,#d6eaff 44%,#a9d1f8 100%);color:#10253c;border:1px solid rgba(87,147,209,.18);box-shadow:0 44px 120px rgba(31,75,127,.16)}.final-cta-copy small{color:#5d7d9f}.final-cta-copy p{color:#587391}.final-cta-actions .button{border-color:rgba(38,86,137,.16);color:#17334f;background:rgba(255,255,255,.38)}.final-cta-actions .button-primary{background:#173754;color:white;border-color:#173754}.final-cta-orbit,.final-cta-orbit::before,.final-cta-orbit::after{border-color:rgba(39,90,144,.11)}.final-cta-orbit i{background:#3789d9;box-shadow:0 0 25px rgba(55,137,217,.5)}
html[data-theme="dark"] .final-cta{background:linear-gradient(125deg,#10243a 0%,#163b5d 56%,#235f93 100%);color:#fff;border-color:rgba(166,202,241,.12)}html[data-theme="dark"] .final-cta-copy small{color:rgba(255,255,255,.58)}html[data-theme="dark"] .final-cta-copy p{color:rgba(255,255,255,.66)}html[data-theme="dark"] .final-cta-actions .button{color:#fff;background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16)}html[data-theme="dark"] .final-cta-actions .button-primary{background:#fff;color:#11223a;border-color:#fff}

/* =========================================================
   Features V5 — asymmetrical bento + interactive atlas
   ========================================================= */
.features-v5{overflow:hidden}.features-hero-v5{position:relative;min-height:820px;display:flex;align-items:center;padding-top:120px;overflow:hidden}.features-hero-grid{position:absolute;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(to bottom,transparent 0,black 24%,black 74%,transparent 100%);opacity:.34}.feature-hero-orb{position:absolute;border-radius:50%;filter:blur(1px);background:radial-gradient(circle at 32% 28%,rgba(255,255,255,.8),rgba(113,177,242,.15) 50%,rgba(45,126,245,.05) 72%,transparent 74%);border:1px solid color-mix(in srgb,var(--blue) 12%,transparent);animation:featureOrb 14s ease-in-out infinite alternate}.orb-a{width:min(52vw,740px);aspect-ratio:1;right:-10vw;top:4%}.orb-b{width:min(25vw,360px);aspect-ratio:1;left:48%;bottom:0;animation-delay:-7s}@keyframes featureOrb{to{transform:translate3d(-24px,34px,0) scale(1.04)}}.features-hero-inner{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.28fr) minmax(300px,.72fr);gap:70px;align-items:end}.features-hero-copy h1{margin:18px 0 34px;font-size:clamp(76px,9.4vw,152px);line-height:.82;letter-spacing:-.08em}.features-hero-copy h1 span{color:var(--muted);font-weight:570}.features-hero-copy>p{max-width:820px;font-size:18px;line-height:1.76}.feature-hero-meter{align-self:center;justify-self:end;width:min(340px,100%);padding:30px 0;border-top:1px solid var(--line-strong);border-bottom:1px solid var(--line-strong)}.feature-hero-meter strong{display:block;font-size:clamp(76px,7vw,108px);line-height:.8;letter-spacing:-.07em;color:var(--blue)}.feature-hero-meter>span{display:block;margin-top:16px;font-size:14px;color:var(--muted)}.meter-line{height:2px;margin:28px 0 16px;background:var(--line)}.meter-line i{display:block;width:72%;height:100%;background:linear-gradient(90deg,var(--blue),#a5d4ff);animation:meterBreath 3.8s ease-in-out infinite alternate}.feature-hero-meter small{color:var(--muted);line-height:1.6}@keyframes meterBreath{to{width:92%}}

.feature-bento-wrap{padding-top:clamp(80px,8vw,120px);padding-bottom:clamp(120px,11vw,180px)}.bento-intro{display:grid;grid-template-columns:1fr .75fr;gap:60px;align-items:end;margin-bottom:60px}.bento-intro .scene-no{grid-column:1/-1}.bento-intro h2{margin:0;font-size:clamp(54px,5.8vw,94px);line-height:.94;letter-spacing:-.06em}.bento-intro p{margin:0 0 8px;color:var(--muted);font-size:16px;line-height:1.7}.feature-bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:minmax(110px,auto);gap:14px}.bento-tile{--sx:50%;--sy:50%;position:relative;overflow:hidden;border:1px solid var(--line);background:color-mix(in srgb,var(--surface-strong) 82%,transparent);min-height:260px;padding:clamp(24px,3vw,42px);isolation:isolate;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,border-color .35s ease}.bento-tile::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(520px circle at var(--sx) var(--sy),color-mix(in srgb,var(--blue) 11%,transparent),transparent 42%);opacity:0;transition:opacity .28s ease}.bento-tile:hover::before{opacity:1}.bento-tile:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--blue) 25%,var(--line));box-shadow:0 30px 65px rgba(54,92,137,.10)}.bento-copy{position:relative;z-index:3}.bento-copy small{font:850 9px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.18em;color:var(--blue)}.bento-copy h3{margin:14px 0 14px;font-size:clamp(28px,2.5vw,44px);line-height:1.02;letter-spacing:-.045em}.bento-copy p{margin:0;color:var(--muted);font-size:14px;line-height:1.66}.bento-browse{grid-column:span 7;grid-row:span 3;min-height:580px;border-radius:42px 12px 42px 42px;background:linear-gradient(145deg,color-mix(in srgb,var(--blue) 8%,var(--surface-strong)),var(--surface-strong) 60%)}.bento-local{grid-column:span 5;grid-row:span 2;border-radius:12px 42px 42px 42px;display:grid;grid-template-columns:.85fr 1.15fr;align-items:center;gap:24px}.bento-download{grid-column:span 5;grid-row:span 2;border-radius:42px 42px 12px 42px}.bento-content{grid-column:span 4;grid-row:span 3;border-radius:42px 12px 42px 12px;min-height:520px;background:linear-gradient(160deg,#faf5e8 0%,#f4eddc 100%);color:#2b2b27}.bento-content .bento-copy p{color:#706a5c}.bento-control{grid-column:span 4;grid-row:span 3;border-radius:12px 42px 12px 42px;min-height:520px}.bento-custom{grid-column:span 4;grid-row:span 2;border-radius:42px 42px 42px 12px}.bento-harmony{grid-column:span 8;grid-row:span 2;border-radius:12px 42px 42px 42px;display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:44px;background:linear-gradient(120deg,color-mix(in srgb,var(--blue) 8%,var(--surface-strong)),var(--surface-strong))}
html[data-theme="dark"] .bento-content{background:linear-gradient(160deg,#2b2b24,#20201d);color:#f2eee0}.bento-browse .bento-copy{max-width:620px}.mini-browser{position:absolute;left:7%;right:6%;bottom:6%;height:55%;border:1px solid var(--line-strong);border-radius:26px;background:color-mix(in srgb,var(--bg-elev) 92%,transparent);box-shadow:0 28px 70px rgba(44,85,132,.12);overflow:hidden;transform:perspective(900px) rotateX(3deg);transition:transform .45s ease}.bento-browse:hover .mini-browser{transform:perspective(900px) rotateX(0deg) translateY(-4px)}.mini-tabs{height:44px;display:flex;align-items:end;gap:5px;padding:0 12px;border-bottom:1px solid var(--line)}.mini-tabs button{height:33px;padding:0 14px;border:0;border-radius:10px 10px 0 0;background:transparent;color:var(--muted);font-size:10px;cursor:pointer}.mini-tabs button.is-active{background:var(--surface);color:var(--text);box-shadow:0 -1px 0 var(--line)}.mini-tabs i{margin-left:auto;margin-bottom:9px;font-style:normal;color:var(--muted)}.mini-address{height:52px;display:flex;align-items:center;gap:10px;padding:0 17px;border-bottom:1px solid var(--line);font-size:11px}.mini-address span{flex:1;color:var(--muted)}.mini-address em{font-style:normal;color:var(--muted);padding:3px 7px;border:1px solid var(--line);border-radius:6px}.mini-page{height:calc(100% - 96px);padding:18px;display:grid;grid-template-columns:1.4fr .7fr .7fr;gap:10px;align-items:end}.mini-page span{display:block;height:64%;border-radius:16px;background:linear-gradient(180deg,color-mix(in srgb,var(--blue) 8%,var(--surface)),var(--surface));border:1px solid var(--line)}.mini-page span:first-child{height:86%}
.local-pulse{position:relative;aspect-ratio:1;display:grid;place-items:center}.local-pulse::before,.local-pulse::after{content:"";position:absolute;border-radius:50%;border:1px solid color-mix(in srgb,var(--blue) 24%,var(--line));animation:pulseOrbit 7s linear infinite}.local-pulse::before{inset:5%}.local-pulse::after{inset:22%;border-style:dashed;animation-direction:reverse;animation-duration:10s}.local-pulse b{position:relative;z-index:2;font-size:16px;letter-spacing:.16em}.local-pulse i{position:absolute;width:5px;height:5px;border-radius:50%;background:var(--blue);box-shadow:0 0 18px color-mix(in srgb,var(--blue) 62%,transparent)}.local-pulse i:nth-child(1){top:12%;left:49%}.local-pulse i:nth-child(2){bottom:19%;right:14%}.local-pulse i:nth-child(3){left:10%;top:58%}@keyframes pulseOrbit{to{transform:rotate(360deg)}}.mini-download{margin-top:30px;border-top:1px solid var(--line-strong)}.mini-download>div{position:relative;display:grid;grid-template-columns:1fr auto;gap:8px;padding:15px 0 18px;border-bottom:1px solid var(--line)}.mini-download b{font-size:12px}.mini-download em{font-style:normal;font-size:9px;color:var(--muted)}.mini-download i{position:absolute;left:0;bottom:8px;height:2px;width:var(--p);background:linear-gradient(90deg,var(--blue),#a9d6ff)}
.content-scrubber{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-bottom:44px}.content-scrubber button{height:34px;border-radius:999px;border:1px solid rgba(66,73,69,.14);background:rgba(255,255,255,.42);color:#777266;font-size:10px;cursor:pointer;transition:.22s ease}.content-scrubber button.is-active{background:#272720;color:#fff;transform:translateY(-3px)}.paper-wave{position:absolute;left:10%;right:10%;bottom:8%;display:grid;gap:8px}.paper-wave i{height:2px;background:#8c846f;opacity:.16;transform-origin:left;animation:paperLine 3s ease-in-out infinite alternate}.paper-wave i:nth-child(2){width:80%;animation-delay:-1s}.paper-wave i:nth-child(3){width:62%;animation-delay:-2s}.paper-wave i:nth-child(4){width:90%;animation-delay:-.5s}@keyframes paperLine{to{transform:scaleX(.88);opacity:.26}}
.control-dial{position:relative;width:min(280px,74%);aspect-ratio:1;margin:0 auto 28px;border-radius:50%;border:1px solid var(--line-strong);transition:transform .7s cubic-bezier(.2,.8,.2,1)}.control-dial::before{content:"";position:absolute;inset:21%;border-radius:50%;border:1px dashed var(--line-strong)}.dial-core{position:absolute;inset:34%;border-radius:50%;display:grid;place-items:center;background:var(--surface);border:1px solid var(--line);font-size:10px;font-weight:850;color:var(--blue)}.control-dial span{position:absolute;font-size:9px;font-weight:780;color:var(--muted)}.control-dial span:nth-of-type(1){left:45%;top:4%}.control-dial span:nth-of-type(2){right:2%;top:48%}.control-dial span:nth-of-type(3){right:17%;bottom:12%}.control-dial span:nth-of-type(4){left:11%;bottom:17%}.control-dial span:nth-of-type(5){left:-2%;top:40%}.bento-control:hover .control-dial{transform:rotate(12deg)}.custom-lines{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}.custom-lines span{padding:8px 12px;border-radius:999px;border:1px solid var(--line);background:var(--surface);font-size:10px;color:var(--muted);transition:.2s ease}.bento-custom:hover .custom-lines span:nth-child(odd){transform:translateY(-4px);color:var(--blue)}.bento-custom:hover .custom-lines span:nth-child(even){transform:translateY(3px)}.harmony-mini-mark{position:relative;aspect-ratio:1;display:grid;place-items:center;max-width:260px;margin:auto}.harmony-mini-mark::before,.harmony-mini-mark::after{content:"";position:absolute;border-radius:50%;border:1px solid color-mix(in srgb,var(--blue) 24%,var(--line));animation:hmosRing 9s linear infinite}.harmony-mini-mark::before{inset:4%}.harmony-mini-mark::after{inset:24%;border-style:dashed;animation-direction:reverse}.harmony-mini-mark b{font-size:24px;letter-spacing:.18em;color:var(--blue)}.harmony-mini-mark i{position:absolute;width:6px;height:6px;border-radius:50%;background:var(--blue);box-shadow:0 0 22px color-mix(in srgb,var(--blue) 70%,transparent);animation:hmosStar 3s ease-in-out infinite}.harmony-mini-mark i:nth-child(1){left:17%;top:28%}.harmony-mini-mark i:nth-child(2){right:13%;top:52%;animation-delay:-1s}.harmony-mini-mark i:nth-child(3){left:45%;bottom:10%;animation-delay:-2s}

.feature-atlas{position:relative;max-width:none;padding:clamp(110px,11vw,170px) 0;background:linear-gradient(180deg,color-mix(in srgb,var(--blue) 4%,transparent),transparent 28%,color-mix(in srgb,var(--blue) 5%,transparent) 100%);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.atlas-head{max-width:980px;margin-bottom:60px}.atlas-head h2{margin:16px 0 24px;font-size:clamp(56px,6vw,96px);line-height:.92;letter-spacing:-.06em}.atlas-head p{max-width:720px;color:var(--muted);font-size:16px;line-height:1.7}.atlas-shell{display:grid;grid-template-columns:190px minmax(0,1fr);min-height:610px;border:1px solid var(--line-strong);border-radius:34px;overflow:hidden;background:color-mix(in srgb,var(--surface-strong) 78%,transparent);box-shadow:0 30px 80px rgba(46,82,124,.08)}.atlas-nav{display:flex;flex-direction:column;border-right:1px solid var(--line-strong);padding:18px}.atlas-nav button{position:relative;display:grid;grid-template-columns:34px 1fr;align-items:center;gap:8px;min-height:70px;padding:0 12px;border:0;border-radius:18px;background:transparent;color:var(--muted);text-align:left;cursor:pointer;transition:.25s ease}.atlas-nav button b{font:800 9px/1 ui-monospace,SFMono-Regular,Menlo,monospace}.atlas-nav button span{font-size:13px;font-weight:800}.atlas-nav button.is-active{background:var(--text);color:var(--bg-elev);transform:translateX(6px)}.atlas-stage{--ax:72%;--ay:34%;position:relative;overflow:hidden;padding:clamp(42px,5vw,78px);display:grid;grid-template-columns:minmax(0,.8fr) minmax(340px,1.2fr);gap:40px;align-items:center}.atlas-stage::before{content:"";position:absolute;inset:0;background:radial-gradient(500px circle at var(--ax) var(--ay),color-mix(in srgb,var(--blue) 10%,transparent),transparent 48%);pointer-events:none}.atlas-watermark{position:absolute;right:-1%;bottom:-8%;font-size:clamp(100px,16vw,250px);font-weight:950;line-height:.8;letter-spacing:-.08em;color:color-mix(in srgb,var(--blue) 5%,transparent);pointer-events:none}.atlas-copy{position:relative;z-index:2}.atlas-copy small{font:850 9px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.17em;color:var(--blue)}.atlas-copy h3{margin:18px 0 20px;font-size:clamp(40px,4vw,66px);line-height:.95;letter-spacing:-.055em}.atlas-copy p{max-width:520px;margin:0;color:var(--muted);line-height:1.75}.atlas-chips{position:relative;z-index:3;min-height:390px}.atlas-chips button{position:absolute;border:1px solid var(--line);border-radius:999px;background:color-mix(in srgb,var(--surface) 88%,transparent);backdrop-filter:blur(12px);box-shadow:0 12px 30px rgba(43,82,126,.07);color:var(--muted);font-size:11px;font-weight:760;padding:10px 14px;cursor:default;animation:chipFloat 5s ease-in-out infinite alternate;transition:color .25s ease,border-color .25s ease,transform .25s ease}.atlas-chips button:hover{color:var(--blue);border-color:color-mix(in srgb,var(--blue) 30%,var(--line));transform:scale(1.07)}.atlas-chips button:nth-child(2n){animation-delay:-1.7s}.atlas-chips button:nth-child(3n){animation-delay:-3.2s}.atlas-pointer{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 8px color-mix(in srgb,var(--blue) 10%,transparent),0 0 24px color-mix(in srgb,var(--blue) 48%,transparent);right:19%;top:27%;transition:transform .45s ease}@keyframes chipFloat{to{translate:0 -8px}}

.feature-flow{padding-top:clamp(110px,10vw,160px);padding-bottom:clamp(120px,12vw,190px)}.flow-copy{display:grid;grid-template-columns:1.2fr .8fr;gap:60px;align-items:end}.flow-copy .scene-no{grid-column:1/-1}.flow-copy h2{margin:0;font-size:clamp(56px,6vw,96px);line-height:.92;letter-spacing:-.06em}.flow-copy p{margin:0;color:var(--muted);line-height:1.75}.flow-track{display:flex;align-items:center;margin-top:86px;overflow:hidden}.flow-node{flex:0 0 auto;width:145px;aspect-ratio:1;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid var(--line-strong);background:var(--surface);transition:.35s cubic-bezier(.2,.8,.2,1)}.flow-node b{font:800 9px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--blue)}.flow-node span{margin-top:8px;font-size:13px;font-weight:800}.flow-node.is-active{background:var(--text);color:var(--bg-elev);transform:scale(1.05)}.flow-track>i{flex:1 1 90px;height:1px;min-width:48px;background:linear-gradient(90deg,var(--line-strong),color-mix(in srgb,var(--blue) 45%,var(--line-strong)),var(--line-strong));position:relative}.flow-track>i::after{content:"";position:absolute;top:-3px;width:7px;height:7px;border-radius:50%;background:var(--blue);animation:flowDot 3.2s linear infinite}@keyframes flowDot{from{left:0}to{left:calc(100% - 7px)}}
.features-final-v5{padding:0 0 70px}.features-final-inner{min-height:520px;padding:clamp(56px,7vw,100px);border-radius:46px;background:linear-gradient(135deg,color-mix(in srgb,var(--blue) 8%,var(--surface-strong)),var(--surface-strong));border:1px solid var(--line);display:flex;align-items:flex-end;justify-content:space-between;gap:50px;overflow:hidden;position:relative}.features-final-inner::after{content:"";position:absolute;width:560px;height:560px;border-radius:50%;right:-180px;top:-220px;border:1px solid color-mix(in srgb,var(--blue) 18%,var(--line));box-shadow:inset 0 0 0 70px color-mix(in srgb,var(--blue) 2%,transparent),inset 0 0 0 140px color-mix(in srgb,var(--blue) 2%,transparent)}.features-final-inner>div,.features-final-inner>a{position:relative;z-index:2}.features-final-inner h2{margin:18px 0 0;font-size:clamp(64px,7vw,110px);line-height:.88;letter-spacing:-.07em}

/* Shared micro-interactions */
.cursor-echo{position:fixed;z-index:9999;width:28px;height:28px;border:1px solid color-mix(in srgb,var(--blue) 42%,transparent);border-radius:50%;pointer-events:none;transform:translate(-50%,-50%);opacity:0;transition:width .2s ease,height .2s ease,opacity .2s ease,background .2s ease;mix-blend-mode:multiply}.cursor-echo.is-visible{opacity:.8}.cursor-echo.is-hot{width:48px;height:48px;background:color-mix(in srgb,var(--blue) 7%,transparent)}html[data-theme="dark"] .cursor-echo{mix-blend-mode:screen}.micro-ripple{position:absolute;border-radius:50%;pointer-events:none;background:color-mix(in srgb,var(--blue) 14%,transparent);transform:translate(-50%,-50%) scale(0);animation:rippleOut .55s ease-out forwards}@keyframes rippleOut{to{transform:translate(-50%,-50%) scale(5);opacity:0}}

@media (max-width:1180px){
  .feature-portal{grid-template-columns:1fr}.feature-portal-visual{min-height:540px;max-width:720px;width:100%;justify-self:center}.device-family-v5{min-height:500px}.device-v5-phone{width:120px}.device-v5-tablet{width:270px}.device-v5-laptop{width:310px}.bento-browse{grid-column:span 12}.bento-local,.bento-download{grid-column:span 6}.bento-content,.bento-control,.bento-custom{grid-column:span 6}.bento-harmony{grid-column:span 12}.atlas-shell{grid-template-columns:160px 1fr}.atlas-stage{grid-template-columns:1fr}.atlas-chips{min-height:290px}.features-hero-inner{grid-template-columns:1fr}.feature-hero-meter{justify-self:start}.features-hero-v5{min-height:760px}.flow-track{overflow-x:auto;padding-bottom:12px}.flow-track>i{flex:0 0 80px}
}
@media (max-width:760px){
  .feature-portal{padding-left:20px;padding-right:20px}.feature-portal-copy h2{font-size:clamp(48px,13vw,70px)}.feature-portal-visual{min-height:440px}.portal-core{width:165px;height:165px}.portal-chip{font-size:9px}.pc-5,.pc-6{display:none}
  .device-family-v5{min-height:360px;gap:10px;overflow:hidden;align-items:center}.device-v5-phone{width:72px}.device-v5-tablet{width:162px}.device-v5-laptop{width:184px;margin-bottom:24px}.device-v5-base{height:20px;bottom:-18px}.device-v5-label{bottom:-38px;font-size:8px}.device-v5-laptop .device-v5-label{bottom:-48px}.hmos-mark b{font-size:7px}.hmos-mark small{font-size:5px}
  .features-hero-v5{min-height:700px;padding-top:110px}.features-hero-inner{padding-left:20px;padding-right:20px}.features-hero-copy h1{font-size:clamp(62px,18vw,92px)}.feature-hero-meter strong{font-size:74px}.feature-bento-wrap{padding-left:20px;padding-right:20px}.bento-intro{grid-template-columns:1fr;gap:22px}.bento-intro .scene-no{grid-column:auto}.feature-bento{grid-template-columns:1fr;gap:12px}.bento-browse,.bento-local,.bento-download,.bento-content,.bento-control,.bento-custom,.bento-harmony{grid-column:1;grid-row:auto;min-height:420px;border-radius:30px}.bento-local,.bento-harmony{grid-template-columns:1fr}.bento-local .local-pulse{max-width:210px}.bento-content{min-height:460px}.bento-harmony .harmony-mini-mark{max-width:190px}.mini-browser{height:48%}
  .feature-atlas-inner{padding-left:20px;padding-right:20px}.atlas-shell{grid-template-columns:1fr;min-height:auto}.atlas-nav{flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--line-strong);padding:10px}.atlas-nav button{flex:0 0 110px;grid-template-columns:24px 1fr;min-height:54px}.atlas-nav button.is-active{transform:none}.atlas-stage{padding:34px 24px}.atlas-chips{min-height:320px}.atlas-watermark{font-size:32vw}.flow-copy{grid-template-columns:1fr;gap:22px}.flow-copy .scene-no{grid-column:auto}.feature-flow{padding-left:20px;padding-right:20px}.flow-node{width:105px}.flow-track>i{flex-basis:52px}.features-final-v5{padding:0 14px 50px}.features-final-inner{min-height:500px;padding:42px 24px;display:grid;align-content:end;border-radius:34px}.features-final-inner h2{font-size:clamp(58px,16vw,82px)}
}
@media (max-width:480px){.device-v5-tablet{width:138px}.device-v5-laptop{width:155px}.device-family-v5{gap:7px}.atlas-chips button{font-size:9px;padding:8px 10px}.feature-hero-orb.orb-b{display:none}.bento-tile{padding:24px}}
@media (prefers-reduced-motion:reduce){.feature-hero-orb,.portal-cursor-dot,.hmos-mark::before,.hmos-mark::after,.hmos-mark>i,.hmos-particle,.local-pulse::before,.local-pulse::after,.paper-wave i,.harmony-mini-mark::before,.harmony-mini-mark::after,.harmony-mini-mark i,.atlas-chips button,.flow-track>i::after,.meter-line i,.download-row i::after{animation:none!important}.bento-tile,.device-v5,.feature-portal-link,.download-row{transition:none!important}.cursor-echo{display:none!important}}

/* =========================================================
   V5.1 — baked-in Doubao watermark visual cleaner
   Keeps the video file, framing and scroll timing untouched.
   Only a feathered backdrop repair is shown while each corner
   watermark is actually present in the source video.
   ========================================================= */
.journey-watermark-cleaner{
  position:absolute;
  z-index:4;
  pointer-events:none;
  width:clamp(190px,13vw,255px);
  height:clamp(125px,8.5vw,170px);
  opacity:0;
  transition:opacity .18s linear;
  backdrop-filter:blur(18px) saturate(.84) contrast(.96);
  -webkit-backdrop-filter:blur(18px) saturate(.84) contrast(.96);
  -webkit-mask-image:radial-gradient(ellipse at 50% 50%,#000 0 43%,rgba(0,0,0,.98) 55%,rgba(0,0,0,.70) 68%,rgba(0,0,0,.25) 82%,transparent 100%);
  mask-image:radial-gradient(ellipse at 50% 50%,#000 0 43%,rgba(0,0,0,.98) 55%,rgba(0,0,0,.70) 68%,rgba(0,0,0,.25) 82%,transparent 100%);
  will-change:opacity;
}
.journey-watermark-cleaner.is-active{opacity:1}
.journey-watermark-cleaner.cleaner-tl{
  left:-18px;
  top:-10px;
  background:radial-gradient(ellipse at 48% 48%,rgba(239,248,253,.40) 0%,rgba(222,239,249,.18) 53%,transparent 82%);
}
.journey-watermark-cleaner.cleaner-br{
  right:-16px;
  bottom:-12px;
  background:radial-gradient(ellipse at 52% 52%,rgba(13,45,64,.30) 0%,rgba(16,52,70,.15) 52%,transparent 82%);
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .journey-watermark-cleaner.cleaner-tl{background:radial-gradient(ellipse at 50% 50%,rgba(233,245,251,.90) 0%,rgba(225,241,249,.72) 56%,transparent 86%)}
  .journey-watermark-cleaner.cleaner-br{background:radial-gradient(ellipse at 50% 50%,rgba(10,38,56,.88) 0%,rgba(13,45,62,.68) 56%,transparent 86%)}
}
@media (max-width:760px){
  .journey-watermark-cleaner{width:190px;height:130px;backdrop-filter:blur(16px) saturate(.86);-webkit-backdrop-filter:blur(16px) saturate(.86)}
}