:root{font-family:sans-serif;line-height:1.5;color-scheme:light dark;color:#ffffffde;background-color:#242424;--font-size-xs: 12px;--font-size-sm: 13px;--font-size-base: 14px;--font-size-md: 15px;--font-size-lg: 16px;--font-size-xl: 18px;--font-size-2xl: 20px;--font-size-3xl: 22px;--font-size-4xl: 24px;--font-size-5xl: 28px;--font-size-6xl: 32px;--icon-xs: 18px;--icon-sm: 22px;--icon-md: 26px;--icon-lg: 34px;--icon-xl: 50px;--icon-2xl: 66px;--color-primary: #1976d2;--color-primary-dark: #1565c0;--color-primary-light: #42a5f5;--color-primary-gradient: linear-gradient(135deg, #1976d2 0%, #1565c0 100%);--color-secondary: #42a5f5;--color-secondary-gradient: linear-gradient(135deg, #42a5f5 0%, #1976d2 100%);--color-success: #0097a7;--color-success-dark: #00838f;--color-success-gradient: linear-gradient(135deg, #00bcd4 0%, #0097a7 100%);--color-danger: #f44336;--color-danger-dark: #d32f2f;--color-neutral: #f0f0f0;--color-neutral-dark: #e0e0e0}.page-header,.feed-header,.map-header,.profile-header,.badges-header,.friends-header,.settings-header,.search-header,.verified-header,.edit-profile-header,.detail-header{display:flex;align-items:center;justify-content:space-between;padding:16px;min-height:74px;background:#fff;box-shadow:0 2px 12px #0000001a;position:sticky;top:0;z-index:100}.page-header h1,.feed-header h1,.map-header h1,.profile-header h1,.badges-header h1,.friends-header h1,.settings-header h1,.search-header h1,.verified-header h1,.edit-profile-header h1,.detail-header h1{flex:1;text-align:center;margin:0;font-size:var(--font-size-3xl);color:#333}.header-spacer{width:40px}.back-button,.edit-button,.settings-button,.save-button,.header-button{background:#0000000d;border:1px solid rgba(0,0,0,.1);font-size:15px;cursor:pointer;padding:10px 16px;color:#333;border-radius:12px;white-space:nowrap;transition:all .2s;min-width:40px;min-height:40px;display:flex;align-items:center;justify-content:center}.back-button:hover,.edit-button:hover,.settings-button:hover,.save-button:hover,.header-button:hover{background:#ffffff4d;border-color:#ffffff80}.primary-button{background:var(--color-primary-gradient);color:#fff;border:none;padding:16px 36px;border-radius:12px;font-size:var(--font-size-lg);font-weight:500;cursor:pointer;transition:all .3s;box-shadow:0 4px 12px #1976d24d;display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap}.primary-button:hover{transform:translateY(-2px);box-shadow:0 6px 16px #1976d266}.primary-button:active{transform:translateY(0)}.primary-button .arrow{transition:transform .3s}.primary-button:hover .arrow{transform:translate(4px)}.secondary-button{background:#fff;color:var(--color-primary);border:2px solid var(--color-primary);padding:16px 36px;border-radius:12px;font-size:var(--font-size-lg);font-weight:500;cursor:pointer;transition:all .3s;white-space:nowrap}.secondary-button:hover{background:var(--color-primary);color:#fff;transform:translateY(-2px);box-shadow:0 4px 12px #1976d24d}.danger-button{background:var(--color-danger);color:#fff;border:none;padding:16px 36px;border-radius:12px;font-size:var(--font-size-lg);font-weight:500;cursor:pointer;transition:all .3s;box-shadow:0 4px 12px #f443364d;white-space:nowrap}.danger-button:hover{background:var(--color-danger-dark);transform:translateY(-2px);box-shadow:0 6px 16px #f4433666}.empty-state{text-align:center;padding:80px 20px;display:flex;flex-direction:column;align-items:center;justify-content:center}.empty-icon{font-size:68px;margin-bottom:20px;opacity:.5;filter:grayscale(100%)}.empty-state h2,.empty-state h3{font-size:var(--font-size-xl);font-weight:600;color:#333;margin:0 0 12px}.empty-state p{font-size:var(--font-size-md);color:#999;margin:0 0 32px;line-height:1.6}.empty-state-illustration{position:relative;margin-bottom:28px;animation:float 3s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.empty-state-title{font-size:var(--font-size-3xl);text-align:center;color:#2c3e50;margin-bottom:16px;line-height:1.3;max-width:280px;word-break:keep-all}.empty-state-description{font-size:var(--font-size-md);color:#7f8c8d;line-height:1.6;margin-bottom:32px;max-width:280px;text-align:center}.empty-state-button{display:inline-flex;align-items:center;gap:8px;padding:14px 28px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:50px;font-size:var(--font-size-lg);font-weight:600;cursor:pointer;box-shadow:0 4px 16px #667eea4d;transition:all .3s ease;margin-bottom:40px}.empty-state-button:hover{transform:translateY(-2px);box-shadow:0 6px 24px #667eea66}.empty-state-button:active{transform:translateY(0)}.empty-state-features{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;max-width:340px;margin:0 auto}.modal-overlay{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .2s}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-content{background:#fff;border-radius:16px;padding:24px;max-width:400px;width:90%;box-shadow:0 8px 32px #0003;animation:slideUp .3s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.modal-content h3{margin:0 0 16px;font-size:var(--font-size-2xl);color:#333}.modal-content p{margin:0 0 24px;font-size:var(--font-size-md);color:#666;line-height:1.6}.modal-buttons{display:flex;gap:12px;justify-content:flex-end}.modal-buttons button{padding:10px 20px;border-radius:8px;font-size:var(--font-size-md);font-weight:500;cursor:pointer;transition:all .2s;border:none}.modal-buttons .cancel-button{background:var(--color-neutral);color:#666}.modal-buttons .cancel-button:hover{background:var(--color-neutral-dark)}.modal-buttons .confirm-button{background:var(--color-primary);color:#fff}.modal-buttons .confirm-button:hover{background:var(--color-primary-dark)}.modal-buttons .confirm-button.delete{background:var(--color-danger)}.modal-buttons .confirm-button.delete:hover{background:var(--color-danger-dark)}.card,.user-card{background:#fff;border-radius:12px;padding:16px;box-shadow:0 2px 8px #00000014;transition:all .2s}.card:hover,.user-card:hover{box-shadow:0 4px 16px #0000001f;transform:translateY(-2px)}a{color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;font-family:sans-serif}h1{font-size:var(--font-size-3xl);line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.4em .6em;font-size:15px;font-family:sans-serif;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}@media(max-width:375px){:root{--font-size-xs: 10px;--font-size-sm: 11px;--font-size-base: 12px;--font-size-md: 13px;--font-size-lg: 15px;--font-size-xl: 15px;--font-size-2xl: 16px;--font-size-3xl: 20px;--font-size-4xl: 20px;--font-size-5xl: 24px;--font-size-6xl: 28px;--icon-xs: 12px;--icon-sm: 16px;--icon-md: 18px;--icon-lg: 24px;--icon-xl: 36px;--icon-2xl: 48px}.page-header,.feed-header,.map-header,.profile-header,.badges-header,.friends-header,.settings-header,.search-header,.verified-header,.edit-profile-header,.detail-header{padding:10px}.page-header h1,.feed-header h1{font-size:20px}.back-button,.edit-button,.settings-button,.save-button,.header-button{padding:5px 8px;min-width:32px;min-height:32px;font-size:15px}}@media(min-width:376px)and (max-width:414px){:root{--font-size-xs: 11.5px;--font-size-sm: 12.5px;--font-size-base: 13.5px;--font-size-md: 14.5px;--font-size-lg: 15.5px;--font-size-xl: 17px;--font-size-2xl: 19px;--font-size-3xl: 22px;--font-size-4xl: 26px;--font-size-5xl: 30px;--font-size-6xl: 36px}}.app-header{position:fixed;top:0;left:50%;transform:translate(-50%);width:100%;max-width:600px;background:#fff;border-bottom:1px solid #e0e0e0;z-index:1000;box-shadow:0 2px 8px #0000001a}.header-content{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;height:56px}.header-left{position:relative;flex:0 0 auto}.menu-button{background:none;border:none;cursor:pointer;padding:8px;display:flex;align-items:center;justify-content:center;transition:opacity .2s}.menu-button:hover{opacity:.7}.menu-button:active{opacity:.5}.hamburger-icon{display:flex;flex-direction:column;gap:4px;width:24px}.hamburger-icon span{display:block;height:2px;background:#333;border-radius:2px;transition:all .3s}.dropdown-menu{position:absolute;top:calc(100% + 8px);left:0;background:#fff;border-radius:8px;box-shadow:0 4px 16px #00000026;min-width:200px;overflow:hidden;animation:slideDown .2s ease-out}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.menu-item{display:flex;align-items:center;gap:16px;padding:16px 20px;width:100%;background:none;border:none;cursor:pointer;transition:background .2s;text-align:left;color:#333;font-size:15px}.menu-item:hover{background:#f5f5f5}.menu-item.active{background:#e3f2fd;color:#1976d2;font-weight:500}.menu-icon{font-size:26px;width:32px;text-align:center;filter:grayscale(100%);opacity:.5}.menu-label{flex:1}.header-center{flex:1;display:flex;justify-content:center;cursor:pointer}.logo{font-size:20px;font-weight:700;color:#1976d2;margin:0;letter-spacing:-.5px}.header-right{display:flex;gap:8px;align-items:center;flex:0 0 auto}.icon-button{position:relative;background:none;border:none;cursor:pointer;padding:8px;font-size:20px;display:flex;align-items:center;justify-content:center;transition:opacity .2s;border-radius:50%}.icon-button:hover{opacity:.7;background:#f5f5f5}.icon-button:active{opacity:.5}.notification-button{color:#666}.notification-icon{width:20px;height:20px}.badge{position:absolute;top:4px;right:4px;background:#f44336;color:#fff;font-size:10px;font-weight:600;font-family:sans-serif;padding:2px 4px;border-radius:10px;min-width:16px;text-align:center;line-height:1}.profile-button{width:32px;height:32px;padding:0}.profile-image{width:32px;height:32px;border-radius:50%;object-fit:cover}@media(max-width:375px){.header-content{padding:10px 12px;height:52px}.logo{font-size:18px}.icon-button{font-size:18px;padding:6px}.profile-button,.profile-image{width:28px;height:28px}}.app-footer{width:100%;max-width:600px;margin:40px auto 0;background:#f8f9fa;border-top:1px solid #e0e0e0;padding:24px 20px}.footer-content{display:flex;flex-direction:column;align-items:center;gap:8px}.copyright{font-size:13px;color:#666;margin:0;letter-spacing:normal;word-spacing:normal;font-variant-numeric:normal}.footer-links{display:flex;align-items:center;gap:8px;font-size:13px;margin:0}.footer-links a{color:#1976d2;text-decoration:none;transition:opacity .2s}.footer-links a:hover{opacity:.7;text-decoration:underline}.separator{color:#999}@media(max-width:375px){.app-footer{padding:20px 16px}.footer-links{flex-wrap:wrap;justify-content:center;font-size:12px}.copyright{font-size:12px}}.toast{position:fixed;top:20px;left:50%;transform:translate(-50%);background:#fff;padding:16px 24px;border-radius:12px;box-shadow:0 8px 24px #00000026;display:flex;align-items:center;gap:12px;z-index:9999;min-width:320px;max-width:90%;animation:slideDownSmooth .4s cubic-bezier(.16,1,.3,1);cursor:pointer;will-change:transform,opacity;backface-visibility:hidden;-webkit-font-smoothing:antialiased}@keyframes slideDownSmooth{0%{opacity:0;transform:translate(-50%) translateY(-30px) scale(.95)}to{opacity:1;transform:translate(-50%) translateY(0) scale(1)}}.toast-exit{animation:slideUpSmooth .3s cubic-bezier(.4,0,1,1) forwards}@keyframes slideUpSmooth{0%{opacity:1;transform:translate(-50%) translateY(0) scale(1)}to{opacity:0;transform:translate(-50%) translateY(-30px) scale(.95)}}.toast-icon{font-size:15px;line-height:1}.toast-message{font-size:15px;line-height:1.4;color:#333;white-space:pre-line}.toast-success{border-left:4px solid #10b981}.toast-error{border-left:4px solid #ef4444}.toast-info{border-left:4px solid #3b82f6}@media(min-width:768px){.toast{min-width:400px;max-width:600px}}*{box-sizing:border-box;margin:0;padding:0}body,button,input,textarea,select{font-family:sans-serif}:root{color-scheme:light;--bg-primary: #ffffff;--bg-secondary: #f8f9fa;--text-primary: #333333;--text-secondary: #666666;--text-tertiary: #999999;--border-color: #e0e0e0;--safe-text: #000000}html,body{margin:0;padding:0;width:100%;overflow-x:hidden;background:var(--bg-secondary)!important;color:var(--text-primary)!important}body{background:#f8f9fa;color:#333!important}#root{width:100%;margin:0;padding:0;overflow-x:hidden;background:var(--bg-secondary);color:var(--text-primary)}.app-container{min-height:100vh;position:relative;padding-top:56px;width:100%;margin:0 auto;overflow-x:hidden;background:#e5e5e5;color:#333!important}@media(min-width:600px){.app-container{max-width:600px}}@media(max-width:375px){.app-container{padding-top:52px}}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}