From 65bb91c5515e44a3b2bf4e9eec2405fcb812dfa5 Mon Sep 17 00:00:00 2001
From: ludan <251918489@qq.com>
Date: Tue, 9 Jun 2026 18:45:57 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E9=A6=96=E9=A1=B5SaaS=E9=AB=98?=
 =?UTF-8?q?=E7=AB=AF=E5=8C=96=E8=A7=86=E8=A7=89=E5=8D=87=E7=BA=A7=E4=B8=8E?=
 =?UTF-8?q?=E5=9B=BE=E6=A0=87=E7=B3=BB=E7=BB=9F=E7=BB=9F=E4=B8=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

本次提交包含以下改进：

## 1. 首页架构精简 (HomePage.tsx)
- 移除模型生成(ModelGenerationShowcase)专题区和相关导入
- 移除"一站进入 OmniAI"Experience体验区及HOME_EXPERIENCE_POINTS
- 移除未使用的导入(DashboardOutlined, ThunderboltOutlined)
- 首页专题区从3个(model/ecommerce/script)缩减为2个(ecommerce/script)
- 轮播卡片x偏移量从固定px值改为clamp()流式响应式单位

## 2. 首页入口按钮重设计 (HomePage.tsx)
- 按钮文案升级：新手→快速生成(副标题:新手友好)，老手→专业创作(副标题:画布工作流)，电商→电商出图(副标题:商品视觉)
- 每个按钮新增small元素展示副标题
- 主按钮(专业创作)渐变绿色背景+发光阴影

## 3. 图标系统统一 — Emoji→Ant Design (ModelGenerationShowcase.tsx + ToolboxSection.tsx)
- ModelGenerationShowcase: emoji(🤖🖼️🎬📷🎨🛍️🌈✨)全部替换为对应的@ant-design/icons组件
- ToolboxSection: emoji(🎨📷🧑✨)替换为PictureOutlined/CameraOutlined/VideoCameraOutlined/ScissorOutlined
- SVG播放按钮替换为PlayCircleOutlined

## 4. 工具预览图补充 (MorePage.tsx)
- 为workbench核心工具添加预览图URL
- 为digitalHuman工具添加预览图URL

## 5. 合规页面按需样式加载 (App.tsx)
- 新增COMPLIANCE_PAGE_STYLE_VIEWS集合(communityReview/communityCaseAdd/report/userAgreement/privacyPolicy)
- 新增loadCompliancePageStyles()动态加载compliance.css
- 只在进入合规页面时才加载对应样式，减少首屏CSS体积

## 6. 全局滚动操作按钮禁用 (AppShell.tsx)
- showPageScrollActions强制设为false，全局禁用页面滚动到顶部/底部的浮动按钮

## 7. 首页Premium SaaS视觉升级 (home.css)
- 全新CSS变量体系：--home-card-radius/panel-radius/section-line/panel-border/text-strong/muted/faint
- 背景三层渐变叠加+双radial光晕(brand green+blue accent)
- Hero区域：eyebrow胶囊标签(绿点+毛玻璃)、h1字重950+text-shadow、描述text-wrap:balance
- 轮播卡片：流式clamp尺寸、非激活卡滤镜降饱和、激活卡高亮阴影、底部渐变分割线
- 入口按钮组：统一三列grid布局、图标圆形背景、hover微上移
- Feature专题页：grid网格背景+radial光晕+border分割线、Visual卡片统一玻璃态
- Ecommerce Matrix全面重写：三栏→自适应grid、feature/item/input/ai-node/output全组件玻璃态统一风格
- Experience区域：双radial光晕+网格纹理背景、路线卡片route-color动态渐变
- Script Review专题区：专属高度/内边距/溢出控制，容器查询适配
- Cookie Consent移动端优化

## 8. 响应式断点矩阵 (home.css)
- 1200px: 轮播卡片尺寸压缩
- 1100px: 专题页解除固定高度，Matrix双列布局
- 980px: h1字号clamp、轮播缩小、Matrix紧凑间距
- 899px: 专题页inline padding收紧
- 720px: 入口按钮堆叠、轮播全宽、专题页解除overflow
- 699px: Matrix grid-template-areas重构(copy+input双栏，outputs全宽)
- 640px: Matrix单列、feature-icon/text逐级隐藏
- 520px: output-group水平grid、output-cards三列
- 480px: 全页面紧缩、h1最大字号、carousel最小尺寸

## 9. 入口按钮多轮视觉打磨 (home.css 多轮迭代)
- Round 1: 绿色主题毛玻璃+三列grid
- Round 2: 暗色产品路径选择器风格，actions外框+entry透明
- Round 3: 回归深色面板风格(#101214)，保持原始配色调性

## 10. Ecommerce Matrix分层响应式策略 (home.css)
- 1101px+: 三列流式宽度+dvh高度自适应
- 900-1100px: 三列紧凑+逐步隐藏描述文字
- 700-899px: 三列超紧凑+大量line-clamp截断
- <699px: grid-template-areas双栏+全宽输出
- <640px: 全单列堆叠

## 11. 脚本评审Showcase容器查询 (script-review-showcase.css)
- 外层@media保留padding控制
- 内层@container查询适配880px/720px/560px断点
- 图表列720px以下水平进度条布局
- 品牌区域/评分标签/流程卡片逐级压缩
---
 src/App.tsx                                   |   16 +
 src/components/AppShell.tsx                   |    2 +-
 src/features/home/HomePage.tsx                |   56 -
 src/features/home/ModelGenerationShowcase.tsx |   33 +-
 src/features/home/ToolboxSection.tsx          |   18 +-
 src/features/more/MorePage.tsx                |    2 +
 src/styles/pages/home.css                     | 1819 ++++++++++++++++-
 .../pages/model-generation-showcase.css       |  345 +++-
 src/styles/pages/script-review-showcase.css   | 1107 ++++++++++
 src/styles/pages/toolbox.css                  |  620 ++++++
 src/styles/themes/dark-green.css              |   11 +
 11 files changed, 3934 insertions(+), 95 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index 9c6c0fb..6222b86 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -132,14 +132,27 @@ const LEGACY_PAGE_STYLE_VIEWS = new Set<WebViewKey>([
   "characterMix",
   "more",
 ]);
+const COMPLIANCE_PAGE_STYLE_VIEWS = new Set<WebViewKey>([
+  "communityReview",
+  "communityCaseAdd",
+  "report",
+  "userAgreement",
+  "privacyPolicy",
+]);
 
 let legacyPageStylesPromise: Promise<unknown> | null = null;
+let compliancePageStylesPromise: Promise<unknown> | null = null;
 
 function loadLegacyPageStyles(): Promise<unknown> {
   legacyPageStylesPromise ??= import("./styles/pages/legacy-pages.css");
   return legacyPageStylesPromise;
 }
 
+function loadCompliancePageStyles(): Promise<unknown> {
+  compliancePageStylesPromise ??= import("./styles/pages/compliance.css");
+  return compliancePageStylesPromise;
+}
+
 function normalizeViewKey(rawView: string): WebViewKey {
   const normalized =
     rawView === "profile" || rawView === "auth"
@@ -378,6 +391,9 @@ function App() {
     if (LEGACY_PAGE_STYLE_VIEWS.has(activeView) || ecommerceEverMounted) {
       void loadLegacyPageStyles();
     }
+    if (COMPLIANCE_PAGE_STYLE_VIEWS.has(activeView)) {
+      void loadCompliancePageStyles();
+    }
   }, [activeView, ecommerceEverMounted]);
 
   // Dismiss boot splash after first render
diff --git a/src/components/AppShell.tsx b/src/components/AppShell.tsx
index 27f6d03..aab778d 100644
--- a/src/components/AppShell.tsx
+++ b/src/components/AppShell.tsx
@@ -93,7 +93,7 @@ function AppShell({
   const isAuthView = activeView === "login";
   const isImmersiveView = activeView === "agent" || activeView === "avatarConsole";
   const showFloatingNav = !isAuthView && !isImmersiveView && activeView !== "home";
-  const showPageScrollActions = showFloatingNav && !TOOL_SURFACE_VIEW_SET.has(activeView);
+  const showPageScrollActions = false;
 
   const visibleNavItems = useMemo(
     () => {
diff --git a/src/features/home/HomePage.tsx b/src/features/home/HomePage.tsx
index 2f9e81c..0092f27 100644
--- a/src/features/home/HomePage.tsx
+++ b/src/features/home/HomePage.tsx
@@ -1,11 +1,9 @@
 import {
   ArrowRightOutlined,
-  DashboardOutlined,
   FileSearchOutlined,
   PlayCircleOutlined,
   PlusOutlined,
   ShoppingOutlined,
-  ThunderboltOutlined,
 } from "@ant-design/icons";
 import { Fragment, useCallback, useEffect, useMemo, useRef, useState, type CSSProperties } from "react";
 import type { WebViewKey, WebImageWorkbenchTool } from "../../types";
@@ -15,7 +13,6 @@ import "../../styles/pages/home.css";
 import WelcomeSplash from "./WelcomeSplash";
 import ToolboxSection from "./ToolboxSection";
 import ScriptReviewShowcase from "./ScriptReviewShowcase";
-import ModelGenerationShowcase from "./ModelGenerationShowcase";
 
 function ScrollEntrance({ children, className, ...rest }: { children: React.ReactNode; className?: string } & React.HTMLAttributes<HTMLElement>) {
   const { ref, isVisible } = useScrollEntrance<HTMLElement>();
@@ -30,7 +27,6 @@ const [heroImage1, heroImage2, heroImage3] = ossAssets.home.heroSlides;
 const {
   ecommerce: featureEcommerceImage,
   script: featureScriptImage,
-  token: featureTokenImage,
 } = ossAssets.home.features;
 
 interface HomePageProps {
@@ -52,16 +48,6 @@ const HOME_CAROUSEL_IMAGES = [
 ];
 
 const HOME_FEATURES = [
-  {
-    key: "model",
-    eyebrow: "AI Generation",
-    title: "模型生成",
-    description: "通过AI模型生成文本、图片、视频，三种模式覆盖全内容类型，Agent对话式交互智能产出。",
-    imageUrl: featureTokenImage,
-    actionLabel: "开始生成",
-    icon: <ThunderboltOutlined />,
-    stats: ["文本生成", "图片生成", "视频生成"],
-  },
   {
     key: "ecommerce",
     eyebrow: "AI Commerce",
@@ -84,13 +70,6 @@ const HOME_FEATURES = [
   },
 ];
 
-const HOME_EXPERIENCE_POINTS = [
-  { label: "生成", meta: "图像 / 视频", tone: "green" },
-  { label: "测评", meta: "剧本质量", tone: "cyan" },
-  { label: "成本", meta: "Token 用量", tone: "violet" },
-  { label: "电商", meta: "商品视觉", tone: "amber" },
-];
-
 const ECOMMERCE_MATRIX_FEATURES = [
   { icon: "⚡", title: "高效工作流", description: "自动化处理，一键触发" },
   { icon: "⊞", title: "矩阵式产出", description: "多场景、多尺寸批量生成" },
@@ -673,8 +652,6 @@ function HomePage({ onOpenGenerate, onOpenCanvas, onOpenEcommerce, onOpenScriptR
             <div className="omni-home__feature-visual" aria-hidden={feature.key !== "script" && feature.key !== "model" && feature.key !== "ecommerce"}>
               {feature.key === "script" ? (
                 <ScriptReviewShowcase />
-              ) : feature.key === "model" ? (
-                <ModelGenerationShowcase />
               ) : feature.key === "ecommerce" ? (
                 <EcommerceFeatureShowcase />
               ) : (
@@ -692,39 +669,6 @@ function HomePage({ onOpenGenerate, onOpenCanvas, onOpenEcommerce, onOpenScriptR
         ))}
 
         <ToolboxSection onSelectView={onSelectView} onOpenImageTool={onOpenImageTool} />
-
-        <section className="omni-home__experience" aria-label="点击体验">
-          <div className="omni-home__experience-copy">
-            <span>
-              <ThunderboltOutlined />
-              Click To Experience
-            </span>
-            <h2>一站进入 OmniAI</h2>
-            <p>选择入口，直接开始生成、评测、监控或电商作图。</p>
-          </div>
-          <div className="omni-home__experience-visual" aria-hidden="true">
-            <div className="omni-home__experience-line is-top" />
-            <div className="omni-home__experience-line is-bottom" />
-            <div className="omni-home__experience-routes">
-              {HOME_EXPERIENCE_POINTS.map((point) => (
-                <span key={point.label} className={`omni-home__experience-route is-${point.tone}`}>
-                  <b>{point.label}</b>
-                  <small>{point.meta}</small>
-                </span>
-              ))}
-            </div>
-          </div>
-          <div className="omni-home__experience-actions">
-            <button type="button" className="is-primary" onClick={onOpenGenerate}>
-              <PlayCircleOutlined />
-              立即体验生成
-            </button>
-            <button type="button" onClick={onOpenEcommerce}>
-              <ShoppingOutlined />
-              体验电商生成
-            </button>
-          </div>
-        </section>
       </main>
     </section>
     </>
diff --git a/src/features/home/ModelGenerationShowcase.tsx b/src/features/home/ModelGenerationShowcase.tsx
index a92e63b..a39a1e8 100644
--- a/src/features/home/ModelGenerationShowcase.tsx
+++ b/src/features/home/ModelGenerationShowcase.tsx
@@ -1,12 +1,21 @@
+import {
+  BgColorsOutlined,
+  CameraOutlined,
+  PictureOutlined,
+  PlayCircleOutlined,
+  RobotOutlined,
+  ShoppingOutlined,
+  VideoCameraOutlined,
+} from "@ant-design/icons";
 import { useEffect, useRef, useState } from "react";
 import "../../styles/pages/model-generation-showcase.css";
 
 type ShowMode = "agent" | "image" | "video";
 
 const MODE_TABS = [
-  { key: "agent" as const, icon: "🤖", title: "Agent 模式", desc: "文本生成，对话式交互，智能推理" },
-  { key: "image" as const, icon: "🖼️", title: "图片模式", desc: "图像生成，风格迁移，场景合成" },
-  { key: "video" as const, icon: "🎬", title: "视频模式", desc: "视频生成，动态场景，数字人演绎" },
+  { key: "agent" as const, icon: <RobotOutlined />, title: "Agent 模式", desc: "文本生成，对话式交互，智能推理" },
+  { key: "image" as const, icon: <PictureOutlined />, title: "图片模式", desc: "图像生成，风格迁移，场景合成" },
+  { key: "video" as const, icon: <VideoCameraOutlined />, title: "视频模式", desc: "视频生成，动态场景，数字人演绎" },
 ];
 
 const AGENT_OUTPUTS = [
@@ -16,9 +25,9 @@ const AGENT_OUTPUTS = [
 ];
 
 const IMAGE_OUTPUTS = [
-  { tag: "Image", title: "写实风格", icon: "📷", styleClass: "realistic" },
-  { tag: "Image", title: "插画风格", icon: "🎨", styleClass: "illustration" },
-  { tag: "Image", title: "电商风格", icon: "🛍️", styleClass: "ecommerce" },
+  { tag: "Image", title: "写实风格", icon: <CameraOutlined />, styleClass: "realistic" },
+  { tag: "Image", title: "插画风格", icon: <BgColorsOutlined />, styleClass: "illustration" },
+  { tag: "Image", title: "电商风格", icon: <ShoppingOutlined />, styleClass: "ecommerce" },
 ];
 
 const VIDEO_OUTPUTS = [
@@ -160,10 +169,10 @@ function ModelGenerationShowcase() {
                 ))}
               </div>
               <div className="mgs-img-grid">
-                <div className="mgs-img-cell">🎨</div>
-                <div className="mgs-img-cell">🖼️</div>
-                <div className="mgs-img-cell">✨</div>
-                <div className="mgs-img-cell">🌈</div>
+                <div className="mgs-img-cell"><BgColorsOutlined /></div>
+                <div className="mgs-img-cell"><PictureOutlined /></div>
+                <div className="mgs-img-cell"><CameraOutlined /></div>
+                <div className="mgs-img-cell"><ShoppingOutlined /></div>
               </div>
             </div>
           )}
@@ -195,7 +204,7 @@ function ModelGenerationShowcase() {
               </div>
               <div className="mgs-video-preview">
                 <div className="mgs-play-btn">
-                  <svg viewBox="0 0 24 24"><polygon points="6,3 20,12 6,21" /></svg>
+                  <PlayCircleOutlined />
                 </div>
               </div>
               <div className="mgs-video-timeline">
@@ -266,7 +275,7 @@ function ModelGenerationShowcase() {
                   </div>
                   <div className="mgs-out-video-placeholder">
                     <div className="mgs-mini-play">
-                      <svg viewBox="0 0 24 24"><polygon points="6,3 20,12 6,21" /></svg>
+                      <PlayCircleOutlined />
                     </div>
                     <span className="mgs-video-duration">{item.duration}</span>
                   </div>
diff --git a/src/features/home/ToolboxSection.tsx b/src/features/home/ToolboxSection.tsx
index ac23134..768c549 100644
--- a/src/features/home/ToolboxSection.tsx
+++ b/src/features/home/ToolboxSection.tsx
@@ -1,4 +1,4 @@
-import { ToolOutlined } from "@ant-design/icons";
+import { CameraOutlined, PictureOutlined, ScissorOutlined, ToolOutlined, VideoCameraOutlined } from "@ant-design/icons";
 import type { WebViewKey, WebImageWorkbenchTool } from "../../types";
 import { ossAssets } from "../../data/ossAssets";
 import "../../styles/pages/toolbox.css";
@@ -18,25 +18,25 @@ interface ToolboxSectionProps {
 const TOOLS = [
   {
     key: "image-studio",
-    icon: "🎨",
+    icon: <PictureOutlined />,
     name: "图片工作室",
     desc: "图片二次加工，调色裁剪特效风格迁移",
   },
   {
     key: "lens-lab",
-    icon: "📷",
+    icon: <CameraOutlined />,
     name: "镜头实验室",
     desc: "多视角镜头生成，不同角度与姿势",
   },
   {
     key: "digital-human",
-    icon: "🧑",
+    icon: <VideoCameraOutlined />,
     name: "一键数字人",
     desc: "上传图片和音频，生成数字人视频",
   },
   {
     key: "watermark-removal",
-    icon: "✨",
+    icon: <ScissorOutlined />,
     name: "去除水印",
     desc: "AI智能识别去除图片视频水印",
   },
@@ -47,7 +47,7 @@ const CARDS = [
     key: "image-studio",
     title: "图片工作室",
     tag: "图片加工",
-    icon: "🎨",
+    icon: <PictureOutlined />,
     features: ["二次加工", "调色", "裁剪", "风格迁移"],
     targetView: "imageWorkbench" as WebViewKey,
     render: () => (
@@ -72,7 +72,7 @@ const CARDS = [
     key: "lens-lab",
     title: "镜头实验室",
     tag: "多视角",
-    icon: "📷",
+    icon: <CameraOutlined />,
     features: ["正面", "45°侧", "俯拍", "仰拍", "背面"],
     targetView: "imageWorkbench" as WebViewKey,
     render: () => (
@@ -91,7 +91,7 @@ const CARDS = [
     key: "digital-human",
     title: "一键数字人",
     tag: "视频生成",
-    icon: "🧑",
+    icon: <VideoCameraOutlined />,
     features: ["上传人像", "匹配音频", "唇形同步", "生成视频"],
     targetView: "digitalHuman" as WebViewKey,
     render: () => (
@@ -122,7 +122,7 @@ const CARDS = [
     key: "watermark-removal",
     title: "去除水印",
     tag: "AI清除",
-    icon: "✨",
+    icon: <ScissorOutlined />,
     features: ["智能识别", "精准去除", "无损画质"],
     targetView: "watermarkRemoval" as WebViewKey,
     render: () => (
diff --git a/src/features/more/MorePage.tsx b/src/features/more/MorePage.tsx
index bf740ad..f38dacd 100644
--- a/src/features/more/MorePage.tsx
+++ b/src/features/more/MorePage.tsx
@@ -40,12 +40,14 @@ interface MoreTool {
 }
 
 const toolPreviewImages: Record<string, string> = {
+  workbench: "https://stringtest.oss-cn-hangzhou.aliyuncs.com/static/toolbox/image-workbench-20260609132455.png",
   inpaint: "https://stringtest.oss-cn-hangzhou.aliyuncs.com/toolbox/images/%E5%B1%80%E9%83%A8%E9%87%8D%E7%BB%98.PNG",
   camera: "https://stringtest.oss-cn-hangzhou.aliyuncs.com/toolbox/images/%E9%95%9C%E5%A4%B4%E5%AE%9E%E9%AA%8C%E5%AE%A4.PNG",
   upscale: "https://stringtest.oss-cn-hangzhou.aliyuncs.com/toolbox/images/%E5%88%86%E8%BE%A8%E7%8E%87%E6%8F%90%E5%8D%87.PNG",
   watermarkRemoval: "https://stringtest.oss-cn-hangzhou.aliyuncs.com/toolbox/images/%E5%8E%BB%E6%B0%B4%E5%8D%B0.PNG",
   dialogGenerator: "https://stringtest.oss-cn-hangzhou.aliyuncs.com/toolbox/images/%E4%BA%A4%E4%BA%92%E5%BC%8F%E5%AF%B9%E8%AF%9D%E6%A1%86%E7%94%9F%E6%88%90%E5%99%A8.PNG",
   subtitleRemoval: "https://stringtest.oss-cn-hangzhou.aliyuncs.com/toolbox/images/%E5%AD%97%E5%B9%95%E5%8E%BB%E9%99%A4.PNG",
+  digitalHuman: "https://stringtest.oss-cn-hangzhou.aliyuncs.com/static/toolbox/digital-human-20260609132455.png",
   characterMix: "https://stringtest.oss-cn-hangzhou.aliyuncs.com/toolbox/images/%E8%A7%92%E8%89%B2%E8%BF%81%E7%A7%BB.PNG",
   avatarConsole: "https://stringtest.oss-cn-hangzhou.aliyuncs.com/toolbox/images/%E6%95%B0%E5%AD%97%E4%BA%BA%E6%8E%A7%E5%88%B6%E5%8F%B0.PNG",
 };
diff --git a/src/styles/pages/home.css b/src/styles/pages/home.css
index 281c50f..e0e65a7 100644
--- a/src/styles/pages/home.css
+++ b/src/styles/pages/home.css
@@ -2831,8 +2831,9 @@
   .web-shell[data-view="home"] .omni-home__feature-page.is-script .omni-home__feature-visual,
   .web-shell[data-view="home"] .omni-home__feature-page.is-model .omni-home__feature-visual,
   .web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce .omni-home__feature-visual {
-    height: auto;
-    min-height: clamp(520px, 78vw, 720px);
+    height: clamp(560px, 82vh, 720px);
+    min-height: 0;
+    overflow: auto;
   }
 
   .web-shell[data-view="home"] .omni-home__experience {
@@ -2964,7 +2965,9 @@
   .web-shell[data-view="home"] .omni-home__feature-page.is-script .omni-home__feature-visual,
   .web-shell[data-view="home"] .omni-home__feature-page.is-model .omni-home__feature-visual,
   .web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce .omni-home__feature-visual {
-    min-height: 560px;
+    height: min(620px, calc(100svh - 120px));
+    min-height: 480px;
+    overflow: auto;
   }
 
   .web-shell[data-view="home"] .omni-home__experience-routes {
@@ -2997,3 +3000,1813 @@
     flex: 1 1 0;
   }
 }
+
+/* ===== Premium SaaS landing direction ===== */
+.web-shell[data-view="home"] .omni-home {
+  --home-card-radius: 16px;
+  --home-panel-radius: 20px;
+  --home-section-line: rgb(255 255 255 / 7%);
+  --home-panel-border: rgb(255 255 255 / 10%);
+  --home-text-strong: #f7fbf8;
+  --home-text-muted: rgb(232 240 236 / 66%);
+  --home-text-faint: rgb(232 240 236 / 42%);
+  background:
+    radial-gradient(circle at 22% 0%, rgb(0 255 136 / 12%), transparent 30%),
+    radial-gradient(circle at 78% 12%, rgb(72 128 255 / 8%), transparent 27%),
+    linear-gradient(180deg, #07100e 0%, #050807 46%, #030504 100%);
+}
+
+.web-shell[data-view="home"] .omni-home__bg-video {
+  opacity: 0.44;
+  filter: saturate(0.82) contrast(1.08) brightness(0.74);
+}
+
+.web-shell[data-view="home"] .omni-home__scrim {
+  background:
+    radial-gradient(circle at 50% 21%, rgb(0 255 136 / 13%), transparent 35%),
+    radial-gradient(circle at 82% 18%, rgb(84 139 255 / 9%), transparent 28%),
+    linear-gradient(180deg, rgb(5 8 8 / 82%), rgb(5 8 8 / 54%) 36%, rgb(5 8 8 / 90%)),
+    linear-gradient(90deg, rgb(5 8 8 / 92%), rgb(5 8 8 / 52%) 48%, rgb(5 8 8 / 92%));
+}
+
+.web-shell[data-view="home"] .omni-home__shell {
+  min-height: max(720px, var(--home-section-min-height));
+  padding-top: clamp(36px, 5.2vw, 78px);
+  padding-bottom: clamp(42px, 5.6vw, 86px);
+}
+
+.web-shell[data-view="home"] .omni-home__hero {
+  position: relative;
+  gap: clamp(18px, 2.4vw, 34px);
+  width: min(100%, 1320px);
+}
+
+.web-shell[data-view="home"] .omni-home__hero::before {
+  content: "";
+  position: absolute;
+  inset: 12% -8% auto;
+  height: 50%;
+  border-radius: 999px;
+  background: radial-gradient(circle at 50% 45%, rgb(0 255 136 / 15%), transparent 62%);
+  filter: blur(30px);
+  opacity: 0.72;
+  pointer-events: none;
+}
+
+.web-shell[data-view="home"] .omni-home__copy,
+.web-shell[data-view="home"] .omni-home__carousel,
+.web-shell[data-view="home"] .omni-home__actions {
+  position: relative;
+  z-index: 1;
+}
+
+.web-shell[data-view="home"] .omni-home__eyebrow {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  width: fit-content;
+  min-height: 32px;
+  padding: 0 13px;
+  border: 1px solid rgb(255 255 255 / 10%);
+  border-radius: 999px;
+  background:
+    linear-gradient(180deg, rgb(255 255 255 / 7%), rgb(255 255 255 / 3%)),
+    rgb(8 14 13 / 62%);
+  color: rgb(235 245 240 / 78%);
+  font-size: 12px;
+  font-weight: 800;
+  box-shadow:
+    inset 0 1px 0 rgb(255 255 255 / 9%),
+    0 16px 42px rgb(0 0 0 / 18%);
+  backdrop-filter: blur(14px);
+}
+
+.web-shell[data-view="home"] .omni-home__eyebrow::before {
+  content: "";
+  width: 7px;
+  height: 7px;
+  border-radius: 999px;
+  background: var(--accent);
+  box-shadow: 0 0 18px rgb(0 255 136 / 58%);
+}
+
+.web-shell[data-view="home"] .omni-home__copy {
+  gap: 14px;
+}
+
+.web-shell[data-view="home"] .omni-home__copy h1 {
+  max-width: min(100%, 940px);
+  color: var(--home-text-strong);
+  font-size: clamp(44px, 6.4vw, 92px);
+  font-weight: 950;
+  line-height: 0.98;
+  text-shadow: 0 24px 80px rgb(0 0 0 / 48%);
+}
+
+.web-shell[data-view="home"] .omni-home__copy p {
+  max-width: 680px;
+  color: var(--home-text-muted);
+  font-size: clamp(15px, 1.35vw, 19px);
+  line-height: 1.82;
+}
+
+.web-shell[data-view="home"] .omni-home__carousel {
+  width: min(100%, 1220px);
+  min-height: clamp(390px, 37vw, 570px);
+}
+
+.web-shell[data-view="home"] .omni-home__carousel-stage {
+  width: min(100%, 1220px);
+  height: clamp(368px, 34.6vw, 540px);
+  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 6%, #000 94%, transparent 100%);
+  mask-image: linear-gradient(90deg, transparent 0%, #000 6%, #000 94%, transparent 100%);
+}
+
+.web-shell[data-view="home"] .omni-home__carousel-card {
+  width: clamp(520px, 48vw, 790px);
+  height: clamp(293px, 27vw, 444px);
+  border-color: rgb(255 255 255 / 6%);
+  border-radius: clamp(16px, 1.8vw, 22px);
+  background:
+    linear-gradient(180deg, rgb(255 255 255 / 5%), rgb(0 0 0 / 5%)),
+    #07100f;
+  box-shadow:
+    0 24px 64px rgb(0 0 0 / 34%),
+    inset 0 1px 0 rgb(255 255 255 / 8%);
+}
+
+.web-shell[data-view="home"] .omni-home__carousel-card::before {
+  background:
+    linear-gradient(180deg, rgb(255 255 255 / 5%), transparent 28%, rgb(2 8 9 / 34%)),
+    linear-gradient(90deg, rgb(4 10 12 / 36%), transparent 24%, transparent 76%, rgb(4 10 12 / 36%));
+  opacity: 0.88;
+}
+
+.web-shell[data-view="home"] .omni-home__carousel-card.is-active {
+  border-color: rgb(255 255 255 / 8%);
+  box-shadow:
+    0 34px 86px rgb(0 0 0 / 42%),
+    0 0 0 1px rgb(255 255 255 / 4%),
+    inset 0 1px 0 rgb(255 255 255 / 10%);
+}
+
+.web-shell[data-view="home"] .omni-home__carousel-stage .omni-home__carousel-card img {
+  filter:
+    saturate(0.7)
+    contrast(0.99)
+    brightness(0.68)
+    hue-rotate(7deg)
+    drop-shadow(0 18px 18px rgb(0 0 0 / 18%));
+}
+
+.web-shell[data-view="home"] .omni-home__carousel-stage .omni-home__carousel-card.is-active img {
+  filter:
+    saturate(0.9)
+    contrast(1.04)
+    brightness(0.9)
+    hue-rotate(5deg)
+    drop-shadow(0 24px 24px rgb(0 0 0 / 20%));
+}
+
+.web-shell[data-view="home"] .omni-home__actions {
+  width: min(100%, 640px);
+  gap: 12px;
+}
+
+.web-shell[data-view="home"] .omni-home__entry {
+  min-height: 68px;
+  border-color: rgb(255 255 255 / 10%);
+  border-radius: 14px;
+  background:
+    linear-gradient(180deg, rgb(255 255 255 / 8%), rgb(255 255 255 / 3%)),
+    rgb(9 14 13 / 82%);
+  box-shadow:
+    0 18px 42px rgb(0 0 0 / 24%),
+    inset 0 1px 0 rgb(255 255 255 / 8%);
+  backdrop-filter: blur(16px);
+}
+
+.web-shell[data-view="home"] .omni-home__entry:hover {
+  border-color: rgb(255 255 255 / 18%);
+  background:
+    linear-gradient(180deg, rgb(255 255 255 / 10%), rgb(255 255 255 / 4%)),
+    rgb(11 18 16 / 90%);
+}
+
+.web-shell[data-view="home"] .omni-home__entry--primary,
+.web-shell[data-view="home"] .omni-home__entry--primary:hover {
+  border-color: rgb(0 255 136 / 72%);
+  background: linear-gradient(180deg, rgb(102 255 181), rgb(0 255 136));
+  box-shadow:
+    0 20px 50px rgb(0 255 136 / 15%),
+    inset 0 1px 0 rgb(255 255 255 / 30%);
+}
+
+.web-shell[data-view="home"] .omni-home__feature-pages {
+  background:
+    linear-gradient(180deg, rgb(5 8 8 / 0%), #050807 1.5%, #030504 100%),
+    radial-gradient(circle at 10% 16%, rgb(0 255 136 / 7%), transparent 24%),
+    linear-gradient(90deg, rgb(255 255 255 / 2.2%) 1px, transparent 1px),
+    linear-gradient(180deg, rgb(255 255 255 / 2.2%) 1px, transparent 1px);
+  background-size: auto, auto, 42px 42px, 42px 42px;
+}
+
+.web-shell[data-view="home"] .omni-home__feature-page {
+  border-top-color: var(--home-section-line);
+}
+
+.web-shell[data-view="home"] .omni-home__feature-page::before {
+  background:
+    radial-gradient(circle at 78% 32%, rgb(0 255 136 / 8%), transparent 32%),
+    linear-gradient(90deg, rgb(5 8 8 / 96%) 0%, rgb(5 8 8 / 80%) 40%, rgb(5 8 8 / 56%) 100%),
+    linear-gradient(180deg, rgb(255 255 255 / 4%), transparent 34%);
+}
+
+.web-shell[data-view="home"] .omni-home__feature-page.is-model::before,
+.web-shell[data-view="home"] .omni-home__feature-page.is-script::before,
+.web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce::before {
+  background:
+    radial-gradient(circle at 50% 22%, rgb(0 255 136 / 9%), transparent 32%),
+    radial-gradient(circle at 86% 70%, rgb(84 139 255 / 6%), transparent 30%),
+    linear-gradient(180deg, rgb(5 8 8 / 96%), rgb(5 8 8 / 88%));
+}
+
+.web-shell[data-view="home"] .omni-home__feature-visual,
+.web-shell[data-view="home"] .omni-home__feature-page.is-script .omni-home__feature-visual,
+.web-shell[data-view="home"] .omni-home__feature-page.is-model .omni-home__feature-visual,
+.web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce .omni-home__feature-visual {
+  border-color: var(--home-panel-border);
+  border-radius: var(--home-panel-radius);
+  background:
+    linear-gradient(180deg, rgb(255 255 255 / 5.5%), rgb(255 255 255 / 2%)),
+    rgb(8 13 12 / 88%);
+  box-shadow:
+    0 34px 90px rgb(0 0 0 / 42%),
+    inset 0 1px 0 rgb(255 255 255 / 7%);
+}
+
+.web-shell[data-view="home"] .omni-home__feature-page.is-script .omni-home__feature-visual,
+.web-shell[data-view="home"] .omni-home__feature-page.is-model .omni-home__feature-visual,
+.web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce .omni-home__feature-visual {
+  border-radius: clamp(14px, 1.4vw, 20px);
+}
+
+.web-shell[data-view="home"] .omni-home__feature-copy > span,
+.web-shell[data-view="home"] .omni-home__experience-copy > span {
+  width: fit-content;
+  min-height: 32px;
+  padding: 0 12px;
+  border: 1px solid rgb(255 255 255 / 9%);
+  border-radius: 999px;
+  background: rgb(255 255 255 / 4.5%);
+  color: rgb(214 255 236 / 82%);
+  font-size: 12px;
+  letter-spacing: 0;
+  text-transform: none;
+}
+
+.web-shell[data-view="home"] .omni-home__feature-copy h2,
+.web-shell[data-view="home"] .omni-home__experience-copy h2 {
+  color: var(--home-text-strong);
+  letter-spacing: 0;
+}
+
+.web-shell[data-view="home"] .omni-home__feature-copy p,
+.web-shell[data-view="home"] .omni-home__experience-copy p {
+  color: var(--home-text-muted);
+}
+
+.web-shell[data-view="home"] .omni-home__feature-copy button,
+.web-shell[data-view="home"] .omni-home__experience-actions button {
+  border-radius: 14px;
+  border-color: rgb(255 255 255 / 14%);
+  background:
+    linear-gradient(180deg, rgb(255 255 255 / 8%), rgb(255 255 255 / 3%)),
+    rgb(10 16 15 / 86%);
+  color: var(--home-text-strong);
+  box-shadow:
+    0 18px 42px rgb(0 0 0 / 24%),
+    inset 0 1px 0 rgb(255 255 255 / 8%);
+}
+
+.web-shell[data-view="home"] .omni-home__feature-copy button:hover,
+.web-shell[data-view="home"] .omni-home__experience-actions button:hover,
+.web-shell[data-view="home"] .omni-home__experience-actions button.is-primary {
+  border-color: rgb(0 255 136 / 70%);
+  background: linear-gradient(180deg, rgb(102 255 181), rgb(0 255 136));
+  color: #05100d;
+}
+
+.web-shell[data-view="home"] .omni-home__experience {
+  border-top-color: var(--home-section-line);
+  background:
+    radial-gradient(circle at 16% 25%, rgb(0 255 136 / 10%), transparent 30%),
+    radial-gradient(circle at 82% 36%, rgb(84 139 255 / 8%), transparent 28%),
+    linear-gradient(180deg, #050807 0%, #030504 100%);
+}
+
+.web-shell[data-view="home"] .omni-home__experience::before {
+  background:
+    linear-gradient(90deg, rgb(255 255 255 / 2.6%) 1px, transparent 1px),
+    linear-gradient(180deg, rgb(255 255 255 / 2.6%) 1px, transparent 1px);
+  background-size: 42px 42px;
+  mask-image: linear-gradient(180deg, rgb(0 0 0 / 70%), rgb(0 0 0 / 18%));
+}
+
+.web-shell[data-view="home"] .omni-home__experience-visual::before,
+.web-shell[data-view="home"] .omni-home__experience-visual::after {
+  border-color: rgb(255 255 255 / 10%);
+}
+
+.web-shell[data-view="home"] .omni-home__experience-line {
+  background: linear-gradient(90deg, transparent, rgb(0 255 136 / 52%), rgb(255 255 255 / 28%), transparent);
+}
+
+.web-shell[data-view="home"] .omni-home__experience-route {
+  border-color: rgb(255 255 255 / 10%);
+  border-left-width: 1px;
+  border-radius: 16px;
+  background:
+    linear-gradient(135deg, color-mix(in srgb, var(--route-color) 13%, transparent), rgb(255 255 255 / 5%)),
+    rgb(6 12 11 / 76%);
+  box-shadow:
+    0 20px 46px rgb(0 0 0 / 25%),
+    inset 0 1px 0 rgb(255 255 255 / 7%);
+}
+
+.web-shell[data-view="home"] .omni-home__experience-route b {
+  color: var(--home-text-strong);
+}
+
+.web-shell[data-view="home"] .omni-home__experience-route small {
+  color: var(--home-text-faint);
+}
+
+@media (max-width: 1200px) {
+  .web-shell[data-view="home"] .omni-home__carousel-card {
+    width: clamp(500px, 59vw, 690px);
+    height: clamp(281px, 33.19vw, 388px);
+  }
+}
+
+@media (max-width: 980px) {
+  .web-shell[data-view="home"] .omni-home__shell {
+    min-height: auto;
+  }
+
+  .web-shell[data-view="home"] .omni-home__copy h1 {
+    font-size: clamp(40px, 9vw, 68px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__carousel {
+    min-height: clamp(300px, 56vw, 450px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__carousel-stage {
+    height: clamp(288px, 52vw, 430px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__carousel-card {
+    width: min(88vw, 620px);
+    height: min(49.5vw, 349px);
+    min-height: 246px;
+  }
+}
+
+@media (max-width: 720px) {
+  .web-shell[data-view="home"] .omni-home__shell {
+    padding-top: 26px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__copy h1 {
+    font-size: clamp(36px, 11vw, 54px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__copy p {
+    font-size: 14px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__actions {
+    width: min(100%, 440px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__carousel {
+    min-height: clamp(260px, 70vw, 360px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__carousel-stage {
+    height: clamp(246px, 66vw, 340px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__carousel-card {
+    width: min(94vw, 520px);
+    height: min(52.88vw, 292px);
+    min-height: 206px;
+  }
+}
+
+@media (max-width: 480px) {
+  .web-shell[data-view="home"] .omni-home__eyebrow {
+    min-height: 30px;
+    font-size: 11px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__copy h1 {
+    font-size: clamp(34px, 12vw, 48px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__carousel {
+    min-height: clamp(232px, 69vw, 292px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__carousel-stage {
+    height: clamp(222px, 65vw, 280px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__carousel-card {
+    width: 94vw;
+    height: 52.88vw;
+    min-height: 188px;
+  }
+}
+
+/* Script review section sizing: align it with the toolbox landing section rhythm. */
+.web-shell[data-view="home"] .omni-home__feature-page.is-script {
+  min-height: clamp(660px, 86dvh, 820px);
+  padding: clamp(42px, 5.2vw, 72px) clamp(28px, 4vw, 56px);
+}
+
+.web-shell[data-view="home"] .omni-home__feature-page.is-script .omni-home__feature-visual {
+  width: min(100%, 1320px);
+  height: clamp(600px, 76dvh, 760px);
+  min-height: 0;
+  margin-inline: auto;
+  overflow: hidden;
+}
+
+@media (max-width: 980px) {
+  .web-shell[data-view="home"] .omni-home__feature-page.is-script {
+    min-height: auto;
+    padding: clamp(34px, 6vw, 56px) clamp(20px, 4vw, 40px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__feature-page.is-script .omni-home__feature-visual {
+    width: min(100%, 860px);
+    height: auto;
+    min-height: 0;
+    overflow: visible;
+  }
+}
+
+@media (max-width: 560px) {
+  .web-shell[data-view="home"] .omni-home__feature-page.is-script {
+    padding: 30px 14px 40px;
+  }
+}
+
+/* Immersive showcase pass: keep the product modules, remove the framed demo feel. */
+.web-shell[data-view="home"] .omni-home__feature-page.is-script,
+.web-shell[data-view="home"] .omni-home__feature-page.is-model,
+.web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce {
+  min-height: clamp(660px, 86dvh, 820px);
+  padding: clamp(42px, 5.2vw, 72px) clamp(28px, 4vw, 56px);
+}
+
+.web-shell[data-view="home"] .omni-home__feature-page.is-script .omni-home__feature-visual,
+.web-shell[data-view="home"] .omni-home__feature-page.is-model .omni-home__feature-visual,
+.web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce .omni-home__feature-visual {
+  width: min(100%, 1320px);
+  height: clamp(600px, 76dvh, 760px);
+  min-height: 0;
+  margin-inline: auto;
+  overflow: hidden;
+  border: 0;
+  background:
+    radial-gradient(circle at 18% 12%, rgb(0 255 136 / 7%), transparent 30%),
+    radial-gradient(circle at 82% 76%, rgb(84 139 255 / 5%), transparent 32%);
+  box-shadow: none;
+}
+
+.web-shell[data-view="home"] .omni-home__feature-page.is-script .omni-home__feature-visual::before,
+.web-shell[data-view="home"] .omni-home__feature-page.is-model .omni-home__feature-visual::before,
+.web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce .omni-home__feature-visual::before {
+  content: "";
+  position: absolute;
+  inset: 2px;
+  border-radius: inherit;
+  background: linear-gradient(180deg, rgb(255 255 255 / 3%), transparent 28%);
+  pointer-events: none;
+}
+
+.web-shell[data-view="home"] .omni-home__feature-page.is-model .omni-home__feature-visual,
+.web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce .omni-home__feature-visual {
+  height: clamp(600px, 74dvh, 740px);
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix {
+  min-height: 0;
+  border-radius: inherit;
+  background: transparent;
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .page {
+  display: grid;
+  grid-template-columns: minmax(260px, 0.82fr) minmax(260px, 0.78fr) minmax(330px, 1fr);
+  align-items: center;
+  height: 100%;
+  min-height: 0;
+  gap: clamp(18px, 2vw, 34px);
+  padding: clamp(22px, 2.4vw, 38px);
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .left-panel,
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .center-panel,
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .right-panel {
+  min-width: 0;
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .left-panel {
+  flex: none;
+  justify-content: center;
+  gap: clamp(14px, 1.4vw, 22px);
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .hero-title {
+  max-width: 9em;
+  background: none;
+  color: #f3fbf6;
+  -webkit-text-fill-color: currentColor;
+  font-size: clamp(34px, 3vw, 48px);
+  text-shadow: 0 18px 54px rgb(0 0 0 / 36%);
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .hero-desc {
+  max-width: 390px;
+  color: rgb(232 240 236 / 66%);
+  font-size: clamp(14px, 1.05vw, 16px);
+  line-height: 1.68;
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .feature-item,
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .input-card,
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node,
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-card {
+  border-color: rgb(255 255 255 / 10%);
+  border-radius: 14px;
+  background:
+    linear-gradient(180deg, rgb(255 255 255 / 6%), rgb(255 255 255 / 2.5%)),
+    rgb(8 13 12 / 76%);
+  box-shadow:
+    0 18px 44px rgb(0 0 0 / 22%),
+    inset 0 1px 0 rgb(255 255 255 / 7%);
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .feature-item {
+  min-height: 74px;
+  padding: clamp(12px, 1vw, 16px);
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .feature-icon {
+  flex-basis: 40px;
+  width: 40px;
+  height: 40px;
+  border-color: rgb(255 255 255 / 10%);
+  border-radius: 12px;
+  background: rgb(255 255 255 / 5%);
+  color: rgb(214 255 236 / 82%);
+  font-size: 17px;
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .feature-text h4 {
+  font-size: clamp(15px, 1.05vw, 18px);
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .feature-text p {
+  color: rgb(232 240 236 / 46%);
+  font-size: clamp(12px, 0.86vw, 14px);
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .process-flow {
+  display: none;
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .center-panel,
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .right-panel {
+  flex: none;
+  justify-content: center;
+  padding-left: 0;
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .input-card {
+  width: min(100%, 320px);
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .right-panel {
+  gap: 14px;
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-group {
+  gap: 12px;
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-label {
+  flex-basis: 90px;
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-label h4 {
+  font-size: clamp(13px, 0.95vw, 15px);
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-label p {
+  font-size: 11px;
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-card {
+  min-height: 0;
+  padding: 8px;
+}
+
+@media (max-width: 1100px) {
+  .web-shell[data-view="home"] .omni-home__feature-page.is-script,
+  .web-shell[data-view="home"] .omni-home__feature-page.is-model,
+  .web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce {
+    min-height: auto;
+    padding: clamp(34px, 6vw, 56px) clamp(20px, 4vw, 40px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__feature-page.is-script .omni-home__feature-visual,
+  .web-shell[data-view="home"] .omni-home__feature-page.is-model .omni-home__feature-visual,
+  .web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce .omni-home__feature-visual {
+    width: min(100%, 880px);
+    height: auto;
+    min-height: 0;
+    overflow: visible;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .page {
+    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
+    grid-template-rows: auto auto;
+    height: auto;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .left-panel {
+    grid-column: 1 / -1;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .hero-title,
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .hero-desc {
+    max-width: none;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .features {
+    display: grid;
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .center-panel {
+    grid-column: 1;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .right-panel {
+    grid-column: 2;
+  }
+}
+
+@media (max-width: 640px) {
+  .web-shell[data-view="home"] .omni-home__feature-page.is-script,
+  .web-shell[data-view="home"] .omni-home__feature-page.is-model,
+  .web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce {
+    padding: 30px 14px 40px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .page {
+    grid-template-columns: 1fr;
+    gap: 16px;
+    padding: 16px 0;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .left-panel,
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .center-panel,
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .right-panel {
+    grid-column: 1;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .features {
+    grid-template-columns: 1fr;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .input-card {
+    width: min(100%, 300px);
+    margin-inline: auto;
+  }
+}
+
+@media (max-width: 480px) {
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .page {
+    gap: 12px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .hero-title {
+    font-size: 28px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .hero-desc {
+    font-size: 13px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .feature-item {
+    min-height: 58px;
+    padding: 10px 12px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .feature-icon {
+    flex-basis: 34px;
+    width: 34px;
+    height: 34px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .feature-text p {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .input-card {
+    width: min(100%, 280px);
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node {
+    padding: 12px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node-list {
+    gap: 6px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node-item {
+    font-size: 11px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-group {
+    gap: 8px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-label p,
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-card-res {
+    display: none;
+  }
+}
+
+/* Device-fit pass: feature pages scale by both viewport width and height. */
+@media (min-width: 1101px) {
+  .web-shell[data-view="home"] .omni-home__feature-page.is-script,
+  .web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce {
+    min-height: clamp(620px, 82dvh, 840px);
+    padding-block: clamp(34px, 4.2dvh, 64px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__feature-page.is-script .omni-home__feature-visual,
+  .web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce .omni-home__feature-visual {
+    width: min(100%, clamp(1120px, 86vw, 1320px));
+    height: clamp(560px, calc(100dvh - 180px), 720px);
+  }
+}
+
+@media (min-width: 900px) and (max-width: 1100px) {
+  .web-shell[data-view="home"] .omni-home__feature-page.is-script,
+  .web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce {
+    padding: clamp(28px, 4vw, 44px) clamp(24px, 4vw, 40px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__feature-page.is-script .omni-home__feature-visual,
+  .web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce .omni-home__feature-visual {
+    width: min(100%, 980px);
+    height: auto;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .page {
+    grid-template-columns: minmax(230px, 0.68fr) minmax(230px, 0.72fr) minmax(300px, 1fr);
+    align-items: center;
+    gap: 18px;
+    padding: 20px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .left-panel {
+    grid-column: auto;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .features {
+    grid-template-columns: 1fr;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .hero-title {
+    font-size: clamp(30px, 3.6vw, 38px);
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .hero-desc,
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .feature-text p {
+    font-size: 12px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .input-card {
+    width: min(100%, 280px);
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .right-panel {
+    grid-column: auto;
+    gap: 10px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-group {
+    gap: 8px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-label {
+    flex-basis: 70px;
+  }
+}
+
+@media (max-width: 899px) {
+  .web-shell[data-view="home"] .omni-home__feature-page.is-script,
+  .web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce {
+    padding-inline: clamp(14px, 4vw, 28px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__feature-page.is-script .omni-home__feature-visual,
+  .web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce .omni-home__feature-visual {
+    width: min(100%, 760px);
+  }
+}
+
+@media (max-width: 520px) {
+  .web-shell[data-view="home"] .omni-home__feature-page.is-script,
+  .web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce {
+    padding: 24px 12px 34px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__feature-page.is-script .omni-home__feature-visual,
+  .web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce .omni-home__feature-visual {
+    width: min(100%, 430px);
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .page {
+    padding-block: 8px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .right-panel {
+    gap: 10px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-group {
+    display: grid;
+    grid-template-columns: minmax(56px, 0.22fr) minmax(0, 1fr);
+    align-items: center;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-label {
+    width: auto;
+    text-align: left;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-label h4 {
+    font-size: 12px;
+    line-height: 1.15;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-cards {
+    display: grid;
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+    gap: 6px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-card {
+    padding: 4px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-card-img,
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-card.square .output-card-img {
+    aspect-ratio: 1;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-card-tag {
+    top: 4px;
+    right: 4px;
+    padding: 3px 5px;
+    font-size: 9px;
+  }
+}
+
+/* Device-fit refinement: keep immersive sections proportional on portrait tablets and phones. */
+@media (min-width: 700px) and (max-width: 899px) {
+  .web-shell[data-view="home"] .omni-home__feature-page.is-script,
+  .web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce {
+    min-height: auto;
+    padding-block: clamp(24px, 4vw, 40px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__feature-page.is-script .omni-home__feature-visual,
+  .web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce .omni-home__feature-visual {
+    width: min(100%, 820px);
+    height: auto;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .page {
+    display: grid;
+    grid-template-columns: minmax(190px, 0.72fr) minmax(180px, 0.62fr) minmax(280px, 1fr);
+    align-items: center;
+    gap: 14px;
+    min-height: 0;
+    padding: 18px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .left-panel,
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .center-panel,
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .right-panel {
+    flex: initial;
+    gap: 10px;
+    padding-left: 0;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .hero-title {
+    font-size: clamp(27px, 4vw, 36px);
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .hero-desc {
+    display: -webkit-box;
+    overflow: hidden;
+    font-size: 12px;
+    line-height: 1.45;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .features {
+    gap: 8px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .feature-item {
+    min-height: 54px;
+    gap: 8px;
+    padding: 10px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .feature-icon {
+    flex-basis: 32px;
+    width: 32px;
+    height: 32px;
+    font-size: 15px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .feature-text h4 {
+    font-size: 13px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .feature-text p {
+    display: -webkit-box;
+    overflow: hidden;
+    margin-top: 2px;
+    font-size: 10px;
+    line-height: 1.3;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 1;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .process-flow {
+    min-height: 48px;
+    padding: 8px 10px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .step-sub {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .input-card {
+    width: min(100%, 190px);
+    padding: 10px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .input-card-header {
+    margin-bottom: 8px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .input-card-label {
+    font-size: 10px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .input-card-res {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node {
+    min-height: 46px;
+    padding: 8px 10px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node-list {
+    gap: 6px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node-item {
+    padding: 5px 7px;
+    font-size: 10px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-group {
+    gap: 8px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-label {
+    flex-basis: 58px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-label h4 {
+    font-size: 12px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-label p,
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-card-res {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-cards {
+    gap: 6px;
+  }
+}
+
+@media (max-width: 699px) {
+  .web-shell[data-view="home"] .omni-home__feature-page.is-script,
+  .web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce {
+    min-height: auto;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .page {
+    display: grid;
+    grid-template-columns: minmax(0, 0.94fr) minmax(124px, 0.56fr);
+    grid-template-areas:
+      "copy input"
+      "outputs outputs";
+    gap: 10px;
+    min-height: 0;
+    padding: 12px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .left-panel {
+    grid-area: copy;
+    gap: 8px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .center-panel {
+    grid-area: input;
+    justify-content: start;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .right-panel {
+    grid-area: outputs;
+    gap: 8px;
+    padding-left: 0;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .hero-title {
+    font-size: clamp(24px, 7vw, 34px);
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .hero-desc {
+    display: -webkit-box;
+    overflow: hidden;
+    font-size: 11px;
+    line-height: 1.4;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .features {
+    gap: 6px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .feature-item {
+    min-height: 42px;
+    gap: 7px;
+    padding: 7px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .feature-icon {
+    flex-basis: 26px;
+    width: 26px;
+    height: 26px;
+    font-size: 12px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .feature-text h4 {
+    font-size: 12px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .feature-text p,
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .process-flow,
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node-list,
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-label p,
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-card-res,
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .flow-svg {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .input-card {
+    width: min(100%, 150px);
+    padding: 7px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .input-card-header {
+    margin-bottom: 6px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .input-card-label {
+    font-size: 9px;
+    letter-spacing: 0.5px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .input-card-res {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node {
+    min-height: 34px;
+    padding: 7px 9px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node-title {
+    font-size: 10px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-group {
+    grid-template-columns: minmax(50px, 0.18fr) minmax(0, 1fr);
+    gap: 7px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-label {
+    padding-right: 0;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-label h4 {
+    font-size: 11px;
+  }
+}
+
+@media (min-width: 900px) and (max-width: 1100px) {
+  .web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce {
+    min-height: auto;
+    padding-block: clamp(24px, 3.8dvh, 34px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__feature-page.is-ecommerce .omni-home__feature-visual {
+    height: clamp(520px, calc(100dvh - 170px), 600px);
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix {
+    height: 100%;
+    min-height: 0;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .page {
+    height: 100%;
+    min-height: 0;
+    grid-template-columns: minmax(210px, 0.68fr) minmax(190px, 0.6fr) minmax(300px, 1fr);
+    gap: 14px;
+    padding: 16px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .left-panel {
+    gap: 10px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .hero-title {
+    font-size: clamp(28px, 3.2vw, 34px);
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .hero-desc {
+    display: -webkit-box;
+    overflow: hidden;
+    font-size: 11px;
+    line-height: 1.42;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .features {
+    gap: 7px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .feature-item {
+    min-height: 48px;
+    gap: 8px;
+    padding: 8px 9px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .feature-icon {
+    flex-basis: 30px;
+    width: 30px;
+    height: 30px;
+    font-size: 13px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .feature-text h4 {
+    font-size: 12px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .feature-text p {
+    display: -webkit-box;
+    overflow: hidden;
+    margin-top: 2px;
+    font-size: 10px;
+    line-height: 1.25;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 1;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .process-flow {
+    min-height: 42px;
+    padding: 7px 9px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .step-icon {
+    font-size: 13px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .step-label {
+    font-size: 10px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .step-sub {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .input-card {
+    width: min(100%, 210px);
+    padding: 10px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .input-card-header {
+    margin-bottom: 8px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .input-card-label {
+    font-size: 10px;
+    letter-spacing: 0.7px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .input-card-res {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .right-panel {
+    gap: 8px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node {
+    min-height: 42px;
+    padding: 7px 9px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node-title {
+    font-size: 10px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node-item {
+    padding: 4px 6px;
+    font-size: 9px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-group {
+    gap: 7px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-label {
+    flex-basis: 54px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-label h4 {
+    font-size: 11px;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-label p,
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-card-res {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-cards {
+    gap: 6px;
+  }
+}
+
+/* Homepage polish pass: clearer product paths without changing content or page structure. */
+.web-shell[data-view="home"] .omni-home__shell {
+  padding-bottom: clamp(92px, 9dvh, 132px);
+}
+
+.web-shell[data-view="home"] .omni-home__hero {
+  gap: clamp(16px, 2vw, 30px);
+}
+
+.web-shell[data-view="home"] .omni-home__copy h1 {
+  letter-spacing: 0;
+  text-wrap: balance;
+}
+
+.web-shell[data-view="home"] .omni-home__copy p {
+  text-wrap: balance;
+}
+
+.web-shell[data-view="home"] .omni-home__carousel::after {
+  content: "";
+  position: absolute;
+  left: 50%;
+  bottom: clamp(-18px, -1.2vw, -8px);
+  width: min(760px, 72vw);
+  height: 1px;
+  transform: translateX(-50%);
+  background: linear-gradient(90deg, transparent, rgb(255 255 255 / 16%), rgb(0 255 136 / 28%), transparent);
+  opacity: 0.72;
+  pointer-events: none;
+}
+
+.web-shell[data-view="home"] .omni-home__actions {
+  position: relative;
+  width: min(100%, 720px);
+  padding: 6px;
+  border: 1px solid rgb(255 255 255 / 8%);
+  border-radius: 18px;
+  background:
+    linear-gradient(180deg, rgb(255 255 255 / 5%), rgb(255 255 255 / 2%)),
+    rgb(4 8 7 / 52%);
+  box-shadow:
+    0 22px 70px rgb(0 0 0 / 28%),
+    inset 0 1px 0 rgb(255 255 255 / 7%);
+  backdrop-filter: blur(16px);
+}
+
+.web-shell[data-view="home"] .omni-home__entry {
+  min-height: 62px;
+  border-color: transparent;
+  border-radius: 13px;
+  background: transparent;
+  box-shadow: none;
+}
+
+.web-shell[data-view="home"] .omni-home__entry:hover {
+  border-color: rgb(255 255 255 / 9%);
+  background: rgb(255 255 255 / 5%);
+  transform: translateY(-1px);
+}
+
+.web-shell[data-view="home"] .omni-home__entry--primary,
+.web-shell[data-view="home"] .omni-home__entry--primary:hover {
+  border-color: rgb(0 255 136 / 58%);
+  background:
+    linear-gradient(180deg, rgb(99 255 181), rgb(0 238 127)),
+    rgb(0 255 136);
+  box-shadow:
+    0 18px 46px rgb(0 255 136 / 18%),
+    inset 0 1px 0 rgb(255 255 255 / 32%);
+}
+
+.web-shell[data-view="home"] .omni-home__entry .anticon {
+  display: grid;
+  place-items: center;
+  width: 26px;
+  height: 26px;
+  border-radius: 999px;
+  background: rgb(255 255 255 / 8%);
+}
+
+.web-shell[data-view="home"] .omni-home__entry--primary .anticon {
+  background: rgb(4 18 14 / 12%);
+}
+
+.web-shell[data-view="home"] .omni-home__entry small {
+  margin-top: 2px;
+}
+
+@media (max-width: 720px) {
+  .web-shell[data-view="home"] .omni-home__shell {
+    padding-top: clamp(26px, 7vw, 40px);
+    padding-bottom: calc(168px + env(safe-area-inset-bottom));
+  }
+
+  .web-shell[data-view="home"] .omni-home__actions {
+    width: min(100%, 430px);
+    gap: 7px;
+    padding: 7px;
+    border-radius: 18px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__entry {
+    justify-content: center;
+    min-height: 58px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__entry:not(.omni-home__entry--primary) {
+    background: rgb(255 255 255 / 4%);
+  }
+
+  .web-shell[data-view="home"] .cookie-consent {
+    max-height: 126px;
+  }
+}
+
+@media (max-width: 480px) {
+  .web-shell[data-view="home"] .omni-home__shell {
+    padding-bottom: calc(164px + env(safe-area-inset-bottom));
+  }
+
+  .web-shell[data-view="home"] .omni-home__hero {
+    gap: 13px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__copy h1 {
+    font-size: clamp(39px, 13vw, 54px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__copy p {
+    max-width: 28em;
+    line-height: 1.72;
+  }
+
+  .web-shell[data-view="home"] .omni-home__actions {
+    gap: 8px;
+  }
+}
+
+/* Taste polish: make the hero entries feel like a product path selector, not three loose cards. */
+.web-shell[data-view="home"] .omni-home__carousel::after {
+  background: linear-gradient(90deg, transparent, rgb(255 255 255 / 12%), rgb(255 255 255 / 18%), transparent);
+}
+
+.web-shell[data-view="home"] .omni-home__actions {
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  border-color: rgb(255 255 255 / 7%);
+  background:
+    linear-gradient(180deg, rgb(255 255 255 / 4.5%), rgb(255 255 255 / 1.8%)),
+    rgb(3 8 7 / 48%);
+}
+
+.web-shell[data-view="home"] .omni-home__entry {
+  min-height: 60px;
+  padding: 0 18px;
+  color: rgb(240 248 244 / 88%);
+}
+
+.web-shell[data-view="home"] .omni-home__entry > span:not(.anticon) {
+  display: grid;
+  gap: 2px;
+  min-width: 0;
+  line-height: 1.12;
+  text-align: left;
+}
+
+.web-shell[data-view="home"] .omni-home__entry small {
+  color: rgb(223 236 230 / 46%);
+  font-size: 11px;
+  font-weight: 700;
+}
+
+.web-shell[data-view="home"] .omni-home__entry--primary small {
+  color: rgb(4 18 14 / 56%);
+}
+
+.web-shell[data-view="home"] .omni-home__entry .anticon {
+  flex: 0 0 auto;
+  color: rgb(235 244 240 / 72%);
+}
+
+.web-shell[data-view="home"] .omni-home__entry--primary .anticon {
+  color: rgb(4 18 14 / 72%);
+}
+
+@media (max-width: 720px) {
+  .web-shell[data-view="home"] .omni-home__shell {
+    padding-bottom: calc(118px + env(safe-area-inset-bottom));
+  }
+
+  .web-shell[data-view="home"] .omni-home__actions {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    width: min(100%, 380px);
+    gap: 8px;
+    padding: 6px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__entry {
+    justify-content: flex-start;
+    min-height: 54px;
+    padding: 0 12px;
+    font-size: 14px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__entry--primary {
+    grid-column: 1 / -1;
+    order: -1;
+    justify-content: center;
+  }
+
+  .web-shell[data-view="home"] .omni-home__entry--primary > span:not(.anticon) {
+    text-align: left;
+  }
+
+  .web-shell[data-view="home"] .omni-home__entry .anticon {
+    width: 24px;
+    height: 24px;
+    font-size: 14px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__entry small {
+    font-size: 10px;
+  }
+}
+
+@media (max-width: 480px) {
+  .web-shell[data-view="home"] .omni-home__shell {
+    padding-bottom: calc(112px + env(safe-area-inset-bottom));
+  }
+
+  .web-shell[data-view="home"] .omni-home__copy h1 {
+    font-size: clamp(36px, 12vw, 50px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__actions {
+    width: min(100%, 354px);
+  }
+}
+
+/* Home feedback pass: keep the entry colors original, improve ecommerce and script showcase fit. */
+.web-shell[data-view="home"] .omni-home__actions {
+  border-color: rgb(42 48 50 / 86%);
+  background:
+    linear-gradient(180deg, rgb(255 255 255 / 3%), rgb(255 255 255 / 1%)),
+    rgb(16 18 20 / 74%);
+  box-shadow:
+    0 18px 52px rgb(0 0 0 / 30%),
+    inset 0 1px 0 rgb(255 255 255 / 5%);
+}
+
+.web-shell[data-view="home"] .omni-home__entry {
+  border-color: rgb(42 48 50 / 92%);
+  background: #101214;
+  color: #f3f5f2;
+  box-shadow: none;
+}
+
+.web-shell[data-view="home"] .omni-home__entry:hover {
+  border-color: #394044;
+  background: #202527;
+  color: #ffffff;
+}
+
+.web-shell[data-view="home"] .omni-home__entry:not(.omni-home__entry--primary) .anticon {
+  background: rgb(255 255 255 / 6%);
+  color: rgb(243 245 242 / 76%);
+}
+
+.web-shell[data-view="home"] .omni-home__entry small {
+  color: #7e8983;
+}
+
+.web-shell[data-view="home"] .omni-home__entry--primary,
+.web-shell[data-view="home"] .omni-home__entry--primary:hover {
+  border-color: var(--accent);
+  background: var(--accent);
+  color: var(--dg-button-text, #061014);
+  box-shadow:
+    0 18px 44px rgb(0 255 136 / 14%),
+    inset 0 1px 0 rgb(255 255 255 / 24%);
+}
+
+.web-shell[data-view="home"] .omni-home__entry--primary small {
+  color: rgb(6 16 20 / 58%);
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node {
+  order: 4;
+  display: grid;
+  grid-template-columns: auto minmax(0, 1fr);
+  align-items: center;
+  gap: 10px 14px;
+  min-height: auto;
+  padding: 12px 14px;
+  background:
+    linear-gradient(180deg, rgb(255 255 255 / 5%), rgb(255 255 255 / 2%)),
+    rgb(8 13 12 / 76%);
+  box-shadow:
+    0 14px 34px rgb(0 0 0 / 18%),
+    inset 0 1px 0 rgb(255 255 255 / 6%);
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node-title {
+  background: none;
+  color: var(--matrix-cyan);
+  -webkit-text-fill-color: currentColor;
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node-list {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  gap: 7px;
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node-item {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-height: 28px;
+  overflow: visible;
+  border: 1px solid rgb(0 255 136 / 10%);
+  border-left-width: 1px;
+  border-radius: 7px;
+  background: rgb(255 255 255 / 3.5%);
+  color: rgb(232 240 236 / 68%);
+  font-size: 11px;
+  line-height: 1.18;
+  text-align: center;
+  text-overflow: clip;
+  white-space: normal;
+}
+
+.web-shell[data-view="home"] .omni-home__feature-page.is-script {
+  min-height: var(--home-section-min-height);
+  padding: clamp(34px, 5vw, 64px) clamp(18px, 5vw, 72px);
+  background:
+    linear-gradient(180deg, #070b10 0%, #05080d 100%),
+    radial-gradient(ellipse 70% 48% at 58% 42%, rgb(0 255 136 / 4.5%) 0%, transparent 70%);
+}
+
+.web-shell[data-view="home"] .omni-home__feature-page.is-script .omni-home__feature-visual {
+  width: min(100%, 1440px);
+  height: auto;
+  min-height: clamp(560px, 52vw, 760px);
+  border: 0;
+  border-radius: 0;
+  background: transparent;
+  box-shadow: none;
+  overflow: visible;
+}
+
+@media (max-width: 720px) {
+  .web-shell[data-view="home"] .omni-home__actions {
+    background:
+      linear-gradient(180deg, rgb(255 255 255 / 3%), rgb(255 255 255 / 1%)),
+      rgb(16 18 20 / 78%);
+  }
+
+  .web-shell[data-view="home"] .omni-home__entry:not(.omni-home__entry--primary) {
+    background: #101214;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node {
+    grid-template-columns: 1fr;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node-list {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+}
+
+/* Script review should share the same screen rhythm as the toolbox section. */
+.web-shell[data-view="home"] .omni-home__feature-page.is-script .omni-home__feature-visual {
+  height: clamp(620px, calc(100dvh - 170px), 760px);
+  min-height: 0;
+  overflow: hidden;
+}
+
+/* Home feedback refinement: keep the hero entry palette, move the commerce workflow to a readable bottom band. */
+.web-shell[data-view="home"] .omni-home__actions {
+  width: min(100%, 620px);
+  border: 1px solid rgb(42 48 50 / 88%);
+  background: rgb(16 18 20 / 78%);
+}
+
+.web-shell[data-view="home"] .omni-home {
+  overflow-x: clip;
+}
+
+.web-shell[data-view="home"] .omni-home__entry:not(.omni-home__entry--primary) {
+  border-color: rgb(42 48 50 / 92%);
+  background: #101214;
+  color: #f3f5f2;
+}
+
+.web-shell[data-view="home"] .omni-home__entry:not(.omni-home__entry--primary):hover {
+  border-color: #394044;
+  background: #202527;
+  color: #ffffff;
+}
+
+.web-shell[data-view="home"] .omni-home__entry--primary,
+.web-shell[data-view="home"] .omni-home__entry--primary:hover {
+  border-color: var(--accent);
+  background: var(--accent);
+  color: var(--dg-button-text, #061014);
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .right-panel {
+  justify-content: center;
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .output-group {
+  order: 1;
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node {
+  order: 9;
+  grid-template-columns: minmax(92px, auto) minmax(0, 1fr);
+  align-items: center;
+  margin-top: 2px;
+  padding: clamp(12px, 1vw, 16px) clamp(14px, 1.35vw, 22px);
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node-list {
+  grid-template-columns: repeat(5, minmax(0, 1fr));
+  gap: 8px;
+}
+
+.web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node-item {
+  min-height: 32px;
+  padding: 6px 8px;
+  white-space: normal;
+}
+
+.web-shell[data-view="home"] .omni-home__feature-page.is-script {
+  padding: clamp(36px, 5.5vw, 68px) clamp(20px, 6vw, 76px);
+}
+
+.web-shell[data-view="home"] .omni-home__feature-page.is-script .omni-home__feature-visual {
+  width: min(100%, 1440px);
+  height: clamp(620px, calc(100dvh - 150px), 780px);
+}
+
+@media (max-width: 1180px) {
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node-list {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+  }
+}
+
+@media (max-width: 720px) {
+  .web-shell[data-view="home"] .omni-home__actions {
+    width: min(100%, 430px);
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node {
+    grid-template-columns: 1fr;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node-list {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+
+  .web-shell[data-view="home"] .omni-home__feature-page.is-script {
+    padding: 30px 14px 42px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__feature-page.is-script .omni-home__feature-visual {
+    height: auto;
+    overflow: visible;
+  }
+}
+
+@media (max-width: 760px) {
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .page {
+    grid-template-columns: minmax(0, 1fr);
+    grid-template-areas:
+      "copy"
+      "input"
+      "outputs";
+    align-items: stretch;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .left-panel,
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .center-panel,
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .right-panel {
+    width: 100%;
+    max-width: 100%;
+    padding-left: 0;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .left-panel {
+    grid-area: copy;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .center-panel {
+    grid-area: input;
+    justify-content: center;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .right-panel {
+    grid-area: outputs;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .hero-title,
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .hero-desc {
+    max-width: 100%;
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .input-card {
+    width: min(100%, 240px);
+  }
+
+  .web-shell[data-view="home"] .omni-home-ecommerce-matrix .ai-node-list {
+    display: grid;
+  }
+}
diff --git a/src/styles/pages/model-generation-showcase.css b/src/styles/pages/model-generation-showcase.css
index 6277354..1432adc 100644
--- a/src/styles/pages/model-generation-showcase.css
+++ b/src/styles/pages/model-generation-showcase.css
@@ -83,14 +83,15 @@
 .mgs-brand-section h1 {
   max-width: 9.6em;
   margin: 0;
-  background: linear-gradient(135deg, var(--mgs-green), var(--mgs-mint), var(--mgs-blue));
-  -webkit-background-clip: text;
-  background-clip: text;
-  color: transparent;
+  background: none;
+  color: #eef8f2;
   font-size: clamp(30px, 2.35cqw, 50px);
   font-weight: 950;
   letter-spacing: 0;
   line-height: 1.16;
+  text-shadow:
+    0 18px 54px rgba(0, 0, 0, 0.38),
+    0 0 34px rgba(0, 255, 136, 0.08);
 }
 
 .mgs-subtitle {
@@ -180,6 +181,10 @@
   font-weight: 900;
 }
 
+.mgs-mode-icon .anticon {
+  font-size: 0.9em;
+}
+
 .mgs-mode-info {
   min-width: 0;
 }
@@ -591,6 +596,10 @@
     box-shadow 200ms ease;
 }
 
+.mgs-img-cell .anticon {
+  font-size: 0.9em;
+}
+
 .mgs-img-cell:hover {
   border-color: var(--mgs-border-hover);
   transform: scale(1.02);
@@ -664,11 +673,9 @@
   transform: scale(1.06);
 }
 
-.mgs-play-btn svg {
-  width: 34%;
-  height: 34%;
-  margin-left: 3px;
-  fill: var(--mgs-green);
+.mgs-play-btn .anticon {
+  color: var(--mgs-green);
+  font-size: 46%;
 }
 
 .mgs-video-timeline {
@@ -900,11 +907,9 @@
   background: rgba(168, 85, 247, 0.18);
 }
 
-.mgs-mini-play svg {
-  width: 34%;
-  height: 34%;
-  margin-left: 2px;
-  fill: var(--mgs-purple);
+.mgs-mini-play .anticon {
+  color: var(--mgs-purple);
+  font-size: 54%;
 }
 
 .mgs-video-duration {
@@ -1003,3 +1008,315 @@
     text-align: left;
   }
 }
+
+/* Home landing responsive containment */
+@media (max-width: 980px) {
+  .web-shell[data-view="home"] .omni-model-gen-showcase {
+    gap: 14px;
+    padding: 18px;
+    overflow-y: auto;
+  }
+
+  .web-shell[data-view="home"] .mgs-brand-section {
+    gap: 10px;
+  }
+
+  .web-shell[data-view="home"] .mgs-brand-section h1 {
+    font-size: clamp(28px, 6vw, 42px);
+  }
+
+  .web-shell[data-view="home"] .mgs-subtitle {
+    font-size: clamp(13px, 2.4vw, 16px);
+    line-height: 1.55;
+  }
+
+  .web-shell[data-view="home"] .mgs-mode-tabs {
+    gap: 10px;
+  }
+
+  .web-shell[data-view="home"] .mgs-mode-tab {
+    min-height: 92px;
+    padding: 12px;
+  }
+
+  .web-shell[data-view="home"] .mgs-input-card {
+    min-height: 420px;
+  }
+}
+
+@media (max-width: 560px) {
+  .web-shell[data-view="home"] .omni-model-gen-showcase {
+    gap: 12px;
+    padding: 14px;
+  }
+
+  .web-shell[data-view="home"] .mgs-mode-tabs {
+    grid-template-columns: 1fr;
+  }
+
+  .web-shell[data-view="home"] .mgs-mode-tab {
+    grid-template-columns: 42px minmax(0, 1fr);
+    justify-items: stretch;
+    min-height: 70px;
+    text-align: left;
+  }
+
+  .web-shell[data-view="home"] .mgs-mode-icon {
+    width: 42px;
+    height: 42px;
+    font-size: 20px;
+  }
+
+  .web-shell[data-view="home"] .mgs-mode-info p {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .mgs-workflow {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .mgs-input-card {
+    min-height: 360px;
+  }
+
+  .web-shell[data-view="home"] .mgs-output-cards {
+    gap: 10px;
+  }
+
+  .web-shell[data-view="home"] .mgs-out-card {
+    min-height: auto;
+    padding: 14px;
+  }
+}
+
+/* Homepage landing tune: calmer, responsive product showcase. */
+.web-shell[data-view="home"] .omni-model-gen-showcase {
+  grid-template-columns: minmax(250px, 0.7fr) minmax(330px, 1fr) minmax(330px, 1fr);
+  gap: clamp(16px, 1.8vw, 28px);
+  padding: clamp(22px, 2.4vw, 38px);
+  background: transparent;
+}
+
+.web-shell[data-view="home"] .omni-model-gen-showcase::before {
+  background: radial-gradient(circle at 50% 0%, rgb(0 255 136 / 8%), transparent 34%);
+  opacity: 0.5;
+}
+
+.web-shell[data-view="home"] .omni-model-gen-showcase::after {
+  opacity: 0.1;
+}
+
+.web-shell[data-view="home"] .mgs-left-panel {
+  gap: clamp(14px, 1.6vw, 24px);
+  padding-block: 0;
+}
+
+.web-shell[data-view="home"] .mgs-brand-section {
+  gap: 14px;
+}
+
+.web-shell[data-view="home"] .mgs-brand-section h1 {
+  max-width: 8em;
+  font-size: clamp(32px, 3vw, 48px);
+  line-height: 1.12;
+}
+
+.web-shell[data-view="home"] .mgs-subtitle {
+  color: rgb(232 240 236 / 66%);
+  font-size: clamp(14px, 1.05vw, 16px);
+  line-height: 1.68;
+}
+
+.web-shell[data-view="home"] .mgs-mode-tabs {
+  gap: 10px;
+}
+
+.web-shell[data-view="home"] .mgs-mode-tab,
+.web-shell[data-view="home"] .mgs-workflow,
+.web-shell[data-view="home"] .mgs-input-card,
+.web-shell[data-view="home"] .mgs-out-card {
+  border-color: rgb(255 255 255 / 10%);
+  border-radius: 14px;
+  background:
+    linear-gradient(180deg, rgb(255 255 255 / 6%), rgb(255 255 255 / 2.5%)),
+    rgb(8 13 12 / 76%);
+  box-shadow:
+    0 18px 44px rgb(0 0 0 / 22%),
+    inset 0 1px 0 rgb(255 255 255 / 7%);
+}
+
+.web-shell[data-view="home"] .mgs-mode-tab {
+  grid-template-columns: 42px minmax(0, 1fr);
+  min-height: 78px;
+  padding: 12px 14px;
+}
+
+.web-shell[data-view="home"] .mgs-mode-tab:hover {
+  transform: translateX(2px);
+}
+
+.web-shell[data-view="home"] .mgs-mode-icon {
+  width: 42px;
+  height: 42px;
+  border-radius: 12px;
+  background: rgb(255 255 255 / 5%);
+  color: rgb(214 255 236 / 82%);
+  font-size: 20px;
+}
+
+.web-shell[data-view="home"] .mgs-mode-info h3 {
+  font-size: clamp(15px, 1.05vw, 18px);
+}
+
+.web-shell[data-view="home"] .mgs-mode-info p {
+  color: rgb(232 240 236 / 46%);
+  font-size: clamp(12px, 0.82vw, 13px);
+}
+
+.web-shell[data-view="home"] .mgs-workflow {
+  padding: 14px;
+}
+
+.web-shell[data-view="home"] .mgs-workflow-title {
+  margin-bottom: 10px;
+  color: rgb(232 240 236 / 42%);
+  font-size: 11px;
+  letter-spacing: 0.04em;
+}
+
+.web-shell[data-view="home"] .mgs-workflow-steps {
+  flex-wrap: wrap;
+  gap: 8px;
+}
+
+.web-shell[data-view="home"] .mgs-workflow-steps > span {
+  gap: 8px;
+}
+
+.web-shell[data-view="home"] .mgs-wf-step {
+  min-height: 34px;
+  padding-inline: 10px;
+  font-size: 12px;
+}
+
+.web-shell[data-view="home"] .mgs-input-card {
+  align-self: center;
+  height: auto;
+  min-height: clamp(430px, 48dvh, 560px);
+  max-width: 100%;
+  padding: clamp(18px, 1.8vw, 26px);
+}
+
+.web-shell[data-view="home"] .mgs-card-mode-badge {
+  min-height: 36px;
+  padding-inline: 14px;
+  font-size: 13px;
+}
+
+.web-shell[data-view="home"] .mgs-card-status {
+  font-size: 12px;
+}
+
+.web-shell[data-view="home"] .mgs-prompt-input {
+  height: clamp(82px, 8vw, 112px);
+  font-size: 13px;
+}
+
+.web-shell[data-view="home"] .mgs-agent-result-text,
+.web-shell[data-view="home"] .mgs-out-preview {
+  font-size: 13px;
+  line-height: 1.62;
+}
+
+.web-shell[data-view="home"] .mgs-right-panel {
+  justify-content: center;
+}
+
+.web-shell[data-view="home"] .mgs-output-cards {
+  gap: 12px;
+}
+
+.web-shell[data-view="home"] .mgs-out-card {
+  min-height: clamp(128px, 12dvh, 172px);
+  padding: 16px;
+}
+
+.web-shell[data-view="home"] .mgs-out-title {
+  font-size: clamp(15px, 1.08vw, 18px);
+}
+
+.web-shell[data-view="home"] .mgs-out-img-placeholder,
+.web-shell[data-view="home"] .mgs-out-video-placeholder {
+  min-height: clamp(72px, 7dvh, 104px);
+  border-style: solid;
+}
+
+.web-shell[data-view="home"] .mgs-out-img-placeholder .anticon {
+  font-size: 0.9em;
+}
+
+@container (max-width: 1180px) {
+  .web-shell[data-view="home"] .omni-model-gen-showcase {
+    grid-template-columns: minmax(240px, 0.64fr) minmax(0, 1.36fr);
+  }
+
+  .web-shell[data-view="home"] .mgs-right-panel {
+    grid-column: 1 / -1;
+  }
+
+  .web-shell[data-view="home"] .mgs-output-cards {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+  }
+}
+
+@media (max-width: 1100px) {
+  .web-shell[data-view="home"] .omni-model-gen-showcase {
+    grid-template-columns: 1fr;
+    overflow: visible;
+  }
+
+  .web-shell[data-view="home"] .mgs-left-panel {
+    grid-template-rows: auto auto auto;
+  }
+
+  .web-shell[data-view="home"] .mgs-brand-section h1,
+  .web-shell[data-view="home"] .mgs-subtitle {
+    max-width: none;
+  }
+
+  .web-shell[data-view="home"] .mgs-mode-tabs {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+  }
+
+  .web-shell[data-view="home"] .mgs-mode-tab {
+    grid-template-columns: 38px minmax(0, 1fr);
+    min-height: 70px;
+  }
+
+  .web-shell[data-view="home"] .mgs-input-card {
+    min-height: 420px;
+  }
+}
+
+@media (max-width: 720px) {
+  .web-shell[data-view="home"] .omni-model-gen-showcase {
+    padding: 10px 0;
+  }
+
+  .web-shell[data-view="home"] .mgs-mode-tabs,
+  .web-shell[data-view="home"] .mgs-output-cards {
+    grid-template-columns: 1fr;
+  }
+
+  .web-shell[data-view="home"] .mgs-mode-info p {
+    display: block;
+  }
+
+  .web-shell[data-view="home"] .mgs-workflow {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .mgs-input-card {
+    min-height: 360px;
+  }
+}
diff --git a/src/styles/pages/script-review-showcase.css b/src/styles/pages/script-review-showcase.css
index 1e0b84f..684e200 100644
--- a/src/styles/pages/script-review-showcase.css
+++ b/src/styles/pages/script-review-showcase.css
@@ -909,3 +909,1110 @@
     padding: 16px;
   }
 }
+
+/* Home landing tune: compact desktop dashboard, resilient mobile stack. */
+.web-shell[data-view="home"] .omni-script-review-showcase {
+  grid-template-columns: minmax(280px, 0.72fr) minmax(0, 1.28fr);
+  gap: clamp(18px, 2.4vw, 32px);
+  padding: clamp(22px, 2.7vw, 42px);
+  border-radius: inherit;
+  background:
+    radial-gradient(circle at 18% 20%, rgb(0 255 136 / 8%), transparent 30%),
+    radial-gradient(circle at 82% 68%, rgb(84 139 255 / 6%), transparent 28%),
+    linear-gradient(180deg, #050807 0%, #030504 100%);
+}
+
+.web-shell[data-view="home"] .srs-left-panel {
+  grid-template-rows: auto minmax(0, 1fr) auto;
+  gap: clamp(16px, 2vw, 28px);
+  padding-block: clamp(6px, 1vw, 14px);
+}
+
+.web-shell[data-view="home"] .srs-brand-section {
+  gap: clamp(12px, 1.4vw, 20px);
+}
+
+.web-shell[data-view="home"] .srs-brand-section h1 {
+  max-width: 7em;
+  background: none;
+  color: #f3fbf6;
+  font-size: clamp(32px, 3vw, 48px);
+  text-shadow:
+    0 18px 54px rgb(0 0 0 / 34%),
+    0 0 30px rgb(0 255 136 / 8%);
+}
+
+.web-shell[data-view="home"] .srs-brand-section p {
+  max-width: 360px;
+  color: rgb(232 240 236 / 66%);
+  font-size: clamp(14px, 1.04vw, 16px);
+  font-weight: 700;
+  line-height: 1.72;
+}
+
+.web-shell[data-view="home"] .srs-point-list {
+  gap: 10px;
+}
+
+.web-shell[data-view="home"] .srs-point-card,
+.web-shell[data-view="home"] .srs-flow-card,
+.web-shell[data-view="home"] .srs-score-hero,
+.web-shell[data-view="home"] .srs-chart-card,
+.web-shell[data-view="home"] .srs-section-card {
+  border-color: rgb(255 255 255 / 10%);
+  border-radius: 14px;
+  background:
+    linear-gradient(180deg, rgb(255 255 255 / 6%), rgb(255 255 255 / 2.5%)),
+    rgb(8 13 12 / 78%);
+  box-shadow:
+    0 18px 44px rgb(0 0 0 / 22%),
+    inset 0 1px 0 rgb(255 255 255 / 7%);
+}
+
+.web-shell[data-view="home"] .srs-point-card {
+  grid-template-columns: 40px minmax(0, 1fr);
+  min-height: 70px;
+  padding: 12px 14px;
+}
+
+.web-shell[data-view="home"] .srs-point-icon {
+  width: 40px;
+  height: 40px;
+  border-color: rgb(255 255 255 / 9%);
+  border-radius: 12px;
+  background: rgb(255 255 255 / 5%);
+  color: rgb(224 248 237 / 82%);
+  font-size: 15px;
+}
+
+.web-shell[data-view="home"] .srs-point-card h3 {
+  font-size: 15px;
+}
+
+.web-shell[data-view="home"] .srs-point-card p {
+  color: rgb(232 240 236 / 45%);
+  font-size: 12px;
+}
+
+.web-shell[data-view="home"] .srs-flow-card {
+  min-height: 68px;
+  padding: 12px 14px;
+}
+
+.web-shell[data-view="home"] .srs-results-panel {
+  grid-template-rows: auto minmax(260px, 1fr) minmax(150px, 0.66fr);
+  gap: clamp(12px, 1.25vw, 18px);
+}
+
+.web-shell[data-view="home"] .srs-score-hero {
+  grid-template-columns: minmax(230px, 0.64fr) 1px minmax(0, 1.36fr);
+  min-height: 104px;
+  padding: 16px 18px;
+}
+
+.web-shell[data-view="home"] .srs-score-circle {
+  width: clamp(72px, 5vw, 90px);
+  height: clamp(72px, 5vw, 90px);
+}
+
+.web-shell[data-view="home"] .srs-score-num {
+  font-size: clamp(26px, 2vw, 34px);
+}
+
+.web-shell[data-view="home"] .srs-score-grade {
+  font-size: clamp(22px, 1.8vw, 32px);
+}
+
+.web-shell[data-view="home"] .srs-score-summary {
+  color: rgb(232 240 236 / 62%);
+  font-size: clamp(13px, 1vw, 15px);
+  line-height: 1.58;
+}
+
+.web-shell[data-view="home"] .srs-chart-card {
+  padding: 16px 22px 12px;
+}
+
+.web-shell[data-view="home"] .srs-chart-title {
+  font-size: 12px;
+  letter-spacing: 0.06em;
+}
+
+.web-shell[data-view="home"] .srs-chart-body {
+  gap: clamp(14px, 2vw, 32px);
+}
+
+.web-shell[data-view="home"] .srs-chart-bar-wrap {
+  min-height: clamp(120px, 13vw, 190px);
+}
+
+.web-shell[data-view="home"] .srs-chart-bar-bg,
+.web-shell[data-view="home"] .srs-chart-bar-fill {
+  width: min(100%, clamp(42px, 3.7vw, 68px));
+}
+
+.web-shell[data-view="home"] .srs-chart-bar-score {
+  top: -26px;
+  font-size: clamp(15px, 1.1vw, 20px);
+}
+
+.web-shell[data-view="home"] .srs-chart-col-name {
+  font-size: clamp(12px, 0.9vw, 14px);
+}
+
+.web-shell[data-view="home"] .srs-chart-col-desc {
+  color: rgb(232 240 236 / 54%);
+  font-size: clamp(11px, 0.8vw, 13px);
+  line-height: 1.45;
+}
+
+.web-shell[data-view="home"] .srs-triple-section {
+  gap: 12px;
+}
+
+.web-shell[data-view="home"] .srs-section-card {
+  padding: 14px;
+}
+
+.web-shell[data-view="home"] .srs-section-item {
+  padding: 10px;
+}
+
+.web-shell[data-view="home"] .srs-section-item-text {
+  font-size: 11px;
+  line-height: 1.55;
+}
+
+@media (max-width: 1080px) {
+  .web-shell[data-view="home"] .omni-script-review-showcase {
+    grid-template-columns: 1fr;
+    gap: 18px;
+    overflow: visible;
+  }
+
+  .web-shell[data-view="home"] .srs-left-panel {
+    grid-template-rows: auto auto auto;
+    padding-block: 0;
+  }
+
+  .web-shell[data-view="home"] .srs-brand-section h1,
+  .web-shell[data-view="home"] .srs-brand-section p {
+    max-width: none;
+  }
+
+  .web-shell[data-view="home"] .srs-point-list {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+  }
+
+  .web-shell[data-view="home"] .srs-results-panel {
+    grid-template-rows: auto auto auto;
+  }
+}
+
+@media (min-width: 761px) and (max-width: 1080px) {
+  .web-shell[data-view="home"] .srs-score-left {
+    grid-column: 1;
+  }
+
+  .web-shell[data-view="home"] .srs-score-divider {
+    display: block;
+    grid-column: 2;
+  }
+
+  .web-shell[data-view="home"] .srs-score-right {
+    grid-column: 3;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-body {
+    grid-template-columns: repeat(6, minmax(0, 1fr));
+    gap: 14px;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-col {
+    grid-template-columns: none;
+    grid-template-rows: minmax(120px, 1fr) auto;
+    min-height: 0;
+    padding: 0;
+    border: 0;
+    background: transparent;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-bar-wrap {
+    grid-column: auto;
+    grid-row: auto;
+    height: 100%;
+    min-height: clamp(120px, 18vw, 170px);
+  }
+
+  .web-shell[data-view="home"] .srs-chart-bar-bg,
+  .web-shell[data-view="home"] .srs-chart-bar-fill {
+    width: min(100%, 48px);
+    height: auto;
+    border-radius: 10px 10px 0 0;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-bar-bg {
+    left: 50%;
+    transform: translateX(-50%);
+  }
+
+  .web-shell[data-view="home"] .srs-chart-col-label {
+    grid-column: auto;
+    grid-row: auto;
+    text-align: center;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-col-desc {
+    display: block;
+  }
+
+  .web-shell[data-view="home"] .srs-triple-section {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+  }
+}
+
+@media (max-width: 760px) {
+  .web-shell[data-view="home"] .omni-script-review-showcase {
+    padding: 16px;
+    border-radius: 14px;
+  }
+
+  .web-shell[data-view="home"] .srs-point-list,
+  .web-shell[data-view="home"] .srs-triple-section {
+    grid-template-columns: 1fr;
+  }
+
+  .web-shell[data-view="home"] .srs-score-hero {
+    grid-template-columns: 1fr;
+  }
+
+  .web-shell[data-view="home"] .srs-score-divider {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-card {
+    padding: 14px;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-body {
+    grid-template-columns: 1fr;
+    gap: 10px;
+    padding-top: 12px;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-col {
+    grid-template-columns: minmax(88px, 0.36fr) minmax(0, 1fr);
+    grid-template-rows: auto;
+    align-items: center;
+    justify-items: stretch;
+    min-height: 46px;
+    padding: 10px;
+    border: 1px solid rgb(255 255 255 / 7%);
+    border-radius: 12px;
+    background: rgb(255 255 255 / 3%);
+  }
+
+  .web-shell[data-view="home"] .srs-chart-bar-wrap {
+    grid-column: 2;
+    grid-row: 1;
+    height: 16px;
+    min-height: 16px;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-bar-bg,
+  .web-shell[data-view="home"] .srs-chart-bar-fill {
+    width: 100%;
+    height: 100% !important;
+    border-radius: 999px;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-bar-bg {
+    left: 0;
+    transform: none;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-col:nth-child(1) .srs-chart-bar-fill { width: 80%; }
+  .web-shell[data-view="home"] .srs-chart-col:nth-child(2) .srs-chart-bar-fill { width: 80%; }
+  .web-shell[data-view="home"] .srs-chart-col:nth-child(3) .srs-chart-bar-fill { width: 100%; }
+  .web-shell[data-view="home"] .srs-chart-col:nth-child(4) .srs-chart-bar-fill { width: 80%; }
+  .web-shell[data-view="home"] .srs-chart-col:nth-child(5) .srs-chart-bar-fill { width: 66%; }
+  .web-shell[data-view="home"] .srs-chart-col:nth-child(6) .srs-chart-bar-fill { width: 53%; }
+
+  .web-shell[data-view="home"] .srs-chart-bar-score {
+    top: 50%;
+    right: 8px;
+    left: auto;
+    font-size: 12px;
+    transform: translateY(-50%);
+  }
+
+  .web-shell[data-view="home"] .srs-chart-col-label {
+    grid-column: 1;
+    grid-row: 1;
+    text-align: left;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-col-desc {
+    display: none;
+  }
+}
+
+@media (max-width: 480px) {
+  .web-shell[data-view="home"] .srs-brand-section h1 {
+    font-size: clamp(28px, 9vw, 38px);
+  }
+
+  .web-shell[data-view="home"] .srs-brand-section p {
+    font-size: 13px;
+  }
+
+  .web-shell[data-view="home"] .srs-flow-card {
+    grid-template-columns: 1fr;
+    justify-items: stretch;
+  }
+
+  .web-shell[data-view="home"] .srs-flow-card b {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .srs-score-left {
+    align-items: flex-start;
+    flex-direction: column;
+  }
+}
+
+@media (max-width: 480px) {
+  .web-shell[data-view="home"] .omni-script-review-showcase {
+    gap: 12px;
+    padding: 10px 0;
+  }
+
+  .web-shell[data-view="home"] .srs-left-panel,
+  .web-shell[data-view="home"] .srs-results-panel {
+    gap: 12px;
+  }
+
+  .web-shell[data-view="home"] .srs-point-card {
+    grid-template-columns: 34px minmax(0, 1fr);
+    min-height: 58px;
+    padding: 10px 12px;
+  }
+
+  .web-shell[data-view="home"] .srs-point-icon {
+    width: 34px;
+    height: 34px;
+    border-radius: 10px;
+  }
+
+  .web-shell[data-view="home"] .srs-point-card p,
+  .web-shell[data-view="home"] .srs-flow-card {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .srs-score-hero,
+  .web-shell[data-view="home"] .srs-chart-card,
+  .web-shell[data-view="home"] .srs-section-card {
+    padding: 12px;
+  }
+
+  .web-shell[data-view="home"] .srs-score-circle {
+    width: 68px;
+    height: 68px;
+  }
+
+  .web-shell[data-view="home"] .srs-score-tags,
+  .web-shell[data-view="home"] .srs-score-summary,
+  .web-shell[data-view="home"] .srs-chart-title {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-body {
+    gap: 8px;
+    padding-top: 0;
+  }
+
+  .web-shell[data-view="home"] .srs-section-card {
+    gap: 8px;
+  }
+
+  .web-shell[data-view="home"] .srs-section-list {
+    gap: 6px;
+  }
+
+  .web-shell[data-view="home"] .srs-section-item {
+    padding: 8px;
+  }
+}
+
+/* Device-fit pass: keep tablet landscape compact instead of switching too early to a tall stack. */
+@media (min-width: 900px) and (max-width: 1080px) {
+  .web-shell[data-view="home"] .omni-script-review-showcase {
+    grid-template-columns: minmax(250px, 0.68fr) minmax(0, 1.32fr);
+    gap: 18px;
+    padding: 20px;
+  }
+
+  .web-shell[data-view="home"] .srs-left-panel {
+    grid-template-rows: auto minmax(0, 1fr);
+    gap: 14px;
+  }
+
+  .web-shell[data-view="home"] .srs-brand-section {
+    gap: 10px;
+  }
+
+  .web-shell[data-view="home"] .srs-brand-section h1 {
+    max-width: 7em;
+    font-size: clamp(30px, 3.4vw, 38px);
+  }
+
+  .web-shell[data-view="home"] .srs-brand-section p {
+    font-size: 13px;
+    line-height: 1.55;
+  }
+
+  .web-shell[data-view="home"] .srs-point-list {
+    grid-template-columns: 1fr;
+    gap: 8px;
+  }
+
+  .web-shell[data-view="home"] .srs-point-card {
+    min-height: 60px;
+    padding: 10px 12px;
+  }
+
+  .web-shell[data-view="home"] .srs-point-card p,
+  .web-shell[data-view="home"] .srs-flow-card {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .srs-results-panel {
+    grid-template-rows: auto minmax(210px, 1fr) auto;
+    gap: 12px;
+  }
+
+  .web-shell[data-view="home"] .srs-score-hero {
+    grid-template-columns: minmax(220px, 0.7fr) 1px minmax(0, 1.3fr);
+    padding: 14px;
+  }
+
+  .web-shell[data-view="home"] .srs-score-circle {
+    width: 70px;
+    height: 70px;
+  }
+
+  .web-shell[data-view="home"] .srs-score-summary {
+    font-size: 12px;
+    line-height: 1.45;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-card {
+    padding: 14px 16px 10px;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-body {
+    gap: 10px;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-bar-wrap {
+    min-height: clamp(96px, 13vw, 140px);
+  }
+
+  .web-shell[data-view="home"] .srs-triple-section {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+    gap: 10px;
+  }
+
+  .web-shell[data-view="home"] .srs-section-card {
+    padding: 10px;
+  }
+
+  .web-shell[data-view="home"] .srs-section-list {
+    display: none;
+  }
+}
+
+@media (max-width: 520px) {
+  .web-shell[data-view="home"] .omni-script-review-showcase {
+    padding: 8px 0;
+  }
+
+  .web-shell[data-view="home"] .srs-brand-section {
+    gap: 8px;
+  }
+
+  .web-shell[data-view="home"] .srs-brand-section h1 {
+    font-size: clamp(26px, 8.2vw, 34px);
+  }
+
+  .web-shell[data-view="home"] .srs-brand-section p {
+    font-size: 12px;
+    line-height: 1.45;
+  }
+
+  .web-shell[data-view="home"] .srs-results-panel {
+    gap: 10px;
+  }
+
+  .web-shell[data-view="home"] .srs-score-hero {
+    min-height: 0;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-col {
+    min-height: 40px;
+    padding: 8px;
+  }
+
+  .web-shell[data-view="home"] .srs-triple-section {
+    gap: 8px;
+  }
+}
+
+/* Device-fit refinement: reduce height without changing the showcase structure. */
+@media (min-width: 700px) and (max-width: 899px) {
+  .web-shell[data-view="home"] .omni-script-review-showcase {
+    display: grid;
+    grid-template-columns: minmax(220px, 0.7fr) minmax(0, 1.3fr);
+    gap: 16px;
+    padding: 18px;
+  }
+
+  .web-shell[data-view="home"] .srs-left-panel {
+    gap: 12px;
+  }
+
+  .web-shell[data-view="home"] .srs-brand-section {
+    gap: 8px;
+  }
+
+  .web-shell[data-view="home"] .srs-brand-section h1 {
+    max-width: 7em;
+    font-size: clamp(28px, 4vw, 38px);
+  }
+
+  .web-shell[data-view="home"] .srs-brand-section p {
+    display: -webkit-box;
+    overflow: hidden;
+    font-size: 12px;
+    line-height: 1.45;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 3;
+  }
+
+  .web-shell[data-view="home"] .srs-point-list {
+    gap: 8px;
+  }
+
+  .web-shell[data-view="home"] .srs-point-card {
+    grid-template-columns: 34px minmax(0, 1fr);
+    min-height: 54px;
+    gap: 8px;
+    padding: 8px 10px;
+  }
+
+  .web-shell[data-view="home"] .srs-point-icon {
+    width: 34px;
+    height: 34px;
+    font-size: 14px;
+  }
+
+  .web-shell[data-view="home"] .srs-point-card h3 {
+    margin-bottom: 0;
+    font-size: 13px;
+  }
+
+  .web-shell[data-view="home"] .srs-point-card p,
+  .web-shell[data-view="home"] .srs-flow-card,
+  .web-shell[data-view="home"] .srs-section-list {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .srs-results-panel {
+    grid-template-rows: auto minmax(190px, 1fr) auto;
+    gap: 10px;
+  }
+
+  .web-shell[data-view="home"] .srs-score-hero {
+    grid-template-columns: minmax(188px, 0.68fr) 1px minmax(0, 1.32fr);
+    gap: 12px;
+    min-height: 92px;
+    padding: 12px;
+  }
+
+  .web-shell[data-view="home"] .srs-score-left {
+    gap: 10px;
+  }
+
+  .web-shell[data-view="home"] .srs-score-circle {
+    width: 58px;
+    height: 58px;
+  }
+
+  .web-shell[data-view="home"] .srs-score-num {
+    font-size: 24px;
+  }
+
+  .web-shell[data-view="home"] .srs-score-grade {
+    font-size: 24px;
+  }
+
+  .web-shell[data-view="home"] .srs-score-tags {
+    gap: 5px;
+  }
+
+  .web-shell[data-view="home"] .srs-score-tag {
+    min-height: 20px;
+    padding-inline: 7px;
+    font-size: 10px;
+  }
+
+  .web-shell[data-view="home"] .srs-score-summary {
+    display: -webkit-box;
+    overflow: hidden;
+    font-size: 11px;
+    line-height: 1.4;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-card {
+    padding: 10px 12px 8px;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-title {
+    margin-bottom: 8px;
+    font-size: 11px;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-body {
+    gap: 8px;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-bar-wrap {
+    min-height: 82px;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-col-label {
+    margin-top: 6px;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-col-desc {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .srs-triple-section {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+    gap: 8px;
+  }
+
+  .web-shell[data-view="home"] .srs-section-card {
+    gap: 6px;
+    padding: 8px;
+  }
+}
+
+@media (max-width: 699px) {
+  .web-shell[data-view="home"] .omni-script-review-showcase {
+    display: grid;
+    gap: 10px;
+    padding: 10px;
+  }
+
+  .web-shell[data-view="home"] .srs-left-panel {
+    gap: 9px;
+  }
+
+  .web-shell[data-view="home"] .srs-brand-section {
+    gap: 6px;
+  }
+
+  .web-shell[data-view="home"] .srs-brand-section h1 {
+    font-size: clamp(24px, 7vw, 32px);
+  }
+
+  .web-shell[data-view="home"] .srs-brand-section p {
+    display: -webkit-box;
+    overflow: hidden;
+    font-size: 11px;
+    line-height: 1.4;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+  }
+
+  .web-shell[data-view="home"] .srs-point-list {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+    gap: 6px;
+  }
+
+  .web-shell[data-view="home"] .srs-point-card {
+    display: grid;
+    grid-template-columns: 1fr;
+    justify-items: start;
+    min-height: 58px;
+    gap: 5px;
+    padding: 8px;
+  }
+
+  .web-shell[data-view="home"] .srs-point-icon {
+    width: 24px;
+    height: 24px;
+    font-size: 11px;
+  }
+
+  .web-shell[data-view="home"] .srs-point-card h3 {
+    margin: 0;
+    font-size: 11px;
+    line-height: 1.2;
+  }
+
+  .web-shell[data-view="home"] .srs-point-card p,
+  .web-shell[data-view="home"] .srs-flow-card,
+  .web-shell[data-view="home"] .srs-score-divider,
+  .web-shell[data-view="home"] .srs-score-tags,
+  .web-shell[data-view="home"] .srs-score-summary,
+  .web-shell[data-view="home"] .srs-chart-col-desc,
+  .web-shell[data-view="home"] .srs-section-list {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .srs-results-panel {
+    grid-template-rows: auto auto auto;
+    gap: 8px;
+  }
+
+  .web-shell[data-view="home"] .srs-score-hero {
+    grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
+    gap: 8px;
+    min-height: 74px;
+    padding: 10px;
+  }
+
+  .web-shell[data-view="home"] .srs-score-left {
+    gap: 8px;
+  }
+
+  .web-shell[data-view="home"] .srs-score-circle {
+    width: 52px;
+    height: 52px;
+  }
+
+  .web-shell[data-view="home"] .srs-score-circle-inner {
+    width: calc(100% - 12px);
+    height: calc(100% - 12px);
+  }
+
+  .web-shell[data-view="home"] .srs-score-num {
+    font-size: 21px;
+  }
+
+  .web-shell[data-view="home"] .srs-score-grade {
+    font-size: 20px;
+  }
+
+  .web-shell[data-view="home"] .srs-score-proj {
+    margin-bottom: 0;
+    font-size: 10px;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-card {
+    padding: 9px 10px;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-title {
+    margin-bottom: 7px;
+    font-size: 11px;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-body {
+    display: grid;
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+    gap: 6px;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-col {
+    min-height: 68px;
+    padding: 6px;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-bar-wrap {
+    min-height: 40px;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-bar-bg,
+  .web-shell[data-view="home"] .srs-chart-bar-fill {
+    width: 8px;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-bar-score {
+    font-size: 9px;
+  }
+
+  .web-shell[data-view="home"] .srs-chart-col-label {
+    margin-top: 5px;
+    font-size: 10px;
+    line-height: 1.15;
+  }
+
+  .web-shell[data-view="home"] .srs-triple-section {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+    gap: 6px;
+  }
+
+  .web-shell[data-view="home"] .srs-section-card {
+    min-height: 58px;
+    gap: 4px;
+    padding: 8px;
+  }
+
+  .web-shell[data-view="home"] .srs-section-header {
+    gap: 6px;
+  }
+}
+
+/* Home feedback pass: align script review section with the toolbox page rhythm. */
+.web-shell[data-view="home"] .omni-script-review-showcase {
+  min-height: clamp(560px, 52vw, 760px);
+  grid-template-columns: minmax(300px, 0.42fr) minmax(0, 1fr);
+  gap: clamp(18px, 2.8vw, 36px);
+  padding: clamp(34px, 5vw, 64px) 0;
+  border-radius: 0;
+  background: transparent;
+}
+
+.web-shell[data-view="home"] .srs-left-panel {
+  grid-template-rows: auto auto auto;
+  align-self: center;
+  gap: 14px;
+  padding-block: 0;
+}
+
+.web-shell[data-view="home"] .srs-brand-section h1 {
+  max-width: 8em;
+  color: #f7fff9;
+  font-size: clamp(32px, 3.4vw, 46px);
+}
+
+.web-shell[data-view="home"] .srs-brand-section p {
+  max-width: 420px;
+  font-size: clamp(15px, 1.18vw, 17px);
+  line-height: 1.65;
+}
+
+.web-shell[data-view="home"] .srs-point-list {
+  display: grid;
+  grid-template-columns: 1fr;
+  gap: 10px;
+}
+
+.web-shell[data-view="home"] .srs-point-card {
+  min-height: 76px;
+  border-radius: 16px;
+}
+
+.web-shell[data-view="home"] .srs-flow-card {
+  margin-top: auto;
+  border-radius: 16px;
+}
+
+.web-shell[data-view="home"] .srs-results-panel {
+  align-self: stretch;
+  grid-template-rows: auto minmax(260px, 1fr) minmax(150px, 0.7fr);
+  gap: 16px;
+  min-width: 0;
+}
+
+.web-shell[data-view="home"] .srs-score-hero,
+.web-shell[data-view="home"] .srs-chart-card,
+.web-shell[data-view="home"] .srs-section-card {
+  border-radius: 18px;
+}
+
+@media (max-width: 980px) {
+  .web-shell[data-view="home"] .omni-script-review-showcase {
+    grid-template-columns: 1fr;
+    padding: 0;
+  }
+
+  .web-shell[data-view="home"] .srs-left-panel {
+    gap: 12px;
+  }
+
+  .web-shell[data-view="home"] .srs-point-list {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+  }
+}
+
+@media (max-width: 699px) {
+  .web-shell[data-view="home"] .srs-point-list {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+  }
+}
+
+/* Keep the script showcase from exceeding the toolbox-like section height. */
+.web-shell[data-view="home"] .omni-script-review-showcase {
+  height: 100%;
+  min-height: 0;
+  align-items: stretch;
+  padding-block: clamp(22px, 3vw, 42px);
+}
+
+.web-shell[data-view="home"] .srs-left-panel,
+.web-shell[data-view="home"] .srs-results-panel {
+  min-height: 0;
+}
+
+.web-shell[data-view="home"] .srs-results-panel {
+  grid-template-rows: minmax(92px, auto) minmax(210px, 1fr) minmax(124px, 0.55fr);
+  overflow: hidden;
+}
+
+.web-shell[data-view="home"] .srs-chart-card,
+.web-shell[data-view="home"] .srs-triple-section,
+.web-shell[data-view="home"] .srs-section-card,
+.web-shell[data-view="home"] .srs-section-list {
+  min-height: 0;
+}
+
+.web-shell[data-view="home"] .srs-chart-bar-wrap {
+  min-height: clamp(92px, 10vw, 140px);
+}
+
+.web-shell[data-view="home"] .srs-section-card {
+  overflow: hidden;
+}
+
+.web-shell[data-view="home"] .srs-section-list {
+  overflow: auto;
+}
+
+/* Home feedback refinement: match the toolbox page's left-copy/right-grid composition. */
+.web-shell[data-view="home"] .omni-script-review-showcase {
+  display: grid;
+  grid-template-columns: clamp(320px, 30vw, 450px) minmax(0, 1fr);
+  gap: clamp(18px, 2.8vw, 36px);
+  width: 100%;
+  height: 100%;
+  padding: 0;
+  background: transparent;
+}
+
+.web-shell[data-view="home"] .srs-left-panel {
+  align-self: center;
+  gap: 17px;
+  justify-content: flex-start;
+  padding-top: clamp(24px, 4vh, 62px);
+}
+
+.web-shell[data-view="home"] .srs-brand-section h1 {
+  max-width: 9em;
+  font-size: clamp(36px, 3.8vw, 50px);
+  line-height: 1.15;
+}
+
+.web-shell[data-view="home"] .srs-brand-section p {
+  max-width: 100%;
+  font-size: clamp(16px, 1.2vw, 18px);
+  line-height: 1.55;
+}
+
+.web-shell[data-view="home"] .srs-point-list {
+  gap: 10px;
+}
+
+.web-shell[data-view="home"] .srs-point-card {
+  min-height: 74px;
+  padding: 15px 18px;
+}
+
+.web-shell[data-view="home"] .srs-flow-card {
+  margin-top: auto;
+  padding: 17px 20px;
+}
+
+.web-shell[data-view="home"] .srs-results-panel {
+  align-self: center;
+  grid-template-rows: minmax(112px, auto) minmax(260px, 1fr) minmax(150px, 0.62fr);
+  gap: 16px;
+  min-height: clamp(560px, 52vw, 760px);
+  overflow: hidden;
+}
+
+.web-shell[data-view="home"] .srs-score-hero,
+.web-shell[data-view="home"] .srs-chart-card,
+.web-shell[data-view="home"] .srs-section-card {
+  border-color: rgb(0 255 136 / 10%);
+  background:
+    linear-gradient(180deg, rgb(255 255 255 / 5%), rgb(255 255 255 / 2%)),
+    rgb(8 13 12 / 72%);
+}
+
+@media (max-width: 1080px) {
+  .web-shell[data-view="home"] .omni-script-review-showcase {
+    grid-template-columns: 1fr;
+    height: auto;
+  }
+
+  .web-shell[data-view="home"] .srs-left-panel {
+    padding-top: 0;
+  }
+
+  .web-shell[data-view="home"] .srs-results-panel {
+    min-height: 0;
+    overflow: visible;
+  }
+}
+
+@media (min-width: 760px) and (max-width: 1080px) {
+  .web-shell[data-view="home"] .omni-script-review-showcase {
+    grid-template-columns: minmax(260px, 0.38fr) minmax(0, 0.62fr);
+    height: 100%;
+  }
+
+  .web-shell[data-view="home"] .srs-results-panel {
+    min-height: 0;
+    overflow: hidden;
+  }
+}
+
+@media (max-width: 759px) {
+  .web-shell[data-view="home"] .omni-script-review-showcase {
+    grid-template-columns: 1fr;
+    gap: 12px;
+    height: auto;
+  }
+
+  .web-shell[data-view="home"] .srs-brand-section h1 {
+    font-size: clamp(26px, 8vw, 36px);
+  }
+
+  .web-shell[data-view="home"] .srs-left-panel,
+  .web-shell[data-view="home"] .srs-results-panel {
+    min-width: 0;
+    padding-top: 0;
+  }
+
+  .web-shell[data-view="home"] .srs-results-panel {
+    grid-template-rows: auto auto auto;
+    min-height: 0;
+    overflow: visible;
+  }
+
+  .web-shell[data-view="home"] .srs-flow-card,
+  .web-shell[data-view="home"] .srs-point-card p,
+  .web-shell[data-view="home"] .srs-score-summary,
+  .web-shell[data-view="home"] .srs-chart-col-desc,
+  .web-shell[data-view="home"] .srs-section-list {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .srs-point-list,
+  .web-shell[data-view="home"] .srs-triple-section {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+  }
+
+  .web-shell[data-view="home"] .srs-point-card,
+  .web-shell[data-view="home"] .srs-section-card {
+    min-height: 58px;
+    padding: 10px;
+  }
+}
diff --git a/src/styles/pages/toolbox.css b/src/styles/pages/toolbox.css
index a425b1d..be44ff4 100644
--- a/src/styles/pages/toolbox.css
+++ b/src/styles/pages/toolbox.css
@@ -1138,3 +1138,623 @@
     gap: 5px;
   }
 }
+
+/* Premium landing pass: keep toolbox content, align material with the home redesign. */
+.web-shell[data-view="home"] .omni-home__toolbox-page {
+  --toolbox-surface: rgb(255 255 255 / 4.5%);
+  --toolbox-elevated: rgb(255 255 255 / 6%);
+  --toolbox-border-subtle: rgb(255 255 255 / 8%);
+  --toolbox-border-default: rgb(255 255 255 / 10%);
+  --toolbox-border-hover: rgb(0 255 136 / 28%);
+  --toolbox-text-primary: #f4f8f5;
+  --toolbox-text-secondary: rgb(232 240 236 / 66%);
+  --toolbox-text-tertiary: rgb(232 240 236 / 42%);
+  border-top-color: rgb(255 255 255 / 7%);
+  background:
+    radial-gradient(circle at 18% 20%, rgb(0 255 136 / 9%), transparent 31%),
+    radial-gradient(circle at 82% 70%, rgb(84 139 255 / 7%), transparent 30%),
+    linear-gradient(180deg, #050807 0%, #030504 100%);
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-page::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  z-index: 0;
+  background:
+    linear-gradient(90deg, rgb(255 255 255 / 2.3%) 1px, transparent 1px),
+    linear-gradient(180deg, rgb(255 255 255 / 2.3%) 1px, transparent 1px);
+  background-size: 42px 42px;
+  mask-image: linear-gradient(180deg, rgb(0 0 0 / 62%), rgb(0 0 0 / 20%));
+  pointer-events: none;
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-brand-icon {
+  border: 1px solid rgb(0 255 136 / 28%);
+  background:
+    linear-gradient(145deg, rgb(0 255 136 / 22%), rgb(255 255 255 / 4%)),
+    rgb(7 17 15 / 90%);
+  color: var(--toolbox-green);
+  box-shadow:
+    0 16px 40px rgb(0 0 0 / 24%),
+    inset 0 1px 0 rgb(255 255 255 / 10%);
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-title {
+  background: none;
+  color: var(--toolbox-text-primary);
+  -webkit-text-fill-color: currentColor;
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-subtitle {
+  color: var(--toolbox-text-secondary);
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-item,
+.web-shell[data-view="home"] .omni-home__toolbox-workflow,
+.web-shell[data-view="home"] .omni-home__toolbox-card {
+  border-color: var(--toolbox-border-default);
+  border-radius: 18px;
+  background:
+    linear-gradient(180deg, rgb(255 255 255 / 6%), rgb(255 255 255 / 2.5%)),
+    rgb(8 13 12 / 78%);
+  box-shadow:
+    0 20px 50px rgb(0 0 0 / 24%),
+    inset 0 1px 0 rgb(255 255 255 / 7%);
+  backdrop-filter: blur(18px);
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-item:hover,
+.web-shell[data-view="home"] .omni-home__toolbox-card:hover {
+  border-color: var(--toolbox-border-hover);
+  background:
+    linear-gradient(180deg, rgb(255 255 255 / 8%), rgb(255 255 255 / 3%)),
+    rgb(10 18 16 / 86%);
+  box-shadow:
+    0 26px 62px rgb(0 0 0 / 30%),
+    inset 0 1px 0 rgb(255 255 255 / 8%);
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-item-icon,
+.web-shell[data-view="home"] .omni-home__toolbox-card-icon {
+  border-color: rgb(255 255 255 / 9%);
+  background: rgb(255 255 255 / 5%);
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-card-tag,
+.web-shell[data-view="home"] .omni-home__toolbox-card-feat {
+  border-color: rgb(255 255 255 / 8%);
+  background: rgb(255 255 255 / 5%);
+  color: rgb(214 255 236 / 72%);
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-card {
+  overflow: hidden;
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-card::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+  background:
+    linear-gradient(180deg, rgb(255 255 255 / 4%), transparent 34%),
+    radial-gradient(circle at 50% 0%, rgb(0 255 136 / 7%), transparent 42%);
+  pointer-events: none;
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-card > * {
+  position: relative;
+  z-index: 1;
+}
+
+/* Final tune after homepage landing feedback */
+.web-shell[data-view="home"] .omni-home__toolbox-shell {
+  width: min(100%, 1360px);
+  gap: clamp(20px, 2.6vw, 36px);
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-left {
+  width: clamp(300px, 26vw, 390px);
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-brand-icon {
+  width: 46px;
+  height: 46px;
+  border-radius: 14px;
+  font-size: 21px;
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-brand-icon .anticon {
+  font-size: 21px;
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-brand-text {
+  font-size: clamp(22px, 2vw, 28px);
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-title {
+  font-size: clamp(32px, 3vw, 44px);
+  line-height: 1.12;
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-subtitle {
+  max-width: 380px;
+  font-size: clamp(14px, 1.08vw, 16px);
+  line-height: 1.65;
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-item {
+  gap: 14px;
+  padding: 14px 16px;
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-item-icon {
+  width: 40px;
+  height: 40px;
+  border: 1px solid rgb(255 255 255 / 9%);
+  border-radius: 12px;
+  color: rgb(214 255 236 / 82%);
+  font-size: 18px;
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-item-icon .anticon {
+  font-size: 18px;
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-item-name {
+  font-size: 15px;
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-item-desc {
+  font-size: 12px;
+  line-height: 1.45;
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-grid {
+  gap: 14px;
+  min-height: clamp(500px, 45vw, 640px);
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-card-icon {
+  width: 30px;
+  height: 30px;
+  border: 1px solid rgb(255 255 255 / 9%);
+  border-radius: 10px;
+  color: rgb(214 255 236 / 82%);
+  font-size: 15px;
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-card-icon .anticon {
+  font-size: 15px;
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-card-title {
+  font-size: 14px;
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-card-tag {
+  font-size: 10px;
+}
+
+/* Homepage landing tune: make this section feel like one product story, not a separate template block. */
+.web-shell[data-view="home"] .omni-home__toolbox-page {
+  min-height: clamp(660px, 86dvh, 820px);
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-shell {
+  display: grid;
+  grid-template-columns: minmax(300px, 0.78fr) minmax(620px, 1.22fr);
+  align-items: center;
+  width: min(100% - 56px, 1320px);
+  min-height: inherit;
+  margin-inline: auto;
+  padding: clamp(42px, 5.2vw, 72px) 0;
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-left {
+  width: auto;
+  max-width: 390px;
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-brand-icon,
+.web-shell[data-view="home"] .omni-home__toolbox-item-icon,
+.web-shell[data-view="home"] .omni-home__toolbox-card-icon {
+  background:
+    linear-gradient(180deg, rgb(255 255 255 / 7%), rgb(255 255 255 / 3%)),
+    rgb(8 14 13 / 72%);
+  color: rgb(224 248 237 / 82%);
+  box-shadow:
+    inset 0 1px 0 rgb(255 255 255 / 8%),
+    0 12px 30px rgb(0 0 0 / 18%);
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-brand-icon {
+  border-color: rgb(255 255 255 / 10%);
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-list {
+  gap: 10px;
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-item {
+  min-height: 72px;
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-workflow {
+  padding: 14px 16px;
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-grid {
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  min-height: clamp(520px, 42vw, 620px);
+  gap: 16px;
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-card {
+  min-height: 0;
+  padding: clamp(16px, 1.4vw, 20px);
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-card-content {
+  min-height: clamp(170px, 13vw, 220px);
+}
+
+.web-shell[data-view="home"] .omni-home__toolbox-card-footer {
+  min-height: 28px;
+  align-items: center;
+}
+
+@media (max-width: 1080px) {
+  .web-shell[data-view="home"] .omni-home__toolbox-shell {
+    grid-template-columns: 1fr;
+    width: min(100% - 40px, 860px);
+    gap: 24px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-left {
+    max-width: none;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-list {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+}
+
+@media (max-width: 640px) {
+  .web-shell[data-view="home"] .omni-home__toolbox-page {
+    min-height: auto;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-shell {
+    width: min(100% - 28px, 520px);
+    padding-block: 36px 44px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-list,
+  .web-shell[data-view="home"] .omni-home__toolbox-grid {
+    grid-template-columns: 1fr;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-card-content {
+    min-height: 176px;
+  }
+}
+
+/* Device-fit pass for the home landing toolbox section. */
+@media (min-width: 1101px) {
+  .web-shell[data-view="home"] .omni-home__toolbox-page {
+    min-height: clamp(620px, 82dvh, 840px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-shell {
+    min-height: inherit;
+    padding-block: clamp(34px, 4.2dvh, 64px);
+  }
+}
+
+@media (min-width: 900px) and (max-width: 1080px) {
+  .web-shell[data-view="home"] .omni-home__toolbox-page {
+    min-height: clamp(620px, 84dvh, 760px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-shell {
+    grid-template-columns: minmax(250px, 0.68fr) minmax(0, 1.32fr);
+    width: min(100% - 48px, 980px);
+    min-height: inherit;
+    gap: 20px;
+    padding-block: 28px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-left {
+    max-width: none;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-brand {
+    gap: 12px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-title {
+    font-size: clamp(30px, 3.6vw, 38px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-subtitle {
+    font-size: 13px;
+    line-height: 1.55;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-list {
+    grid-template-columns: 1fr;
+    gap: 8px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-item {
+    min-height: 60px;
+    padding: 10px 12px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-workflow {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-grid {
+    min-height: clamp(430px, 58dvh, 560px);
+    gap: 12px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-card {
+    padding: 14px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-card-content {
+    min-height: clamp(138px, 16dvh, 180px);
+  }
+}
+
+@media (max-width: 520px) {
+  .web-shell[data-view="home"] .omni-home__toolbox-shell {
+    width: min(100% - 24px, 430px);
+    padding-block: 28px 34px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-title {
+    font-size: clamp(28px, 8.8vw, 34px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-subtitle,
+  .web-shell[data-view="home"] .omni-home__toolbox-item-desc {
+    font-size: 12px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-item {
+    min-height: 58px;
+    padding: 10px 12px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-grid {
+    gap: 12px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-card {
+    padding: 14px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-card-content {
+    min-height: 132px;
+  }
+}
+
+/* Device-fit refinement: toolbox keeps a product-card rhythm across tablet and mobile. */
+@media (min-width: 700px) and (max-width: 899px) {
+  .web-shell[data-view="home"] .omni-home__toolbox-page {
+    min-height: auto;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-shell {
+    grid-template-columns: minmax(220px, 0.7fr) minmax(0, 1.3fr);
+    width: min(100% - 40px, 820px);
+    gap: 16px;
+    min-height: 0;
+    padding-block: 24px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-left {
+    gap: 12px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-brand {
+    gap: 10px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-title {
+    font-size: clamp(28px, 4vw, 38px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-subtitle {
+    display: -webkit-box;
+    overflow: hidden;
+    font-size: 12px;
+    line-height: 1.45;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 3;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-list {
+    grid-template-columns: 1fr;
+    gap: 8px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-item {
+    min-height: 54px;
+    gap: 8px;
+    padding: 8px 10px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-item-icon {
+    width: 34px;
+    height: 34px;
+    font-size: 14px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-item-name {
+    font-size: 13px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-item-desc {
+    display: -webkit-box;
+    overflow: hidden;
+    font-size: 10px;
+    line-height: 1.3;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 1;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-workflow {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-grid {
+    min-height: 0;
+    gap: 10px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-card {
+    min-height: 178px;
+    padding: 0;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-card-header {
+    padding: 11px 12px 0;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-card-icon {
+    width: 28px;
+    height: 28px;
+    font-size: 13px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-card-title {
+    font-size: 12px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-card-tag {
+    padding: 3px 7px;
+    font-size: 9px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-card-content {
+    min-height: 98px;
+    padding: 6px 12px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-card-footer {
+    padding: 6px 12px 10px;
+  }
+}
+
+@media (max-width: 699px) {
+  .web-shell[data-view="home"] .omni-home__toolbox-page {
+    min-height: auto;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-shell {
+    width: min(100% - 24px, 430px);
+    gap: 12px;
+    min-height: 0;
+    padding-block: 24px 30px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-left {
+    gap: 10px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-title {
+    font-size: clamp(24px, 7.4vw, 32px);
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-subtitle {
+    display: -webkit-box;
+    overflow: hidden;
+    font-size: 11px;
+    line-height: 1.4;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-list {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    gap: 7px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-item {
+    min-height: 50px;
+    gap: 7px;
+    padding: 8px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-item-icon {
+    width: 28px;
+    height: 28px;
+    font-size: 12px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-item-name {
+    font-size: 12px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-item-desc,
+  .web-shell[data-view="home"] .omni-home__toolbox-workflow,
+  .web-shell[data-view="home"] .omni-home__toolbox-card-feat,
+  .web-shell[data-view="home"] .omni-home__toolbox-card-feat-sep {
+    display: none;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-grid {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    gap: 8px;
+    min-height: 0;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-card {
+    min-height: 144px;
+    border-radius: 14px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-card-header {
+    align-items: flex-start;
+    gap: 6px;
+    padding: 9px 9px 0;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-card-header-left {
+    gap: 6px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-card-icon {
+    width: 24px;
+    height: 24px;
+    border-radius: 7px;
+    font-size: 11px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-card-title {
+    font-size: 11px;
+    line-height: 1.2;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-card-tag {
+    padding: 2px 5px;
+    font-size: 8px;
+    line-height: 1.2;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-card-content {
+    min-height: 84px;
+    padding: 4px 8px;
+  }
+
+  .web-shell[data-view="home"] .omni-home__toolbox-card-footer {
+    min-height: 0;
+    padding: 0 9px 9px;
+  }
+}
diff --git a/src/styles/themes/dark-green.css b/src/styles/themes/dark-green.css
index 2fcc520..9f75b50 100644
--- a/src/styles/themes/dark-green.css
+++ b/src/styles/themes/dark-green.css
@@ -191,6 +191,17 @@
   overflow: hidden;
 }
 
+.web-shell[data-ui-theme="dark-green"][data-view="home"] .notification-center__panel {
+  contain: layout paint;
+  width: min(380px, calc(100vw - 24px));
+  max-height: min(420px, calc(100dvh - 92px));
+  transform-origin: top right;
+}
+
+.web-shell[data-ui-theme="dark-green"][data-view="home"] .notification-center__list {
+  max-height: min(336px, calc(100dvh - 164px));
+}
+
 .web-shell[data-ui-theme="dark-green"] .notification-center__panel::before {
   content: "";
   position: absolute;