:root{--primary: #10b981;--primary-dark: #059669;--bg-light: #f0fdf4;--text-main: #1f2937;--glass: rgba(255, 255, 255, .85)}.app-container{width:100%;height:100vh;background:var(--bg-light);font-family:Inter,system-ui,sans-serif;color:var(--text-main);overflow:hidden;position:relative}.cloud-status{position:absolute;top:12px;right:12px;background:var(--glass);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:4px 12px;border-radius:20px;font-size:12px;display:flex;align-items:center;gap:6px;z-index:100;box-shadow:0 2px 10px #0000000d;color:#64748b}.screen{width:100%;height:100%;position:relative;display:flex;flex-direction:column}.start-screen{justify-content:center;align-items:center;text-align:center}.hero-content{z-index:2;background:var(--glass);padding:40px;border-radius:32px;box-shadow:0 20px 50px #0000001a;max-width:80%}.hero-content h1{font-size:2.5rem;margin-bottom:12px;background:linear-gradient(135deg,#059669,#3b82f6);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.bg-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1}.bg-overlay img,.placeholder-bg{width:100%;height:100%;object-fit:cover}.placeholder-bg{display:flex;align-items:center;justify-content:center;font-size:100px;background:linear-gradient(to bottom,#dcfce7,#f0fdf4)}.map-header{padding:24px;background:#fff;z-index:10;box-shadow:0 4px 20px #0000000d}.progress-bar{margin-top:12px;height:8px;background:#e2e8f0;border-radius:4px;position:relative}.progress-fill{height:100%;background:var(--primary);border-radius:4px;transition:width .5s ease}.progress-bar span{position:absolute;right:0;top:-20px;font-size:12px;color:#64748b}.map-container{flex:1;position:relative;background:radial-gradient(circle at center,#f0fdf4,#dcfce7);overflow:hidden}.park-svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;opacity:.3}.spot-marker{position:absolute;transform:translate(-50%,-50%);width:56px;height:56px;border-radius:20px;display:flex;align-items:center;justify-content:center;color:#fff;border:4px solid white;box-shadow:0 8px 20px #00000026;cursor:pointer;z-index:5}.spot-marker.visited:after{content:"✓";position:absolute;top:-8px;right:-8px;background:#10b981;width:20px;height:20px;border-radius:50%;font-size:12px;display:flex;align-items:center;justify-content:center}.marker-label{position:absolute;bottom:-28px;white-space:nowrap;background:var(--glass);color:var(--text-main);padding:2px 10px;border-radius:10px;font-size:12px;font-weight:600}.spot-screen{background:#fff}.btn-back{position:absolute;top:20px;left:20px;z-index:20;background:var(--glass);border:none;padding:8px 16px;border-radius:12px;display:flex;align-items:center;gap:4px;font-weight:600;cursor:pointer}.panorama-container{height:40vh;position:relative;overflow:hidden;background:#000}.panorama-track{height:100%;display:flex}.panorama-track img{height:100%;min-width:100%;object-fit:cover}.panorama-hint{position:absolute;bottom:12px;left:50%;transform:translate(-50%);background:#00000080;color:#fff;padding:4px 12px;border-radius:20px;font-size:12px;display:flex;align-items:center;gap:6px}.info-card{flex:1;padding:30px;border-radius:30px 30px 0 0;margin-top:-30px;background:#fff;position:relative;box-shadow:0 -10px 30px #0000001a}.info-card h3{font-size:1.8rem;margin-bottom:12px}.desc{color:#4b5563;line-height:1.6;margin-bottom:24px}.ai-tip-box{background:#f8fafc;border-left:4px solid #3b82f6;padding:16px;border-radius:0 12px 12px 0;margin-bottom:20px}.tip-header{font-size:13px;font-weight:700;color:#3b82f6;display:flex;align-items:center;gap:6px;margin-bottom:6px}.egg-hint-box{background:linear-gradient(135deg,#fef3c7,#fde68a);padding:16px;border-radius:16px;display:flex;align-items:center;gap:12px;color:#92400e;font-weight:600;cursor:pointer}.egg-screen{justify-content:center;align-items:center;background:#10b9811a}.egg-card{background:#fff;padding:40px;border-radius:32px;text-align:center;box-shadow:0 20px 60px #00000026;max-width:320px}.egg-visual{width:120px;height:120px;margin:0 auto 24px;background:radial-gradient(circle,#fef3c7,#fde68a);border-radius:50%;display:flex;align-items:center;justify-content:center;overflow:hidden}.egg-visual img{width:100%;height:100%;object-fit:cover}.egg-emoji{font-size:60px}.btn-primary{background:var(--primary);color:#fff;border:none;padding:12px 32px;border-radius:16px;font-size:16px;font-weight:700;cursor:pointer;transition:all .2s}.btn-primary:hover{background:var(--primary-dark);transform:translateY(-2px)}