:root{--primary: #3b82f6;--primary-dark: #2563eb;--secondary: #10b981;--bg-dark: #0f172a;--bg-card: rgba(30, 41, 59, .7);--text-main: #f8fafc;--text-muted: #94a3b8;--gold: #fbbf24;--danger: #ef4444}*{box-sizing:border-box;margin:0;padding:0;font-family:Segoe UI,system-ui,sans-serif}body{background-color:var(--bg-dark);color:var(--text-main);overflow:hidden;-webkit-user-select:none;user-select:none}.screen{width:100vw;height:100vh;display:flex;flex-direction:column;position:relative}.icon-sm{width:16px;height:16px}.icon-md{width:24px;height:24px}.icon-lg{width:32px;height:32px}.icon-xl{width:48px;height:48px}.icon-spin{animation:spin 2s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.text-gold{color:var(--gold)}.text-blue{color:var(--primary)}.text-green-400{color:#4ade80}.text-blue-500{color:#3b82f6}.text-gray-400{color:#9ca3af}.text-gray-500{color:#6b7280}.text-red-400{color:#f87171}.btn-primary{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff;border:none;border-radius:99px;padding:12px 24px;font-size:1.1rem;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:8px;box-shadow:0 4px 15px #3b82f666}.btn-large{padding:16px 32px;font-size:1.3rem;margin-top:20px}.app-header{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;background:#0f172acc;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.1);z-index:10}.header-left,.header-right{display:flex;align-items:center;gap:16px}.title{font-size:1.2rem;font-weight:700;background:linear-gradient(to right,#60a5fa,#a78bfa);-webkit-background-clip:text;color:transparent}.cloud-status{font-size:.8rem;color:var(--text-muted);background:#ffffff1a;padding:4px 8px;border-radius:12px}.cloud-status .error{color:var(--danger)}.score-badge{display:flex;align-items:center;gap:6px;background:#fbbf241a;padding:6px 12px;border-radius:20px;font-weight:700;border:1px solid rgba(251,191,36,.3)}.icon-btn{background:transparent;border:none;color:var(--text-main);cursor:pointer;padding:8px;border-radius:50%;transition:background .2s}.icon-btn:hover{background:#ffffff1a}.start-screen{justify-content:center;align-items:center;background:radial-gradient(circle at center,#1e293b,#0f172a)}.stars-bg{position:absolute;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(rgba(255,255,255,.1) 1px,transparent 1px);background-size:30px 30px;opacity:.5}.hero-content{text-align:center;z-index:1;display:flex;flex-direction:column;align-items:center;background:var(--bg-card);padding:40px;border-radius:32px;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);box-shadow:0 25px 50px -12px #00000080}.hero-icon-wrapper{width:120px;height:120px;margin-bottom:20px;filter:drop-shadow(0 0 20px rgba(59,130,246,.5))}.hero-svg{width:100%;height:100%;animation:float 6s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-15px)}}.main-title{font-size:3rem;margin-bottom:10px;text-shadow:0 2px 10px rgba(0,0,0,.5)}.subtitle{color:var(--text-muted);margin-bottom:30px;font-size:1.1rem}.stats-preview{display:flex;gap:20px;margin-bottom:30px}.stat-item{display:flex;align-items:center;gap:8px;background:#0000004d;padding:8px 16px;border-radius:12px}.map-screen{background:#0f172a}.map-container{flex:1;position:relative;overflow:hidden;background:radial-gradient(circle at 50% 50%,#1e293b,#020617)}.world-map-svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;opacity:.3;pointer-events:none}.map-pin{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer;z-index:2}.pin-icon{width:48px;height:48px;border-radius:50%;display:flex;justify-content:center;align-items:center;background:#1e293be6;border:2px solid rgba(255,255,255,.2);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:all .3s}.map-pin.unlocked .pin-icon{border-color:var(--primary);box-shadow:0 0 20px #3b82f666}.map-pin.completed .pin-icon{border-color:var(--secondary);box-shadow:0 0 20px #10b98166}.pin-label{background:#000000b3;padding:4px 10px;border-radius:12px;font-size:.85rem;font-weight:700;white-space:nowrap}.map-footer{padding:20px;background:#0f172ae6;border-top:1px solid rgba(255,255,255,.1)}.progress-bar-container{max-width:600px;margin:0 auto}.progress-text{font-size:.9rem;color:var(--text-muted);margin-bottom:8px;text-align:center}.progress-track{height:8px;background:#ffffff1a;border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,var(--primary),#8b5cf6);transition:width .5s ease}.playing-screen{background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" opacity="0.05"><path d="M0 0h100v100H0z" fill="%230f172a"/><path d="M0 0l100 100M100 0L0 100" stroke="%23fff" stroke-width="1"/></svg>') center/cover}.game-board{flex:1;display:flex;flex-direction:column;align-items:center;padding:20px;overflow-y:auto}.level-header{width:100%;max-width:800px;display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;background:var(--bg-card);padding:16px 24px;border-radius:20px;border:1px solid rgba(255,255,255,.1)}.dest-title{font-size:1.2rem;font-weight:700}.timer{display:flex;align-items:center;gap:8px;font-size:1.2rem;font-weight:700;color:var(--secondary);background:#10b9811a;padding:8px 16px;border-radius:12px}.timer.danger{color:var(--danger);background:#ef44441a;animation:pulse 1s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.puzzle-card{width:100%;max-width:800px;background:var(--bg-card);border-radius:24px;padding:40px;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.1);box-shadow:0 20px 40px #0000004d;min-height:400px;display:flex;flex-direction:column;justify-content:center}.loading-state,.error-state{display:flex;flex-direction:column;align-items:center;gap:16px;color:var(--text-muted)}.question-text{font-size:1.5rem;line-height:1.4;margin-bottom:30px;text-align:center}.options-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:30px}@media (max-width: 600px){.options-grid{grid-template-columns:1fr}}.option-btn{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:16px;display:flex;align-items:center;gap:16px;cursor:pointer;color:#fff;text-align:left;transition:all .2s}.option-btn:hover{background:#3b82f633;border-color:var(--primary)}.opt-letter{background:#ffffff1a;width:32px;height:32px;display:flex;justify-content:center;align-items:center;border-radius:8px;font-weight:700;color:var(--text-muted)}.option-btn:hover .opt-letter{background:var(--primary);color:#fff}.opt-text{font-size:1.1rem;flex:1}.actions-row{display:flex;justify-content:center;gap:16px;margin-top:20px}.hint-btn,.reset-btn{background:#ffffff1a;border:none;color:#fff;padding:10px 20px;border-radius:12px;cursor:pointer;display:flex;align-items:center;gap:8px;transition:background .2s}.hint-btn:hover{background:#f59e0b33;color:#fcd34d}.hint-btn.disabled{opacity:.5;cursor:not-allowed}.reset-btn:hover{background:#fff3}.hint-box{margin-top:20px;background:#f59e0b1a;border:1px solid rgba(245,158,11,.3);padding:16px;border-radius:12px;color:#fcd34d;text-align:center}.gallery-screen{background:#0f172a}.gallery-container{flex:1;padding:40px;overflow-y:auto}.gallery-title{text-align:center;font-size:2rem;margin-bottom:40px;text-shadow:0 2px 10px rgba(0,0,0,.5)}.photo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:30px;max-width:1200px;margin:0 auto}.photo-frame{background:#fff;padding:12px 12px 40px;border-radius:8px;box-shadow:0 10px 20px #0000004d;transform:rotate(-2deg);transition:transform .3s}.photo-frame:nth-child(2n){transform:rotate(2deg)}.photo-frame:hover{transform:scale(1.05) rotate(0);z-index:10}.photo-inner{width:100%;aspect-ratio:4/3;background:#e2e8f0;overflow:hidden;display:flex;justify-content:center;align-items:center;border-radius:4px}.real-photo{width:100%;height:100%;object-fit:cover}.fallback-photo{font-size:4rem}.locked-photo{background:#cbd5e1;width:100%;height:100%;display:flex;justify-content:center;align-items:center}.photo-caption{text-align:center;color:#334155;font-family:Comic Sans MS,cursive,sans-serif;font-size:1.2rem;margin-top:-25px;font-weight:700}.photo-frame.locked{filter:grayscale(1) opacity(.5);pointer-events:none}