/* Mycel homepage: a self-contained dark product narrative. */
.mycel-home { --home-bg:#08090b; --home-panel:#101216; --home-panel-2:#15171c; --home-line:rgba(255,255,255,.12); --home-fg:#f4f3ef; --home-muted:#a4a5a8; --home-dim:#6f7278; --home-lime:#ceff45; --home-orange:#ffa760; background:var(--home-bg); color:var(--home-fg); font-family:Inter,MiSans,"PingFang SC","Hiragino Sans GB",system-ui,sans-serif; line-height:1.5; letter-spacing:-.015em; }
.mycel-home body::before { content:none; } .mycel-home .site-shell { max-width:1440px; margin:0 auto; overflow:hidden; background:var(--home-bg); } .mycel-home a { color:inherit; } .mycel-home * { box-sizing:border-box; }
.home-nav { height:68px; padding:0 clamp(16px,4.72vw,68px); display:flex; align-items:center; justify-content:space-between; gap:24px; border-bottom:1px solid var(--home-line); position:relative; z-index:4; }
.home-brand { display:inline-flex; align-items:center; gap:9px; color:var(--home-fg); font-size:17px; font-weight:700; letter-spacing:-.05em; white-space:nowrap; } .home-brand img { border-radius:7px; } .home-nav-links,.home-nav-actions { display:flex; align-items:center; gap:24px; } .home-nav-links a,.home-lang { color:var(--home-muted); font-size:13px; font-weight:550; transition:color .2s ease; } .home-nav-links a:hover,.home-lang:hover { color:var(--home-fg); } .home-nav-actions { gap:10px; }
.home-button { min-height:36px; display:inline-flex; align-items:center; justify-content:center; gap:8px; border:1px solid transparent; border-radius:7px; padding:0 13px; color:var(--home-fg); font-size:12px; font-weight:700; letter-spacing:-.01em; transition:transform .2s ease,background .2s ease,border-color .2s ease; } .home-button:hover { transform:translateY(-1px); } .home-button--quiet { border-color:var(--home-line); color:var(--home-muted); } .home-button--quiet:hover { color:var(--home-fg); border-color:rgba(255,255,255,.28); } .mycel-home .home-button--light { background:var(--home-fg); color:#111216; } .mycel-home .home-button--light:hover { background:#fff; color:#111216; } .home-button--large { min-height:49px; padding:0 17px; font-size:14px; }
.hero-section { min-height:calc(88svh - 64px); display:grid; grid-template-columns:minmax(0,.93fr) minmax(540px,1.07fr); gap:48px; align-items:center; padding:82px 68px 92px; position:relative; background:radial-gradient(600px 450px at 83% 43%,rgba(163,255,77,.09),transparent 68%); } .hero-section:after { content:""; position:absolute; width:480px; height:480px; left:-300px; top:70px; border:1px solid rgba(255,255,255,.04); border-radius:50%; box-shadow:0 0 0 80px rgba(255,255,255,.018),0 0 0 160px rgba(255,255,255,.012); pointer-events:none; }.hero-canvas { position:absolute; inset:0; width:100%; height:100%; z-index:0; pointer-events:none; opacity:.85; mask-image:linear-gradient(90deg,transparent 24%,#000 45%,#000 93%,transparent); }
.hero-copy { position:relative; z-index:1; } .kicker,.eyebrow { display:flex; align-items:center; gap:8px; margin:0 0 20px; color:#c4c6c8; font-family:"JetBrains Mono","SFMono-Regular",monospace; font-size:10px; font-weight:600; letter-spacing:.075em; text-transform:uppercase; } .status-dot { width:7px; height:7px; border-radius:50%; background:var(--home-lime); box-shadow:0 0 0 4px rgba(206,255,69,.11); }
.hero-copy h1 { margin:0; color:var(--home-fg); font-size:clamp(48px,4.4vw,69px); font-weight:600; line-height:1.035; letter-spacing:-.068em; } .hero-copy h1 strong { color:var(--home-lime); font-weight:inherit; } .hero-lead { max-width:510px; margin:27px 0 30px; color:var(--home-muted); font-size:16px; line-height:1.7; letter-spacing:-.018em; } .hero-actions { display:flex; align-items:center; gap:25px; flex-wrap:wrap; } .home-text-link { display:inline-flex; align-items:center; gap:7px; color:#d9dad9; font-size:13px; font-weight:650; transition:color .2s ease; } .home-text-link:hover { color:var(--home-lime); } .home-text-link span { color:var(--home-lime); font-size:16px; } .hero-proof { display:flex; flex-wrap:wrap; gap:9px 19px; margin-top:35px; color:var(--home-dim); font-size:11px; font-weight:600; } .hero-proof span:before { content:"✓"; margin-right:6px; color:var(--home-lime); }
.hero-product { position:relative; z-index:1; overflow:hidden; border:1px solid rgba(255,255,255,.16); border-radius:10px; background:#101216; box-shadow:0 36px 90px rgba(0,0,0,.45),0 0 90px rgba(206,255,69,.05); transform:perspective(1600px) rotateY(-3deg) rotateX(1deg); } .window-titlebar { height:35px; display:flex; align-items:center; gap:6px; padding:0 12px; border-bottom:1px solid var(--home-line); background:#15171b; color:#767a80; font-family:"JetBrains Mono",monospace; font-size:9px; } .window-titlebar span { width:7px; height:7px; border-radius:50%; background:#4a4d52; } .window-titlebar span:nth-child(1) { background:#f27772; }.window-titlebar span:nth-child(2){background:#edc75e}.window-titlebar span:nth-child(3){background:#7acb78}.window-titlebar p { margin:0 auto; transform:translateX(26px); } .window-titlebar i { color:#7e8187; font-style:normal; }
.product-layout { min-height:271px; display:grid; grid-template-columns:148px 1fr; } .product-sidebar { padding:10px 9px; border-right:1px solid var(--home-line); background:#0d0f12; color:#74787e; font-size:8px; } .side-brand { display:flex; align-items:center; gap:6px; margin:0 4px 10px; color:#e0e2e1; font-size:10px; font-weight:700; }.side-brand img{border-radius:4px}.product-sidebar p { margin:9px 5px 4px; color:#55595f; font-size:7px; text-transform:uppercase; letter-spacing:.06em; }.product-sidebar b { display:flex; align-items:center; gap:5px; padding:4px 5px; border-radius:4px; font-weight:500; }.product-sidebar b.active { background:#293324; color:#e3f0c8; }.product-sidebar em { margin-left:auto; padding:0 4px; border-radius:6px; color:#c4f85c; background:#45542c; font-style:normal; font-size:8px; }
.proposal-panel { padding:16px 20px; }.panel-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }.panel-head small { color:#b8dd63; font-family:"JetBrains Mono",monospace; font-size:7px; letter-spacing:.08em; }.panel-head h2 { margin:5px 0 0; color:#eff0ed; font-size:16px; font-weight:600; letter-spacing:-.045em; line-height:1.15; }.review-badge { flex:none; padding:4px 6px; border:1px solid rgba(255,167,96,.4); border-radius:4px; color:#ffba83; background:rgba(255,167,96,.08); font-size:7px; }.proposal-summary { max-width:470px; margin:8px 0 10px; color:#878b91; font-size:8px; line-height:1.4; }.diff-view { overflow:hidden; border:1px solid rgba(255,255,255,.08); border-radius:6px; background:#0d0f11; font-family:"JetBrains Mono",monospace; font-size:8px; }.diff-line { display:grid; grid-template-columns:27px 1fr; min-height:18px; align-items:center; color:#c4c8c8; }.diff-line code { height:100%; display:flex; align-items:center; justify-content:center; border-right:1px solid rgba(255,255,255,.06); color:#565b61; font-size:7px; }.diff-line span { padding:0 8px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.diff-line.add { background:rgba(105,180,104,.14); color:#bfe1bd; }.diff-line.remove { background:rgba(220,100,100,.11); color:#ce9a9a; text-decoration:line-through; }.proposal-foot { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:9px; color:#747980; font-size:7px; }.proposal-foot>span i { display:inline-block; width:5px; height:5px; margin-right:5px; border-radius:50%; background:#92d581; }.proposal-foot div { display:flex; gap:5px; }.proposal-foot button { padding:5px 7px; border:1px solid rgba(255,255,255,.14); border-radius:4px; background:#17191d; color:#b9bcbe; font:600 7px Inter,sans-serif; }.proposal-foot .approve { border-color:#b9e557; background:#caff4a; color:#151708; }
.trust-row { min-height:67px; display:flex; align-items:center; justify-content:space-around; gap:25px; padding:0 40px; border-top:1px solid var(--home-line); border-bottom:1px solid var(--home-line); color:#8c8e93; font-family:"JetBrains Mono",monospace; font-size:10px; white-space:nowrap; }
.intro-section,.growth-section { padding:142px 68px; }.section-heading { max-width:550px; }.section-heading--center { max-width:670px; margin:0 auto 70px; text-align:center; }.section-heading--center .eyebrow { justify-content:center; }.eyebrow { color:#aeb0b1; }.section-heading h2,.section-copy h2,.capture-copy h2,.ownership-copy h2,.mcp-content h2,.final-cta h2 { margin:0; color:#f1f1ee; font-size:clamp(34px,3.2vw,52px); font-weight:600; line-height:1.04; letter-spacing:-.064em; }.section-heading>p:last-child,.section-copy>p,.capture-copy>p,.ownership-copy>p,.mcp-content>p,.final-cta>p { margin:21px 0 0; color:var(--home-muted); font-size:15px; line-height:1.72; }
.capability-grid { display:grid; grid-template-columns:1.16fr .92fr .92fr; gap:16px; }.capability-card { min-height:420px; position:relative; overflow:hidden; padding:28px; border:1px solid var(--home-line); border-radius:10px; background:linear-gradient(145deg,#15171c,#0e1013); }.capability-card--large { min-height:485px; }.card-icon,.growth-icon { display:flex; width:33px; height:33px; align-items:center; justify-content:center; border:1px solid rgba(206,255,69,.42); border-radius:7px; color:var(--home-lime); background:rgba(206,255,69,.08); font-family:"JetBrains Mono",monospace; }.card-overline { margin:19px 0 8px; color:#8f9294; font-family:"JetBrains Mono",monospace; font-size:9px; letter-spacing:.085em; }.capability-card h3 { margin:0; max-width:410px; color:#ededeb; font-size:24px; font-weight:600; line-height:1.15; letter-spacing:-.047em; }.capability-card>p:not(.card-overline) { max-width:410px; margin:14px 0; color:#95989c; font-size:12px; line-height:1.7; }.search-demo { position:absolute; right:22px; bottom:110px; left:22px; display:flex; align-items:center; gap:10px; padding:13px; border:1px solid rgba(255,255,255,.14); border-radius:8px; background:#0d0f12; box-shadow:0 18px 45px rgba(0,0,0,.35); }.search-demo span { color:var(--home-lime); font-size:17px; }.search-demo p { flex:1; margin:0; color:#d6d8d7; font-size:11px; }.search-demo kbd { padding:3px 5px; border:1px solid rgba(255,255,255,.15); border-radius:3px; color:#868a8d; font:9px "JetBrains Mono",monospace; }.search-result { position:absolute; right:35px; bottom:27px; left:35px; display:grid; grid-template-columns:auto 1fr auto; gap:10px; align-items:start; padding:11px; border-radius:6px; background:#20241c; }.search-result>span { padding:3px 5px; border-radius:3px; color:#bce767; background:#3a4a25; font-size:8px; }.search-result b { display:block; color:#d9ded4; font-size:10px; }.search-result p { margin:3px 0 0; color:#8f958b; font-size:9px; }.search-result em { color:#c1f163; font-style:normal; font-size:9px; }
.galaxy-demo { position:absolute; right:0; bottom:0; left:0; height:205px; overflow:hidden; cursor:crosshair; background:radial-gradient(circle at 58% 52%,rgba(206,255,69,.16),transparent 30%),linear-gradient(135deg,rgba(0,0,0,.1),rgba(69,91,40,.12)); }.galaxy-demo:before { content:""; position:absolute; inset:0; pointer-events:none; background:repeating-linear-gradient(0deg,transparent 0 28px,rgba(200,255,154,.035) 29px),repeating-linear-gradient(90deg,transparent 0 28px,rgba(200,255,154,.03) 29px); mask-image:linear-gradient(90deg,transparent,#000 20%,#000 82%,transparent); }.galaxy-canvas { position:absolute; inset:0; width:100%; height:100%; }.galaxy-label { position:absolute; z-index:1; color:#d5e9b2; font:600 9px "JetBrains Mono",monospace; pointer-events:none; }.galaxy-label--core { left:59%; top:24%; color:#e4ff91; }.galaxy-label--left { left:22%; top:52%; color:#b1bd9f; line-height:1.1; }.galaxy-event { position:absolute; z-index:1; right:17px; bottom:14px; padding:5px 7px; border:1px solid rgba(206,255,69,.31); border-radius:4px; color:#d5f58c; background:rgba(30,42,18,.78); font:8px "JetBrains Mono",monospace; animation:mycel-galaxy-event 3.1s ease-in-out infinite; pointer-events:none; }.galaxy-hint { position:absolute; left:16px; bottom:15px; color:#777f73; font:8px "JetBrains Mono",monospace; opacity:.8; transition:color .2s ease; pointer-events:none; }.galaxy-demo:hover .galaxy-hint { color:#d1eb9b; }.source-demo { position:absolute; right:22px; bottom:23px; left:22px; overflow:hidden; border:1px solid rgba(255,255,255,.12); border-radius:7px; background:#0d0f12; color:#aeb1b3; font:10px "JetBrains Mono",monospace; }.source-demo div { display:flex; gap:13px; padding:10px 12px; border-bottom:1px solid rgba(255,255,255,.08); color:#676b71; }.source-demo div span:first-child { color:#cbf668; }.source-demo p,.source-demo b { display:block; margin:0; padding:5px 12px; }.source-demo mark { color:#d6f99b; background:transparent; }
.feature-split { display:grid; grid-template-columns:.82fr 1.18fr; gap:60px; align-items:center; padding:130px 68px; border-top:1px solid var(--home-line); }.section-copy { max-width:440px; }.section-copy .home-text-link { margin-top:30px; }.shot-composition { min-height:450px; position:relative; display:flex; align-items:center; justify-content:center; }.shot-composition img { position:relative; z-index:1; width:100%; border:1px solid rgba(255,255,255,.17); border-radius:9px; box-shadow:0 30px 75px rgba(0,0,0,.45); }.shot-glow { position:absolute; width:75%; height:70%; border-radius:50%; background:rgba(206,255,69,.09); filter:blur(65px); }.callout { position:absolute; z-index:2; display:flex; align-items:flex-start; gap:9px; max-width:166px; padding:9px; border:1px solid rgba(255,255,255,.17); border-radius:5px; background:rgba(15,17,20,.92); box-shadow:0 12px 27px rgba(0,0,0,.37); }.callout span { color:var(--home-lime); font:9px "JetBrains Mono",monospace; }.callout p { margin:0; color:#aaadaf; font-size:9px; line-height:1.45; }.callout b { color:#eceeeb; }.callout--one { top:9%; left:-27px; }.callout--two { right:-22px; bottom:10%; }
.capture-section { display:grid; grid-template-columns:1.08fr .92fr; align-items:center; gap:82px; padding:130px 68px; }.capture-image { overflow:hidden; border-radius:9px; background:#e8e6df; box-shadow:0 24px 60px rgba(0,0,0,.4); }.capture-image img { display:block; width:100%; min-height:370px; object-fit:cover; object-position:left center; }.capture-copy { max-width:440px; }.feature-list { margin:28px 0 0; padding:0; list-style:none; }.feature-list li { display:flex; gap:14px; padding:13px 0; border-top:1px solid var(--home-line); color:#d3d4d1; font-size:13px; font-weight:500; }.feature-list span { color:var(--home-lime); font:10px "JetBrains Mono",monospace; }
.growth-section { border-top:1px solid var(--home-line); }.growth-section .section-heading { margin-bottom:64px; }.growth-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; border:1px solid var(--home-line); border-radius:9px; overflow:hidden; background:var(--home-line); }.growth-grid article { min-height:285px; position:relative; padding:28px; background:#101216; transition:background .25s ease; }.growth-grid article:hover { background:#171b17; }.growth-index { position:absolute; right:25px; top:27px; color:#5c6064; font:10px "JetBrains Mono",monospace; }.growth-grid h3 { margin:22px 0 9px; color:#eff0ed; font-size:20px; letter-spacing:-.045em; }.growth-grid p { max-width:275px; margin:0; color:#96999d; font-size:12px; line-height:1.7; }
.mcp-section { min-height:630px; position:relative; display:flex; align-items:center; justify-content:center; overflow:hidden; padding:80px 30px; border-top:1px solid var(--home-line); text-align:center; }.mcp-background { position:absolute; inset:0; opacity:.74; background:radial-gradient(ellipse at 50% 37%,rgba(79,119,45,.25),transparent 30%),linear-gradient(180deg,rgba(0,0,0,.1),rgba(0,0,0,.7)),repeating-linear-gradient(0deg,transparent 0 48px,rgba(255,255,255,.027) 49px 50px),repeating-linear-gradient(90deg,transparent 0 48px,rgba(255,255,255,.027) 49px 50px); }.mcp-content { position:relative; z-index:1; max-width:680px; }.mcp-content .eyebrow { justify-content:center; }.mcp-content>p { max-width:570px; margin-right:auto; margin-left:auto; }.terminal-card { margin:36px auto 25px; overflow:hidden; border:1px solid rgba(255,255,255,.18); border-radius:10px; background:rgba(13,15,16,.82); box-shadow:0 22px 65px rgba(0,0,0,.45); text-align:left; font:11px "JetBrains Mono",monospace; }.terminal-card div { padding:17px 20px; color:#e5e7e3; border-bottom:1px solid rgba(255,255,255,.08); }.terminal-prompt { margin-right:10px; color:var(--home-lime); }.terminal-card p,.terminal-card b { display:block; margin:0; padding:13px 20px; color:#989c9c; font-size:10px; font-weight:400; }.terminal-card p i { margin-right:8px; color:var(--home-lime); font-style:normal; }.terminal-card b { color:#c9d1c2; background:rgba(184,242,73,.07); }.terminal-card b span { margin-right:8px; color:var(--home-lime); }
.ownership-section { display:grid; grid-template-columns:.85fr 1.15fr; align-items:center; gap:75px; padding:140px 68px; }.ownership-copy { max-width:440px; }.ownership-window { overflow:hidden; border:1px solid rgba(255,255,255,.16); border-radius:9px; background:#111317; box-shadow:0 25px 60px rgba(0,0,0,.4); }.file-tree { display:grid; grid-template-columns:160px 1fr; min-height:310px; }.file-tree aside { display:flex; flex-direction:column; gap:3px; padding:16px 9px; border-right:1px solid var(--home-line); color:#7e8287; font:9px "JetBrains Mono",monospace; }.file-tree aside b { margin:0 2px 8px; color:#afb1b3; }.file-tree aside span { padding:6px 5px; border-radius:4px; }.file-tree aside .selected { color:#d6e9b4; background:#293323; }.file-tree article { padding:23px 27px; color:#979b9e; }.file-tree article small { color:#71767b; font:9px "JetBrains Mono",monospace; }.file-tree article h3 { margin:21px 0 11px; color:#e6e7e3; font:600 20px "JetBrains Mono",monospace; letter-spacing:-.06em; }.file-tree article p,.file-tree article li { font:11px "JetBrains Mono",monospace; line-height:1.65; }.file-tree article ul { padding-left:20px; color:#d4e6bb; }
.final-cta { padding:142px 30px; border-top:1px solid var(--home-line); background:radial-gradient(600px 360px at 50% 50%,rgba(206,255,69,.12),transparent 72%); text-align:center; }.final-cta .eyebrow { justify-content:center; }.final-cta>p { margin-right:auto; margin-left:auto; }.final-cta .hero-actions { justify-content:center; margin-top:31px; }.home-footer { position:relative; display:grid; grid-template-columns:1fr auto; gap:80px; padding:58px 68px 24px; border-top:1px solid var(--home-line); }.footer-brand p { margin:15px 0 0; color:#81858a; font-size:12px; line-height:1.65; }.footer-links { display:flex; gap:80px; }.footer-links div { display:flex; flex-direction:column; gap:11px; min-width:80px; }.footer-links b { margin-bottom:4px; color:#d5d6d4; font-size:11px; }.footer-links a { color:#85898e; font-size:11px; transition:color .2s ease; }.footer-links a:hover { color:var(--home-lime); }.footer-bottom { grid-column:1/-1; display:flex; gap:18px; margin-top:28px; padding-top:18px; border-top:1px solid var(--home-line); color:#666a70; font-size:10px; }.footer-bottom a:last-child { margin-left:auto; }
@media (max-width:1000px) { .hero-section { grid-template-columns:1fr; padding:76px 42px; }.hero-product { max-width:720px; }.home-nav-links { display:none; }.capability-grid { grid-template-columns:1fr 1fr; }.capability-card--large { grid-column:1/-1; }.feature-split,.capture-section,.ownership-section { gap:42px; padding-right:42px; padding-left:42px; }.feature-split { grid-template-columns:1fr; }.capture-section { grid-template-columns:1fr; }.capture-copy { max-width:600px; }.ownership-section { grid-template-columns:1fr; }.ownership-copy { max-width:560px; }.intro-section,.growth-section { padding-right:42px; padding-left:42px; } }
@media (max-width:660px) { .home-nav { height:66px; padding:0 17px; }.home-nav-actions { gap:7px; }.home-nav-actions .home-button--quiet { display:none; }.home-lang { padding:8px 5px; }.home-button { min-height:34px; padding:0 10px; font-size:11px; }.hero-section { min-height:0; gap:47px; padding:68px 20px 62px; }.hero-copy h1 { font-size:45px; }.hero-lead { font-size:14px; }.hero-actions { align-items:flex-start; flex-direction:column; gap:18px; }.hero-product { width:calc(100% + 16px); margin-left:-8px; transform:none; }.product-layout { grid-template-columns:1fr; }.product-sidebar { display:none; }.proposal-panel { padding:19px 16px; }.panel-head h2 { font-size:16px; }.review-badge { display:none; }.proposal-summary { font-size:9px; }.proposal-foot>span { display:none; }.proposal-foot { justify-content:flex-end; }.trust-row { justify-content:flex-start; overflow:auto; padding:0 20px; font-size:9px; }.intro-section,.growth-section { padding:89px 20px; }.section-heading--center { margin-bottom:43px; }.section-heading h2,.section-copy h2,.capture-copy h2,.ownership-copy h2,.mcp-content h2,.final-cta h2 { font-size:35px; }.section-heading>p:last-child,.section-copy>p,.capture-copy>p,.ownership-copy>p,.mcp-content>p,.final-cta>p { font-size:13px; }.capability-grid { grid-template-columns:1fr; }.capability-card--large { grid-column:auto; }.capability-card,.capability-card--large { min-height:380px; padding:22px; }.capability-card h3 { font-size:22px; }.feature-split,.capture-section,.ownership-section { padding:89px 20px; }.shot-composition { min-height:300px; }.callout { display:none; }.capture-image img { min-height:280px; }.growth-grid { grid-template-columns:1fr; }.growth-grid article { min-height:215px; }.mcp-section { min-height:560px; padding:70px 20px; }.terminal-card { font-size:9px; }.ownership-window { margin:0 -5px; }.file-tree { grid-template-columns:1fr; }.file-tree aside { display:none; }.file-tree article { min-height:280px; padding:22px; }.final-cta { padding:95px 20px; }.home-footer { grid-template-columns:1fr; gap:35px; padding:45px 20px 20px; }.footer-links { gap:55px; }.footer-bottom { flex-wrap:wrap; }.footer-bottom a:last-child { margin-left:0; } }

/* Motion system: source-like pacing, implemented with Mycel's own product states. */
.home-nav--enter > * { opacity:0; filter:blur(5px); transform:translateY(-6px); animation:mycel-nav-in .68s cubic-bezier(.22,1,.36,1) both; }
.home-nav--enter > :nth-child(1) { animation-delay:.02s; }.home-nav--enter > :nth-child(2) { animation-delay:.13s; }.home-nav--enter > :nth-child(3) { animation-delay:.27s; }
.hero-copy { animation:mycel-copy-in .9s cubic-bezier(.22,1,.36,1) .16s both; }.hero-deck { position:relative; z-index:1; isolation:isolate; }.hero-deck::before,.hero-deck::after { content:""; position:absolute; inset:19px -8px -19px 8px; z-index:-2; border:1px solid rgba(255,255,255,.08); border-radius:10px; background:#0d0f12; opacity:.62; pointer-events:none; animation:mycel-deck-layer-one 2.8s cubic-bezier(.45,0,.55,1) infinite, mycel-deck-float 5.6s ease-in-out infinite; }.hero-deck::after { inset:10px -4px -10px 4px; z-index:-1; background:#16191a; opacity:.85; animation:mycel-deck-layer-two 2.8s cubic-bezier(.45,0,.55,1) infinite, mycel-deck-float 5.6s ease-in-out -.9s infinite; }.hero-product { position:relative; transform:perspective(1600px) rotateY(-3deg) rotateX(1deg); }.hero-deck:hover::before,.hero-deck:hover::after { animation-play-state:paused; }.hero-deck:hover::after { box-shadow:0 0 0 1px rgba(206,255,69,.18); }.hero-deck:focus-within::before,.hero-deck:focus-within::after { animation-play-state:paused; }
.hero-product .proposal-panel { transition:background .25s ease; }.hero-product.is-approved .proposal-panel { background:linear-gradient(135deg,rgba(154,224,85,.10),transparent 45%); }.hero-product.is-approved .approve { border-color:#8fbd42; background:#9ed84b; }.proposal-foot button { cursor:pointer; transition:transform .15s ease,background .15s ease,color .15s ease; }.proposal-foot button:not(:disabled):hover { transform:translateY(-1px); background:#272c30; color:#fff; }.proposal-foot .approve:not(:disabled):hover { background:#d8ff6d; color:#111; }.proposal-foot button:disabled { cursor:default; opacity:.95; }.diff-view { position:relative; max-height:125px; transition:max-height .44s cubic-bezier(.22,1,.36,1); }.hero-product.show-details .diff-view { max-height:182px; }.hero-product.show-details .diff-view::after { content:"06  + 为每次关键决策补充来源与回滚入口"; display:block; padding:7px 9px 7px 40px; color:#bfe1bd; background:rgba(105,180,104,.14); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.hero-deck:hover .diff-line { animation:mycel-diff-arrive .62s cubic-bezier(.22,1,.36,1) both; }.hero-deck:hover .diff-line:nth-child(2) { animation-delay:.07s; }.hero-deck:hover .diff-line:nth-child(3) { animation-delay:.14s; }.hero-deck:hover .diff-line:nth-child(4) { animation-delay:.21s; }.hero-deck:hover .diff-line:nth-child(5) { animation-delay:.28s; }.galaxy-demo::after { content:""; position:absolute; inset:18% 15%; border-radius:50%; background:radial-gradient(circle,rgba(206,255,69,.22),rgba(126,160,255,.08) 34%,transparent 68%); opacity:0; transform:scale(.72); transition:opacity .32s ease,transform .42s cubic-bezier(.22,1,.36,1); pointer-events:none; }.galaxy-demo:hover::after { opacity:1; transform:scale(1); }.galaxy-demo:hover .galaxy-event { color:#ecffd0; border-color:rgba(206,255,69,.68); box-shadow:0 0 22px rgba(206,255,69,.2); }
.trust-row { display:block; overflow:hidden; padding:0; }.marquee-viewport { width:100%; overflow:hidden; }.marquee-track { width:max-content; min-height:67px; display:flex; align-items:center; gap:58px; padding-left:29px; animation:mycel-marquee 46s linear infinite; }.marquee-track span { display:inline-flex; align-items:center; gap:58px; color:#8c8e93; }.marquee-track span::after { content:"✦"; color:#5e6744; font-size:8px; }.marquee-track:hover { animation-play-state:paused; }
[data-reveal] { opacity:0; transform:translateY(30px); transition:opacity .72s cubic-bezier(.22,1,.36,1),transform .72s cubic-bezier(.22,1,.36,1); } [data-reveal].is-revealed { opacity:1; transform:none; }
.search-result { animation:mycel-terminal-glow 3.8s ease-in-out infinite; }.growth-grid article { overflow:hidden; }.growth-grid article::after { content:""; position:absolute; width:130px; height:130px; right:-70px; bottom:-80px; border-radius:50%; background:rgba(206,255,69,.11); filter:blur(22px); opacity:0; transform:scale(.7); transition:opacity .35s ease,transform .35s ease; }.growth-grid article:hover::after { opacity:1; transform:scale(1); }
.mcp-section:hover .mcp-prompt,.mcp-section:hover .mcp-searching,.mcp-section:hover .mcp-searched,.mcp-section:hover .mcp-created,.mcp-section:hover .mcp-reply,.mcp-section:hover .mcp-type-one,.mcp-section:hover .mcp-type-two { animation-play-state:paused; }.mcp-prompt { animation:mycel-mcp-prompt 10.2s linear infinite; }.mcp-searching,.mcp-searched,.mcp-created,.mcp-reply { opacity:0; }.mcp-searching { animation:mycel-mcp-searching 10.2s linear infinite; }.mcp-searched { animation:mycel-mcp-searched 10.2s linear infinite; }.mcp-created { animation:mycel-mcp-created 10.2s linear infinite; }.mcp-reply { display:block; min-height:42px; animation:mycel-mcp-reply 10.2s linear infinite; }.mcp-reply span { display:block; width:0; overflow:hidden; white-space:nowrap; }.mcp-type-one { animation:mycel-type-one 10.2s steps(42,end) infinite; }.mcp-type-two { animation:mycel-type-two 10.2s steps(30,end) infinite; }.mcp-searching i { display:inline-block; animation:mycel-think-spin 1.2s linear infinite; }.copy-link { display:inline-flex; align-items:center; gap:8px; margin-top:25px; padding:8px 11px; border:1px solid rgba(255,255,255,.14); border-radius:6px; background:rgba(12,14,15,.78); color:#9da1a4; font:600 10px "JetBrains Mono",monospace; cursor:pointer; transition:background .18s ease,color .18s ease,border-color .18s ease; }.copy-link:hover,.copy-link:focus-visible { border-color:rgba(206,255,69,.6); background:#191d17; color:#d9efad; }.copy-link:focus-visible { outline:2px solid var(--home-lime); outline-offset:3px; }
@keyframes mycel-nav-in { from { opacity:0; filter:blur(5px); transform:translateY(-6px); } to { opacity:1; filter:blur(0); transform:none; } }
@keyframes mycel-copy-in { from { opacity:0; transform:translateY(20px); filter:blur(5px); } to { opacity:1; transform:none; filter:blur(0); } }
@keyframes mycel-deck-float { 0%,100% { translate:0 0; } 50% { translate:0 -10px; } }
@keyframes mycel-deck-shuffle { 0%,37% { transform:perspective(1600px) rotateY(-3deg) rotateX(1deg) scale(1); } 46% { transform:perspective(1600px) rotateY(-5deg) rotateX(2deg) translateX(-8px) scale(.992); } 57% { transform:perspective(1600px) rotateY(-1deg) rotateX(.4deg) translateX(6px) scale(1.006); } 67%,100% { transform:perspective(1600px) rotateY(-3deg) rotateX(1deg) scale(1); } }
@keyframes mycel-deck-layer-one { 0%,37% { transform:rotate(3deg) translate(8px,12px); } 48% { transform:rotate(4.2deg) translate(22px,18px); opacity:.32; } 62% { transform:rotate(1.1deg) translate(3px,4px); opacity:.72; } 75%,100% { transform:rotate(3deg) translate(8px,12px); } }
@keyframes mycel-deck-layer-two { 0%,37% { transform:rotate(1.4deg) translate(4px,6px); } 48% { transform:rotate(2.5deg) translate(13px,13px); opacity:.42; } 62% { transform:rotate(.4deg) translate(1px,1px); opacity:.95; } 75%,100% { transform:rotate(1.4deg) translate(4px,6px); } }
@keyframes mycel-diff-arrive { from { opacity:.24; transform:translateX(-11px); filter:brightness(.75); } to { opacity:1; transform:none; filter:brightness(1); } }
@keyframes mycel-marquee { from { transform:translateX(0); } to { transform:translateX(-50%); } }
@keyframes mycel-node-pulse { 0%,100% { transform:scale(.85); filter:brightness(.8); } 50% { transform:scale(1.35); filter:brightness(1.35); } }
@keyframes mycel-galaxy-event { 0%,100% { opacity:.5; transform:translateY(3px); } 50% { opacity:1; transform:translateY(0); box-shadow:0 0 14px rgba(206,255,69,.18); } }
@keyframes mycel-terminal-glow { 0%,100% { box-shadow:0 0 0 0 rgba(206,255,69,0); } 50% { box-shadow:0 0 24px 1px rgba(206,255,69,.16); } }
@keyframes mycel-mcp-prompt { 0%,6% { opacity:0; transform:translateY(8px); } 12%,86% { opacity:1; transform:none; } 94%,100% { opacity:0; transform:translateY(-4px); } }
@keyframes mycel-mcp-searching { 0%,15% { opacity:0; transform:translateY(6px); } 21%,40% { opacity:1; transform:none; } 47%,100% { opacity:0; } }
@keyframes mycel-mcp-searched { 0%,43% { opacity:0; transform:translateY(6px); } 49%,70% { opacity:1; transform:none; } 77%,100% { opacity:0; } }
@keyframes mycel-mcp-created { 0%,69% { opacity:0; transform:translateY(6px); } 76%,92% { opacity:1; transform:none; } 100% { opacity:0; } }
@keyframes mycel-mcp-reply { 0%,74% { opacity:0; transform:translateY(6px); } 80%,93% { opacity:1; transform:none; } 100% { opacity:0; } }
@keyframes mycel-type-one { 0%,79% { width:0; } 87%,93% { width:100%; } 100% { width:0; } }
@keyframes mycel-type-two { 0%,86% { width:0; } 93% { width:100%; } 100% { width:0; } }
@keyframes mycel-think-spin { to { transform:rotate(360deg); } }
@media (max-width:660px) { .home-nav--enter > * { animation:none; opacity:1; filter:none; transform:none; }.hero-copy { animation:none; }.hero-deck::before,.hero-deck::after { inset:9px -3px -9px 3px; }.hero-product { width:100%; margin-left:0; transform:none; }.marquee-track { gap:34px; padding-left:20px; }.marquee-track span { gap:34px; }.mcp-searching,.mcp-searched,.mcp-created { font-size:9px; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; } [data-reveal] { opacity:1; transform:none; } .hero-product { transform:perspective(1600px) rotateY(-3deg) rotateX(1deg); } }

/* Visible state changes for the rest of the product story. */
[data-search-flow] { overflow:hidden; }.search-demo::before { content:""; position:absolute; inset:0; border:1px solid transparent; border-radius:8px; animation:mycel-search-focus 6.4s ease-in-out infinite; pointer-events:none; }.search-demo i { position:absolute; width:6px; height:6px; right:18px; bottom:7px; border-radius:50%; background:var(--home-lime); box-shadow:0 0 0 0 rgba(206,255,69,.55); animation:mycel-search-ping 1.45s ease-out infinite; }.search-result { transform-origin:center bottom; animation:mycel-terminal-glow 3.8s ease-in-out infinite,mycel-result-arrive 6.4s cubic-bezier(.22,1,.36,1) infinite; }.search-result em { animation:mycel-confidence 6.4s steps(1,end) infinite; }
.approval-signal { position:absolute; z-index:3; width:8px; height:8px; border-radius:50%; background:var(--home-lime); box-shadow:0 0 0 5px rgba(206,255,69,.13),0 0 19px rgba(206,255,69,.75); pointer-events:none; }.approval-signal--one { left:13%; top:27%; animation:mycel-approval-signal-one 5.2s cubic-bezier(.45,0,.55,1) infinite; }.approval-signal--two { right:18%; bottom:23%; background:#ffa760; box-shadow:0 0 0 5px rgba(255,167,96,.13),0 0 18px rgba(255,167,96,.7); animation:mycel-approval-signal-two 5.2s cubic-bezier(.45,0,.55,1) -2.6s infinite; }.shot-composition:hover .approval-signal { animation-play-state:paused; }
[data-capture-flow] { position:relative; }.capture-ping { position:absolute; z-index:2; top:70%; left:9%; width:10px; height:10px; border-radius:50%; background:var(--home-lime); box-shadow:0 0 0 6px rgba(206,255,69,.17),0 0 20px rgba(206,255,69,.83); animation:mycel-capture-flight 4.8s cubic-bezier(.45,0,.55,1) infinite; }.capture-receipt { position:absolute; right:18px; bottom:18px; z-index:2; padding:7px 9px; border:1px solid rgba(206,255,69,.45); border-radius:5px; color:#d8fca1; background:rgba(14,26,11,.82); font:9px "JetBrains Mono",monospace; box-shadow:0 7px 22px rgba(0,0,0,.25); animation:mycel-capture-receipt 4.8s cubic-bezier(.22,1,.36,1) infinite; }.capture-image:hover .capture-ping,.capture-image:hover .capture-receipt { animation-play-state:paused; }
[data-growth-flow]::before { content:""; position:absolute; right:28px; bottom:23px; left:28px; height:2px; border-radius:2px; background:linear-gradient(90deg,transparent 0 15%,rgba(206,255,69,.95) 34%,rgba(206,255,69,.2) 50%,transparent 70%); background-size:200% 100%; animation:mycel-growth-stream 4.5s linear infinite; }.growth-grid article:nth-child(2)::before { animation-delay:-1.5s; }.growth-grid article:nth-child(3)::before { animation-delay:-3s; }.growth-grid article .growth-icon { animation:mycel-growth-icon 4.5s ease-in-out infinite; }.growth-grid article:nth-child(2) .growth-icon { animation-delay:-1.5s; }.growth-grid article:nth-child(3) .growth-icon { animation-delay:-3s; }
.file-tree aside .selected { position:relative; animation:mycel-file-selected 3.8s ease-in-out infinite; }.file-tree aside .selected::after { content:""; position:absolute; top:50%; right:7px; width:5px; height:5px; border-radius:50%; background:var(--home-lime); box-shadow:0 0 9px rgba(206,255,69,.8); transform:translateY(-50%); animation:mycel-file-dot 1.2s ease-in-out infinite; }.file-tree article h3::after { content:"_"; margin-left:5px; color:var(--home-lime); animation:mycel-cursor .85s steps(1,end) infinite; }.file-tree article li { animation:mycel-line-read 5.6s ease-in-out infinite; }.file-tree article li:nth-child(2) { animation-delay:-1.8s; }.file-tree article li:nth-child(3) { animation-delay:-3.6s; }
@keyframes mycel-search-focus { 0%,14%,100% { border-color:transparent; } 20%,43% { border-color:rgba(206,255,69,.78); box-shadow:0 0 0 3px rgba(206,255,69,.08); } 51% { border-color:transparent; box-shadow:none; } }
@keyframes mycel-search-ping { 0% { box-shadow:0 0 0 0 rgba(206,255,69,.5); opacity:1; } 80%,100% { box-shadow:0 0 0 10px rgba(206,255,69,0); opacity:0; } }
@keyframes mycel-result-arrive { 0%,28% { opacity:.26; transform:translateY(13px) scale(.97); } 39%,78% { opacity:1; transform:none; } 91%,100% { opacity:.26; transform:translateY(6px) scale(.985); } }
@keyframes mycel-confidence { 0%,32% { color:#77815e; } 38%,76% { color:#d4ff72; text-shadow:0 0 12px rgba(206,255,69,.55); } 100% { color:#77815e; } }
@keyframes mycel-approval-signal-one { 0%,12% { opacity:0; transform:translate(-16px,10px) scale(.5); } 23%,60% { opacity:1; transform:translate(0,0) scale(1); } 76%,100% { opacity:0; transform:translate(170px,73px) scale(.6); } }
@keyframes mycel-approval-signal-two { 0%,12% { opacity:0; transform:translate(18px,-12px) scale(.45); } 26%,64% { opacity:1; transform:translate(0,0) scale(1); } 80%,100% { opacity:0; transform:translate(-190px,-76px) scale(.55); } }
@keyframes mycel-capture-flight { 0%,14% { opacity:0; transform:translate(0,0) scale(.45); } 22% { opacity:1; transform:translate(0,0) scale(1); } 63% { opacity:1; transform:translate(225px,-110px) scale(.8); } 70%,100% { opacity:0; transform:translate(250px,-118px) scale(.4); } }
@keyframes mycel-capture-receipt { 0%,61% { opacity:0; transform:translateY(11px) scale(.96); } 70%,88% { opacity:1; transform:none; } 100% { opacity:0; transform:translateY(-4px); } }
@keyframes mycel-growth-stream { from { background-position:200% 0; } to { background-position:-40% 0; } }
@keyframes mycel-growth-icon { 0%,100% { transform:translateY(0); box-shadow:0 0 0 0 rgba(206,255,69,0); } 50% { transform:translateY(-4px); box-shadow:0 7px 19px rgba(206,255,69,.16); } }
@keyframes mycel-file-selected { 0%,100% { background:#293323; } 50% { background:#3d4f29; box-shadow:inset 0 0 0 1px rgba(206,255,69,.16); } }
@keyframes mycel-file-dot { 0%,100% { opacity:.4; transform:translateY(-50%) scale(.7); } 50% { opacity:1; transform:translateY(-50%) scale(1); } }
@keyframes mycel-cursor { 0%,48% { opacity:1; } 49%,100% { opacity:0; } }
@keyframes mycel-line-read { 0%,26%,100% { color:#d4e6bb; text-shadow:none; } 33%,52% { color:#f0ffd0; text-shadow:0 0 12px rgba(206,255,69,.42); } 59% { color:#d4e6bb; } }
