/* 全局基础区：Neo Deco 暖石材、深青绿、黄铜与陶土色令牌 */
:root { --ink:#162a2e; --teal:#183c42; --muted:#6d7169; --paper:rgba(255,249,238,.9); --stone:#e9dec9; --terracotta:#a54c2e; --brass:#b58b42; }
* { box-sizing:border-box; }
html,body { min-height:100%; margin:0; }
body { color:var(--ink); background:var(--stone); font-family:Inter,"Noto Sans SC",system-ui,sans-serif; } input,textarea,[contenteditable="true"] { caret-color:transparent; }
button,a { font:inherit; }
button:focus-visible,a:focus-visible { outline:3px solid var(--brass); outline-offset:3px; }
[hidden] { display:none !important; }
/* 指针可见性区：显式覆盖任何外部或缓存样式，不隐藏真实鼠标指针。 */
html,body,body * { cursor:default !important; caret-color:transparent !important; }
button,a,[role="button"] { cursor:pointer !important; }

/* 顶栏功能区：保持为真实 DOM 控件，不写进场景艺术图 */
.topbar { position:absolute; z-index:10; top:0; left:0; width:100%; display:flex; align-items:center; justify-content:space-between; gap:18px; padding:22px clamp(20px,4vw,62px); }
.brand { color:var(--teal); font-weight:900; letter-spacing:.07em; text-decoration:none; }.brand span { display:block; margin-top:3px; color:#746c5d; font-size:.72rem; font-weight:600; letter-spacing:.03em; }.topbar-actions { display:flex; gap:9px; }.quiet-button { min-height:40px; padding:0 13px; color:var(--teal); background:rgba(255,249,238,.82); border:1px solid rgba(24,60,66,.22); border-radius:12px; cursor:pointer; backdrop-filter:blur(9px); }.quiet-button:hover { background:#fff9ee; }.sound-control { position:relative; width:48px; min-height:48px; }.sound-orb { display:grid; place-items:center; width:48px; height:48px; padding:0; color:var(--teal); background:rgba(255,255,255,.14); border:0; border-radius:50%; box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 10px 24px rgba(18,39,42,.12); cursor:pointer; backdrop-filter:blur(22px) saturate(150%); transition:transform 1940ms cubic-bezier(.18,1.6,.32,1); }.sound-orb img { width:21px; height:21px; object-fit:contain; filter:brightness(0) invert(1); opacity:.72; }.sound-icon { display:none; }.sound-control.is-on .sound-icon { display:block; }.sound-control.is-on .mute-icon { display:none; }.volume-popover { position:absolute; top:56px; left:0; right:0; margin-inline:auto; display:grid; place-items:center; width:48px; height:112px; padding:8px 0; background:rgba(255,255,255,.12); border:0; border-radius:24px; box-shadow:inset 0 1px 0 rgba(255,255,255,.24),0 10px 24px rgba(18,39,42,.1); backdrop-filter:blur(22px) saturate(150%); opacity:0; pointer-events:none; clip-path:polygon(50% 0,68% 28%,100% 100%,0 100%,32% 28%); transform:translateY(-6px) scaleY(.08); transform-origin:50% 0; transition:opacity 180ms ease 1s,transform 420ms cubic-bezier(.32,1.45,.56,1) 1s,clip-path 420ms cubic-bezier(.32,1.45,.56,1) 1s; }.volume-popover span { font-size:10px; letter-spacing:.06em; }.volume-popover input { position:absolute; left:50%; top:50%; -webkit-appearance:none; appearance:none; width:82px; height:18px; margin:0; background:transparent; transform:translate(-50%,-50%) rotate(-90deg); transform-origin:center; }.volume-popover input::-webkit-slider-runnable-track { height:4px; border-radius:999px; background:rgba(255,255,255,.34); }.volume-popover input::-webkit-slider-thumb { -webkit-appearance:none; width:18px; height:18px; margin-top:-7px; border:0; border-radius:50%; background:rgba(255,255,255,.22); box-shadow:inset 0 1px 0 rgba(255,255,255,.52),0 3px 10px rgba(15,37,40,.18); backdrop-filter:blur(10px); }.volume-popover input::-moz-range-track { height:4px; border:0; border-radius:999px; background:rgba(255,255,255,.34); }.volume-popover input::-moz-range-thumb { width:18px; height:18px; border:0; border-radius:50%; background:rgba(255,255,255,.22); box-shadow:inset 0 1px 0 rgba(255,255,255,.52),0 3px 10px rgba(15,37,40,.18); }.sound-control.is-on:hover .volume-popover,.sound-control.is-on:focus-within .volume-popover,.sound-control.is-volume-open .volume-popover { opacity:1; pointer-events:auto; transform:translateY(0) scaleY(1); clip-path:inset(0 round 24px); transition-delay:0s; }.sound-control.is-volume-closing .volume-popover { transition-delay:0s; }.sound-control.is-on.pointer-exited .volume-popover { opacity:0; pointer-events:none; clip-path:polygon(50% 0,68% 28%,100% 100%,0 100%,32% 28%); transform:translateY(-6px) scaleY(.08); transition-delay:0s; }.sound-control.pointer-exited .sound-orb { transform:scale(1) !important; }.sound-control.is-attention .sound-orb { animation:sound-prompt 4s cubic-bezier(.18,1.5,.35,1) infinite; }.sound-control:hover .sound-orb,.sound-control:focus-within .sound-orb { animation:none; transform:scale(1.1); }.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }@keyframes sound-prompt { 0%,30%,100% { transform:translateX(0) rotate(0); } 5% { transform:translateX(-4px) rotate(-5deg); } 10% { transform:translateX(4px) rotate(5deg); } 15% { transform:translateX(-3px) rotate(-3deg); } 20% { transform:translateX(2px) rotate(2deg); } 25% { transform:translateX(-1px) rotate(-1deg); } }

/* 场地选择区：48 项形成完整循环；用户输入才转动，背景采用深色强模糊城市地图。 */
.place-picker { --orbit-center-x:calc(-650 / 1920 * 100vw); --orbit-center-y:50vh; --orbit-radius:calc(1800 / 1920 * 100vw); position:absolute; z-index:20; inset:0; overflow:hidden; background:#0c1315; isolation:isolate; }.place-picker::before{content:"";position:absolute;inset:-4%;z-index:0;background:url('assets/venue-picker-city.png?v=venue-picker-city-v2') center/cover no-repeat;filter:blur(5px);transform:scale(1.08)}.place-picker::after{content:"";position:absolute;inset:0;z-index:0;background:radial-gradient(ellipse at 72% 28%,rgba(181,139,66,.24),transparent 48%),radial-gradient(ellipse at 20% 82%,rgba(44,88,98,.18),transparent 52%),rgba(3,10,12,.86)}.place-picker[hidden] { display:none!important; }.place-wheel { --wheel-turn:0deg; position:absolute; z-index:1; inset:0; outline:none; }.place-option { --angle:calc(var(--initial-angle) + var(--wheel-turn)); position:absolute; left:calc(var(--orbit-center-x) + var(--orbit-radius) * cos(var(--angle))); top:calc(var(--orbit-center-y) + var(--orbit-radius) * sin(var(--angle))); color:#fff; font:700 clamp(2rem,7vw,7rem)/1 Inter,"Noto Sans SC",sans-serif; white-space:nowrap; opacity:calc(1 - (var(--focus-distance, 1) * .13)); filter:blur(calc(var(--focus-distance, 1) * 2.2px)); transform:translate(-50%,-50%) rotate(var(--angle)); transform-origin:center; transition:left 500ms cubic-bezier(.4,0,.2,1),top 500ms cubic-bezier(.4,0,.2,1),transform 500ms cubic-bezier(.4,0,.2,1),opacity 500ms cubic-bezier(.4,0,.2,1),filter 500ms cubic-bezier(.4,0,.2,1); }.place-option.is-current { z-index:2; opacity:1; filter:blur(0); }.place-option-arrow { display:none; position:absolute; right:calc(100% + .52em); top:50%; margin:0; transform:translateY(-50%); }.place-option.is-current .place-option-arrow { display:block; }.place-wheel.is-stepping .place-option.is-current .place-option-arrow { animation:place-arrow-pulse 750ms linear 1; }.place-option-label { display:inline-block; }.place-wheel.is-stepping .place-option.is-current .place-option-label { animation:place-label-arrive 500ms cubic-bezier(.4,0,.2,1) 1; }
.place-option[data-place-index="0"] { --initial-angle:-45deg; }.place-option[data-place-index="1"] { --initial-angle:-37.5deg; }.place-option[data-place-index="2"] { --initial-angle:-30deg; }.place-option[data-place-index="3"] { --initial-angle:-22.5deg; }.place-option[data-place-index="4"] { --initial-angle:-15deg; }.place-option[data-place-index="5"] { --initial-angle:-7.5deg; }.place-option[data-place-index="6"] { --initial-angle:0deg; }.place-option[data-place-index="7"] { --initial-angle:7.5deg; }.place-option[data-place-index="8"] { --initial-angle:15deg; }.place-option[data-place-index="9"] { --initial-angle:22.5deg; }.place-option[data-place-index="10"] { --initial-angle:30deg; }.place-option[data-place-index="11"] { --initial-angle:37.5deg; }

/* 箭头提示区：60fps Lottie 实测帧位移只作用于当前行的内联箭头。 */
@keyframes place-arrow-pulse { 0%,6.667% { transform:translateY(-50%) translateX(0); } 26.667% { transform:translateY(-50%) translateX(38.605px); } 32.853% { transform:translateY(-50%) translateX(43.137px); } 43.093% { transform:translateY(-50%) translateX(17.619px); } 60%,100% { transform:translateY(-50%) translateX(0); } }
@keyframes place-label-arrive { 0% { transform:translateX(0); } 55% { transform:translateX(43.137px); } 100% { transform:translateX(0); } }
@media (prefers-reduced-motion: reduce) { .place-option { transition:none; }.place-option.is-current .place-option-arrow { animation:none; } }

/* Neo Deco 场景区：两张经批准的无文字插画以短交叉淡入呈现 */
.scene { position:relative; isolation:isolate; min-height:100svh; overflow:hidden; background:#d6c6ad; }.scene::before,.scene::after { content:""; position:absolute; z-index:0; inset:0; background-position:center; background-size:cover; background-repeat:no-repeat; transition:opacity .72s ease; }.scene::before { background-image:url("assets/neo-deco-home.png"); opacity:1; }.scene::after { background-image:url("assets/neo-deco-cafe.png"); opacity:0; }.scene--cafe::before { opacity:0; }.scene--cafe::after { opacity:1; }
/* 旧几何原型层停用：由高分辨率 Neo Deco 场景资产统一承载透视、材质与人物 */
.sky-layer,.city-layer,.home-shell,.cafe-layer,.ambient-events,.desk { display:none; }

/* 单场景微动效区：候鸟与风吹叶片为低频环境事件；没有额外光晕或闪烁效果 */
.scene-motion-layers{position:absolute;z-index:2;inset:0;pointer-events:none;overflow:hidden}.home-motion,.cafe-motion{position:absolute;inset:0;opacity:0;transition:opacity .45s ease}.scene--home .home-motion,.scene--cafe .cafe-motion{opacity:1}.seagull{position:absolute;left:51%;top:23%;width:34px;height:18px;overflow:visible;opacity:0;filter:drop-shadow(0 1px 1px rgba(38,57,48,.18));transform-origin:50% 70%}.seagull path{fill:none;stroke:#65766b;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;animation:gull-wings 1.55s ease-in-out infinite}.seagull--one{animation:seagull-pass 39s 5s linear infinite}.seagull--two{width:25px;left:56%;top:27%;animation:seagull-pass 39s 6.4s linear infinite}.seagull--two path{stroke-width:2.5;animation-duration:1.32s}.leaf-sway{position:absolute;display:block;transform-origin:52% 100%;opacity:.28;filter:drop-shadow(1px 2px 1px rgba(34,50,34,.15));animation:leaf-sway 16s 2s cubic-bezier(.42,0,.2,1) infinite}.leaf-sway i{position:absolute;width:20px;height:12px;border:1px solid rgba(57,82,54,.2);border-radius:100% 0 100% 0;background:linear-gradient(135deg,#899d79 0%,#607653 54%,#3d5746 100%);clip-path:polygon(0 50%,72% 0,100% 18%,86% 76%,34% 100%);transform:rotate(var(--r));box-shadow:inset -2px -1px 0 rgba(21,47,40,.2)}.leaf-sway--home{left:39.5%;top:35%;width:112px;height:162px}.leaf-sway--home i:nth-child(1){left:3px;top:31px;--r:15deg}.leaf-sway--home i:nth-child(2){left:35px;top:12px;--r:-35deg}.leaf-sway--home i:nth-child(3){left:59px;top:49px;--r:44deg}.leaf-sway--home i:nth-child(4){left:22px;top:73px;--r:-18deg}.leaf-sway--home i:nth-child(5){left:69px;top:91px;--r:20deg}.leaf-sway--cafe{left:11%;top:0;width:130px;height:180px;opacity:.36;animation:cafe-leaf-sway 13s -3s cubic-bezier(.42,0,.2,1) infinite}.leaf-sway--cafe i:nth-child(1){left:8px;top:49px;--r:32deg}.leaf-sway--cafe i:nth-child(2){left:37px;top:25px;--r:-21deg}.leaf-sway--cafe i:nth-child(3){left:66px;top:60px;--r:48deg}.leaf-sway--cafe i:nth-child(4){left:88px;top:15px;--r:-38deg}.leaf-sway--cafe i:nth-child(5){left:28px;top:96px;--r:20deg}.leaf-sway--cafe i:nth-child(6){left:92px;top:110px;--r:-18deg}.machine-steam{position:absolute;left:72%;top:37%;width:52px;height:100px}.machine-steam b{position:absolute;bottom:0;width:12px;height:58px;border-left:2.5px solid rgba(255,245,221,.74);border-radius:50%;filter:blur(.35px);opacity:0;animation:steam-rise 8s ease-out infinite}.machine-steam b:nth-child(1){left:7px;animation-delay:-1s}.machine-steam b:nth-child(2){left:23px;height:73px;animation-delay:-5.2s}.machine-steam b:nth-child(3){left:39px;height:49px;animation-delay:-8.1s}@keyframes gull-wings{0%,100%{transform:scaleY(1) rotate(0)}50%{transform:scaleY(.62) rotate(-2deg)}}@keyframes seagull-pass{0%,72%{opacity:0;transform:translate3d(-56px,-28px,0) scale(.7)}75%{opacity:.3;transform:translate3d(-18px,0,0) scale(.82)}79%{opacity:.42;transform:translate3d(18px,78px,0) scale(.9)}83%,88%{opacity:.5;transform:translate3d(35px,220px,0) scale(.76)}94%{opacity:.36;transform:translate3d(146px,-38px,0) scale(.62)}100%{opacity:0;transform:translate3d(190px,-78px,0) scale(.55)}}@keyframes leaf-sway{0%,100%{transform:rotate(-.5deg) translateX(0)}38%{transform:rotate(1.4deg) translateX(2px)}64%{transform:rotate(-1.1deg) translateX(-1px)}}@keyframes cafe-leaf-sway{0%,100%{transform:rotate(-.6deg) translateX(0)}35%{transform:rotate(2.4deg) translateX(3px)}61%{transform:rotate(-1.8deg) translateX(-2px)}82%{transform:rotate(1.3deg) translateX(1px)}}@keyframes steam-rise{0%{opacity:0;transform:translate3d(0,8px,0) scale(.72)}15%{opacity:.68}78%{opacity:.23}100%{opacity:0;transform:translate3d(12px,-58px,0) scale(1.18)}}

/* 叙事交互区：固定在艺术留白上，永远不盖住右下工作的桌面 */
.foreground-stack { position:absolute; z-index:4; left:clamp(20px,6vw,96px); top:clamp(104px,15vh,160px); width:min(440px,calc(100% - 40px)); }.story-panel { position:relative; z-index:2; box-sizing:border-box; width:100%; padding:clamp(32px,4.2vw,64px); border:0; border-radius:clamp(56px,5.365vw,103px); background:rgba(255,255,255,.18); box-shadow:none; backdrop-filter:blur(24px) saturate(115%); -webkit-backdrop-filter:blur(24px) saturate(115%); } .foreground-blur { position:absolute; z-index:0; inset:0; overflow:hidden; border-radius:clamp(56px,5.365vw,103px); pointer-events:none; background:rgba(177,177,177,.18); }.foreground-blur img { position:absolute; width:188.889%; height:387.5%; left:-50.815%; top:-163.52%; object-fit:cover; filter:blur(clamp(56px,5.68vw,109px)); opacity:.58; transform:scale(1); transform-origin:center; } .foreground-overlay { position:absolute; z-index:0; inset:0; border:0; border-radius:clamp(56px,5.365vw,103px); background:rgba(255,255,255,.13); box-shadow:none; pointer-events:none; }.story-panel,.foreground-overlay,.foreground-blur { transform-origin:center; transition:transform 1940ms cubic-bezier(.18,1.6,.32,1); }.foreground-stack:hover .story-panel,.foreground-stack:hover .foreground-overlay,.foreground-stack:hover .foreground-blur,.foreground-stack:focus-within .story-panel,.foreground-stack:focus-within .foreground-overlay,.foreground-stack:focus-within .foreground-blur { transform:scale(1.1); }.eyebrow { margin:0 0 17px; color:#ffffff80; font-size:.78rem; font-weight:800; letter-spacing:.08em; }.story-panel h1 { margin:0; font-family:Georgia,"Noto Serif SC",serif; font-weight:500; font-size:clamp(2.35rem,3.7vw,3.35rem); line-height:1.12; letter-spacing:-.035em; }.story-panel p:not(.eyebrow) { color:#425559; line-height:1.7; margin:22px 0 26px; }.story-actions { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }.primary-button { min-height:48px; border:0; border-radius:999px; padding:0 19px; background:var(--terracotta); color:#fff; font-weight:700; cursor:pointer; box-shadow:0 8px 18px rgba(165,76,46,.24); transition:background .2s,transform .2s; }.primary-button:hover { background:var(--teal); transform:translateY(-2px); }.primary-button span { font-size:1.25em; padding-left:8px; }.text-button { min-height:44px; padding:0 16px; color:#fff; border:1px solid rgba(255,255,255,.32); border-radius:999px; background:rgba(18,46,48,.18); box-shadow:inset 0 1px 0 rgba(255,255,255,.28); backdrop-filter:blur(16px) saturate(135%); -webkit-backdrop-filter:blur(16px) saturate(135%); cursor:pointer; transition:background 220ms ease,transform 420ms cubic-bezier(.18,1.35,.32,1); }.text-button:hover { background:rgba(18,46,48,.28); transform:scale(1.04); }.text-button:focus-visible { background:rgba(18,46,48,.18); outline:2px solid rgba(255,255,255,.7); outline-offset:3px; transform:scale(1.04); }#return-home{appearance:none;-webkit-appearance:none;opacity:0;visibility:hidden;pointer-events:none}#return-home:disabled{opacity:0;background:rgba(18,46,48,.18);color:#fff;border-color:rgba(255,255,255,.32)}#return-home.is-ready{opacity:1;visibility:visible;pointer-events:auto}#return-home.is-ready:disabled{opacity:1;pointer-events:none}.motion-note { position:absolute; z-index:5; right:24px; bottom:20px; max-width:380px; padding:10px 14px; color:var(--muted); background:var(--paper); border-radius:12px; font-size:.82rem; }

/* 状态与可访问性区：暂停与系统减少动态效果均会停止所有环境动画 */
.motion-paused *,.motion-paused *::before,.motion-paused *::after { animation-play-state:paused !important; }
/* 咖啡机试听区：仅咖啡馆场景可悬停，按钮温和浮现并保持玻璃质感。 */
.coffee-sound-hotspot{position:absolute;z-index:8;left:63%;top:31%;width:12%;height:15%;display:none;align-items:flex-start;justify-content:center;pointer-events:auto}.scene--cafe .coffee-sound-hotspot{display:flex}.coffee-sound-hotspot button{margin-top:-42px;opacity:0;transform:translateY(18px) scale(.62);width:48px;height:48px;padding:10px;border:1px solid rgba(255,255,255,.32);border-radius:999px;color:#fff;background:rgba(18,46,48,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.28);backdrop-filter:blur(16px) saturate(135%);transition:transform 920ms cubic-bezier(.18,1.35,.32,1),opacity 920ms cubic-bezier(.18,1.35,.32,1),background 220ms ease;pointer-events:none}.coffee-sound-hotspot:hover button,.coffee-sound-hotspot:focus-within button{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}.coffee-sound-hotspot button:hover,.coffee-sound-hotspot button:focus-visible{background:rgba(255,255,255,.22)}.coffee-sound-hotspot button img{display:block;width:110%;height:110%;margin:-5%;filter:invert(1);opacity:.9}
@keyframes coffee-preview-in{0%{opacity:0;transform:translateY(18px) scale(.62);animation-timing-function:cubic-bezier(.18,.92,.28,1)}72%{opacity:1;transform:translateY(-3px) scale(1.08);animation-timing-function:cubic-bezier(.4,0,.2,1)}100%{opacity:1;transform:translateY(0) scale(1)}}@keyframes coffee-preview-out{0%{opacity:1;transform:translateY(0) scale(1);animation-timing-function:cubic-bezier(.18,.92,.28,1)}42%{opacity:1;transform:translateY(-3px) scale(1.08);animation-timing-function:cubic-bezier(.4,0,.2,1)}100%{opacity:0;transform:translateY(18px) scale(.62)}}.coffee-sound-hotspot button{transform-origin:50% 50%}.coffee-sound-hotspot.is-preview-visible button{opacity:1;transform:translateY(0) scale(1);pointer-events:auto;animation:none}.coffee-sound-hotspot.is-preview-leaving button{pointer-events:none;animation:none}
/* 右侧吧台倾倒区：独立于蒸汽热区，按钮同样在热区外上方浮现。 */
.coffee-pour-hotspot{position:absolute;z-index:8;left:72%;top:25%;width:10%;height:18%;display:none;align-items:flex-start;justify-content:center;pointer-events:auto}.scene--cafe .coffee-pour-hotspot{display:flex}.coffee-pour-hotspot button{margin-top:-42px;opacity:0;transform:translateY(18px) scale(.62);width:48px;height:48px;padding:10px;border:1px solid rgba(255,255,255,.32);border-radius:999px;color:#fff;background:rgba(18,46,48,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.28);backdrop-filter:blur(16px) saturate(135%);transition:transform 920ms cubic-bezier(.18,1.35,.32,1),opacity 920ms cubic-bezier(.18,1.35,.32,1),background 220ms ease;pointer-events:none}.coffee-pour-hotspot:hover button,.coffee-pour-hotspot:focus-within button{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}.coffee-pour-hotspot button:hover,.coffee-pour-hotspot button:focus-visible{background:rgba(255,255,255,.22)}.coffee-pour-hotspot button img{display:block;width:85%;height:85%;margin:auto;filter:invert(1);opacity:.9}
/* 咖啡馆前景办公桌：用户提供的透明桌面素材落在露台右下方，不改变底图人物与建筑。 */
.cafe-work-desk{position:absolute;z-index:9;display:none;left:29%;bottom:-13%;width:72%;max-width:none;aspect-ratio:1653/952;background:url('assets/cafe-work-desk.png') center/contain no-repeat;pointer-events:none}.scene--cafe .cafe-work-desk{display:block}
/* 桌面咖啡：用户触发后在笔记本右侧缓慢显现，十分钟无替换时撤去。 */
.cafe-desk-drink{position:absolute;z-index:10;display:none;left:74%;bottom:3%;width:10%;aspect-ratio:1/1;pointer-events:none}.scene--cafe .cafe-desk-drink{display:block}.desk-drink{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transform:translateY(14px) scale(.92);transition:opacity 1200ms cubic-bezier(.16,1,.3,1),transform 1200ms cubic-bezier(.16,1,.3,1)}.cafe-desk-drink.is-iced .desk-drink--iced,.cafe-desk-drink.is-latte .desk-drink--latte{opacity:1;transform:translateY(0) scale(1)}
/* 咖啡馆老奶奶推车：和目标背景以同一中心点、1.5→1 倍率、1490ms 时间轴同步缩放进入；回家时立即消失。 */
.cafe-grandmother-stroller{position:absolute;z-index:3;left:44%;top:27%;width:22%;aspect-ratio:1150/1367;opacity:0;transform-origin:50% 50%;background:none;pointer-events:none}.cafe-grandmother-stroller img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:opacity 1400ms cubic-bezier(.16,1,.3,1)}.cafe-grandmother-stroller .grandmother-baby{opacity:0}.cafe-grandmother-stroller.is-revealed>img:first-child{opacity:0}.cafe-grandmother-stroller.is-revealed .grandmother-baby{opacity:1}.grandmother-interact-cue{position:absolute;inset:0;margin:auto;display:grid;place-items:center;width:48px;height:48px;padding:10px;border:1px solid rgba(255,255,255,.32);border-radius:999px;color:#fff;background:rgba(18,46,48,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.28);backdrop-filter:blur(16px) saturate(135%);appearance:none;cursor:pointer;font-size:1.2rem;opacity:0;transform:translateY(18px) scale(.62);transition:transform 920ms cubic-bezier(.18,1.35,.32,1),opacity 920ms cubic-bezier(.18,1.35,.32,1),background 220ms ease;pointer-events:auto}.cafe-grandmother-stroller:hover .grandmother-interact-cue,.cafe-grandmother-stroller:focus-within .grandmother-interact-cue{opacity:1;transform:translateY(0) scale(1)}.grandmother-interact-cue:hover,.grandmother-interact-cue:focus-visible{background:rgba(255,255,255,.22)}.grandmother-interact-cue:active{transform:scale(.9)}.cafe-grandmother-stroller.is-revealed .grandmother-interact-cue{display:none}.grandmother-interact-cue img{position:static!important;display:block;width:100%;height:100%;object-fit:contain;filter:invert(1);transition:none!important}.baby-sound-hotspot{position:absolute;z-index:2;left:26%;top:8%;width:30%;height:28%;display:none;align-items:center;justify-content:center;padding:0;border:0;background:transparent;cursor:pointer}.baby-sound-icon{display:grid;place-items:center;width:48px;height:48px;padding:10px;border:1px solid rgba(255,255,255,.32);border-radius:999px;background:rgba(18,46,48,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.28);backdrop-filter:blur(16px) saturate(135%);opacity:0;transform:translateY(18px) scale(.62);transition:transform 920ms cubic-bezier(.18,1.35,.32,1),opacity 920ms cubic-bezier(.18,1.35,.32,1),background 220ms ease;pointer-events:none}.baby-sound-hotspot img{position:static!important;width:100%!important;height:100%!important;padding:0!important;opacity:.9!important;object-fit:contain;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;backdrop-filter:none!important;filter:invert(1);transform:none!important;transition:none!important}.cafe-grandmother-stroller.is-revealed .baby-sound-hotspot{display:flex}.baby-sound-hotspot:hover .baby-sound-icon{opacity:1;transform:translateY(0) scale(1);pointer-events:auto;background:rgba(18,46,48,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.28)}.baby-sound-icon:hover,.baby-sound-hotspot:focus-visible .baby-sound-icon{background:rgba(255,255,255,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.28)}.baby-sound-hotspot:active .baby-sound-icon{transform:scale(.9)}.cafe-grandmother-stroller:focus-visible{outline:2px solid rgba(24,60,66,.75);outline-offset:5px}.scene--cafe .cafe-grandmother-stroller{opacity:1;pointer-events:auto}.scene--cafe.is-entering .cafe-grandmother-stroller{animation:scene-scale-down 1490ms cubic-bezier(.4,0,.2,1) both}.scene--home .cafe-grandmother-stroller{opacity:0;pointer-events:none;animation:none}
/* 统一玻璃按钮：蒸汽、老奶奶与小宝宝使用同一材质、hover 与点击反馈。 */
.coffee-sound-hotspot button,.coffee-pour-hotspot button,.grandmother-interact-cue,.baby-sound-icon{box-sizing:border-box;width:48px;height:48px;padding:10px;border:1px solid rgba(255,255,255,.32);border-radius:999px;background:rgba(18,46,48,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.28);backdrop-filter:blur(16px) saturate(135%)}
.coffee-sound-hotspot button:hover,.coffee-sound-hotspot button:focus-visible,.coffee-pour-hotspot button:hover,.coffee-pour-hotspot button:focus-visible,.grandmother-interact-cue:hover,.grandmother-interact-cue:focus-visible{background:rgba(255,255,255,.22)}
.baby-sound-icon:hover,.baby-sound-hotspot:focus-visible .baby-sound-icon{background:rgba(255,255,255,.22)}
/* 小宝宝热区与真实按钮拆分：大热区只负责显现，中央按钮自身 hover 才点亮。 */
.baby-sound-hotspot>button{width:48px;height:48px;padding:0;border:0;background:transparent;cursor:pointer}.baby-sound-hotspot>button:hover .baby-sound-icon,.baby-sound-hotspot>button:focus-visible .baby-sound-icon{background:rgba(255,255,255,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.28)}
@keyframes glass-button-click{0%{transform:scale(1)}45%{transform:scale(.88)}100%{transform:scale(1)}}
.coffee-sound-hotspot button.is-button-click,.coffee-pour-hotspot button.is-button-click,.grandmother-interact-cue.is-button-click,.baby-sound-hotspot>button.is-button-click .baby-sound-icon{animation:glass-button-click 360ms cubic-bezier(.16,1,.3,1)}
.cafe-stroller{position:absolute;z-index:1;right:34%;bottom:27%;width:7.5vw;max-width:126px;aspect-ratio:1;background:url('assets/cafe-stroller.png?v=baby-v1') center/contain no-repeat;opacity:.78;pointer-events:none}
@media (max-width:720px) { .topbar { padding:16px 18px; }.brand span { display:none; }.topbar-actions { gap:5px; }.quiet-button { padding:0 10px; font-size:.78rem; }.scene::before,.scene::after { background-position:62% center; }.foreground-stack { top:auto; bottom:22px; }.story-panel { padding:32px; }.story-panel h1 { font-size:2.35rem; }.story-panel p:not(.eyebrow) { margin:13px 0 18px; font-size:.9rem; }.motion-note { display:none; }.seagull{left:57%;top:20%}.leaf-sway--home{left:46%} }
@media (prefers-reduced-motion: reduce) { .scene::before,.scene::after { transition-duration:0ms !important; } .scene-motion-layers * { animation:none !important; } *,*::before,*::after { scroll-behavior:auto !important; } }

/* 静态环境区：候鸟、树叶与蒸汽等环境层已移除，只有用户触发的转场可动。 */
.scene::before,.scene::after { transition:none; }

/* Jitter 风格转场区：整卡先收束，后以标签、标题、正文、按钮顺序进入。 */
.scene.is-transitioning { pointer-events:none; }.scene.is-exiting .foreground-stack { animation:glass-card-out 360ms cubic-bezier(.32,0,.18,1) both; }.scene--home.is-entering::before,.scene--cafe.is-entering::after { animation:scene-scale-down 1490ms cubic-bezier(.4,0,.2,1) both; }.scene.is-entering .foreground-stack { animation:foreground-scale-down 1490ms cubic-bezier(.4,0,.2,1) both; }.scene.is-entering .foreground-blur img { animation:foreground-visual-scale-down 1490ms cubic-bezier(.4,0,.2,1) both; }.scene.is-entering .eyebrow,.scene.is-entering .story-panel p:not(.eyebrow),.scene.is-entering .story-actions { opacity:0; animation:content-rise 520ms cubic-bezier(.16,1,.3,1) both; }.title-glyph { display:inline-block; }.title-glyph--punctuation { margin-inline-start:-.16em; }.scene.is-entering .title-glyph { opacity:0; animation:glyph-reveal 520ms cubic-bezier(.16,1,.3,1) both; animation-delay:calc(620ms + (var(--glyph-index) * 32ms)); }.scene.is-entering .eyebrow { animation-delay:560ms; }.scene.is-entering .story-panel p:not(.eyebrow) { animation-delay:1040ms; }.scene.is-entering .story-actions { animation-delay:1240ms; }@keyframes glass-card-out { to { opacity:.25; transform:translateY(7px) scale(.98); filter:blur(1px); } }@keyframes scene-scale-down { from { transform:scale(1.5); } to { transform:scale(1); } }@keyframes glass-card-settle { 0% { transform:translateY(12px) scale(1.10); } 48% { transform:translateY(2px) scale(.925); } 70% { transform:translateY(-1px) scale(1.028); } 100% { transform:translateY(0) scale(1); } }@keyframes foreground-scale-down { from { transform:scale(1.5); } to { transform:scale(1); } }@keyframes foreground-visual-scale-down { from { transform:scale(1.5); } to { transform:scale(1); } }@keyframes foreground-impulse { 0% { transform:scale(1); } 46% { transform:scale(1.148); } 72% { transform:scale(1.075); } 100% { transform:scale(1.1); } }@keyframes content-rise { from { opacity:0; transform:translateY(12px); filter:blur(1px); } to { opacity:1; transform:translateY(0); filter:blur(0); } }@keyframes glyph-reveal { from { opacity:0; transform:translateY(10px); filter:blur(2px); } to { opacity:1; transform:translateY(0); filter:blur(0); } }

/* 减少动态效果区：状态保留，任何转场立即完成。 */
@media (prefers-reduced-motion: reduce) { .story-panel,.foreground-overlay,.foreground-blur { transition:none !important; } .scene.is-exiting .foreground-stack,.scene.is-entering::before,.scene.is-entering::after,.scene.is-entering .foreground-stack,.scene.is-entering .foreground-blur img,.scene.is-entering .story-panel,.scene.is-entering .foreground-overlay,.scene.is-entering .eyebrow,.scene.is-entering .story-panel h1,.scene.is-entering .story-panel p:not(.eyebrow),.scene.is-entering .story-actions { animation:none !important; } }
