/* 成长原野、UU 行走和场景反馈。第一阶段只搬移，不改选择器和值。 */
.home-world { margin: -3px -8px 0; }
.world-head { display: flex; align-items: end; justify-content: space-between; gap: 12px; padding: 0 8px 12px; }
.world-head h1 { margin: 3px 0 0; font-size: 27px; }
.world-head .eyebrow { margin: 0; }
.world-week { flex: 0 0 auto; padding: 8px 10px; border-radius: 14px; background: rgba(255,255,255,.76); color: #617d9c; font-size: 11px; font-weight: 800; box-shadow: 0 7px 20px rgba(69,96,127,.08); }
.world-map { position: relative; aspect-ratio: 4 / 5; overflow: hidden; border: 1px solid rgba(255,255,255,.72); border-radius: 30px; background: #dcecff; box-shadow: 0 18px 45px rgba(56,89,123,.2); isolation: isolate; }
.world-map-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.world-map::after { content: ""; position: absolute; z-index: 1; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(45,72,103,.07), transparent 24%, transparent 76%, rgba(44,67,88,.08)); }
.world-hotspot { position: absolute; z-index: 4; transform: translate(-50%,-50%); border: 1px solid rgba(255,255,255,.9); border-radius: 999px; padding: 7px 10px; background: rgba(255,255,255,.88); color: #405873; font-size: 11px; font-weight: 900; white-space: nowrap; box-shadow: 0 7px 18px rgba(52,79,106,.2); backdrop-filter: blur(8px); cursor: pointer; transition: transform .2s ease, background .2s ease, color .2s ease; }
.world-hotspot::before { content: ""; position: absolute; left: 50%; bottom: -6px; width: 10px; height: 10px; transform: translateX(-50%) rotate(45deg); background: inherit; border-right: 1px solid rgba(255,255,255,.9); border-bottom: 1px solid rgba(255,255,255,.9); }
.world-hotspot:hover { transform: translate(-50%,-55%) scale(1.04); }
.world-hotspot.active { background: #385a7d; color: white; box-shadow: 0 0 0 4px rgba(255,255,255,.55), 0 10px 24px rgba(35,59,84,.28); }
.world-hotspot.targeting { animation: destinationPulse .8s ease-in-out infinite alternate; }
.world-hotspot:disabled { cursor: wait; }
@keyframes destinationPulse { to { transform: translate(-50%,-56%) scale(1.07); box-shadow: 0 0 0 6px rgba(255,255,255,.42), 0 11px 25px rgba(35,59,84,.24); } }
.world-trail { position: absolute; z-index: 2; inset: 0; pointer-events: none; }
.world-footstep { --trail-angle: 0deg; --foot-side: -11deg; position: absolute; width: 5px; height: 9px; border-radius: 60% 60% 52% 52%; background: rgba(73,101,126,.34); transform: translate(-50%,-50%) rotate(calc(var(--trail-angle) + var(--foot-side))); animation: footprintIn .35s ease both; }
.world-footstep.right { --foot-side: 11deg; }
.world-footstep::after { content: ""; position: absolute; left: 1px; top: -3px; width: 3px; height: 3px; border-radius: 50%; background: inherit; }
.world-trail.fading .world-footstep { animation: footprintOut 1.25s ease forwards; }
@keyframes footprintIn { from { opacity: 0; scale: .5; } to { opacity: 1; scale: 1; } }
@keyframes footprintOut { to { opacity: 0; transform: translate(-50%,-50%) scale(.35); } }
.map-uu { --depth-scale: 1; --travel-lean: 0deg; position: absolute; z-index: 3; left: 49%; top: 54%; width: 78px; height: 104px; transform: translate(-50%,-82%) scale(var(--depth-scale)); transform-origin: 50% 82%; pointer-events: none; will-change: left, top, transform; }
.map-uu-shadow { position: absolute; z-index: 0; left: 50%; bottom: 1px; width: 52px; height: 14px; border-radius: 50%; background: rgba(46,68,87,.24); filter: blur(3px); transform: translateX(-50%); transition: width .2s ease, opacity .2s ease; }
.map-uu-body { position: absolute; z-index: 2; left: 2px; right: 2px; bottom: 4px; transform-origin: 50% 92%; filter: drop-shadow(0 8px 7px rgba(44,67,89,.22)); }
.map-uu-body img { display: block; width: 100%; max-width: none; transition: transform .24s cubic-bezier(.25,.8,.3,1); }
.map-uu.facing-left .map-uu-body img { transform: scaleX(-1); }
.map-uu.turning .map-uu-body { animation: uuTurn .24s ease both; }
.map-uu.walking .map-uu-body { animation: uuWalkCycle .54s linear infinite; }
.map-uu.walking .map-uu-shadow { width: 47px; opacity: .68; animation: shadowStep .54s linear infinite; }
.map-uu.walking .map-uu-scene, .map-uu.turning .map-uu-scene { opacity: 0 !important; transform: translateY(6px) scale(.7) !important; }
.map-uu.walking .map-uu-caption, .map-uu.turning .map-uu-caption { opacity: 0; }
@keyframes uuTurn { 50% { transform: translateY(1px) scaleX(.92) scaleY(.98); } }
@keyframes uuWalkCycle {
  0%,100% { transform: translateY(0) rotate(calc(var(--travel-lean) - 1deg)) scaleY(1); }
  25% { transform: translateY(-3px) rotate(calc(var(--travel-lean) + 1.4deg)) scaleY(1.008); }
  50% { transform: translateY(-.5px) rotate(calc(var(--travel-lean) + .6deg)) scaleY(.985); }
  75% { transform: translateY(-3px) rotate(calc(var(--travel-lean) - 1.4deg)) scaleY(1.006); }
}
@keyframes shadowStep { 25%,75% { transform: translateX(-50%) scaleX(.9); opacity: .54; } 50% { transform: translateX(-50%) scaleX(1.03); opacity: .7; } }
.map-uu.arrived .map-uu-body { animation: uuArrive .78s cubic-bezier(.2,1.25,.35,1); }
@keyframes uuArrive { 0% { transform: translateY(-2px) rotate(var(--travel-lean)); } 42% { transform: translateY(-7px) rotate(2deg) scale(1.035); } 72% { transform: translateY(1px) rotate(-1deg) scale(.992); } 100% { transform: translateY(0); } }
.map-uu.scene-rest:not(.walking):not(.arrived) .map-uu-body { animation: uuRest 3.4s ease-in-out infinite; }
.map-uu.scene-map:not(.walking):not(.arrived) .map-uu-body { animation: uuLookUp 2.8s ease-in-out infinite; }
.map-uu.scene-tools:not(.walking):not(.arrived) .map-uu-body { animation: uuChoose 2.4s ease-in-out infinite; }
.map-uu.scene-vault:not(.walking):not(.arrived) .map-uu-body { animation: uuTreasure 3.2s ease-in-out infinite; }
.map-uu.scene-action:not(.walking):not(.arrived) .map-uu-body { animation: uuReady 1.9s ease-in-out infinite; }
@keyframes uuRest { 0%,100% { transform: translateY(1px) rotate(-1deg) scale(.985); } 50% { transform: translateY(3px) rotate(1deg) scale(.97); } }
@keyframes uuLookUp { 0%,100% { transform: translateY(0) rotate(-1deg); } 35%,65% { transform: translateY(-2px) rotate(4deg); } }
@keyframes uuChoose { 0%,100% { transform: translateY(0) rotate(-1deg); } 38% { transform: translateY(-3px) rotate(2deg) scale(1.015); filter: drop-shadow(0 8px 10px rgba(233,184,93,.3)); } 62% { transform: translateY(-1px) rotate(-2deg); } }
@keyframes uuTreasure { 0%,100% { transform: translateY(0) rotate(0); } 40% { transform: translateY(-1px) rotate(3deg); filter: drop-shadow(0 8px 12px rgba(230,152,186,.28)); } 70% { transform: translateY(1px) rotate(-2deg) scale(.985); } }
@keyframes uuReady { 0%,100% { transform: translateY(0) rotate(-1deg); } 45% { transform: translateY(-4px) rotate(1deg) scale(1.02); } 60% { transform: translateY(-1px) rotate(-1deg) scale(1.005); } }
.map-uu-scene { position: absolute; z-index: 4; right: -12px; top: 7px; min-width: 31px; height: 31px; padding: 0 7px; display: grid; place-items: center; border: 2px solid rgba(255,255,255,.9); border-radius: 50%; background: rgba(255,255,255,.94); box-shadow: 0 7px 17px rgba(44,67,89,.18); font-size: 16px; opacity: 0; transform: translateY(6px) scale(.7); transition: opacity .24s ease, transform .24s ease; }
.map-uu:not(.scene-center) .map-uu-scene { opacity: 1; transform: translateY(0) scale(1); }
.map-uu.scene-rest .map-uu-scene { background: #eff8ff; }
.map-uu.scene-map .map-uu-scene { background: #eef1ff; }
.map-uu.scene-tools .map-uu-scene { background: #fff6df; }
.map-uu.scene-vault .map-uu-scene { background: #fff0f5; }
.map-uu.scene-action .map-uu-scene { background: #edf8f1; }
.map-uu-caption { position: absolute; z-index: 5; left: 50%; top: -27px; width: max-content; max-width: 142px; padding: 6px 9px; border: 1px solid rgba(255,255,255,.94); border-radius: 12px 12px 12px 4px; color: #405873; background: rgba(255,255,255,.94); box-shadow: 0 7px 18px rgba(45,68,92,.16); font-size: 10px; font-weight: 900; opacity: 0; transform: translate(-50%,7px) scale(.92); transition: opacity .24s ease, transform .24s ease; }
.map-uu.arrived .map-uu-caption { opacity: 1; transform: translate(-50%,0) scale(1); }
#worldBanner { position: absolute; z-index: 6; left: 11px; right: 11px; bottom: 11px; }
.world-banner { display: grid; grid-template-columns: 44px 1fr auto; gap: 10px; align-items: center; padding: 11px 12px; border: 1px solid rgba(255,255,255,.85); border-radius: 19px; background: rgba(255,255,255,.92); box-shadow: 0 13px 32px rgba(47,70,94,.2); backdrop-filter: blur(12px); animation: bannerIn .28s ease; }
@keyframes bannerIn { from { opacity: 0; transform: translateY(7px); } }
.world-banner-icon { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 15px; background: linear-gradient(145deg, #e8f4ff, #fff1f5); font-size: 21px; }
.world-banner-copy { min-width: 0; }
.world-banner-copy strong { display: block; font-size: 15px; margin-bottom: 3px; }
.world-banner-copy p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.world-banner .mini-action { width: 42px; height: 42px; border: 0; border-radius: 14px; padding: 0; color: white; background: linear-gradient(135deg, #6598ca, #7eb7b1); font-size: 0; font-weight: 800; cursor: pointer; }
.world-banner .mini-action::after { content: "›"; font-size: 24px; line-height: 1; }
.world-quick-actions { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.world-quick-actions button { border: 1px solid rgba(68,98,130,.12); border-radius: 12px; padding: 8px 3px; color: #4c647e; background: rgba(243,248,253,.94); font-size: 11px; font-weight: 800; cursor: pointer; }
.world-quick-actions b { display: block; margin-bottom: 2px; font-size: 15px; }
.mentor-mode-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; padding: 5px; margin: 3px 0 18px; border-radius: 18px; background: rgba(91,126,162,.1); }
.mentor-mode-tab { border: 0; border-radius: 14px; padding: 11px 8px; color: #73839a; background: transparent; font-weight: 800; cursor: pointer; }
.mentor-mode-tab.active { color: #315475; background: white; box-shadow: 0 7px 19px rgba(61,88,119,.1); }
.peer-hero { position: relative; overflow: hidden; min-height: 182px; padding: 22px 112px 22px 21px; border-radius: 27px; color: white; background: linear-gradient(145deg, #537b7d, #7fb0a0); box-shadow: 0 16px 38px rgba(61,105,102,.2); }
.peer-hero::after { content: "UU"; position: absolute; right: -2px; bottom: -28px; font-size: 90px; font-weight: 900; color: rgba(255,255,255,.08); }
.peer-hero h2 { margin: 11px 0 7px; font-size: 24px; }
.peer-hero p { margin: 0; color: rgba(255,255,255,.8); font-size: 13px; line-height: 1.6; }
.peer-card { width: 100%; margin-top: 11px; display: grid; grid-template-columns: 48px 1fr auto; gap: 11px; align-items: center; padding: 14px; border: 1px solid var(--line); border-radius: 20px; background: rgba(255,255,255,.88); color: var(--ink); text-align: left; cursor: pointer; }
.peer-card-icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 16px; background: #edf5ff; font-size: 22px; }
.peer-card strong { display: block; font-size: 15px; }
.peer-card small { display: block; margin-top: 4px; color: var(--muted); font-size: 12px; line-height: 1.45; }
.peer-card .arrow { font-size: 20px; }
.safe-note { display: grid; grid-template-columns: 35px 1fr; gap: 10px; align-items: start; padding: 13px 14px; margin-top: 13px; border-radius: 18px; color: #567267; background: #edf8f3; font-size: 12px; line-height: 1.55; }
.safe-note b { width: 35px; height: 35px; display: grid; place-items: center; border-radius: 12px; background: white; }

/* UG-UI-20261015-05: a quiet meadow for feelings and memories, with non-blocking proximity hints. */
.home-world .world-map { touch-action: pan-y; }
.home-world .world-map-bg { pointer-events: none; user-select: none; -webkit-user-drag: none; }
.home-world .map-uu-body img { user-select: none; -webkit-user-drag: none; }
.home-world #worldBanner { pointer-events: none; }
.home-world .world-hotspot:focus-visible { outline: 3px solid #314f86; outline-offset: 5px; }
.home-world .map-uu.near-location:not(.walking) .map-uu-caption { opacity: 1; transform: translate(-50%,0) scale(1); }
.world-nearby-note { display: flex; align-items: center; gap: 10px; width: fit-content; max-width: 100%; margin: 0 auto; padding: 10px 14px; color: #3d536c; background: rgba(255,255,255,.91); border: 1px solid rgba(255,255,255,.9); border-radius: 18px; box-shadow: 0 8px 22px rgba(45,68,92,.12); backdrop-filter: blur(10px); }
.world-nearby-note > span { font-size: 22px; }
.world-nearby-note strong, .world-nearby-note small { display: block; }
.world-nearby-note strong { font-size: 13px; line-height: 1.6; }
.world-nearby-note small { font-size: 11px; line-height: 1.6; color: #5b7187; }
.world-walk-hint { width: fit-content; max-width: 100%; margin: 0 auto; padding: 9px 14px; border-radius: 17px; color: #455c72; background: rgba(255,255,255,.82); text-align: center; font-size: 12px; line-height: 1.7; }
.world-walk-hint small { display: block; font-size: 10px; color: #657b8d; }
.world-touch-hint { display: none; }
.world-follow-footstep { animation: meadowFootstep 1.8s ease-out both; }
@keyframes meadowFootstep { 0% { opacity: 0; } 15%,45% { opacity: .55; } 100% { opacity: 0; } }
.world-reduced-motion :is(.map-uu-body,.map-uu-shadow,.map-uu-scene,.map-uu-caption,.world-hotspot,.map-uu-body img) { animation: none !important; transition: none !important; }
@media (pointer: coarse) { .world-desktop-hint { display: none; } .world-touch-hint { display: inline; } }
@media (prefers-reduced-motion: reduce) { .home-world :is(.map-uu-body,.map-uu-shadow,.map-uu-scene,.map-uu-caption,.world-hotspot,.map-uu-body img,.world-follow-footstep) { animation: none !important; transition: none !important; } }