From 2d20170ac7012148105650772b558ca1c11b527f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=86=B0=E6=9C=94?= <565183519@qq.com>
Date: Sun, 16 Aug 2026 01:25:09 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=A4=A7=E9=97=A8v2=E5=94=AF=E7=BE=8E?=
 =?UTF-8?q?=E9=87=8D=E7=BB=98=E2=80=94=E2=80=94=E4=B8=80=E7=89=87=E6=B9=96?=
 =?UTF-8?q?+=E4=BA=94=E5=9D=97=E6=B2=89=E5=BA=95=E7=8E=89(=E5=8F=AA?=
 =?UTF-8?q?=E9=9C=B2=E5=B0=96=E5=BE=AE=E5=8A=A8)+=E6=B9=96=E9=9D=A2?=
 =?UTF-8?q?=E6=AD=A3=E4=B8=AD=E6=82=AC=E6=B5=AE=E7=BC=96=E5=8F=B7=E8=88=B1?=
 =?UTF-8?q?=EF=BC=9B=E7=BC=96=E5=8F=B7=E8=87=AA=E5=8A=A8=E8=A1=A5=E6=9D=A0?=
 =?UTF-8?q?(ICE/GLS=E7=99=BB=E8=AE=B0=E6=96=87=E6=B3=95)+=E2=88=9E?=
 =?UTF-8?q?=E5=BC=80=E5=85=B3=E7=82=B9=E4=BA=AE=EF=BC=9B=E8=BF=87=E5=85=B3?=
 =?UTF-8?q?=E7=8E=89=E5=8D=87=E8=B5=B7=E2=86=92=E6=AC=A2=E8=BF=8E=E8=AF=AD?=
 =?UTF-8?q?=E2=86=92=E9=92=A5=E5=8C=99=E9=97=A8=EF=BC=9B=E6=96=87=E5=AD=97?=
 =?UTF-8?q?=E5=A4=A7=E5=88=A0=E6=94=B9=E7=94=BB=E9=9D=A2=E5=8F=99=E4=BA=8B?=
 =?UTF-8?q?=EF=BC=88=E5=86=B0=E6=9C=9420260816=E8=B0=95=EF=BC=9A=E5=AF=B9?=
 =?UTF-8?q?=E5=A4=96=E5=88=86=E5=8F=91=E7=9A=84=E8=BD=AF=E4=BB=B6=E8=A6=81?=
 =?UTF-8?q?=E5=8A=A8=E6=80=81=E7=94=BB=E9=9D=A2=E4=BB=A3=E6=9B=BF=E6=96=87?=
 =?UTF-8?q?=E5=AD=97=EF=BC=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../hololake-native-desktop/src/main.tsx      | 112 +++++++++++-------
 .../hololake-native-desktop/src/styles.css    |  62 ++++++----
 2 files changed, 111 insertions(+), 63 deletions(-)

diff --git a/product-source/hololake-native-desktop/src/main.tsx b/product-source/hololake-native-desktop/src/main.tsx
index bf9e99dd5..ce0383a0e 100644
--- a/product-source/hololake-native-desktop/src/main.tsx
+++ b/product-source/hololake-native-desktop/src/main.tsx
@@ -2,8 +2,35 @@ import { StrictMode, useCallback, useEffect, useMemo, useRef, useState } from 'r
 import { createRoot } from 'react-dom/client'
 import { invoke } from '@tauri-apps/api/core'
 import { splitFrontmatter, documentOutline, jumpToHeading, MarkdownDocument, markdownHtml } from './modules/knowledge-render'
+import nightLake from './assets/hololake-night-lake.png'
 
 const TAG_TINTS = ['tag-lavender', 'tag-sky', 'tag-mint', 'tag-amber', 'tag-rose', 'tag-slate']
+
+// 编号自动补齐：人只敲字母与数字，杠由系统按已登记文法自动出。
+// ICE 系（ICE-GL∞ / ICE-P-ZY001）、GLS 系（GLS-LA-20260720-003）；认不出的文法只在字母数字交界处补杠。
+function formatGateNumber(raw: string): string {
+  const up = raw.toUpperCase()
+  if (up.startsWith('ICE')) {
+    const rest = up.slice(3)
+    if (!rest) return 'ICE'
+    if (rest.startsWith('P')) {
+      const body = rest.slice(1)
+      return body ? `ICE-P-${body}` : 'ICE-P'
+    }
+    return `ICE-${rest}`
+  }
+  if (up.startsWith('GLS')) {
+    const rest = up.slice(3)
+    if (!rest) return 'GLS'
+    const letters = rest.match(/^[A-Z]*/)?.[0] ?? ''
+    const digits = rest.slice(letters.length)
+    if (!digits) return `GLS-${letters}`
+    const d1 = digits.slice(0, 8)
+    const d2 = digits.slice(8, 11)
+    return `GLS-${letters}-${d1}${d2 ? `-${d2}` : ''}`
+  }
+  return up.replace(/([A-Z]+)([0-9])/g, '$1-$2').replace(/([0-9]+)([A-Z])/g, '$1-$2')
+}
 function tagTint(tag: string) {
   let hash = 0
   for (const char of tag) hash = (hash * 31 + (char.codePointAt(0) || 0)) % 997
@@ -258,7 +285,9 @@ function HoloLakeApp() {
   const [loginRising, setLoginRising] = useState(false)
   const [loginMessage, setLoginMessage] = useState('')
   const [gateStage, setGateStage] = useState<'number' | 'key'>('number')
-  const [gateNumber, setGateNumber] = useState('')
+  const [gateRaw, setGateRaw] = useState('')
+  const [gateInf, setGateInf] = useState(false)
+  const gateNumber = formatGateNumber(gateRaw) + (gateInf ? '∞' : '')
   const [gateBusy, setGateBusy] = useState(false)
   const [gateMessage, setGateMessage] = useState('')
   const [gateRising, setGateRising] = useState(false)
@@ -320,21 +349,30 @@ function HoloLakeApp() {
   }, [zeroPoint, view])
   // 大门·编号门：本机已有绑定编号时回填，省得主人重报家门
   useEffect(() => {
-    if (gateStage === 'number' && !gateNumber && zeroPoint?.binding === 'bound' && zeroPoint.userNumber) setGateNumber(zeroPoint.userNumber)
-  }, [zeroPoint, gateStage, gateNumber])
+    if (gateStage !== 'number' || gateRaw) return
+    const bound = zeroPoint?.binding === 'bound' ? zeroPoint.userNumber : ''
+    if (!bound) return
+    setGateInf(bound.includes('∞'))
+    setGateRaw(bound.toUpperCase().replace(/[^A-Z0-9]/g, ''))
+  }, [zeroPoint, gateStage, gateRaw])
+  // 大门·编号门输入：只收字母数字（杠系统补、∞开关点），删到∞时开关跟着灭
+  const onGateInput = (value: string) => {
+    if (gateInf && !value.includes('∞')) setGateInf(false)
+    setGateRaw(value.toUpperCase().replace(/[^A-Z0-9]/g, ''))
+  }
   // 大门·编号门：先报编号→灯塔查号→只答有效/无效→域浮起→才见钥匙门
   const gateVerifyNumber = async () => {
     setGateBusy(true)
     setGateMessage('')
     try {
-      await invoke<ZeroPointSnapshot>('zero_point_bind', { input: { number: gateNumber.trim() } })
+      await invoke<ZeroPointSnapshot>('zero_point_bind', { input: { number: gateNumber } })
       const snapshot = await invoke<ZeroPointSnapshot>('zero_point_verify')
       setZeroPoint(snapshot)
       if (snapshot.route === 'persona') {
         setGateRising(true)
-        window.setTimeout(() => { setGateRising(false); setGateStage('key') }, 1900)
+        window.setTimeout(() => { setGateRising(false); setGateStage('key') }, 2600)
       } else {
-        setGateMessage('编号未获灯塔放行——灯塔只答有效或无效，不透露编号表。')
+        setGateMessage('编号无效')
       }
     } catch (error) {
       setGateMessage(humanError(error, 'login'))
@@ -906,45 +944,35 @@ function HoloLakeApp() {
 
   if (!repoLogin) {
     return <div className="app-shell">
-      <div className={`onboarding-backdrop lake-scene${loginRising ? ' sinking' : ''}`}>
-        <div className="lake-bays" aria-hidden="true">{([['main', '主域'], ['sub', '分域'], ['zero', '零域'], ['sense', '零感域'], ['fifth', '第五域']] as const).map(([bayId, bayName]) => <span key={bayId} className={`lake-bay ${bayId}${(gateRising || loginRising) && bayId === 'fifth' ? ' rising' : ''}`}><i/><b>{bayName}</b></span>)}</div>
+      <div className={`gate-lake${loginRising ? ' sinking' : ''}`} style={{ '--lake-img': `url(${nightLake})` } as React.CSSProperties}>
+        <i className="lake-mist" aria-hidden="true"/>
+        <div className="lake-jades" aria-hidden="true">{[1, 2, 3, 4, 5].map((n) => <span key={n} className={`jade j${n}${(gateRising || loginRising) && n === 5 ? ' rising' : ''}`}/>)}</div>
         {gateRising ? (
-          <section className="gate-welcome" role="status">
-            <span className="gate-welcome-kicker">编号有效 · 域已浮起</span>
-            <h1>欢迎回到 第五域 · 光之湖</h1>
-            <p>编号 {gateNumber} 已通过灯塔校验——湖湾为你浮起，请交钥匙进门。</p>
+          <section className="gate-rise" role="status">
+            <span className="gate-rise-jade" aria-hidden="true"><i/></span>
+            <h1>第五域 · 光之湖</h1>
+            <p>欢迎回来 · {gateNumber}</p>
+          </section>
+        ) : gateStage === 'number' ? (
+          <section className={`gate-pod${loginRising ? ' fade-out' : ''}`} role="dialog">
+            <span className="gate-pod-mark">光湖</span>
+            <div className="gate-pod-row">
+              <input id="gate-number" aria-label="编号" autoFocus maxLength={48} value={gateNumber} placeholder="报上编号" onChange={(event) => onGateInput(event.target.value)} onKeyDown={(event) => { if (event.key === 'Enter' && gateNumber) { event.preventDefault(); void gateVerifyNumber() } }}/>
+              <button type="button" className={`gate-inf${gateInf ? ' on' : ''}`} title="编号里带无限符号就点一下点亮" aria-pressed={gateInf} onClick={() => setGateInf((v) => !v)}>∞</button>
+            </div>
+            <button className="gate-submit" disabled={gateBusy || !gateNumber} onClick={() => void gateVerifyNumber()}>{gateBusy ? '查验中…' : '提交'}</button>
+            {gateMessage && <p className="gate-hint">{gateMessage}</p>}
           </section>
         ) : (
-          <section className={`onboarding-card gate-card${loginRising ? ' fade-out' : ''}`} role="dialog">
-            <span className="onboarding-mark gate-mark">光湖</span>
-            <div className="gate-steps" aria-hidden="true"><span className={gateStage === 'number' ? 'active' : 'done'}><i>壹</i>编号门</span><em/><span className={gateStage === 'key' ? 'active' : ''}><i>贰</i>钥匙门</span></div>
-            {gateStage === 'number' ? (
-              <>
-                <span className="kicker">GATE OF GUANGHU WORLD</span>
-                <h1>光湖世界大门</h1>
-                <p>先报编号。灯塔只回答"有效 / 无效"，不透露编号表在哪、有什么。编号合法，你所属的域才会浮起。</p>
-                <form onSubmit={(event) => { event.preventDefault(); void gateVerifyNumber() }}>
-                  <label htmlFor="gate-number">来者编号</label>
-                  <input id="gate-number" autoFocus maxLength={40} value={gateNumber} placeholder="如 ICE-GL∞" onChange={(event) => setGateNumber(event.target.value)}/>
-                  <button className="primary-button" disabled={gateBusy || !gateNumber.trim()}>{gateBusy ? '灯塔查号中…' : '校验编号'}</button>
-                </form>
-              </>
-            ) : (
-              <>
-                <span className="kicker">FIFTH DOMAIN · KEY GATE</span>
-                <h1>第五域 · 钥匙门</h1>
-                <p>编号 <b className="gate-number-chip">{gateNumber}</b> 已通过校验。用第五域代码仓库（guanghulab.com）的账号与密码交钥匙；凭证只存本机钥匙串，不落明文。</p>
-                <form onSubmit={(event) => void performRepoLogin(event)}>
-                  <label htmlFor="repo-login-username">仓库账号</label>
-                  <input id="repo-login-username" autoFocus maxLength={40} value={loginUsername} placeholder="代码仓库用户名" onChange={(event) => setLoginUsername(event.target.value)}/>
-                  <label htmlFor="repo-login-password">密码</label>
-                  <input id="repo-login-password" type="password" maxLength={512} value={loginPassword} placeholder="代码仓库密码" onChange={(event) => setLoginPassword(event.target.value)}/>
-                  <button className="primary-button" disabled={loginBusy || !loginUsername.trim() || !loginPassword}>{loginBusy ? '正在验证…' : '进入 HoloLake'}</button>
-                </form>
-                <button className="gate-back" type="button" onClick={() => { setGateStage('number'); setGateMessage(''); setLoginMessage('') }}>换个编号重新报门</button>
-              </>
-            )}
-            {(gateMessage || loginMessage) && <p className="gate-message">{gateMessage || loginMessage}</p>}
+          <section className={`gate-pod gate-pod-key${loginRising ? ' fade-out' : ''}`} role="dialog">
+            <span className="gate-pod-mark">光湖</span>
+            <form onSubmit={(event) => void performRepoLogin(event)}>
+              <input id="repo-login-username" aria-label="账号" autoFocus maxLength={40} value={loginUsername} placeholder="账号" onChange={(event) => setLoginUsername(event.target.value)}/>
+              <input id="repo-login-password" aria-label="密码" type="password" maxLength={512} value={loginPassword} placeholder="密码" onChange={(event) => setLoginPassword(event.target.value)}/>
+              <button className="gate-submit" disabled={loginBusy || !loginUsername.trim() || !loginPassword}>{loginBusy ? '查验中…' : '进入'}</button>
+            </form>
+            {loginMessage && <p className="gate-hint">{loginMessage}</p>}
+            <button className="gate-back" type="button" onClick={() => { setGateStage('number'); setGateMessage(''); setLoginMessage('') }}>换编号</button>
           </section>
         )}
       </div>
diff --git a/product-source/hololake-native-desktop/src/styles.css b/product-source/hololake-native-desktop/src/styles.css
index e605660a0..e51d66dfb 100644
--- a/product-source/hololake-native-desktop/src/styles.css
+++ b/product-source/hololake-native-desktop/src/styles.css
@@ -437,25 +437,45 @@ svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-lineca
 .onboarding-card { position: relative; z-index: 1; transition: opacity .7s ease, transform .7s ease; }
 .onboarding-card.fade-out { opacity: 0; transform: translateY(16px) scale(.985); }
 
-/* ===== 光湖世界大门（编号门→域浮起→钥匙门）===== */
-.gate-card { width: min(520px, 100%); text-align: center; }
-.gate-card form { text-align: left; }
-.gate-mark { width: 72px; height: 72px; margin: 0 auto 20px; border-radius: 22px; font-size: 22px; border-color: color-mix(in srgb, var(--primitive-warm-glow) 46%, transparent); color: var(--accent-light); box-shadow: 0 0 42px color-mix(in srgb, var(--primitive-warm-glow) 30%, transparent), inset 0 0 22px color-mix(in srgb, var(--primitive-warm-glow) 14%, transparent); animation: gate-mark-breathe 4.5s ease-in-out infinite; }
-@keyframes gate-mark-breathe { 0%, 100% { box-shadow: 0 0 30px color-mix(in srgb, var(--primitive-warm-glow) 22%, transparent), inset 0 0 18px color-mix(in srgb, var(--primitive-warm-glow) 10%, transparent); } 50% { box-shadow: 0 0 58px color-mix(in srgb, var(--primitive-warm-glow) 40%, transparent), inset 0 0 26px color-mix(in srgb, var(--primitive-warm-glow) 18%, transparent); } }
-.gate-card h1 { font-size: 30px; letter-spacing: .04em; }
-.gate-card .kicker { letter-spacing: .3em; color: color-mix(in srgb, var(--primitive-warm-glow) 78%, var(--content-muted)); }
-.gate-steps { display: flex; align-items: center; justify-content: center; gap: 12px; margin: 0 0 22px; }
-.gate-steps span { display: inline-flex; align-items: center; gap: 7px; padding: 5px 13px; border: 1px solid var(--panel-edge); border-radius: 999px; color: var(--content-faint); font-size: 12px; letter-spacing: .12em; transition: all .4s ease; }
-.gate-steps span i { display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; border: 1px solid currentColor; font-style: normal; font-size: 10px; }
-.gate-steps span.active { color: var(--accent-light); border-color: color-mix(in srgb, var(--primitive-warm-glow) 52%, transparent); background: color-mix(in srgb, var(--primitive-warm-glow) 9%, transparent); box-shadow: 0 0 18px color-mix(in srgb, var(--primitive-warm-glow) 18%, transparent); }
-.gate-steps span.done { color: var(--content-secondary); border-color: color-mix(in srgb, var(--accent-light) 34%, transparent); }
-.gate-steps em { width: 34px; height: 1px; background: linear-gradient(90deg, var(--panel-edge), color-mix(in srgb, var(--primitive-warm-glow) 42%, transparent)); }
-.gate-number-chip { padding: 1px 8px; border: 1px solid color-mix(in srgb, var(--primitive-warm-glow) 44%, transparent); border-radius: 7px; color: var(--accent-light); font-weight: 600; letter-spacing: .03em; }
-.gate-back { margin-top: 16px; border: 0; background: none; color: var(--content-faint); font-size: 12.5px; letter-spacing: .08em; cursor: pointer; transition: color .25s ease; }
+/* ===== 光湖世界大门 v2：一片湖 · 五块沉底玉 · 一只悬浮编号舱 ===== */
+.gate-lake { position: fixed; inset: 0; z-index: 20; overflow: hidden; display: grid; place-items: center; background-image: linear-gradient(180deg, color-mix(in srgb, var(--surface-depth) 62%, transparent), color-mix(in srgb, #04070d 78%, transparent) 88%), var(--lake-img); background-size: cover, cover; background-position: center 30%, center; transition: opacity .9s ease; }
+.gate-lake.sinking { opacity: 0; }
+.lake-mist { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(60% 34% at 50% 68%, color-mix(in srgb, var(--primitive-cool-glow) 13%, transparent), transparent 72%); animation: mist-drift 11s ease-in-out infinite; }
+@keyframes mist-drift { 0%, 100% { opacity: .55; transform: translateX(0); } 50% { opacity: .95; transform: translateX(2.4%); } }
+
+/* 沉底五玉：只露一点尖，轻微起伏 */
+.lake-jades { position: absolute; left: 0; right: 0; bottom: 20%; display: flex; align-items: flex-end; justify-content: center; gap: clamp(46px, 9vw, 150px); pointer-events: none; }
+.jade { position: relative; width: 44px; height: 34px; transform: translateY(64%); clip-path: polygon(50% 0, 90% 72%, 100% 100%, 0 100%, 10% 72%); background: linear-gradient(165deg, color-mix(in srgb, #8fe6c3 62%, transparent), color-mix(in srgb, #3f8f7c 40%, transparent) 58%, color-mix(in srgb, #123c36 30%, transparent)); opacity: .4; filter: blur(.5px); animation: jade-bob 7.5s ease-in-out infinite; transition: transform 1.2s cubic-bezier(.3, .7, .35, 1), opacity 1.2s ease, filter 1.2s ease; }
+.jade::after { content: ''; position: absolute; left: 12%; right: 12%; top: 8%; height: 34%; background: linear-gradient(180deg, rgba(255, 255, 255, .34), transparent); clip-path: inherit; }
+.jade.j1 { animation-delay: .2s; } .jade.j2 { animation-delay: 1.6s; } .jade.j3 { animation-delay: 3s; } .jade.j4 { animation-delay: 1s; } .jade.j5 { animation-delay: 2.2s; width: 56px; height: 44px; transform: translateY(58%); background: linear-gradient(165deg, color-mix(in srgb, var(--primitive-warm-glow) 74%, transparent), color-mix(in srgb, var(--primitive-warm-glow) 34%, transparent) 56%, color-mix(in srgb, #4a3210 32%, transparent)); opacity: .62; box-shadow: 0 -8px 46px color-mix(in srgb, var(--primitive-warm-glow) 26%, transparent); }
+.jade.rising { transform: translateY(-150%) scale(1.5); opacity: 1; filter: blur(0) drop-shadow(0 0 34px color-mix(in srgb, var(--primitive-warm-glow) 58%, transparent)); animation: none; }
+@keyframes jade-bob { 0%, 100% { translate: 0 0; } 50% { translate: 0 -7px; } }
+
+/* 编号舱：湖面正中一只悬浮玻璃舱，只装编号 */
+.gate-pod { position: relative; z-index: 3; width: min(400px, 88vw); padding: 38px 32px 32px; text-align: center; border: 1px solid color-mix(in srgb, var(--accent-light) 22%, transparent); border-radius: 24px; background: color-mix(in srgb, var(--panel-bg) 62%, transparent); backdrop-filter: blur(26px) saturate(1.15); box-shadow: 0 34px 90px rgba(0, 0, 0, .5), 0 0 70px color-mix(in srgb, var(--primitive-warm-glow) 9%, transparent), inset 0 1px 0 rgba(255, 255, 255, .07); animation: pod-float 6.5s ease-in-out infinite; transition: opacity .7s ease, transform .7s ease; }
+.gate-pod.fade-out { opacity: 0; transform: translateY(18px) scale(.985); }
+@keyframes pod-float { 0%, 100% { translate: 0 0; } 50% { translate: 0 -9px; } }
+.gate-pod-mark { display: grid; place-items: center; width: 58px; height: 58px; margin: 0 auto 26px; border: 1px solid color-mix(in srgb, var(--primitive-warm-glow) 44%, transparent); border-radius: 18px; color: var(--accent-light); font-family: "Songti SC", serif; font-size: 17px; box-shadow: 0 0 34px color-mix(in srgb, var(--primitive-warm-glow) 24%, transparent), inset 0 0 18px color-mix(in srgb, var(--primitive-warm-glow) 12%, transparent); }
+.gate-pod-row { display: flex; gap: 10px; }
+.gate-pod input { flex: 1; height: 52px; padding: 0 16px; border: 1px solid color-mix(in srgb, var(--accent-light) 24%, transparent); border-radius: 14px; outline: 0; color: var(--content-primary); background: rgba(0, 0, 0, .22); font-size: 17px; letter-spacing: .08em; text-align: center; transition: border-color .3s ease, box-shadow .3s ease; }
+.gate-pod input:focus { border-color: color-mix(in srgb, var(--primitive-warm-glow) 58%, transparent); box-shadow: 0 0 22px color-mix(in srgb, var(--primitive-warm-glow) 18%, transparent); }
+.gate-pod input::placeholder { color: var(--content-faint); letter-spacing: .2em; }
+.gate-pod form { display: grid; gap: 12px; }
+.gate-inf { width: 52px; height: 52px; flex: 0 0 auto; border: 1px solid color-mix(in srgb, var(--accent-light) 24%, transparent); border-radius: 14px; background: rgba(0, 0, 0, .22); color: var(--content-faint); font-size: 21px; cursor: pointer; transition: all .35s ease; }
+.gate-inf:hover { color: var(--content-secondary); border-color: color-mix(in srgb, var(--primitive-warm-glow) 40%, transparent); }
+.gate-inf.on { color: #0b0f14; background: linear-gradient(150deg, color-mix(in srgb, var(--primitive-warm-glow) 92%, #fff), var(--primitive-warm-glow)); border-color: transparent; box-shadow: 0 0 30px color-mix(in srgb, var(--primitive-warm-glow) 52%, transparent); }
+.gate-submit { height: 48px; margin-top: 16px; border: 0; border-radius: 14px; background: linear-gradient(140deg, color-mix(in srgb, var(--primitive-warm-glow) 78%, #fff) 0%, color-mix(in srgb, var(--primitive-warm-glow) 62%, #7a5a22) 100%); color: #141008; font-size: 15px; font-weight: 650; letter-spacing: .3em; text-indent: .3em; cursor: pointer; transition: filter .3s ease, opacity .3s ease, box-shadow .3s ease; box-shadow: 0 10px 30px color-mix(in srgb, var(--primitive-warm-glow) 22%, transparent); }
+.gate-submit:hover:not(:disabled) { filter: brightness(1.07); box-shadow: 0 12px 40px color-mix(in srgb, var(--primitive-warm-glow) 34%, transparent); }
+.gate-submit:disabled { opacity: .45; cursor: default; box-shadow: none; }
+.gate-hint { margin-top: 14px; color: var(--content-muted); font-size: 13px; }
+.gate-back { margin-top: 14px; border: 0; background: none; color: var(--content-faint); font-size: 12.5px; letter-spacing: .1em; cursor: pointer; transition: color .25s ease; }
 .gate-back:hover { color: var(--accent-light); }
-.gate-message { margin-top: 14px; color: var(--content-muted); font-size: 13px; }
-.gate-welcome { position: relative; z-index: 2; text-align: center; animation: gate-welcome-in 1s cubic-bezier(.3, .7, .35, 1) both; }
-.gate-welcome-kicker { display: inline-block; padding: 6px 16px; border: 1px solid color-mix(in srgb, var(--primitive-warm-glow) 40%, transparent); border-radius: 999px; color: var(--accent-light); font-size: 12px; letter-spacing: .26em; text-indent: .26em; background: color-mix(in srgb, var(--primitive-warm-glow) 8%, transparent); }
-.gate-welcome h1 { margin: 20px 0 12px; color: var(--content-primary); font-size: clamp(30px, 4.6vw, 44px); font-weight: 650; letter-spacing: .06em; text-shadow: 0 0 46px color-mix(in srgb, var(--primitive-warm-glow) 34%, transparent); }
-.gate-welcome p { color: var(--content-muted); font-size: 14.5px; line-height: 1.7; }
-@keyframes gate-welcome-in { 0% { opacity: 0; transform: translateY(26px) scale(.97); } 100% { opacity: 1; transform: translateY(0) scale(1); } }
+
+/* 过关：玉自湖面升起 → 欢迎语浮现 */
+.gate-rise { position: relative; z-index: 3; display: grid; place-items: center; text-align: center; }
+.gate-rise-jade { display: block; margin-bottom: 26px; animation: gate-jade-rise 2.3s cubic-bezier(.28, .68, .32, 1) both; }
+.gate-rise-jade i { display: block; width: 84px; height: 66px; clip-path: polygon(50% 0, 90% 72%, 100% 100%, 0 100%, 10% 72%); background: linear-gradient(165deg, color-mix(in srgb, var(--primitive-warm-glow) 88%, #fff), color-mix(in srgb, var(--primitive-warm-glow) 46%, transparent) 56%, color-mix(in srgb, #4a3210 40%, transparent)); filter: drop-shadow(0 0 46px color-mix(in srgb, var(--primitive-warm-glow) 62%, transparent)); }
+@keyframes gate-jade-rise { 0% { transform: translateY(46vh) scale(.55); opacity: 0; } 30% { opacity: 1; } 100% { transform: translateY(0) scale(1); opacity: 1; } }
+.gate-rise h1 { margin: 0; color: var(--content-primary); font-size: clamp(30px, 4.4vw, 42px); font-weight: 650; letter-spacing: .1em; text-shadow: 0 0 46px color-mix(in srgb, var(--primitive-warm-glow) 36%, transparent); animation: gate-text-in 1s ease 1s both; }
+.gate-rise p { margin: 14px 0 0; color: var(--content-muted); font-size: 14.5px; letter-spacing: .14em; animation: gate-text-in 1s ease 1.5s both; }
+@keyframes gate-text-in { 0% { opacity: 0; transform: translateY(14px); } 100% { opacity: 1; transform: translateY(0); } }