@import url('./home-video.css?v=video-section2');
html.loom-loading,html.loom-loading body{overflow:hidden!important}
.loom-entry{position:fixed;inset:0;z-index:2000;display:grid;place-items:center;background:#0F0F0F;color:#FFFFFF;touch-action:none;transition:opacity .2s ease;isolation:isolate}
.loom-entry-center{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:16px;--entry-size:48px;padding:24px;max-width:round(nearest,100%,2px);box-sizing:border-box}
.loom-entry-center img{display:block;width:72px;height:40px;object-fit:contain}
.loom-entry-center p{margin:0;color:#FFFFFF;white-space:nowrap;font:400 var(--entry-size)/round(up,calc(var(--entry-size) + 8px),2px) system-ui,-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;letter-spacing:0;line-height:round(up,calc(var(--entry-size) + 8px),2px)}
.loom-entry-center span{display:inline-block;min-width:round(nearest,3.6ch,2px);font-variant-numeric:tabular-nums;text-align:left}
.loom-entry.is-leaving{opacity:0;pointer-events:none}
.loom-hero{position:relative;display:flex;align-items:center;isolation:isolate;min-height:round(nearest,100svh,2px);width:round(nearest,100%,2px);padding:140px 0 100px;overflow:hidden}
.loom-hero,.loom-hero *{box-sizing:border-box;letter-spacing:0!important}
.loom-hero>.blue-code-flow{z-index:-1}
.loom-hero-inner{width:round(nearest,min(1440px,calc(100% - 112px)),2px);margin-inline:auto;display:grid;grid-template-columns:minmax(280px,.78fr) minmax(0,1.65fr);gap:48px;align-items:center}
.loom-hero-copy{position:relative;z-index:1;min-width:0}
.loom-hero-copy h1{margin:0;color:#FFFFFF;--ui-font-size:clamp(32px,3.2vw,52px);font-family:"PingFang SC",sans-serif;font-weight:500;font-size:var(--ui-font-size);line-height:round(up,calc(var(--ui-font-size) + 8px),2px);text-wrap:balance}
.loom-hero-copy p{margin:28px 0 40px;color:#D2D5D9;font:400 20px/28px "PingFang SC",sans-serif;line-height:28px}
.loom-hero-apply{width:180px;min-height:52px}
.loom-hero-interface{position:relative;min-width:0;aspect-ratio:16/9;background:#0F0F0F;box-shadow:0 24px 64px rgba(15,15,15,.4)}
.loom-hero-interface img{display:block;width:round(nearest,100%,2px);height:auto;aspect-ratio:16/9;object-fit:contain}
@media(width>=1800px){.loom-hero-inner{gap:64px}.loom-hero-copy h1{font-size:58px;line-height:66px}}
@media(768px<=width<1200px){.loom-hero-inner{width:round(nearest,calc(100% - 80px),2px);gap:32px;grid-template-columns:minmax(240px,.85fr) minmax(0,1.4fr)}.loom-hero-copy h1{font-size:36px;line-height:44px}.loom-hero-copy p{font-size:17px;margin:24px 0 32px;line-height:26px}}
@media(width<768px){.loom-hero{padding:120px 0 72px;min-height:round(nearest,100svh,2px)}.loom-hero-inner{width:round(nearest,calc(100% - 40px),2px);grid-template-columns:minmax(0,1fr);gap:44px}.loom-hero-copy{text-align:center;max-width:520px;margin-inline:auto}.loom-hero-copy h1{--ui-font-size:clamp(28px,6.5vw,38px);font-size:var(--ui-font-size);line-height:round(up,calc(var(--ui-font-size) + 8px),2px)}.loom-hero-copy p{font-size:16px;margin:20px 0 28px;line-height:24px}.loom-hero-apply{margin-inline:auto;width:168px;min-height:48px}}
@media(prefers-reduced-motion:reduce){.loom-entry{transition:none}}
.loom-entry{display:none}
html.loom-loading .loom-entry,.loom-entry.is-leaving{display:grid}
.intro-stage .intro-first-layer>.loom-hero{height:auto!important;min-height:round(nearest,100svh,2px)!important}

/* 首屏文案与界面预览按视口高度分区，避免大屏提前露出整张界面。 */
.intro-stage .intro-first-layer>.loom-hero{display:block;padding:0;min-height:round(nearest,100svh,2px)!important;height:round(nearest,100svh,2px)!important;overflow:hidden}
.loom-hero-inner{position:relative;display:block;height:100%;width:100%;max-width:none}
.loom-hero-copy{position:absolute;top:var(--hero-copy-top,96px);left:50%;transform:translateX(-50%) scale(var(--hero-scale,1));transform-origin:top center;width:1100px;max-width:none;text-align:center;margin:0}
.loom-hero-copy h1{--ui-font-size:var(--hero-title-size,64px);font-size:var(--ui-font-size);white-space:nowrap;line-height:calc(var(--ui-font-size) + 8px)}
.loom-hero-copy p{margin:28px 0 36px;font-size:24px;line-height:32px}
.loom-hero-apply{margin-inline:auto;width:180px;min-height:52px;padding:12px 20px;gap:12px;font-size:16px;line-height:24px;white-space:nowrap}
.loom-hero-apply{background:#FFFFFF}
.loom-hero-interface{width:round(nearest,100%,2px);max-width:1200px;flex:none;isolation:isolate;background:rgba(15,15,15,.12);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 0 72px 16px rgba(38,147,255,calc(.15 * var(--interface-effects-opacity,1)));overflow:visible!important;clip-path:none!important;border-radius:24px}
.loom-hero-interface img{position:relative;z-index:1;border-radius:24px;border:0;box-shadow:none;mask-image:linear-gradient(to bottom,#000 0%,#000 var(--transfer-solid,40%),transparent var(--transfer-end,92%));-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 var(--transfer-solid,40%),transparent var(--transfer-end,92%))}
.loom-hero-interface::before{content:none}
.loom-hero-interface::after{content:"";position:absolute;inset:0;z-index:3;border:6px solid rgba(255,255,255,.07);outline:1px solid rgba(255,255,255,.30);border-radius:24px;pointer-events:none;opacity:var(--interface-effects-opacity,1);will-change:opacity}
.loom-interface-lights,.loom-interface-inner-light{position:absolute;inset:0;pointer-events:none;opacity:var(--interface-effects-opacity,1);will-change:opacity}
.loom-interface-lights{z-index:4;overflow:visible}
.loom-interface-inner-light{z-index:2;overflow:hidden}
.loom-edge-stroke{position:absolute;inset:0;display:block;width:100%;height:100%;overflow:visible}
.loom-edge-stroke-outer{filter:drop-shadow(0 0 8px rgba(38,147,255,.60)) drop-shadow(0 0 32px rgba(38,147,255,.15))}
.loom-edge-stroke-inner{filter:drop-shadow(0 0 16px rgba(38,147,255,.45)) drop-shadow(0 0 64px rgba(38,147,255,.30)) drop-shadow(0 0 112px rgba(38,147,255,.15))}

.loom-entry-center span{font-family:inherit;--ui-font-size:1em;font-size:var(--ui-font-size);min-width:round(nearest,4.1ch,2px);line-height:round(up,calc(var(--ui-font-size) + 8px),2px)}

/* Both views share one sticky composition; the entire composition leaves in normal flow. */
.intro-stage.has-scroll-transition{height:var(--intro-stage-height,200svh)!important}
.intro-scroll-pin{position:relative;top:0;height:var(--intro-pin-height,100svh);width:100%;overflow:clip;isolation:isolate}
.intro-scroll-pin>.intro-first-layer{position:absolute!important;inset:0 0 auto!important}
.intro-scroll-pin>.intro-second-layer{position:absolute!important;inset:144px 0 auto!important;pointer-events:none}
.intro-scroll-pin .intro-second-layer [data-figma-node-id="14732:6096"]{opacity:0;pointer-events:auto;will-change:opacity}
.loom-hero-copy{will-change:opacity}
.loom-hero-interface-placeholder{position:absolute;top:var(--hero-preview-top,calc(100% - 32svh));left:50%;transform:translateX(-50%);width:round(nearest,62.5vw,2px);max-width:none;aspect-ratio:16/9}
#product-view-panel.is-transfer-destination{opacity:0!important;pointer-events:none}
.intro-scroll-pin>.loom-interface-transfer{position:absolute!important;z-index:3;max-width:none!important;margin:0!important;pointer-events:none;aspect-ratio:16/9;transform-origin:top left;will-change:transform;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none}
.loom-interface-transfer img{width:100%;height:100%;object-fit:fill}
.intro-scroll-pin>.blue-code-flow{position:absolute;inset:0 0 auto;height:100svh;z-index:0;will-change:opacity}
.intro-scroll-pin>.blue-code-flow,.intro-scroll-pin>.blue-code-flow .blue-code-ambient{mask-image:none;-webkit-mask-image:none}
#figma-page .product-view-tab{box-sizing:border-box;padding-inline:16px!important;min-width:max-content!important;white-space:nowrap!important}
#figma-page .product-view-tab .figma-text-node{width:auto!important;min-width:max-content!important;max-width:none!important;flex-shrink:0!important;white-space:nowrap!important}
#figma-page .product-view-tab .figma-text-node span{white-space:nowrap!important}

/* 统一暗底上的局部氛围光，跨越内容区边界。 */
#figma-page.home-continuous-background{position:relative;isolation:isolate;background-color:#0F0F0F!important}
.home-continuous-background::before{content:none}
.home-continuous-surface{background-color:transparent!important;--noise-underlay:none!important}



.loom-entry-center{transform:translateY(24px)}

.loom-entry-center p{font-size:40px;font-weight:700;line-height:48px}
.loom-entry-center span{font-size:40px;line-height:48px;min-width:100px}
@media(width<768px){.loom-entry-center{--entry-size:28px;gap:12px}.loom-entry-center img{width:48px;height:28px}.loom-entry-center p,.loom-entry-center span{font-size:28px;line-height:36px}.loom-entry-center span{min-width:72px}}


.loom-interface-transfer img.loom-product-return-layer{position:absolute;inset:0;opacity:0;visibility:hidden;pointer-events:none;will-change:opacity}


#figma-page [data-figma-node-id="14737:11442"]{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}

#product [data-figma-node-id="14210:9035"],
#product [data-figma-node-id="14210:9035"] span{white-space:nowrap!important;text-wrap:nowrap!important;overflow-wrap:normal!important}
@media(width<768px){#product [data-figma-node-id="14210:9035"],#product [data-figma-node-id="14210:9035"] span{font-size:clamp(18px,5.5vw,28px)!important;line-height:round(up,calc(clamp(18px,5.5vw,28px) + 8px),2px)!important}}

.loom-hero-apply.trial-button{background:#FFFFFF;transition:background-color .45s ease}
.loom-hero-apply.trial-button .trial-button-label{color:#18191A;text-shadow:none;transition:color .45s ease,text-shadow .45s ease}
@media(hover:hover) and (pointer:fine){
 .trial-button-shell:has(.loom-hero-apply:hover){transform:none;filter:drop-shadow(0 0 5px rgba(0,140,255,.90)) drop-shadow(0 0 18px rgba(0,140,255,.60)) drop-shadow(0 0 40px rgba(0,140,255,.30))}
 .trial-button-shell:has(.loom-hero-apply:active){transform:none}
}
.loom-hero-apply.trial-button:is(:hover,:focus-visible){background:#008CFF}
.loom-hero-apply.trial-button:is(:hover,:focus-visible) .trial-button-label{color:#FFFFFF;text-shadow:0 0 5px #FFFFFF,0 0 12px rgba(255,255,255,.75),0 0 24px rgba(255,255,255,.45)}
.loom-hero-apply.trial-button:focus-visible{--smooth-focus-color:#FFFFFF}
.trial-button-shell:has(.loom-hero-apply:focus-visible){transform:none;filter:drop-shadow(0 0 5px rgba(0,140,255,.90)) drop-shadow(0 0 18px rgba(0,140,255,.60)) drop-shadow(0 0 40px rgba(0,140,255,.30))}
@media(prefers-reduced-motion:reduce){.loom-hero-apply.trial-button,.loom-hero-apply.trial-button .trial-button-label{transition:none!important}.trial-button-shell:has(.loom-hero-apply:is(:hover,:focus-visible)){transform:none}}

/* Reduce character contrast behind navigation while preserving the ambient brightness. */
.intro-scroll-pin>.blue-code-flow canvas{mask-image:linear-gradient(to bottom,rgba(0,0,0,.15) 0,rgba(0,0,0,.15) 64px,rgba(0,0,0,.45) 80px,#000 112px);-webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.15) 0,rgba(0,0,0,.15) 64px,rgba(0,0,0,.45) 80px,#000 112px)}

/* 首屏「申请使用」：默认线框按钮；hover 变白底黑字并加白色外发光 */
.loom-hero-apply.trial-button{background:transparent!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.55);transition:background-color .2s ease,box-shadow .2s ease}
.loom-hero-apply.trial-button .trial-button-label{color:#FFFFFF!important;text-shadow:none!important;transition:color .2s ease}
.loom-hero-apply.trial-button:is(:hover,:focus-visible){background:#FFFFFF!important;box-shadow:inset 0 0 0 1px #FFFFFF}
.loom-hero-apply.trial-button:is(:hover,:focus-visible) .trial-button-label{color:#18191A!important;text-shadow:none!important}
.trial-button-shell:has(.loom-hero-apply:is(:hover,:focus-visible)){transform:none!important;filter:drop-shadow(0 0 14px rgba(255,255,255,.45)) drop-shadow(0 0 36px rgba(255,255,255,.22))!important}
@media(prefers-reduced-motion:reduce){.loom-hero-apply.trial-button,.loom-hero-apply.trial-button .trial-button-label{transition:none!important}}

/* Crossfade a cached solid layer instead of repainting the large image mask on every scroll frame. */
.loom-interface-transfer img.loom-interface-solid{position:absolute;inset:0;opacity:0;mask-image:none!important;-webkit-mask-image:none!important;pointer-events:none;will-change:opacity}