@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";*{margin:0;padding:0;box-sizing:border-box}:root{--primary: #0066FF;--primary-dark: #0052D4;--primary-light: #4D94FF;--white: #FFFFFF;--light: #F8FAFC;--light-gray: #E2E8F0;--gray: #94A3B8;--dark-gray: #64748B;--dark: #334155;--darker: #1E293B;--error: #EF4444;--success: #10B981;--radius: 8px;--radius-lg: 16px;--shadow: 0 4px 20px rgba(0, 102, 255, .1)}body{font-family:Inter,sans-serif;background:linear-gradient(135deg,#f0f9ff,#e0f2fe);color:var(--darker);min-height:100vh;line-height:1.6}#root{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}@keyframes slideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes shimmer{0%{background-position:-200px 0}to{background-position:200px 0}}.container{max-width:1200px;margin:0 auto;padding:0 20px}.text-gradient{background:linear-gradient(90deg,var(--primary) 0%,var(--secondary) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--light-gray);border-radius:4px}::-webkit-scrollbar-thumb{background:var(--primary);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--primary-dark)}[data-theme=dark] body{background:#0d0d1a;color:#e8e8f8}[data-theme=dark] .habits-page,[data-theme=dark] .competitions-page,[data-theme=dark] .profile-page{background:linear-gradient(135deg,#0d0d1a,#1a0a2e)}[data-theme=dark] .habits-header{background:linear-gradient(135deg,#1a1a3a,#2d1a4a);box-shadow:0 2px 20px #0006}[data-theme=dark] .competitions-header,[data-theme=dark] .profile-header{background:#ffffff0a;border-bottom-color:#ffffff14}[data-theme=dark] .bottom-nav{background:#0d0d1af7;border-top-color:#ffffff14;box-shadow:0 -4px 24px #00000080}[data-theme=dark] .nav-item{color:#55557a}[data-theme=dark] .nav-item.active{color:#7b9ef0;background:#667eea1f}[data-theme=dark] .habit-card{background:linear-gradient(135deg,#1e1e32,#1a1a2e);border-color:#ffffff12;box-shadow:0 4px 20px #0006}[data-theme=dark] .habit-title{color:#e8e8f8}[data-theme=dark] .habit-frequency,[data-theme=dark] .habit-meta,[data-theme=dark] .habit-streak{color:#7777a0}[data-theme=dark] .complete-btn:not(.completed){background:#ffffff0f;border-color:#ffffff26;color:#7777a0}[data-theme=dark] .score-badge{background:#ffffff12;color:#a0a0c8}[data-theme=dark] .custom-date-picker{background:#1e1e32;border-color:#ffffff1a;box-shadow:0 8px 32px #0009}[data-theme=dark] .datepicker-header{color:#e8e8f8}[data-theme=dark] .datepicker-weekday{color:#55557a}[data-theme=dark] .datepicker-day{color:#b0b0d0}[data-theme=dark] .datepicker-day:hover{background:#667eea33}[data-theme=dark] .datepicker-day.today{border-color:#667eea;color:#7b9ef0}[data-theme=dark] .datepicker-day.selected{background:#667eea;color:#fff}[data-theme=dark] .datepicker-day.other-month{color:#335}[data-theme=dark] .empty-habits-card{background:#1e1e32e6}[data-theme=dark] .empty-habits-card h2,[data-theme=dark] .empty-habits-card p,[data-theme=dark] .daily-progress-text{color:#88a}[data-theme=dark] .competition-card{background:linear-gradient(135deg,#1e1e32,#1a1a2e)!important;border-color:#ffffff12!important;box-shadow:0 4px 20px #0006!important}[data-theme=dark] .competition-title{color:#e8e8f8}[data-theme=dark] .competition-subtitle{color:#7777a0}[data-theme=dark] .score-section{background:#ffffff0d;border-color:#ffffff14}[data-theme=dark] .score-label{color:#7777a0}[data-theme=dark] .score-value{color:#e8e8f8}[data-theme=dark] .days-label{color:#7777a0}[data-theme=dark] .days-value{color:#e8e8f8}[data-theme=dark] .calendar-day{background:#ffffff0a;color:#b0b0d0}[data-theme=dark] .calendar-day.today{border-color:#667eea}[data-theme=dark] .calendar-stats{color:#7777a0}[data-theme=dark] .tabs-on-gradient{background:#00000040}[data-theme=dark] .gradient-tab{color:#ffffff73}[data-theme=dark] .gradient-tab.active{background:#ffffff1a;color:#fff}[data-theme=dark] .modal-overlay{background:#000c}[data-theme=dark] .modal-content{background:#1e1e32;color:#e8e8f8}[data-theme=dark] .modal-header{border-bottom-color:#ffffff14}[data-theme=dark] .modal-header h3{color:#e8e8f8}[data-theme=dark] .modal-steps{border-bottom-color:#ffffff14}[data-theme=dark] .step-content h4{color:#e8e8f8}[data-theme=dark] .form-label{color:#9090b8}[data-theme=dark] .form-select,[data-theme=dark] .form-input{background:#ffffff0f;border-color:#ffffff1f;color:#e8e8f8}[data-theme=dark] .form-select option{background:#1e1e32}[data-theme=dark] .form-hint{color:#66668a}[data-theme=dark] .summary-card{background:#ffffff0d;border-color:#ffffff14}[data-theme=dark] .summary-label{color:#7777a0}[data-theme=dark] .summary-value{color:#c0c0e0}[data-theme=dark] .summary-note p,[data-theme=dark] .summary-list li{color:#7777a0}[data-theme=dark] .selected-habit-info{background:#667eea1a;border-color:#667eea33}[data-theme=dark] .selected-habit-info p{color:#b0b0d0}[data-theme=dark] .habit-hint{color:#7777a0}[data-theme=dark] .section-container{background:#14142699;border-color:#ffffff0f}[data-theme=dark] .friend-avatar,[data-theme=dark] .recommended-user-avatar{background:#667eea33}[data-theme=dark] .friend-search-input{background:#ffffff0f;border-color:#ffffff1f;color:#e8e8f8}[data-theme=dark] .common-interests,[data-theme=dark] .recommendation-reason,[data-theme=dark] .no-friends p,[data-theme=dark] .hint{color:#7777a0}[data-theme=dark] .empty-competitions-title{color:#e8e8f8}[data-theme=dark] .empty-competitions-description{color:#7777a0}[data-theme=dark] .profile-info-card{background:#141426fa;color:#e8e8f8}[data-theme=dark] .user-username{color:#e8e8f8}[data-theme=dark] .user-email,[data-theme=dark] .user-id{color:#7777a0}[data-theme=dark] .profile-stats,[data-theme=dark] .settings-section{background:#ffffff0d}[data-theme=dark] .stat-item{border-bottom-color:#ffffff12}[data-theme=dark] .stat-label{color:#7777a0}[data-theme=dark] .stat-value{color:#b0b0d0}[data-theme=dark] .settings-title{color:#55557a}[data-theme=dark] .setting-label{color:#c0c0e0}[data-theme=dark] .setting-desc,[data-theme=dark] .logout-note{color:#7777a0}[data-theme=dark] .app-info-section{background:#ffffff0a}[data-theme=dark] .version{color:#fff6}[data-theme=dark] .username-input{background:#ffffff0f;border-color:#ffffff1f;color:#e8e8f8}[data-theme=dark] .confirm-overlay{background:#000c}[data-theme=dark] .confirm-dialog{background:#1e1e32;box-shadow:0 20px 60px #0009}[data-theme=dark] .confirm-title{color:#e8e8f8}[data-theme=dark] .confirm-text{color:#9090b8}[data-theme=dark] .invite-link-input{background:#ffffff0f;border-color:#ffffff1f;color:#e8e8f8}[data-theme=dark] .invite-link-hint{color:#7777a0}[data-theme=dark] .invite-modal-desc{color:#9090b8}[data-theme=dark] ::-webkit-scrollbar-track{background:#1a1a2e}[data-theme=dark] ::-webkit-scrollbar-thumb{background:#3a3a6a}[data-theme=dark] ::-webkit-scrollbar-thumb:hover{background:#667eea}[data-theme=dark] .calendar-grid{background:#ffffff08!important;box-shadow:none!important}[data-theme=dark] .calendar-day:not(.empty):not(.completed):not(.today){background:#ffffff0f!important;color:#b0b0d0!important;border-color:#ffffff14!important}[data-theme=dark] .calendar-day.empty{background:#ffffff05!important;border-color:#ffffff0a!important}[data-theme=dark] .calendar-day.today{border-color:#667eea!important;background:#667eea1f!important;color:#a0b4ff!important}[data-theme=dark] .calendar-day-small.future{background:#ffffff0d!important;color:#88a!important;border-color:#ffffff14!important}[data-theme=dark] .calendar-day-small.before-start{background:#ffffff08!important;color:#446!important;border-color:#ffffff0d!important}[data-theme=dark] .calendar-day-small.missed{background:#f44336b3!important}[data-theme=dark] .add-habit-card{background:#ffffff0a!important;border-color:#ffffff1a!important}[data-theme=dark] .add-habit-card:hover{background:#667eea14!important;border-color:#667eea!important}[data-theme=dark] .add-habit-card span,[data-theme=dark] .add-habit-card p{color:#7777a0!important}[data-theme=dark] .days-remaining{background:#ffffff0d!important;border-color:#ffffff14!important}[data-theme=dark] .days-label{color:#7777a0!important}[data-theme=dark] .days-value{color:#e8e8f8!important}[data-theme=dark] .modal-actions{border-top-color:#ffffff14;background:#1e1e32}[data-theme=dark] .btn-secondary{background:#ffffff12;border-color:#ffffff1f;color:#b0b0d0}[data-theme=dark] .btn-secondary:hover{background:#ffffff1f}[data-theme=dark] .you-section,[data-theme=dark] .friend-section{background:#ffffff0d!important;border-color:#ffffff14!important}[data-theme=dark] .competition-score{background:#ffffff08;border-color:#ffffff0f}[data-theme=dark] .step-indicator .step-number{background:#ffffff14;color:#b0b0d0}[data-theme=dark] .step-indicator.active .step-number{background:#667eea;color:#fff}[data-theme=dark] .step-label{color:#7777a0}[data-theme=dark] .step-indicator.active .step-label{color:#667eea}[data-theme=dark] .duration-option{background:#ffffff0f;border-color:#ffffff1f;color:#b0b0d0}[data-theme=dark] .duration-option:hover{background:#667eea26;border-color:#667eea}[data-theme=dark] .duration-option.selected{background:linear-gradient(135deg,#667eea,#764ba2);border-color:transparent;color:#fff}[data-theme=dark] .no-habits p,[data-theme=dark] .no-habits-reasons li,[data-theme=dark] .no-friends-warning p{color:#88a}[data-theme=dark] .invite-actions{background:#667eea14;border-color:#667eea26}[data-theme=dark] .invite-text{color:#b0b0d0}[data-theme=dark] .search-results{background:#141426fa!important;border-color:#ffffff0f!important;box-shadow:none!important}[data-theme=dark] .calendar-loading{background:#ffffff0a!important;border-color:#667eea33!important}[data-theme=dark] .invite-decline-btn{background:#ffffff0f!important;border-color:#ffffff1f!important;color:#9090b8!important}[data-theme=dark] .no-recommendations{background:#ffffff08!important;border-color:#667eea26!important}[data-theme=dark] .no-recommendations p{color:#7777a0}[data-theme=dark] .status-badge.pending{background:#f59e0b26!important;color:#fbbf24!important}[data-theme=dark] .status-badge.lost{background:#ef444426!important;color:#f87171!important}[data-theme=dark] .status-badge.draw{background:#6b728033!important;color:#9ca3af!important}[data-theme=dark] .empty-habits-content{background:#141426fa!important;box-shadow:none!important}[data-theme=dark] .confirm-cancel{background:#ffffff12!important;border-color:#ffffff1f!important;color:#9090b8!important}[data-theme=dark] .date-picker-input{background:#ffffff0f!important;border-color:#ffffff1f!important;color:#e8e8f8!important}[data-theme=dark] .date-value{color:#e8e8f8}[data-theme=dark] .date-icon{color:#9090b8}[data-theme=dark] .date-note{background:#f59e0b1a!important;border-color:#f59e0b40!important}[data-theme=dark] .date-note p{color:#c4a55a!important}[data-theme=dark] .streak-badge{background:#e6510026!important;color:#ffa040!important;border-color:#e6510033!important}[data-theme=dark] .competition-score-badge{background:#667eea26!important;color:#7b9ef0!important;border-color:#667eea33!important}[data-theme=dark] .delete-habit-btn{background:#dc26261f!important;color:#f87171!important}[data-theme=dark] .delete-habit-btn:hover{background:#dc262633!important}.nav-icon-wrapper{position:relative;display:flex;align-items:center;justify-content:center}.nav-badge{position:absolute;top:-6px;right:-8px;background:#ef4444;color:#fff;font-size:9px;font-weight:700;line-height:1;min-width:16px;height:16px;border-radius:8px;display:flex;align-items:center;justify-content:center;padding:0 3px;box-shadow:0 1px 4px #ef444466}[data-theme=dark] .bottom-nav{background:#1e1e2ef2;border-top-color:#ffffff14;box-shadow:0 -4px 24px #0000004d}[data-theme=dark] .nav-item{color:#666}[data-theme=dark] .nav-item.active{color:#818cf8;background:#818cf81f}@media(max-width:380px){.nav-item{padding:8px 12px}}.habits-page{min-height:100vh;background:linear-gradient(180deg,#ede9f7,#f5f3fb,#f8f9fa 60%);display:flex;flex-direction:column}.habits-header{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:16px;padding-top:calc(16px + env(safe-area-inset-top));box-shadow:0 2px 20px #667eea59}.header-content{display:flex;justify-content:space-between;align-items:center}.habits-header h1{margin:0;font-size:24px;font-weight:700}.pull-spinner.spinning{animation:spin .7s linear infinite}.daily-progress{margin-top:12px}.daily-progress-bar{height:4px;background:#ffffff40;border-radius:2px;overflow:hidden;margin-bottom:6px}.daily-progress-fill{height:100%;background:#fff;border-radius:2px;transition:width .5s ease}.daily-progress-label{font-size:13px;color:#ffffffd9;font-weight:500}.user-avatar{width:38px;height:38px;background:#ffffff40;border:1.5px solid rgba(255,255,255,.5);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:17px;font-weight:600;cursor:pointer;transition:background .2s,transform .15s}.user-avatar:hover{background:#ffffff59;transform:scale(1.05)}.habits-main{flex:1;padding:16px 16px 80px}.habits-list-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.habits-list-header h2{margin:0;font-size:20px;font-weight:600;color:#333}.add-habit-btn{background:#667eea;color:#fff;border:none;padding:8px 16px;border-radius:20px;font-size:14px;font-weight:500;cursor:pointer;transition:background .2s}.add-habit-btn:hover{background:#5a6fd8}.habits-grid{display:flex;flex-direction:column;gap:20px;margin-bottom:20px}[data-theme=dark] .habit-card{background:#141428f2;box-shadow:0 4px 20px #0000004d;border:1px solid rgba(255,255,255,.06)}.habit-card:hover{transform:translateY(-2px);box-shadow:0 6px 20px #0000001a}.habit-card-header{margin-bottom:20px}.habit-title-section{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.habit-card-title{margin:0;font-size:24px;font-weight:700;color:#333}.habit-created-date{font-size:14px;color:#666;font-style:italic}.habit-calendar-small{margin-bottom:20px}.calendar-grid-small{width:100%}.weekdays-row-small{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:8px}.weekday-cell-small{text-align:center;font-size:11px;color:#888;padding:6px 0;font-weight:500}.calendar-week-small{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:2px}.calendar-day-small{aspect-ratio:1;border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:500;position:relative;transition:all .2s}.calendar-day-small.empty{background:transparent}.calendar-day-small.before-start{background:#f5f5f5;color:#bdbdbd;border:1px solid #e0e0e0}.calendar-day-small.completed{background:#4caf50;color:#fff;border:1px solid #4caf50}.calendar-day-small.today-completed{background:#4caf50;color:#fff;border:2px solid #6200ee;box-shadow:0 0 0 1px #6200ee}.calendar-day-small.today{background:#6200ee;color:#fff;border:2px solid #6200ee;font-weight:600}.calendar-day-small.missed{background:#f44336;color:#fff;border:1px solid #f44336}.calendar-day-small.future{background:#fff;color:#333;border:1px solid #e0e0e0}.calendar-day-small.today-highlight{font-weight:700}[data-theme=dark] .calendar-day-small.future{background:#ffffff0d;color:#88a;border-color:#ffffff14}[data-theme=dark] .calendar-day-small.before-start{background:#ffffff08;color:#446;border-color:#ffffff0d}[data-theme=dark] .weekday-cell-small{color:#55557a}.day-number-small{font-size:11px}.habit-card-footer{display:flex;flex-direction:column;gap:12px}.complete-habit-btn-small{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:14px;font-size:16px;font-weight:600;border-radius:10px;cursor:pointer;transition:all .3s;text-transform:uppercase;letter-spacing:.5px;width:100%}.complete-habit-btn-small:hover{transform:translateY(-1px);box-shadow:0 4px 15px #667eea4d}.complete-habit-btn-small.completed{background:#4caf50;box-shadow:0 4px 15px #4caf504d}@keyframes completePop{0%{transform:scale(1)}40%{transform:scale(1.12)}70%{transform:scale(.96)}to{transform:scale(1)}}.complete-animate{animation:completePop .5s cubic-bezier(.34,1.56,.64,1)}.complete-habit-btn-small.completed:hover{background:#45a049;box-shadow:0 6px 20px #4caf5066}.streak-badge{background:linear-gradient(135deg,#fff3e0,#ffe0cc);color:#e65100;padding:5px 11px;border-radius:20px;font-size:13px;font-weight:600;display:inline-flex;align-items:center;gap:3px;border:1px solid rgba(230,81,0,.15)}.competition-score-badge{background:linear-gradient(135deg,#f3f0ff,#ede9f7);color:#667eea;padding:5px 11px;border-radius:20px;font-size:13px;font-weight:600;display:inline-flex;align-items:center;gap:3px;border:1px solid rgba(102,126,234,.15)}.delete-habit-btn{background:#fef2f2;color:#dc2626;border:none;width:32px;height:32px;border-radius:8px;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.delete-habit-btn:hover{background:#fee2e2;transform:scale(1.1)}.add-habit-card{background:#fff;border-radius:16px;padding:24px;box-shadow:0 4px 15px #0000000d;border:2px dashed #e0e0e0;cursor:pointer;transition:all .2s;text-align:center;margin-bottom:20px}[data-theme=dark] .add-habit-card{background:#ffffff0a;border-color:#ffffff1a;box-shadow:none}[data-theme=dark] .add-habit-card:hover{background:#667eea14;border-color:#667eea}.add-habit-card:hover{border-color:#667eea;background:#f8f9ff;transform:translateY(-2px)}.add-habit-content{display:flex;flex-direction:column;align-items:center;gap:12px}.add-icon{font-size:36px;color:#667eea;font-weight:300;line-height:1}.add-text{font-size:16px;color:#666;font-weight:500}.empty-habits-container{flex:1;display:flex;align-items:center;justify-content:center;padding:24px 20px 100px}.empty-habits-content{text-align:center;max-width:360px;width:100%;background:#fff;border-radius:28px;padding:48px 28px 40px;box-shadow:0 8px 40px #667eea1f,0 2px 12px #0000000f}.empty-habits-icon{margin-bottom:28px}.icon-circle{display:inline-flex;width:108px;height:108px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:50%;align-items:center;justify-content:center;box-shadow:0 12px 32px #667eea66}.empty-habits-title{font-size:26px;font-weight:700;color:#1a1a2e;margin:0 0 12px;line-height:1.3}.empty-habits-description{font-size:15px;color:#888;line-height:1.6;margin:0 0 32px}.create-first-habit-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:16px 32px;font-size:16px;font-weight:600;border-radius:16px;cursor:pointer;transition:transform .2s,box-shadow .2s;width:100%;max-width:280px;letter-spacing:.3px}.create-first-habit-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #667eea73}.create-first-habit-btn:active{transform:translateY(0)}.cal-month-nav{display:flex;align-items:center;justify-content:space-between;padding:2px 4px 6px}.cal-nav-btn{background:none;border:none;cursor:pointer;font-size:18px;line-height:1;color:#667eea;padding:2px 6px;border-radius:6px;transition:background .15s}.cal-nav-btn:hover:not(:disabled){background:#667eea1f}.cal-nav-btn:disabled{color:#ccc;cursor:default}.cal-nav-label{font-size:12px;font-weight:600;color:#555;letter-spacing:.3px}.cal-loading{color:#999;font-weight:400}[data-theme=dark] .cal-nav-btn{color:#818cf8}[data-theme=dark] .cal-nav-btn:disabled{color:#444}[data-theme=dark] .cal-nav-label{color:#aaa}.bottom-nav{position:fixed;bottom:0;left:0;right:0;background:#ffffffeb;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);display:flex;justify-content:space-around;align-items:center;padding:10px 8px;padding-bottom:calc(10px + env(safe-area-inset-bottom));border-top:1px solid rgba(0,0,0,.06);box-shadow:0 -4px 24px #0000000f;z-index:100}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.modal-content{background:#fff;border-radius:16px;width:100%;max-width:500px;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px #0000004d;animation:modalSlideIn .3s ease}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.create-habit-modal{max-width:500px}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:24px 24px 16px;border-bottom:1px solid #f0f0f0}.modal-header h3{margin:0;font-size:20px;font-weight:600;color:#333}.modal-close{background:none;border:none;font-size:28px;color:#888;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background .2s}.modal-close:hover{background:#f5f5f5}.create-habit-form{padding:24px}.form-group{margin-bottom:20px}.form-label{display:block;margin-bottom:8px;font-weight:500;color:#333;font-size:14px}.form-input{width:100%;padding:12px 16px;border:2px solid #e0e0e0;border-radius:8px;font-size:16px;transition:border-color .2s;box-sizing:border-box;background:#fff}.form-input:focus{outline:none;border-color:#667eea}.date-picker-container{margin-bottom:12px;position:relative}.date-picker-input{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border:2px solid #e0e0e0;border-radius:8px;background:#fff;cursor:pointer;transition:border-color .2s;margin-bottom:16px}.date-picker-input:hover{border-color:#667eea}.date-value{font-size:16px;color:#333}.date-icon{font-size:20px;color:#666}.date-note{background:#fff8e1;border:1px solid #ffd54f;border-radius:8px;padding:12px 16px;margin-top:8px}.date-note p{margin:4px 0;font-size:13px;color:#5d4037;line-height:1.4}.custom-date-picker{position:absolute;top:100%;left:0;width:280px;background:#fff;border-radius:12px;box-shadow:0 4px 20px #00000026;z-index:1000;margin-top:8px;overflow:hidden;animation:datePickerSlideIn .2s ease}@keyframes datePickerSlideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.custom-datepicker-header{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;background:#667eea;color:#fff}.current-month-year{text-align:center}.current-month{font-size:14px;font-weight:600}.nav-button{background:#fff3;border:none;color:#fff;width:28px;height:28px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:16px;transition:background .2s}.nav-button:hover:not(:disabled){background:#ffffff4d}.nav-button:disabled{opacity:.3;cursor:not-allowed}.datepicker-calendar{padding:0 8px 8px}.datepicker-weekdays{display:grid;grid-template-columns:repeat(7,1fr);margin:8px 0 4px}.weekday-name{text-align:center;color:#666;font-size:11px;font-weight:500;padding:4px 0}.datepicker-days{display:flex;flex-direction:column;gap:2px}.datepicker-week{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.datepicker-day{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;cursor:pointer;transition:all .2s;background:transparent;border:none;color:#333}.datepicker-day:hover:not(.disabled):not(.selected){background:#f0f2ff;color:#667eea}.datepicker-day.selected{background:#667eea;color:#fff;font-weight:600}.datepicker-day.disabled{color:#bdbdbd;cursor:not-allowed}.datepicker-day.outside-month{color:#bdbdbd}.modal-actions{display:flex;gap:12px;margin-top:32px}.btn-primary,.btn-secondary{flex:1;padding:16px;border-radius:8px;font-size:16px;font-weight:500;cursor:pointer;transition:all .2s;border:none}.btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.btn-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 15px #667eea4d}.btn-primary:disabled{opacity:.6;cursor:not-allowed;transform:none!important;box-shadow:none!important}.btn-secondary{background:#f5f5f5;color:#666}.btn-secondary:hover:not(:disabled){background:#e8e8e8}.btn-secondary:disabled{opacity:.6;cursor:not-allowed}@media(max-width:480px){.create-habit-modal{margin:16px}.custom-date-picker{width:260px}.habits-header h1,.habit-card-title{font-size:20px}.weekday-cell-small{font-size:10px;padding:4px 0}.calendar-day-small,.day-number-small{font-size:10px}.complete-habit-btn-small{padding:12px;font-size:14px}.nav-item{padding:8px 12px}.nav-icon{font-size:20px}}@media(min-width:768px){.habits-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:24px}.add-habit-card{grid-column:1 / -1}}.complete-habit-btn-small.disabled{opacity:.5;cursor:not-allowed;background:#ccc!important}.complete-habit-btn-small.disabled:hover{transform:none!important;box-shadow:none!important}.competition-badge{background:gold;color:#333;padding:2px 6px;border-radius:4px;font-size:12px;margin-left:8px;font-weight:700}.loading-spinner{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #667eea;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 20px}.habit-menu-container{position:relative}.habit-menu-toggle{background:transparent;border:none;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:24px;color:#888;transition:all .2s}.habit-menu-dropdown{position:absolute;top:100%;right:0;background:#fff;border-radius:12px;box-shadow:0 4px 20px #00000026;min-width:180px;z-index:1000;overflow:hidden;animation:menuSlideIn .2s ease;margin-top:8px}.habit-title-with-menu{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:8px}.habit-card-title{margin:0;font-size:24px;font-weight:700;color:#333;flex:1}.habit-menu-toggle{background:transparent;border:none;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#888;transition:all .2s;padding:0}.habit-menu-toggle:hover{background:#f0f2ff;color:#667eea;transform:scale(1.1)}.habit-menu-dropdown{position:absolute;top:100%;right:0;background:#fff;border-radius:12px;box-shadow:0 4px 20px #00000026;min-width:200px;z-index:1000;overflow:hidden;animation:menuSlideIn .2s ease;margin-top:8px;border:1px solid #f0f0f0}@media(max-width:480px){.habit-menu-dropdown{position:fixed;inset:auto 16px 70px;margin:0}}.habit-actions{display:flex;justify-content:space-between;align-items:center}.habit-title-with-menu{display:flex;align-items:flex-start;gap:12px;margin-bottom:8px}.habit-card-title{margin:2px 0 0;font-size:24px;font-weight:700;color:#333;flex:1}.habit-menu-container{position:relative;flex-shrink:0}.habit-menu-toggle{background:transparent;border:none;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#aaa;transition:all .2s;padding:0;flex-shrink:0}.habit-menu-toggle:hover{background:#f0f2ff;color:#667eea;transform:scale(1.05)}.habit-menu-toggle svg{width:20px;height:20px}.habit-menu-dropdown{position:absolute;top:100%;left:0;background:#fff;border-radius:12px;box-shadow:0 4px 20px #00000026;min-width:200px;z-index:1000;overflow:hidden;animation:menuSlideIn .2s ease;margin-top:8px;border:1px solid #f0f0f0}@keyframes menuSlideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.menu-item{display:flex;align-items:center;gap:12px;width:100%;padding:14px 16px;background:none;border:none;text-align:left;cursor:pointer;font-size:14px;color:#333;transition:background .2s;border-bottom:1px solid #f5f5f5}.menu-item:last-child{border-bottom:none}.menu-item:hover{background:#f8f9ff}.menu-item svg{width:16px;height:16px;flex-shrink:0}.menu-item span{flex:1}.menu-item.delete{color:#f44336}.menu-item.delete:hover{background:#fef2f2}@media(max-width:480px){.habit-menu-dropdown{position:fixed;inset:auto 16px 70px;margin:0}.habit-card-title{font-size:20px}.habit-menu-toggle{width:32px;height:32px}}@media(min-width:768px){.habit-title-with-menu{gap:16px}}.habit-menu-toggle.simple{background:transparent;border:none;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:24px;font-weight:700;color:#aaa;transition:all .2s;padding:0;flex-shrink:0;line-height:1}.habit-card{background:#fff;border-radius:16px;padding:20px;box-shadow:0 4px 15px #0000000d;transition:transform .2s,box-shadow .2s}.habit-title-section{margin-left:-4px}.habit-title-with-menu{display:flex;align-items:flex-start;gap:8px;margin-bottom:8px;margin-left:-4px}.habit-card-title{margin:2px 0 0;font-size:24px;font-weight:700;color:#333;flex:1;padding-left:0}.habit-menu-container{position:relative;flex-shrink:0;margin-left:-4px}.habit-menu-toggle.simple{background:transparent;border:none;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:20px;font-weight:700;color:#aaa;transition:all .2s;padding:0;flex-shrink:0;line-height:1;margin-left:-8px}.habit-menu-toggle.simple:hover{background:#f0f2ff;color:#667eea;transform:scale(1.05)}.habit-menu-dropdown{position:absolute;top:100%;left:0;background:#fff;border-radius:12px;box-shadow:0 4px 20px #00000026;min-width:200px;z-index:1000;overflow:hidden;animation:menuSlideIn .2s ease;margin-top:8px;border:1px solid #f0f0f0;margin-left:-8px}.habit-created-date{font-size:14px;color:#666;font-style:italic;margin-left:-4px}@media(max-width:480px){.habit-card{padding:16px}.habit-title-section{margin-left:-2px}.habit-title-with-menu{gap:6px;margin-left:-2px}.habit-card-title{font-size:20px}.habit-menu-toggle.simple{width:28px;height:28px;font-size:18px;margin-left:-6px}.habit-menu-dropdown{position:fixed;inset:auto 16px 70px;margin:0}}@media(min-width:768px){.habit-card{padding:24px}.habit-title-with-menu{gap:10px}}.edit-habit-modal{max-width:500px}.edit-habit-form{padding:24px}.complete-habit-btn-small.future-habit{background:linear-gradient(135deg,#95a5a6,#7f8c8d)!important;color:#fff!important;cursor:not-allowed!important}.complete-habit-btn-small.future-habit:hover{transform:none!important;box-shadow:none!important}.skip-habit-btn{padding:8px 14px;border:1.5px solid #94a3b8;border-radius:10px;background:transparent;color:#64748b;font-size:12px;font-weight:600;cursor:pointer;transition:border-color .15s,color .15s;white-space:nowrap}.skip-habit-btn:hover:not(:disabled){border-color:#667eea;color:#667eea}.skip-habit-btn:disabled{opacity:.4;cursor:default}.skip-modal-overlay{position:fixed;inset:0;background:#00000073;z-index:1000;display:flex;align-items:center;justify-content:center;padding:16px}.skip-modal{background:#fff;border-radius:20px;padding:24px;width:100%;max-width:360px;display:flex;flex-direction:column;gap:14px;box-shadow:0 20px 60px #0003}.skip-modal-title{font-size:16px;font-weight:700;color:#1e293b;margin:0}.skip-reason-presets{display:flex;flex-direction:column;gap:8px}.skip-preset-btn{padding:10px 14px;border:1.5px solid #e2e8f0;border-radius:12px;background:transparent;font-size:14px;text-align:left;cursor:pointer;transition:border-color .15s,background .15s}.skip-preset-btn.selected{border-color:#667eea;background:#667eea14;color:#667eea;font-weight:600}.skip-preset-btn:hover:not(.selected){border-color:#cbd5e1}.skip-custom-input{width:100%;padding:10px 12px;border:1.5px solid #e2e8f0;border-radius:12px;font-size:14px;outline:none;box-sizing:border-box;transition:border-color .15s}.skip-custom-input:focus{border-color:#667eea}.skip-modal-actions{display:flex;gap:10px}.skip-cancel-btn{flex:1;padding:11px 0;border:1.5px solid #e2e8f0;border-radius:12px;background:transparent;color:#64748b;font-size:14px;font-weight:600;cursor:pointer}.skip-submit-btn{flex:2;padding:11px 0;border:none;border-radius:12px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-size:14px;font-weight:700;cursor:pointer;transition:opacity .15s}.skip-submit-btn:disabled{opacity:.5;cursor:default}[data-theme=dark] .skip-modal{background:#1e1e3a}[data-theme=dark] .skip-modal-title{color:#e8e8f8}[data-theme=dark] .skip-preset-btn{border-color:#ffffff1a;color:#e8e8f8}[data-theme=dark] .skip-custom-input{background:#ffffff0d;border-color:#ffffff1a;color:#e8e8f8}.competitions-page{min-height:100vh;background:linear-gradient(135deg,#667eea,#764ba2);padding:12px;padding-top:calc(12px + env(safe-area-inset-top));padding-bottom:calc(80px + env(safe-area-inset-bottom));font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;position:relative;overflow-x:hidden}.competitions-container{position:relative;z-index:1}.competitions-header{margin-bottom:12px}.header-content{display:flex;justify-content:space-between;align-items:center;padding:0 4px}.header-content h1{color:#fff;font-size:22px;font-weight:800;margin:0;text-shadow:0 2px 8px rgba(0,0,0,.2);letter-spacing:-.5px}.user-avatar{width:40px;height:40px;background:linear-gradient(135deg,#fffffff2,#ffffffd9);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;color:#667eea;font-size:18px;box-shadow:0 4px 16px #00000026;border:2px solid rgba(255,255,255,.4);transition:all .3s cubic-bezier(.4,0,.2,1);cursor:pointer;outline:none}.user-avatar:hover{transform:scale(1.05) rotate(5deg);box-shadow:0 6px 20px #0003;border-color:#fff9}.tabs-on-gradient{padding:0 12px;margin:16px 0 0;position:relative;z-index:20}.gradient-tabs{display:flex;background:#ffffff26;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:18px;padding:6px;gap:6px;border:1px solid rgba(255,255,255,.2);box-shadow:0 8px 32px #0000001a,inset 0 1px #fff3;position:relative;z-index:25}.gradient-tab{flex:1;display:flex;align-items:center;justify-content:center;gap:10px;padding:16px 12px;background:transparent;border:none;border-radius:14px;font-size:15px;font-weight:600;color:#ffffffe6;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;outline:none}.gradient-tab:before{content:"";position:absolute;inset:0;background:#ffffff1a;opacity:0;transition:opacity .3s ease}.gradient-tab:hover:before{opacity:1}.gradient-tab:hover{color:#fff;transform:translateY(-2px)}.gradient-tab.active{background:#fffffff2;color:#667eea;box-shadow:0 8px 24px #0003,0 4px 12px #ffffff4d;transform:translateY(0)}.gradient-tab.active:hover{background:#fff;transform:translateY(-2px);box-shadow:0 12px 32px #00000040,0 6px 16px #fff6}.gradient-tab .tab-icon{font-size:18px;transition:transform .3s ease;filter:drop-shadow(0 2px 4px rgba(0,0,0,.2))}.gradient-tab.active .tab-icon{transform:scale(1.1);filter:drop-shadow(0 2px 6px rgba(102,126,234,.3))}.gradient-tab .tab-text{font-weight:700;letter-spacing:.3px}.tab-badge{background:linear-gradient(135deg,#ff3b30,#ff9500);color:#fff;font-size:11px;font-weight:800;padding:3px 8px;border-radius:10px;min-width:18px;text-align:center;margin-left:6px;box-shadow:0 4px 12px #ff3b3066;border:2px solid rgba(255,255,255,.6);animation:badgePulse 1.5s ease-in-out infinite}@keyframes badgePulse{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}.competitions-main{background:linear-gradient(135deg,#fffffffa,#f8f9fffa);border-radius:24px 24px 0 0;padding:24px 20px;box-shadow:0 -8px 32px #0000001a;min-height:calc(100vh - 200px);margin-top:12px;position:relative;z-index:5;overflow:visible}[data-theme=dark] .competitions-main{background:#10101efa;box-shadow:0 -8px 32px #0006}.competitions-list-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;padding-bottom:12px;border-bottom:2px solid rgba(102,126,234,.1)}.header-actions{display:flex;align-items:center;gap:12px}.competitions-header-actions{display:flex;align-items:center;gap:8px}.invite-link-btn{background:#667eea1a;color:#667eea;border:none;width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s,transform .15s}.invite-link-btn:hover{background:#667eea33;transform:scale(1.05)}.invite-modal-desc{font-size:14px;color:#666;line-height:1.6;margin:0 0 20px}.invite-link-success{display:flex;align-items:center;gap:12px;background:#ecfdf5;border-radius:12px;padding:14px 16px;margin-bottom:16px}.invite-link-check{flex-shrink:0}.invite-link-success-text{font-size:14px;font-weight:600;color:#065f46;margin:0}.invite-link-box{display:flex;gap:8px;margin-bottom:12px}.invite-link-input{flex:1;padding:12px 14px;border:2px solid #e5e7eb;border-radius:10px;font-size:13px;color:#555;outline:none;background:#f9fafb;cursor:text;min-width:0;font-family:monospace}.invite-link-copy-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;width:44px;height:44px;border-radius:10px;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:opacity .2s}.invite-link-copy-btn:hover{opacity:.88}.invite-link-hint{font-size:13px;color:#888;line-height:1.5;margin:0}.competitions-list-header h2{font-size:22px;font-weight:800;color:#2d3436;margin:0;letter-spacing:-.3px;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.refresh-btn{background:linear-gradient(135deg,#6c5ce7,#00cec9);color:#fff;border:none;width:44px;height:44px;border-radius:14px;font-size:18px;cursor:pointer;transition:all .4s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;justify-content:center;box-shadow:0 6px 20px #6c5ce74d;position:relative;overflow:hidden;outline:none}.refresh-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .7s ease}.refresh-btn:hover{transform:rotate(120deg) scale(1.1);box-shadow:0 8px 24px #6c5ce766}.refresh-btn:hover:before{left:100%}.add-competition-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:12px 20px;border-radius:14px;font-weight:700;cursor:pointer;font-size:14px;transition:all .4s cubic-bezier(.4,0,.2,1);box-shadow:0 6px 20px #667eea4d;letter-spacing:.3px;position:relative;overflow:hidden;outline:none}.add-competition-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .7s ease}.add-competition-btn:hover:not(:disabled){transform:translateY(-4px);box-shadow:0 12px 32px #667eea66}.add-competition-btn:hover:not(:disabled):before{left:100%}.add-competition-btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}.empty-competitions-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:350px;text-align:center;padding:36px 20px;background:linear-gradient(135deg,#667eea0d,#764ba214);border-radius:20px;border:2px dashed rgba(102,126,234,.2);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.empty-competitions-content{max-width:320px}.empty-competitions-icon{margin-bottom:24px}.icon-circle{display:inline-block;width:80px;height:80px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:36px;color:#fff;box-shadow:0 12px 32px #667eea66;animation:float 3s ease-in-out infinite;position:relative;overflow:hidden}.icon-circle:after{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(45deg,transparent,rgba(255,255,255,.1),transparent);transform:rotate(45deg);transition:transform .5s ease}.icon-circle:hover:after{transform:rotate(45deg) translate(50%,50%)}@keyframes float{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-10px) rotate(5deg)}}.empty-competitions-title{font-size:22px;font-weight:800;color:#2d3436;margin-bottom:12px;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.empty-competitions-description{color:#636e72;font-size:15px;line-height:1.5;margin-bottom:28px;opacity:.9;padding:0 16px}.create-first-competition-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:16px 28px;border-radius:16px;font-weight:700;font-size:15px;cursor:pointer;transition:all .4s cubic-bezier(.4,0,.2,1);width:100%;box-shadow:0 8px 24px #667eea4d;position:relative;overflow:hidden;outline:none}.create-first-competition-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .7s ease}.create-first-competition-btn:hover{transform:translateY(-4px) scale(1.02);box-shadow:0 16px 40px #667eea66}.create-first-competition-btn:hover:before{left:100%}.confirm-overlay{position:fixed;inset:0;background:#00000073;display:flex;align-items:center;justify-content:center;z-index:2000;padding:20px}.confirm-dialog{background:#fff;border-radius:20px;padding:28px 24px 20px;width:100%;max-width:320px;box-shadow:0 20px 60px #0003;text-align:center}.confirm-title{font-size:18px;font-weight:700;color:#1a1a2e;margin:0 0 8px}.confirm-text{font-size:14px;color:#888;margin:0 0 24px;line-height:1.5}.confirm-actions{display:flex;gap:10px}.confirm-cancel{flex:1;padding:12px;border:1.5px solid #e5e5e5;border-radius:12px;background:#fff;font-size:15px;font-weight:500;cursor:pointer;color:#555}.confirm-delete{flex:1;padding:12px;border:none;border-radius:12px;background:#ff4757;color:#fff;font-size:15px;font-weight:600;cursor:pointer}.status-badge{display:inline-flex;align-items:center;padding:4px 10px;border-radius:20px;font-size:12px;font-weight:600;flex-shrink:0}.status-badge.pending{background:#fff8e1;color:#f59e0b}.status-badge.won{background:#ecfdf5;color:#10b981}.status-badge.lost{background:#fef2f2;color:#ef4444}.status-badge.draw{background:#f3f4f6;color:#6b7280}.competition-title-badges{display:flex;flex-direction:column;align-items:flex-end;gap:8px;flex-shrink:0}.delete-competition-btn{background:none;border:none;padding:6px;border-radius:8px;color:#ccc;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:color .15s,background .15s}.delete-competition-btn:hover{color:#ef4444;background:#fef2f2}.invite-actions{background:linear-gradient(135deg,#f0f4ff,#f8f0ff);border-radius:12px;padding:14px 16px;margin-bottom:14px}.invite-text{font-size:13px;color:#555;margin:0 0 12px;line-height:1.4}.invite-buttons{display:flex;gap:8px}.invite-accept-btn{flex:1;padding:10px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer}.invite-decline-btn{flex:1;padding:10px;background:#fff;color:#888;border:1.5px solid #e5e5e5;border-radius:10px;font-size:14px;font-weight:500;cursor:pointer}.score-section.winner .score-value{color:#667eea;font-weight:800}.score-section.winner .score-label{color:#667eea}.completed-card{border-color:#667eea40;background:linear-gradient(135deg,#f8fafffa,#fffffffc)}.request-type-badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:600}.request-type-badge.incoming{background:#ecfdf5;color:#10b981}.request-type-badge.outgoing{background:#eff6ff;color:#3b82f6}.competition-card{background:linear-gradient(135deg,#fffffff2,#f8f9fffa);border-radius:20px;padding:20px;margin-bottom:20px;border:1px solid rgba(102,126,234,.15);transition:all .4s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;box-shadow:0 10px 24px #0000001a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-sizing:border-box}.competition-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#667eea,#764ba2);border-radius:20px 20px 0 0;opacity:.8;transition:opacity .3s ease}.competition-card:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(102,126,234,.03),transparent);opacity:0;transition:opacity .3s ease;pointer-events:none}.competition-card:hover{border-color:#667eea4d;transform:translateY(-4px) scale(1.005);box-shadow:0 16px 36px #667eea33}.competition-card:hover:after{opacity:1}.competition-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:20px}.competition-title-section{flex:1;margin-right:16px}.competition-title{font-size:20px;font-weight:800;color:#2d3436;margin:0 0 6px;text-transform:lowercase;letter-spacing:-.3px;line-height:1.3;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.competition-title:first-letter{text-transform:uppercase}.competition-subtitle{color:#636e72;font-size:14px;font-weight:500;display:flex;align-items:center;gap:6px}.friend-name{font-weight:700;color:#667eea;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.refresh-card-btn{background:#667eea1a;border:1px solid rgba(102,126,234,.2);width:40px;height:40px;border-radius:12px;font-size:16px;cursor:pointer;color:#667eea;transition:all .4s cubic-bezier(.4,0,.2,1);flex-shrink:0;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;outline:none}.refresh-card-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .7s ease}.refresh-card-btn:hover{background:linear-gradient(135deg,#667eea,#764ba2);border-color:#667eea;color:#fff;transform:rotate(120deg) scale(1.1);box-shadow:0 6px 20px #667eea4d}.refresh-card-btn:hover:before{left:100%}.competition-score{display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:center;margin-bottom:24px;padding:20px;background:linear-gradient(135deg,#fffffff2,#f8f9fffa);border-radius:16px;box-shadow:0 6px 20px #00000014;border:1px solid rgba(102,126,234,.15);position:relative;box-sizing:border-box}.score-section{text-align:center;padding:16px;border-radius:14px;transition:all .3s ease;position:relative;overflow:hidden;border:1px solid transparent;box-sizing:border-box}.score-section:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(102,126,234,.05),transparent);opacity:0;transition:opacity .3s ease}.score-section:hover{transform:translateY(-4px);box-shadow:0 8px 24px #0000001f}.score-section:hover:before{opacity:1}.you-section{background:linear-gradient(135deg,#667eea14,#667eea1f);border:1px solid rgba(102,126,234,.2)}.friend-section{background:linear-gradient(135deg,#764ba214,#764ba21f);border:1px solid rgba(118,75,162,.2)}.score-label{font-size:11px;font-weight:700;color:#636e72;margin-bottom:6px;text-transform:uppercase;letter-spacing:.8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.score-value{font-size:36px;font-weight:800;color:#2d3436;line-height:1;margin-bottom:6px;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.you-section .score-value{background:linear-gradient(135deg,#667eea,#5a67d8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.friend-section .score-value{background:linear-gradient(135deg,#764ba2,#8a56b8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.score-days{font-size:12px;font-weight:600;color:#636e72;opacity:.9}.vs-section{display:flex;align-items:center;justify-content:center}.vs-text{font-size:14px;font-weight:900;color:#fff;background:linear-gradient(135deg,#ff6b6b,#ffa726);padding:8px 16px;border-radius:40px;box-shadow:0 6px 20px #ff6b6b4d;transform:rotate(-5deg);animation:vsPulse 2s ease-in-out infinite;border:2px solid rgba(255,255,255,.3)}@keyframes vsPulse{0%,to{transform:rotate(-5deg) scale(1)}50%{transform:rotate(-5deg) scale(1.05)}}.days-remaining{grid-column:1 / -1;display:flex;flex-direction:column;align-items:center;padding:16px;background:linear-gradient(135deg,#2d34360f,#636e721f);border-radius:14px;border:1px solid rgba(45,52,54,.15);margin-top:8px}.days-label{font-size:11px;font-weight:700;color:#636e72;margin-bottom:6px;text-transform:uppercase;letter-spacing:.8px}.days-value{font-size:28px;font-weight:800;color:#2d3436;line-height:1;margin-bottom:4px}.days-total{font-size:12px;font-weight:600;color:#636e72;opacity:.8}.competition-calendars{margin-bottom:20px}.calendar-section{margin-bottom:24px}.calendar-section:last-child{margin-bottom:0}.calendar-title{font-size:15px;font-weight:700;color:#2d3436;margin-bottom:12px;padding-left:10px;border-left:3px solid #667eea;display:flex;align-items:center;gap:8px}.calendar-section:last-child .calendar-title{border-left-color:#764ba2}.calendar-grid{background:#fff;border-radius:16px;padding:20px;box-shadow:0 6px 20px #00000014;border:1px solid rgba(102,126,234,.15);box-sizing:border-box}[data-theme=dark] .calendar-grid{background:#ffffff0a;box-shadow:none;border-color:#ffffff12}[data-theme=dark] .calendar-day:not(.empty):not(.completed):not(.today):not(.missed){background:#ffffff0f;color:#b0b0d0;border-color:#ffffff14}[data-theme=dark] .calendar-day.missed{background:#dc323259!important;color:#ffb3b3!important;border:1px solid rgba(220,50,50,.65)!important}[data-theme=dark] .calendar-day.skipped{background:#eab30833!important;color:#fcd34d!important;border:1px solid rgba(234,179,8,.45)!important}[data-theme=dark] .skip-indicator{color:#fbbf24}[data-theme=dark] .calendar-day.empty{background:#ffffff05;border-color:#ffffff0a}[data-theme=dark] .calendar-day.today{border-color:#667eea;background:#667eea26;color:#a0b4ff}[data-theme=dark] .weekday-cell{color:#55557a}[data-theme=dark] .calendar-title{color:#9090b8}[data-theme=dark] .calendar-stats{color:#7777a0;background:#ffffff0a;border-color:#ffffff0f}[data-theme=dark] .calendar-section:first-child .calendar-stats{color:#5ccc60;background:#4caf5014;border-color:#4caf5026}[data-theme=dark] .calendar-section:last-child .calendar-stats{color:#c060e0;background:#9c27b014;border-color:#9c27b026}.weekdays-row{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:12px}.weekday-cell{text-align:center;font-size:12px;font-weight:700;color:#636e72;padding:8px 0;text-transform:uppercase;letter-spacing:.4px}.calendar-week{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:6px}.calendar-week:last-child{margin-bottom:0}.calendar-day{aspect-ratio:1;display:flex;align-items:center;justify-content:center;border-radius:10px;font-size:13px;font-weight:600;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1);cursor:default;border:1px solid transparent;box-sizing:border-box}.calendar-day.empty{background:#667eea0d;color:transparent;border:1px dashed rgba(102,126,234,.1);cursor:default;opacity:.5}.calendar-day.completed{background:linear-gradient(135deg,#4caf50,#2e7d32);color:#fff;font-weight:700;border:2px solid rgba(255,255,255,.8);box-shadow:0 2px 6px #4caf504d;position:relative;z-index:1}.calendar-day.today.completed{background:linear-gradient(135deg,#4caf50,#388e3c);border:2px solid white;box-shadow:0 0 0 2px #4caf50,0 3px 8px #4caf5066}.calendar-day.today{border:2px solid #667eea;background:linear-gradient(135deg,#667eea1a,#764ba214);font-weight:800;animation:todayPulseSimple 3s infinite;color:#2d3436;position:relative}@keyframes todayPulseSimple{0%,to{box-shadow:0 0 #667eea33}50%{box-shadow:0 0 0 4px #667eea00}}.calendar-section:last-child .calendar-day.completed{background:linear-gradient(135deg,#9c27b0,#7b1fa2);border:2px solid rgba(255,255,255,.8);box-shadow:0 2px 6px #9c27b04d}.calendar-section:last-child .calendar-day.today.completed{background:linear-gradient(135deg,#9c27b0,#6a1b9a);border:2px solid white;box-shadow:0 0 0 2px #9c27b0,0 3px 8px #9c27b066}.calendar-day:not(.empty):not(.completed):not(.today):not(.missed){background:#ffffffe6;color:#636e72;border:1px solid rgba(102,126,234,.2);transition:all .2s ease}.calendar-day:not(.empty):not(.completed):not(.today):not(.missed):hover{background:#667eea0d;transform:scale(1.02);border-color:#667eea4d;cursor:default}.calendar-day.missed{background:#e5393514;color:#c62828;border:1px solid rgba(229,57,53,.25)}.calendar-day.skipped{background:#eab3081a;color:#92610a;border:1px solid rgba(234,179,8,.35)}.skip-indicator{position:absolute;bottom:2px;right:3px;font-size:9px;font-weight:700;color:#b45309;line-height:1}.today-indicator{position:absolute;top:2px;right:2px;font-size:7px;color:#667eea;font-weight:900;background:#ffffffe6;width:10px;height:10px;border-radius:50%;display:flex;align-items:center;justify-content:center;line-height:1;z-index:1}.calendar-day.completed .today-indicator,.calendar-day.empty .today-indicator{display:none}.day-number{font-weight:600;position:relative;z-index:2;font-size:13px}.calendar-day.completed .day-number{color:#fff;font-weight:800;text-shadow:0 1px 1px rgba(0,0,0,.2)}.calendar-stats{margin-top:12px;text-align:center;font-size:13px;font-weight:600;color:#636e72;padding:10px;background:linear-gradient(135deg,#667eea0d,#764ba214);border-radius:12px;border:1px solid rgba(102,126,234,.15)}.calendar-section:first-child .calendar-stats{color:#4caf50;background:linear-gradient(135deg,#4caf5014,#2e7d321f);border-color:#4caf5033}.calendar-section:last-child .calendar-stats{color:#9c27b0;background:linear-gradient(135deg,#9c27b014,#7b1fa21f);border-color:#9c27b033}.calendar-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:36px;background:#fffffff2;border-radius:16px;border:2px dashed rgba(102,126,234,.3)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.calendar-error{text-align:center;padding:28px;background:#ff6b6b0d;border-radius:16px;border:2px solid rgba(255,107,107,.2)}.calendar-error p{color:#ff6b6b;font-weight:600;margin-bottom:16px;font-size:15px}.calendar-error button{background:linear-gradient(135deg,#ff6b6b,#ffa726);color:#fff;border:none;padding:10px 20px;border-radius:14px;font-weight:700;cursor:pointer;transition:all .3s ease;font-size:14px;outline:none}.calendar-error button:hover{transform:translateY(-3px);box-shadow:0 8px 24px #ff6b6b4d}.competition-actions{display:grid;grid-template-columns:1fr 2fr;gap:12px;margin-top:20px;padding-top:20px;border-top:2px solid rgba(102,126,234,.1)}.action-btn{padding:14px;border:none;border-radius:14px;font-weight:700;cursor:pointer;font-size:14px;transition:all .4s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;justify-content:center;gap:8px;letter-spacing:.3px;position:relative;overflow:hidden;outline:none;box-sizing:border-box}.action-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .7s ease}.action-btn.secondary{background:linear-gradient(135deg,#636e7214,#636e7226);color:#636e72;border:1px solid rgba(99,110,114,.2)}.action-btn.secondary:hover{background:linear-gradient(135deg,#636e7226,#636e7240);transform:translateY(-3px);box-shadow:0 8px 24px #636e7233;color:#2d3436}.action-btn.secondary:hover:before{left:100%}.action-btn.primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 8px 24px #667eea4d}.action-btn.primary:hover{transform:translateY(-4px);box-shadow:0 16px 40px #667eea66}.action-btn.primary:hover:before{left:100%}.pending-notice{grid-column:1 / -1;text-align:center;padding:12px;background:linear-gradient(135deg,#ffc1071a,#ffc10733);border:2px solid rgba(255,193,7,.3);border-radius:12px;color:#ff9800;font-weight:700;font-size:13px;margin-top:10px;animation:pulse 2s infinite}.friends-container{padding:12px 0}.friends-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;flex-wrap:wrap;gap:16px;padding-bottom:12px;border-bottom:2px solid rgba(102,126,234,.1)}.friends-header h2{font-size:22px;font-weight:800;color:#2d3436;margin:0;letter-spacing:-.3px;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.friend-search-container{display:flex;gap:8px;width:100%;max-width:400px;box-sizing:border-box}.friend-search-input{flex:1;padding:12px 16px;border:1px solid rgba(102,126,234,.2);border-radius:14px;font-size:14px;background:#fff;transition:all .3s ease;box-shadow:0 6px 20px #00000014;outline:none;box-sizing:border-box}.friend-search-input:focus{outline:none;border-color:#667eea;box-shadow:0 8px 28px #667eea33;transform:translateY(-2px)}.search-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:12px 24px;border-radius:14px;font-weight:700;cursor:pointer;font-size:14px;transition:all .3s ease;white-space:nowrap;box-shadow:0 6px 20px #667eea4d;position:relative;overflow:hidden;outline:none}.search-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .7s ease}.search-btn:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 12px 32px #667eea66}.search-btn:hover:not(:disabled):before{left:100%}.search-btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}.search-results{background:#fff;border-radius:16px;padding:20px;margin-bottom:24px;box-shadow:0 6px 24px #0000001a;border:1px solid rgba(102,126,234,.15);box-sizing:border-box}.search-results h3{font-size:18px;font-weight:800;color:#2d3436;margin:0 0 16px}.search-result-item{display:flex;justify-content:space-between;align-items:center;padding:16px;background:linear-gradient(135deg,#667eea08,#764ba20f);border-radius:14px;margin-bottom:10px;border:1px solid rgba(102,126,234,.1);transition:all .4s cubic-bezier(.4,0,.2,1);box-sizing:border-box}.search-result-item:hover{border-color:#667eea4d;transform:translateY(-4px);box-shadow:0 12px 32px #667eea26}.search-result-item:last-child{margin-bottom:0}.search-result-info{display:flex;align-items:center;gap:14px;flex:1}.search-result-actions{flex-shrink:0}.add-friend-btn-small{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:10px 20px;border-radius:12px;font-weight:700;cursor:pointer;font-size:13px;transition:all .3s ease;box-shadow:0 6px 20px #667eea4d;position:relative;overflow:hidden;outline:none}.add-friend-btn-small:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .7s ease}.add-friend-btn-small:hover{transform:translateY(-3px);box-shadow:0 12px 28px #667eea66}.add-friend-btn-small:hover:before{left:100%}.pending-badge{background:linear-gradient(135deg,#ffa726,#ff9800);color:#fff;padding:8px 16px;border-radius:12px;font-weight:700;font-size:13px;box-shadow:0 6px 20px #ffa7264d;border:1px solid rgba(255,255,255,.3)}.already-friend{background:linear-gradient(135deg,#4caf50,#45a049);color:#fff;padding:8px 16px;border-radius:12px;font-weight:700;font-size:13px;box-shadow:0 6px 20px #4caf504d;border:1px solid rgba(255,255,255,.3)}.friends-tabs{display:flex;border-bottom:2px solid rgba(102,126,234,.1);margin-bottom:24px;padding:0 6px;overflow-x:auto;-webkit-overflow-scrolling:touch}.friends-tab{padding:14px 24px;background:none;border:none;font-size:14px;color:#636e72;cursor:pointer;position:relative;font-weight:600;transition:all .3s ease;border-radius:12px 12px 0 0;white-space:nowrap;outline:none}.friend-item{display:flex;align-items:center;padding:16px;background:linear-gradient(135deg,#fffffff2,#f8f9fffa);border-radius:16px;margin-bottom:12px;box-shadow:0 6px 20px #00000014;transition:all .4s cubic-bezier(.4,0,.2,1);border:1px solid rgba(102,126,234,.15);position:relative;overflow:hidden;box-sizing:border-box}.friend-item:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,#667eea,#764ba2);opacity:0;transition:opacity .3s ease}.friend-item:hover{border-color:#667eea4d;transform:translateY(-4px);box-shadow:0 12px 32px #667eea33}.friend-item:hover:before{opacity:1}.friend-avatar{position:relative;width:48px;height:48px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:14px;display:flex;align-items:center;justify-content:center;font-weight:800;color:#fff;font-size:20px;margin-right:16px;flex-shrink:0;box-shadow:0 6px 20px #667eea4d;transition:all .4s cubic-bezier(.4,0,.2,1);border:2px solid rgba(255,255,255,.3)}.friend-item:hover .friend-avatar{transform:scale(1.1) rotate(8deg);box-shadow:0 8px 24px #667eea66}.friend-info{flex:1;min-width:0}.friend-name{margin:0 0 6px;font-size:16px;font-weight:800;color:#2d3436;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.2px}.friend-status{margin:0;font-size:13px;color:#636e72;font-weight:500}.friend-actions{display:flex;gap:10px;flex-shrink:0}.friend-action-btn{background:linear-gradient(135deg,#667eea1a,#764ba226);border:1px solid rgba(102,126,234,.2);width:44px;height:44px;border-radius:12px;cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center;transition:all .4s cubic-bezier(.4,0,.2,1);color:#667eea;position:relative;overflow:hidden;outline:none}.friend-action-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .7s ease}.friend-action-btn:hover{background:linear-gradient(135deg,#667eea,#764ba2);border-color:#667eea;color:#fff;transform:translateY(-3px);box-shadow:0 8px 24px #667eea4d}.friend-action-btn:hover:before{left:100%}.friend-action-btn.danger:hover{background:linear-gradient(135deg,#ff6b6b,#ff9500);border-color:#ff6b6b}.friend-request-item{display:flex;align-items:center;padding:16px;background:linear-gradient(135deg,#fffffff2,#fff8f8fa);border-radius:16px;margin-bottom:12px;box-shadow:0 6px 20px #00000014;transition:all .4s cubic-bezier(.4,0,.2,1);border:1px solid rgba(255,107,107,.15);position:relative;box-sizing:border-box}.friend-request-item:hover{border-color:#ff6b6b4d;transform:translateY(-4px);box-shadow:0 12px 32px #ff6b6b33}.friend-request-info{flex:1;margin-left:16px}.friend-request-info .friend-name{margin:0 0 6px;font-size:16px;font-weight:800;color:#2d3436}.request-time{margin:0;font-size:13px;color:#636e72;font-weight:500}.friend-request-actions{display:flex;gap:10px;flex-shrink:0}.accept-btn,.decline-btn{width:44px;height:44px;border-radius:12px;border:none;cursor:pointer;font-size:20px;display:flex;align-items:center;justify-content:center;transition:all .4s cubic-bezier(.4,0,.2,1);box-shadow:0 6px 20px #00000026;position:relative;overflow:hidden;outline:none}.accept-btn:before,.decline-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .7s ease}.accept-btn{background:linear-gradient(135deg,#4caf50,#45a049);color:#fff}.accept-btn:hover{background:linear-gradient(135deg,#45a049,#3d8b40);transform:translateY(-3px);box-shadow:0 12px 28px #4caf504d}.accept-btn:hover:before{left:100%}.decline-btn{background:linear-gradient(135deg,#ff6b6b,#ff5252);color:#fff}.decline-btn:hover{background:linear-gradient(135deg,#ff5252,#ff3b30);transform:translateY(-3px);box-shadow:0 12px 28px #ff6b6b4d}.decline-btn:hover:before{left:100%}.no-friends,.no-requests{text-align:center;padding:48px 28px;color:#636e72;background:linear-gradient(135deg,#fffffff2,#f8f9fff2);border-radius:20px;box-shadow:0 6px 24px #00000014;border:2px dashed rgba(102,126,234,.2);margin-top:20px;box-sizing:border-box}.no-friends p,.no-requests p{margin:0 0 20px;font-size:16px;font-weight:700}.hint{font-size:14px;color:#b2bec3;margin-top:10px}.nav-item{display:flex;flex-direction:column;align-items:center;gap:4px;background:none;border:none;padding:8px 20px;border-radius:14px;cursor:pointer;transition:color .2s,background .2s,transform .15s;color:#aaa;min-width:70px;outline:none}.modal-overlay{position:fixed;inset:0;background:#000000b3;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;z-index:2000;padding:16px;animation:fadeIn .4s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-content{background:linear-gradient(135deg,#fffffffa,#f8f9fff2);border-radius:24px;width:100%;max-width:480px;max-height:90vh;overflow-y:auto;animation:modalSlideIn .5s cubic-bezier(.4,0,.2,1);box-shadow:0 24px 48px #0000004d;border:1px solid rgba(255,255,255,.4);position:relative;box-sizing:border-box}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(40px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:24px;border-bottom:1px solid rgba(102,126,234,.1);position:relative}.modal-header:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#667eea,#764ba2);border-radius:24px 24px 0 0}.modal-header h3{margin:0;font-size:22px;font-weight:800;color:#2d3436;letter-spacing:-.3px;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.modal-close{background:linear-gradient(135deg,#667eea1a,#764ba226);border:none;width:36px;height:36px;border-radius:12px;font-size:22px;color:#667eea;cursor:pointer;line-height:1;padding:0;display:flex;align-items:center;justify-content:center;transition:all .4s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;outline:none}.modal-close:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .7s ease}.modal-close:hover{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;transform:rotate(90deg);box-shadow:0 8px 24px #667eea4d}.modal-close:hover:before{left:100%}.modal-steps{display:flex;justify-content:center;gap:12px;padding:20px 24px;border-bottom:1px solid rgba(102,126,234,.1)}.step-indicator{display:flex;flex-direction:column;align-items:center;gap:6px;flex:1;max-width:90px}.step-number{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#636e7214,#636e7226);display:flex;align-items:center;justify-content:center;font-weight:800;color:#b2bec3;transition:all .4s cubic-bezier(.4,0,.2,1);font-size:15px;box-shadow:0 4px 12px #00000014;border:2px solid transparent}.step-indicator.active .step-number{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 8px 24px #667eea4d;transform:scale(1.15);border:2px solid rgba(255,255,255,.3)}.step-label{font-size:12px;font-weight:700;color:#b2bec3;text-transform:uppercase;letter-spacing:.4px}.step-indicator.active .step-label{color:#667eea;font-weight:800}.modal-body{padding:24px}.step-content h4{margin:0 0 24px;font-size:20px;font-weight:800;color:#2d3436;letter-spacing:-.2px;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.form-group{margin-bottom:24px}.form-label{display:block;margin-bottom:10px;font-weight:700;color:#2d3436;font-size:15px}.form-input,.form-select{width:100%;padding:14px 18px;border:1px solid rgba(102,126,234,.2);border-radius:14px;font-size:15px;background:#fff;transition:all .4s cubic-bezier(.4,0,.2,1);box-shadow:0 6px 20px #00000014;outline:none;box-sizing:border-box}.form-input:focus,.form-select:focus{outline:none;border-color:#667eea;box-shadow:0 12px 32px #667eea33;transform:translateY(-3px)}.form-hint{font-size:13px;color:#636e72;margin-top:8px;line-height:1.6}.duration-options{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:10px}.duration-option{padding:14px;background:linear-gradient(135deg,#667eea14,#764ba21f);border:1px solid rgba(102,126,234,.2);border-radius:12px;font-size:14px;font-weight:700;cursor:pointer;transition:all .4s cubic-bezier(.4,0,.2,1);color:#636e72;text-align:center;position:relative;overflow:hidden;outline:none}.duration-option:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .7s ease}.duration-option:hover{border-color:#667eea66;transform:translateY(-3px);box-shadow:0 8px 24px #667eea26}.duration-option:hover:before{left:100%}.duration-option.selected{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-color:transparent;box-shadow:0 8px 24px #667eea4d;transform:translateY(-3px)}.duration-option.infinite{background:linear-gradient(135deg,#ff980014,#ff57221a);border-color:#ff98004d;color:#e65100}.duration-option.infinite.selected{background:linear-gradient(135deg,#ff9800,#ff5722);box-shadow:0 8px 24px #ff980059}.selected-habit-info,.no-habits,.no-friends-warning{background:linear-gradient(135deg,#667eea0f,#764ba21a);padding:16px;border-radius:14px;margin-top:12px;border:1px solid rgba(102,126,234,.15)}.selected-habit-info p{margin:0 0 8px;color:#2d3436;font-weight:700}.selected-habit-info p:last-child{margin:0;color:#636e72;font-size:14px;font-weight:400}.habit-hint{font-size:13px;color:#636e72;font-style:italic}.no-habits,.no-friends-warning{text-align:center}.no-habits-reasons{text-align:left;margin:16px 0;padding-left:20px;color:#636e72;font-size:14px}.no-habits-reasons li{margin-bottom:8px;line-height:1.6}.no-habits-reasons li:last-child{margin-bottom:0}.loading-habits{text-align:center;padding:32px}.loading-habits p{margin:16px 0 0;color:#636e72;font-weight:700;font-size:15px}.competition-summary{margin-top:24px}.competition-summary h5{margin:0 0 16px;font-size:18px;font-weight:800;color:#2d3436;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.summary-card{background:linear-gradient(135deg,#667eea0f,#764ba21a);border-radius:16px;padding:20px;border:1px solid rgba(102,126,234,.2);margin-bottom:20px}.summary-row{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid rgba(102,126,234,.1)}.summary-row:last-child{border-bottom:none;padding-bottom:0}.summary-row:first-child{padding-top:0}.summary-label{font-weight:700;color:#636e72;font-size:14px}.summary-value{font-weight:800;color:#2d3436;text-align:right;font-size:15px}.stake-value{color:#667eea;font-style:italic;font-weight:700}.summary-note{background:#fffffff2;border-radius:14px;padding:20px;border:1px solid rgba(102,126,234,.15)}.summary-note p{margin:0 0 12px;font-weight:800;color:#2d3436;font-size:15px}.summary-list{margin:0;padding-left:20px;color:#636e72;font-size:14px;line-height:1.7}.summary-list li{margin-bottom:8px}.summary-list li:last-child{margin-bottom:0}.modal-actions{display:grid;grid-template-columns:1fr 2fr;gap:12px;padding:24px;border-top:1px solid rgba(102,126,234,.1);background:#fffffff2;border-radius:0 0 24px 24px}.btn-secondary{padding:14px;background:linear-gradient(135deg,#636e7214,#636e7226);color:#636e72;border:none;border-radius:14px;font-weight:800;font-size:15px;cursor:pointer;transition:all .4s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;outline:none}.btn-secondary:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .7s ease}.btn-secondary:hover{background:linear-gradient(135deg,#636e7226,#636e7240);transform:translateY(-3px);box-shadow:0 8px 24px #636e7233;color:#2d3436}.btn-secondary:hover:before{left:100%}.btn-primary{padding:14px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:14px;font-weight:800;font-size:15px;cursor:pointer;transition:all .4s cubic-bezier(.4,0,.2,1);box-shadow:0 8px 24px #667eea4d;position:relative;overflow:hidden;outline:none}.btn-primary:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .7s ease}.btn-primary:hover:not(:disabled){transform:translateY(-4px);box-shadow:0 16px 40px #667eea66}.btn-primary:hover:not(:disabled):before{left:100%}.btn-primary:disabled{opacity:.5;cursor:not-allowed;transform:none!important}.request-header{display:flex;align-items:center;gap:8px}.request-type-icon{font-size:16px;opacity:.7}.request-time{font-size:12px;color:#666;margin-top:2px}.friend-request-actions{display:flex;gap:8px}.accept-btn,.decline-btn,.cancel-btn{padding:6px 12px;border:none;border-radius:6px;cursor:pointer;font-size:14px;transition:all .2s;outline:none}.accept-btn{background-color:#4caf50;color:#fff}.accept-btn:hover{background-color:#45a049}.decline-btn{background-color:#f44336;color:#fff}.decline-btn:hover{background-color:#d32f2f}.cancel-btn{background-color:#ff9800;color:#fff}.cancel-btn:hover{background-color:#f57c00}.friends-tabs{display:flex;gap:8px;margin-bottom:20px;border-bottom:2px solid rgba(102,126,234,.1);padding:0 6px;overflow-x:auto;-webkit-overflow-scrolling:touch}.friends-tab{padding:12px 20px;background:none;border:none;font-size:14px;color:#636e72;cursor:pointer;position:relative;font-weight:600;transition:all .3s ease;border-radius:12px 12px 0 0;white-space:nowrap;outline:none}.friends-tab:hover{color:#667eea;background:#667eea0d}.friends-tab.active{color:#667eea;font-weight:700;background:#667eea14}.friends-tab.active:after{content:"";position:absolute;bottom:-2px;left:0;right:0;height:3px;background:linear-gradient(90deg,#667eea,#764ba2);border-radius:3px 3px 0 0;box-shadow:0 -2px 8px #667eea4d}.recommendations-section{margin-bottom:24px}.recommendations-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid rgba(102,126,234,.1)}.recommendations-header h3{margin:0;font-size:18px;font-weight:800;color:#2d3436;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.2px}.refresh-recommendations-btn{background:#667eea1a;border:1px solid rgba(102,126,234,.2);width:36px;height:36px;border-radius:10px;font-size:16px;cursor:pointer;color:#667eea;transition:all .3s ease;display:flex;align-items:center;justify-content:center;outline:none}.refresh-recommendations-btn:hover:not(:disabled){background:#667eea26;transform:rotate(90deg)}.refresh-recommendations-btn:disabled{opacity:.5;cursor:not-allowed}.recommended-user-item{display:flex;align-items:center;padding:16px;background:#fff;border-radius:12px;margin-bottom:12px;box-shadow:0 4px 12px #00000014;border:1px solid rgba(102,126,234,.1);transition:all .3s ease;box-sizing:border-box}.recommended-user-item:hover{border-color:#667eea4d;transform:translateY(-2px);box-shadow:0 8px 20px #667eea26}.recommended-user-avatar{width:48px;height:48px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;display:flex;align-items:center;justify-content:center;font-weight:700;color:#fff;font-size:18px;margin-right:16px;flex-shrink:0;box-shadow:0 4px 12px #667eea4d}.recommended-user-info{flex:1;min-width:0}.recommended-user-name{margin:0 0 6px;font-size:16px;font-weight:700;color:#2d3436;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.common-interests{margin:4px 0;font-size:13px;color:#667eea;font-weight:600;display:flex;align-items:center;gap:4px}.recommendation-reason{margin:4px 0 0;font-size:12px;color:#636e72;font-style:italic;line-height:1.4}.recommended-user-actions{flex-shrink:0;margin-left:12px}.add-friend-recommended-btn{background:linear-gradient(135deg,#4caf50,#45a049);color:#fff;border:none;padding:10px 20px;border-radius:10px;font-weight:700;cursor:pointer;font-size:13px;transition:all .3s ease;white-space:nowrap;box-shadow:0 4px 12px #4caf504d;outline:none}.add-friend-recommended-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 20px #4caf5066}.add-friend-recommended-btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}.loading-recommendations{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center;background:#fffffff2;border-radius:16px;border:2px dashed rgba(102,126,234,.2)}.loading-spinner-small{width:32px;height:32px;border:3px solid rgba(102,126,234,.1);border-top:3px solid #667eea;border-radius:50%;animation:spin .8s linear infinite;margin-bottom:16px}.no-recommendations{text-align:center;padding:40px 20px;background:#fff;border-radius:16px;border:2px dashed rgba(102,126,234,.2);margin:20px 0}.no-recommendations p{margin:0 0 10px;font-size:16px;font-weight:700;color:#636e72}.no-recommendations .hint{font-size:14px;color:#b2bec3;margin-top:10px}.recommendations-info{background:#667eea0d;border-radius:12px;padding:16px;margin-top:24px;border:1px solid rgba(102,126,234,.1);border-left:4px solid #667eea}.info-note{margin:0;font-size:13px;color:#636e72;line-height:1.6;font-weight:500}.friends-list{margin-top:16px}@media(max-width:768px){.competitions-page{padding:12px;padding-top:calc(12px + env(safe-area-inset-top));padding-bottom:calc(80px + env(safe-area-inset-bottom))}.competition-score{grid-template-columns:1fr auto 1fr;gap:16px;padding:16px}.days-remaining{margin-top:12px}.modal-content{max-width:100%;border-radius:20px}.modal-header,.modal-body{padding:20px}.modal-actions{padding:20px;grid-template-columns:1fr}.friend-actions{flex-direction:row}.friend-action-btn{width:40px;height:40px;font-size:16px}.friend-request-actions{flex-direction:row}.accept-btn,.decline-btn{width:40px;height:40px;font-size:18px}.competition-actions{grid-template-columns:1fr;gap:10px}.header-actions{flex-direction:row;gap:10px;width:auto}.refresh-btn{order:0;align-self:auto}.friends-header{flex-direction:column;align-items:stretch;gap:16px}.friend-search-container{max-width:100%;width:100%}.score-value{font-size:32px}.days-value{font-size:28px}.competition-title{font-size:18px}.duration-options{grid-template-columns:repeat(2,1fr)}.bottom-nav{padding:8px 0}.nav-item{margin:0 6px;padding:10px}.tabs-on-gradient{padding:0 8px;margin:12px 0 0}.gradient-tabs{border-radius:16px;padding:4px}.gradient-tab{padding:12px 8px;font-size:13px;gap:6px}.gradient-tab .tab-text{display:none}.gradient-tab .tab-icon{font-size:16px}.tab-badge{font-size:10px;padding:2px 5px;min-width:16px;margin-left:0;position:absolute;top:6px;right:6px}.gradient-tab{position:relative}.competitions-main{border-radius:20px 20px 0 0;padding:20px 16px;margin-top:12px}.recommended-user-item{flex-direction:column;text-align:center;padding:20px}.recommended-user-avatar{margin-right:0;margin-bottom:16px;width:64px;height:64px;font-size:22px}.recommended-user-info{text-align:center;margin-bottom:16px;width:100%}.recommended-user-actions{margin-left:0;width:100%}.add-friend-recommended-btn{width:100%;padding:12px}.recommended-user-name{font-size:18px}.common-interests,.recommendation-reason{font-size:14px}.friends-tabs{overflow-x:auto;-webkit-overflow-scrolling:touch}.friends-tab{white-space:nowrap;flex-shrink:0}}@media(max-width:480px){.header-content h1,.competitions-list-header h2,.friends-header h2{font-size:20px}.competition-card{padding:14px;border-radius:16px;margin-bottom:14px}.competition-header{margin-bottom:12px}.competition-title{font-size:17px}.competition-score{gap:8px;padding:10px;margin-bottom:14px}.score-section{padding:10px 6px}.score-value{font-size:28px}.score-label{font-size:10px;letter-spacing:.3px}.days-remaining{padding:10px}.days-value{font-size:24px}.days-label{font-size:10px}.vs-text{font-size:13px;padding:6px 12px}}.calendar-month-nav{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:10px}.cal-nav-btn{background:#667eea26;border:1px solid rgba(102,126,234,.35);color:#667eea;border-radius:8px;width:30px;height:30px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:20px;line-height:1;transition:background .2s,opacity .2s;flex-shrink:0;padding:0}.cal-nav-btn:hover:not(:disabled){background:#667eea4d}.cal-nav-btn:disabled{opacity:.25;cursor:default}.cal-month-label{font-size:13px;font-weight:600;color:#c8c8f0;min-width:130px;text-align:center;letter-spacing:.01em}.competition-stats{display:flex;align-items:center;gap:0;margin:6px 0 2px;padding:10px 14px;background:#ffffff0a;border-radius:10px;border:1px solid rgba(255,255,255,.07)}.competition-stat{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px}.competition-stat-sep{width:1px;height:32px;background:#ffffff1a;margin:0 8px;flex-shrink:0}.comp-stat-label{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#7070a0;font-weight:600}.comp-stat-values{display:flex;align-items:center;gap:5px}.comp-stat-you{font-size:17px;font-weight:700;color:#a0b4ff}.comp-stat-friend{font-size:17px;font-weight:700;color:#c084fc}.comp-stat-divider{font-size:13px;color:#505070;font-weight:600}[data-theme=dark] .cal-month-label{color:#b0b0d8}[data-theme=dark] .competition-stats{background:#ffffff08;border-color:#ffffff0f}.friends-tab{padding:10px 16px;font-size:13px}.friend-item,.friend-request-item{padding:14px}.friend-avatar{width:44px;height:44px;font-size:18px;margin-right:14px;border-radius:12px}.friend-name{font-size:15px}.score-value{font-size:28px}.days-value{font-size:24px}.competition-title{font-size:18px}.duration-options{grid-template-columns:1fr}.nav-icon{font-size:22px}.nav-text{font-size:10px}.recommendations-header h3{font-size:16px}.refresh-recommendations-btn{width:32px;height:32px;font-size:14px}.recommended-user-item{padding:16px}.recommended-user-avatar{width:56px;height:56px;font-size:20px}.add-friend-recommended-btn{font-size:13px;padding:10px}} @keyframes pulse{0%,100%{opacity:1}50%{opacity:.7}}.competitions-main,.modal-content,.competition-card{max-width:100%;box-sizing:border-box}.section-header-actions{display:flex;gap:8px;align-items:center;flex-shrink:0}.hide-recommendations-btn{background:#ff6b6b1a;border:1px solid rgba(255,107,107,.15);width:32px;height:32px;border-radius:8px;font-size:14px;cursor:pointer;color:#ff6b6b;transition:all .3s ease;display:flex;align-items:center;justify-content:center;font-weight:700;position:relative;overflow:hidden;box-sizing:border-box;margin:0;padding:0;outline:none}.hide-recommendations-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .7s ease}.hide-recommendations-btn:hover{background:#ff6b6b26;color:#ff5252;transform:rotate(90deg);border-color:#ff6b6b40;box-shadow:0 2px 8px #ff6b6b26}.hide-recommendations-btn:hover:before{left:100%}.refresh-recommendations-btn{background:#667eea1a;border:1px solid rgba(102,126,234,.15);width:32px;height:32px;border-radius:8px;font-size:14px;cursor:pointer;color:#667eea;transition:all .3s ease;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;box-sizing:border-box;margin:0;padding:0;outline:none}.refresh-recommendations-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .7s ease}.refresh-recommendations-btn:hover:not(:disabled){background:#667eea26;transform:rotate(120deg);border-color:#667eea40;box-shadow:0 2px 8px #667eea26}.refresh-recommendations-btn:hover:not(:disabled):before{left:100%}.refresh-recommendations-btn:disabled{opacity:.5;cursor:not-allowed;animation:none}.show-recommendations-container{margin:24px 0;text-align:center}.show-recommendations-btn{background:linear-gradient(135deg,#667eea1a,#764ba226);border:2px solid rgba(102,126,234,.2);color:#667eea;border-radius:16px;padding:14px 28px;font-size:15px;font-weight:700;cursor:pointer;transition:all .4s cubic-bezier(.4,0,.2,1);width:100%;position:relative;overflow:hidden;outline:none}.show-recommendations-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .7s ease}.show-recommendations-btn:hover{background:linear-gradient(135deg,#667eea26,#764ba233);border-color:#667eea66;transform:translateY(-3px);box-shadow:0 8px 24px #667eea26;color:#5a67d8}.show-recommendations-btn:hover:before{left:100%}@keyframes refreshing{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.refreshing{animation:refreshing 1s linear infinite}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid rgba(102,126,234,.1)}.section-header h3{margin:0;font-size:18px;font-weight:800;color:#2d3436;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.2px}.competitions-main{position:relative;z-index:1}.friends-container{position:relative;z-index:2}.competition-card{position:relative;z-index:1}button,.action-btn,.gradient-tab,.friends-tab,.nav-item{-webkit-tap-highlight-color:transparent;touch-action:manipulation}@media(max-width:768px){.hide-recommendations-btn,.refresh-recommendations-btn{width:36px;height:36px}.section-header-actions{gap:6px}.section-header{flex-wrap:nowrap;gap:8px;overflow:visible}.section-header h3{flex:1;min-width:0;font-size:15px;white-space:normal;overflow:visible}}[data-theme=dark] .friends-header{border-bottom-color:#ffffff12}[data-theme=dark] .friend-search-input{background:#ffffff0f;border-color:#ffffff1a;color:#e8e8f8}[data-theme=dark] .friend-search-input::placeholder{color:#55557a}[data-theme=dark] .section-container{background:#ffffff0a;border-color:#ffffff0f}[data-theme=dark] .section-header h3{color:#9090b8}[data-theme=dark] .friend-item,[data-theme=dark] .friend-request-item{background:#ffffff0a;border-color:#ffffff0f}[data-theme=dark] .friend-item h4,[data-theme=dark] .friend-request-info h4{color:#e8e8f8}[data-theme=dark] .friend-status,[data-theme=dark] .request-time{color:#7777a0}[data-theme=dark] .friend-avatar,[data-theme=dark] .recommended-user-avatar{background:#667eea40;color:#a0b4ff}[data-theme=dark] .recommended-user-item{background:#ffffff0a;border-color:#ffffff0f}[data-theme=dark] .recommended-user-name{color:#e8e8f8}[data-theme=dark] .recommendation-reason,[data-theme=dark] .common-interests{color:#7777a0}[data-theme=dark] .search-results{background:#141426f2;border-color:#ffffff0f;box-shadow:none}[data-theme=dark] .search-results h3{color:#9090b8}.reactions-section{margin-top:10px;padding-top:10px;border-top:1px solid rgba(0,0,0,.06)}.reactions-buttons{display:flex;gap:6px;flex-wrap:wrap}.reaction-btn{display:flex;align-items:center;gap:4px;padding:5px 10px;border:1.5px solid rgba(0,0,0,.08);border-radius:20px;background:#f7f7fc;font-size:16px;cursor:pointer;transition:all .18s;line-height:1}.reaction-btn:hover:not(:disabled){background:#ececff;border-color:#a0b4ff;transform:scale(1.08)}.reaction-btn:disabled{opacity:.6;cursor:default}.reaction-btn.has-reactions{background:#ececff;border-color:#c0ccff}.reaction-count{font-size:11px;font-weight:600;color:#667eea}[data-theme=dark] .reactions-section{border-top-color:#ffffff12}[data-theme=dark] .reaction-btn{background:#ffffff12;border-color:#ffffff1a}[data-theme=dark] .reaction-btn:hover:not(:disabled){background:#667eea33;border-color:#7b8fff}[data-theme=dark] .reaction-btn.has-reactions{background:#667eea26;border-color:#a0b4ff4d}[data-theme=dark] .reaction-count{color:#a0b4ff}.archive-container{padding:4px 0}.empty-archive{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 24px;text-align:center;gap:8px}.empty-archive-icon{margin-bottom:8px;opacity:.5}.empty-archive-text{font-size:16px;font-weight:600;color:#555;margin:0}.empty-archive-hint{font-size:13px;color:#888;margin:0}.archive-list{display:flex;flex-direction:column;gap:10px}.archive-card{background:#fff;border-radius:16px;padding:16px;box-shadow:0 2px 8px #00000014;border:1px solid rgba(0,0,0,.06)}.archive-card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px;gap:8px}.archive-card-title-section{flex:1;min-width:0}.archive-habit-title{font-size:15px;font-weight:700;color:#1a1a2e;margin:0 0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.archive-vs{font-size:12px;color:#888;margin:0}.archive-card-badges{display:flex;align-items:center;gap:6px;flex-shrink:0}.archive-card-score{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:12px}.archive-score-you,.archive-score-friend{font-size:28px;font-weight:800;color:#999;line-height:1}.archive-score-you.winner,.archive-score-friend.winner{color:#667eea}.archive-score-sep{font-size:20px;font-weight:700;color:#ccc}.archive-card-meta{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.archive-meta-item{display:flex;align-items:center;gap:4px;font-size:12px;color:#888}.archive-meta-item svg{flex-shrink:0;opacity:.7}[data-theme=dark] .empty-archive-text{color:#9090b8}[data-theme=dark] .empty-archive-hint{color:#6666a0}[data-theme=dark] .archive-card{background:#ffffff0d;border-color:#ffffff12}[data-theme=dark] .archive-habit-title{color:#e8e8f8}[data-theme=dark] .archive-vs{color:#7777a0}[data-theme=dark] .archive-score-you,[data-theme=dark] .archive-score-friend{color:#6666a0}[data-theme=dark] .archive-score-you.winner,[data-theme=dark] .archive-score-friend.winner{color:#a0b4ff}[data-theme=dark] .archive-score-sep{color:#3a3a5c}[data-theme=dark] .archive-meta-item{color:#7777a0}[data-theme=dark] .competitions-list-header h2{color:#e8e8f8}[data-theme=dark] .competitions-list-header{border-bottom-color:#ffffff12}.provocation-btn{margin-top:10px;width:100%;padding:8px 0;border:1.5px solid #f59e0b;border-radius:10px;background:transparent;color:#f59e0b;font-size:13px;font-weight:700;cursor:pointer;transition:background .15s,color .15s}.provocation-btn:hover:not(:disabled){background:#f59e0b;color:#fff}.provocation-btn:disabled{opacity:.5;cursor:default}.skip-requests-section{margin-top:12px;display:flex;flex-direction:column;gap:8px}.skip-request-card{background:#667eea12;border:1px solid rgba(102,126,234,.2);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:6px}.skip-request-info{display:flex;flex-direction:column;gap:2px}.skip-request-who{font-size:12px;font-weight:700;color:#667eea}.skip-request-date{font-size:11px;color:#888}.skip-request-reason{font-size:13px;color:#333}.skip-request-actions{display:flex;gap:8px}.skip-accept-btn,.skip-reject-btn{flex:1;padding:6px 0;border-radius:8px;border:none;font-size:12px;font-weight:700;cursor:pointer;transition:opacity .15s}.skip-accept-btn{background:#22c55e;color:#fff}.skip-reject-btn{background:#ef4444;color:#fff}.skip-accept-btn:disabled,.skip-reject-btn:disabled{opacity:.5;cursor:default}.skip-pending-label{font-size:11px;color:#999;font-style:italic}[data-theme=dark] .provocation-btn{border-color:#f59e0b;color:#f59e0b}[data-theme=dark] .skip-request-card{background:#ffffff0a;border-color:#ffffff1a}[data-theme=dark] .skip-request-reason{color:#e8e8f8}.profile-page{min-height:100vh;background:linear-gradient(135deg,#667eea,#764ba2);padding-bottom:80px;color:#fff}.profile-header{background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:20px 16px;border-bottom:1px solid rgba(255,255,255,.2);display:flex;align-items:center;justify-content:space-between}.header-content{display:flex;justify-content:space-between;align-items:center;width:100%}.header-content h1{color:#fff;font-size:24px;font-weight:600;margin:0}.user-avatar{width:40px;height:40px;background:#fff3;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:18px}.profile-main{max-width:500px;margin:0 auto;padding:20px}.profile-info-card{background:#fffffff2;border-radius:20px;padding:30px;box-shadow:0 10px 40px #0003;color:#333;margin-bottom:20px}.profile-tabs{display:flex;background:#f0f0f5;border-radius:12px;padding:4px;margin-bottom:24px;gap:4px}.profile-tab{flex:1;padding:10px 0;border:none;border-radius:9px;background:transparent;color:#888;font-size:14px;font-weight:500;cursor:pointer;font-family:inherit;transition:all .2s}.profile-tab.active{background:#fff;color:#333;font-weight:600;box-shadow:0 1px 6px #0000001a}[data-theme=dark] .profile-tabs{background:#ffffff14}[data-theme=dark] .profile-tab{color:#6666a0}[data-theme=dark] .profile-tab.active{background:#ffffff1f;color:#e8e8f8}.avatar-section{text-align:center;margin-bottom:30px}.avatar-large{width:80px;height:80px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:32px;font-weight:700;color:#fff;margin:0 auto 15px;box-shadow:0 5px 15px #667eea66}.avatar-image{width:100%;height:100%;border-radius:50%;object-fit:cover}.user-details{margin-bottom:20px}.user-username{font-size:1.5rem;font-weight:600;color:#333;margin-bottom:.25rem}.user-email{font-size:.9rem;color:#666;margin-bottom:.5rem}.user-id{font-size:14px;color:#6c757d;font-family:Monaco,Consolas,monospace}.edit-username-btn{background:none;border:1px solid #007AFF;color:#007aff;padding:.5rem 1rem;border-radius:15px;font-size:.9rem;cursor:pointer;transition:all .2s ease;margin-bottom:.5rem;display:inline-block;font-weight:500}.edit-username-btn:hover{background:#007aff;color:#fff;transform:translateY(-1px)}.username-edit-container{width:100%;margin-bottom:.5rem}.username-input{width:100%;padding:.75rem;border:1px solid #ddd;border-radius:12px;font-size:1.1rem;margin-bottom:.5rem;box-sizing:border-box}.username-input:focus{outline:none;border-color:#007aff;box-shadow:0 0 0 2px #007aff1a}.username-input.error{border-color:#ff3b30}.username-error{color:#ff3b30;font-size:.8rem;margin-bottom:.75rem;padding:.25rem .5rem;background:#ff3b301a;border-radius:6px}.username-edit-actions{display:flex;gap:.5rem;margin-top:.5rem}.save-username-btn{background:#007aff;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:12px;font-size:.9rem;cursor:pointer;flex:1;transition:all .2s ease;font-weight:600}.save-username-btn:hover:not(:disabled){background:#0056cc;transform:translateY(-1px);box-shadow:0 4px 12px #007aff4d}.save-username-btn:disabled{opacity:.5;cursor:not-allowed}.cancel-username-btn{background:#f2f2f7;color:#666;border:none;padding:.75rem 1.5rem;border-radius:12px;font-size:.9rem;cursor:pointer;flex:1;transition:all .2s ease;font-weight:500}.cancel-username-btn:hover{background:#e5e5ea;transform:translateY(-1px)}.profile-stats{background:#f8f9fa;border-radius:15px;padding:20px;margin-bottom:30px}.stat-item{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid #e9ecef}.stat-item:last-child{border-bottom:none}.stat-label{font-size:14px;color:#6c757d}.stat-value{font-size:14px;font-weight:500;color:#495057;font-family:Monaco,Consolas,monospace}.settings-section{background:#f8f9fa;border-radius:15px;padding:20px;margin-bottom:20px}.settings-title{font-size:13px;font-weight:600;color:#6c757d;text-transform:uppercase;letter-spacing:.5px;margin:0 0 14px}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.setting-info{display:flex;flex-direction:column;gap:2px;flex:1}.setting-label{font-size:15px;font-weight:500;color:#333}.setting-desc{font-size:12px;color:#6c757d;line-height:1.4}.toggle-switch{position:relative;flex-shrink:0;width:51px;height:31px;background:#ddd;border:none;border-radius:16px;cursor:pointer;transition:background .25s ease;padding:0;outline:none}.toggle-switch:after{content:"";position:absolute;top:2px;left:2px;width:27px;height:27px;background:#fff;border-radius:50%;box-shadow:0 2px 6px #00000040;transition:transform .25s ease}.toggle-switch.on{background:#34c759}.toggle-switch.on:after{transform:translate(20px)}.toggle-switch:disabled{opacity:.6;cursor:not-allowed}.notif-channel-selector{margin-top:10px;padding:10px 12px;background:#667eea0d;border-radius:12px}.channel-toggle{display:flex;gap:8px}.channel-btn{flex:1;padding:9px 0;border:1.5px solid rgba(102,126,234,.2);border-radius:10px;background:transparent;color:#888;font-size:14px;font-weight:500;cursor:pointer;font-family:inherit;transition:all .2s}.channel-btn.active{background:linear-gradient(135deg,#667eea,#764ba2);border-color:transparent;color:#fff;font-weight:600}[data-theme=dark] .channel-btn{border-color:#667eea4d;color:#aaa}[data-theme=dark] .channel-btn.active{color:#fff}.push-enable-btn{margin-top:10px;width:100%;padding:11px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:12px;font-size:14px;font-weight:600;cursor:pointer;font-family:inherit;transition:opacity .2s}.push-enable-btn:hover{opacity:.88}.push-active-note{margin-top:8px;font-size:13px;color:#52c41a;text-align:center}[data-theme=dark] .push-active-note{color:#73d13d}.push-ios-guide{margin-top:12px;padding:14px;background:#667eea0f;border:1px solid rgba(102,126,234,.15);border-radius:12px}.push-ios-guide-title{font-size:13px;font-weight:600;color:#555;margin:0 0 10px}.push-ios-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.push-ios-steps li{display:flex;align-items:flex-start;gap:8px;font-size:13px;color:#444;line-height:1.4}.step-icon{flex-shrink:0;font-size:16px;line-height:1.2}[data-theme=dark] .push-ios-guide{background:#667eea14;border-color:#667eea2e}[data-theme=dark] .push-ios-guide-title{color:#aaa}[data-theme=dark] .push-ios-steps li{color:#888}.reminder-block{margin-top:16px;background:linear-gradient(135deg,#667eea0f,#764ba20f);border:1px solid rgba(102,126,234,.18);border-radius:14px;padding:14px 16px}.reminder-block-header{display:flex;align-items:flex-start;gap:10px;margin-bottom:12px}.reminder-bell{font-size:20px;line-height:1;margin-top:1px}.reminder-block-info{display:flex;flex-direction:column;gap:2px}.reminder-block-title{font-size:14px;font-weight:600;color:#333}.reminder-block-desc{font-size:12px;color:#999;line-height:1.4}.reminder-block-body{display:flex;align-items:center;gap:8px}.reminder-time-input{flex:1;padding:9px 12px;border:1.5px solid rgba(102,126,234,.3);border-radius:10px;font-size:15px;font-weight:600;background:#fff;color:#1a1a2e;outline:none;min-width:0}.reminder-time-input:focus{border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.reminder-time-input:disabled{background:#f5f5f8;color:#bbb;border-color:#00000014}.reminder-save-btn{padding:9px 16px;border:none;border-radius:10px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap;transition:opacity .15s}.reminder-save-btn:disabled{opacity:.45;cursor:default}.reminder-clear-btn{padding:9px 12px;border:1.5px solid rgba(0,0,0,.1);border-radius:10px;background:transparent;color:#aaa;font-size:13px;cursor:pointer;transition:border-color .15s,color .15s}.reminder-clear-btn:hover{border-color:#ff6b6b;color:#ff6b6b}.reminder-locked{font-size:13px;color:#bbb;white-space:nowrap}.reminder-limit-note{font-size:11px;color:#c0c0d0;margin:8px 0 0}[data-theme=dark] .reminder-block{background:#667eea12;border-color:#667eea26}[data-theme=dark] .reminder-block-title{color:#e8e8f8}[data-theme=dark] .reminder-block-desc{color:#6666a0}[data-theme=dark] .reminder-time-input{background:#ffffff12;border-color:#667eea40;color:#e8e8f8}[data-theme=dark] .reminder-time-input:disabled{background:#ffffff08;color:#44447a;border-color:#ffffff0d}[data-theme=dark] .reminder-clear-btn{border-color:#ffffff1a;color:#6666a0}[data-theme=dark] .reminder-locked,[data-theme=dark] .reminder-limit-note{color:#44447a}.logout-section{text-align:center}.logout-btn{width:100%;padding:16px;background:linear-gradient(135deg,#ff6b6b,#ee5a52);color:#fff;border:none;border-radius:12px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s;box-shadow:0 4px 15px #ff6b6b4d;margin-bottom:15px}.logout-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #ff6b6b66}.logout-btn:active:not(:disabled){transform:translateY(0)}.logout-btn:disabled{opacity:.7;cursor:not-allowed}.logout-note{font-size:13px;color:#6c757d;text-align:center;line-height:1.5}.app-info-section{background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;padding:20px;text-align:center}.app-info{color:#fff;font-size:14px;margin-bottom:8px;line-height:1.4}.version{color:#ffffffb3;font-size:12px;margin:0}.bottom-nav{position:fixed;bottom:0;left:0;right:0;background:#ffffffeb;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);display:flex;justify-content:space-around;align-items:center;padding:10px 8px;padding-bottom:calc(10px + env(safe-area-inset-bottom));border-top:1px solid rgba(0,0,0,.06);box-shadow:0 -4px 24px #0000000f;z-index:1000}.nav-item{display:flex;flex-direction:column;align-items:center;gap:4px;background:none;border:none;padding:8px 20px;border-radius:14px;cursor:pointer;transition:color .2s,background .2s,transform .15s;color:#aaa;min-width:70px}.nav-item:active{transform:scale(.93)}.nav-item.active{color:#667eea;background:#667eea1a}.nav-label{font-size:10px;font-weight:500;letter-spacing:.2px}@media(max-width:600px){.profile-page{padding:0 0 80px}.profile-main{padding:20px 16px}.profile-info-card{padding:20px}.avatar-large{width:70px;height:70px;font-size:28px}.user-username{font-size:1.3rem}.header-content h1{font-size:20px}.edit-username-btn{padding:.4rem .8rem;font-size:.85rem}.username-input{padding:.6rem}.save-username-btn,.cancel-username-btn{padding:.6rem 1rem}}@media(max-width:400px){.profile-info-card{padding:16px}.avatar-large{width:60px;height:60px;font-size:24px}.user-username{font-size:1.2rem}.logout-btn{padding:14px;font-size:15px}.edit-username-btn{padding:.35rem .7rem;font-size:.8rem}.username-edit-actions{flex-direction:column;gap:.4rem}.save-username-btn,.cancel-username-btn{padding:.5rem;font-size:.85rem}}.pull-indicator{position:fixed;top:0;left:0;right:0;z-index:9999;display:flex;align-items:flex-end;justify-content:center;padding-bottom:8px;background:linear-gradient(135deg,#667eea,#764ba2);overflow:hidden;transition:height .15s;box-shadow:0 2px 8px #667eea4d}.pull-spinner{width:22px;height:22px;border:2.5px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%}.pull-spinner.spinning{animation:pull-spin .7s linear infinite}@keyframes pull-spin{to{transform:rotate(360deg)}}.whats-new-btn{display:block;margin:0 auto 14px;background:linear-gradient(135deg,#667eea1f,#764ba21f);border:1px solid rgba(102,126,234,.3);color:#667eea;font-size:14px;font-weight:600;font-family:inherit;padding:10px 20px;border-radius:20px;cursor:pointer;transition:background .2s,transform .15s}.whats-new-btn:hover{background:linear-gradient(135deg,#667eea33,#764ba233);transform:translateY(-1px)}[data-theme=dark] .whats-new-btn{background:#667eea26;border-color:#667eea66;color:#a0b0ff}.whats-new-overlay{position:fixed;inset:0;background:#00000073;z-index:1000;display:flex;align-items:flex-end;animation:fadeInOverlay .2s ease}@keyframes fadeInOverlay{0%{opacity:0}to{opacity:1}}.whats-new-sheet{width:100%;max-height:80vh;background:var(--card-bg, #fff);border-radius:24px 24px 0 0;display:flex;flex-direction:column;animation:slideUpSheet .3s cubic-bezier(.16,1,.3,1);box-shadow:0 -8px 32px #00000026}@keyframes slideUpSheet{0%{transform:translateY(100%)}to{transform:translateY(0)}}[data-theme=dark] .whats-new-sheet{background:#1e1e2e}.whats-new-handle{width:40px;height:4px;background:#00000026;border-radius:2px;margin:12px auto 0;flex-shrink:0}[data-theme=dark] .whats-new-handle{background:#fff3}.whats-new-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px 12px;flex-shrink:0;border-bottom:1px solid rgba(0,0,0,.07)}[data-theme=dark] .whats-new-header{border-color:#ffffff12}.whats-new-title{font-size:17px;font-weight:700;color:var(--text-primary, #111)}[data-theme=dark] .whats-new-title{color:#e8e8ff}.whats-new-close{background:#0000000f;border:none;border-radius:50%;width:30px;height:30px;font-size:13px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#666;flex-shrink:0}[data-theme=dark] .whats-new-close{background:#ffffff1a;color:#aaa}.whats-new-body{overflow-y:auto;padding:16px 20px 32px;display:flex;flex-direction:column;gap:24px}.wn-release{display:flex;flex-direction:column;gap:12px}.wn-date{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:#667eea;padding-bottom:6px;border-bottom:1px solid rgba(102,126,234,.2)}.wn-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}.wn-list li{display:flex;align-items:flex-start;gap:10px;font-size:14px;line-height:1.5;color:var(--text-primary, #333)}[data-theme=dark] .wn-list li{color:#c8c8e8}.wn-icon{font-size:18px;flex-shrink:0;margin-top:-1px}.invite-page{min-height:100vh;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center;padding:24px 16px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.invite-card{background:#fff;border-radius:24px;padding:32px 24px;width:100%;max-width:420px;box-shadow:0 24px 64px #00000038;display:flex;flex-direction:column;gap:20px}.invite-card-success{align-items:center;text-align:center}.invite-logo{display:flex;align-items:center;gap:10px;justify-content:center}.invite-logo-icon{width:40px;height:40px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:14px}.invite-logo-text{font-size:20px;font-weight:800;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.invite-info-card{background:linear-gradient(135deg,#f3f0ff,#ede9ff);border-radius:16px;padding:18px;display:flex;gap:14px;align-items:flex-start}.invite-trophy-icon{width:52px;height:52px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.invite-info-text{flex:1;min-width:0}.invite-from{font-size:13px;color:#555;margin:0 0 6px}.invite-habit{font-size:17px;font-weight:700;margin:0 0 10px;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;word-break:break-word}.invite-meta{display:flex;gap:6px;flex-wrap:wrap}.invite-meta-item{font-size:12px;background:#fff;color:#667eea;border-radius:20px;padding:3px 10px;font-weight:600;border:1px solid rgba(102,126,234,.25)}.invite-stake{color:#764ba2}.invite-auth-prompt{font-size:14px;color:#666;text-align:center;margin:0;line-height:1.5}.invite-error-msg{background:#fef2f2;color:#ef4444;border-radius:10px;padding:10px 14px;font-size:13px;text-align:center}.invite-auth-form{display:flex;flex-direction:column;gap:12px}.invite-input{width:100%;padding:14px 16px;border:2px solid #e5e7eb;border-radius:12px;font-size:15px;outline:none;transition:border-color .2s;box-sizing:border-box;font-family:inherit;color:#1a1a2e}.invite-input:focus{border-color:#667eea}.invite-action-btn{width:100%;padding:15px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:14px;font-size:15px;font-weight:700;cursor:pointer;font-family:inherit;transition:opacity .2s,transform .1s}.invite-action-btn:hover:not(:disabled){opacity:.9;transform:translateY(-1px)}.invite-action-btn:disabled{opacity:.45;cursor:not-allowed}.invite-skip-btn{background:none;border:none;color:#aaa;font-size:14px;cursor:pointer;padding:6px;font-family:inherit;text-align:center;transition:color .15s}.invite-skip-btn:hover{color:#555}.invite-auth-toggle{display:flex;align-items:center;justify-content:center;gap:8px;font-size:13px;color:#888}.invite-auth-toggle button{background:none;border:none;color:#667eea;font-weight:600;cursor:pointer;font-size:13px;font-family:inherit;padding:0}.invite-auth-toggle button:hover{text-decoration:underline}.invite-otp-row{display:flex;gap:8px;justify-content:center}.invite-otp-input{width:44px;height:52px;text-align:center;font-size:22px;font-weight:700;border:2px solid #e5e7eb;border-radius:10px;outline:none;transition:border-color .2s,background .2s;font-family:inherit;color:#1a1a2e}.invite-otp-input:focus{border-color:#667eea;background:#f8f7ff}.invite-otp-input.filled{border-color:#667eea}.invite-loading{display:flex;flex-direction:column;align-items:center;gap:16px;color:#fff;font-size:16px}.invite-spinner{width:40px;height:40px;border:3px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:invite-spin .8s linear infinite}@keyframes invite-spin{to{transform:rotate(360deg)}}.invite-error-block{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}.invite-error-block h2{font-size:20px;font-weight:700;color:#2d3436;margin:0}.invite-error-block p{font-size:14px;color:#888;margin:0}.invite-success-icon{font-size:56px;text-align:center}.invite-card-success h2{font-size:22px;font-weight:800;color:#2d3436;margin:0}.invite-card-success p{font-size:14px;color:#888;margin:0}.stats-page{height:100dvh;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;flex-direction:column;padding-top:env(safe-area-inset-top);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.stats-main{flex:1;background:#fff;border-radius:20px 20px 0 0;padding:14px;padding-bottom:calc(72px + env(safe-area-inset-bottom));overflow-y:auto;overflow-x:hidden;box-shadow:0 -4px 24px #0000001a;display:flex;flex-direction:column;gap:0}.stats-title-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.stats-page-title{font-size:17px;font-weight:700;color:#1a1a2e;margin:0}.user-avatar-stats{width:34px;height:34px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;color:#fff;font-size:15px;cursor:pointer;flex-shrink:0}.stats-loading{display:flex;flex-direction:column;align-items:center;gap:12px;padding:40px 0;color:#888}.stats-error{text-align:center;color:#888;padding:40px 0}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-bottom:12px}.stat-card{background:#f7f7fc;border-radius:10px;padding:9px 6px;text-align:center;border:1px solid rgba(0,0,0,.05);display:flex;flex-direction:column;align-items:center;gap:3px}.stat-card.accent{background:linear-gradient(135deg,#667eea15,#764ba215);border-color:#667eea33}.stat-card-icon{font-size:16px;line-height:1}.stat-card-value{font-size:18px;font-weight:800;color:#1a1a2e;line-height:1}.stat-card.accent .stat-card-value{color:#667eea}.stat-card-label{font-size:9px;color:#999;font-weight:500;text-align:center;line-height:1.2}.stats-chart-section{margin-top:6px;border-top:1px solid rgba(0,0,0,.06);padding-top:10px}.stats-section-title{font-size:10px;font-weight:700;color:#999;margin:0 0 8px;text-transform:uppercase;letter-spacing:.6px}.bar-chart{display:flex;align-items:flex-end;gap:5px;height:64px}.bar-col{display:flex;flex-direction:column;align-items:center;flex:1;min-width:0;height:100%}.bar-value{font-size:9px;color:#aaa;font-weight:600;margin-bottom:3px;line-height:1}.bar-track{flex:1;width:100%;display:flex;align-items:flex-end;background:#667eea14;border-radius:4px;overflow:hidden}.bar-fill{width:100%;background:linear-gradient(180deg,#667eea,#764ba2);border-radius:3px 3px 0 0;min-height:4px}.bar-label{font-size:9px;color:#aaa;margin-top:4px;text-align:center}.loading-spinner{width:28px;height:28px;border:3px solid rgba(102,126,234,.2);border-top-color:#667eea;border-radius:50%;animation:spin .8s linear infinite}[data-theme=dark] .stats-main{background:#141426fa}[data-theme=dark] .stats-page-title{color:#e8e8f8}[data-theme=dark] .stats-section-title{color:#9090b8}[data-theme=dark] .user-avatar-stats{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}[data-theme=dark] .stat-card{background:#ffffff0d;border-color:#ffffff0f}[data-theme=dark] .stat-card.accent{background:#667eea1a;border-color:#667eea33}[data-theme=dark] .stat-card-value{color:#e8e8f8}[data-theme=dark] .stat-card.accent .stat-card-value{color:#a0b4ff}[data-theme=dark] .stat-card-label,[data-theme=dark] .bar-label,[data-theme=dark] .bar-value{color:#6666a0}[data-theme=dark] .bar-track{background:#a0b4ff12}[data-theme=dark] .stats-chart-section{border-top-color:#ffffff0f}.heatmap-preview-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.heatmap-open-btn{background:none;border:none;padding:0;font-size:11px;font-weight:600;color:#667eea;cursor:pointer}.heatmap-preview-tap{position:relative;overflow:hidden;cursor:pointer;border-radius:6px}.heatmap-preview-fade{position:absolute;right:0;top:0;bottom:0;width:48px;background:linear-gradient(to right,transparent,white);pointer-events:none}.heatmap-backdrop{position:fixed;inset:0;background:#00000073;z-index:200;display:flex;align-items:flex-end}.heatmap-sheet{background:#fff;border-radius:20px 20px 0 0;padding:20px 16px;padding-bottom:calc(24px + env(safe-area-inset-bottom));width:100%;animation:slideUp .25s ease}.heatmap-sheet-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.heatmap-sheet-title{font-size:15px;font-weight:700;color:#1a1a2e}.heatmap-sheet-close{background:#f0f0f7;border:none;border-radius:50%;width:28px;height:28px;font-size:13px;color:#666;cursor:pointer;display:flex;align-items:center;justify-content:center}.heatmap-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:4px;width:100%}.heatmap-wrap{display:flex;flex-direction:column;gap:3px;width:max-content}.heatmap-month-row{display:flex;gap:2px;height:12px}.heatmap-month-col{width:11px;flex-shrink:0;position:relative}.heatmap-month-label{font-size:8px;color:#aaa;white-space:nowrap;position:absolute;left:0;top:0}.heatmap-grid{display:flex;gap:2px}.heatmap-col{display:flex;flex-direction:column;gap:2px}.heatmap-cell{width:11px;height:11px;border-radius:2px;flex-shrink:0}.hm-future{background:transparent}.hm-0{background:#e8e8f0}.hm-1{background:#b8c4f8}.hm-2{background:#8196f0}.hm-3{background:#667eea}.heatmap-legend{display:flex;align-items:center;gap:3px;justify-content:flex-end;padding-top:3px}.heatmap-legend-label{font-size:8px;color:#bbb}[data-theme=dark] .heatmap-preview-fade{background:linear-gradient(to right,transparent,rgba(20,20,38,.98))}[data-theme=dark] .heatmap-sheet{background:#1a1a2e}[data-theme=dark] .heatmap-sheet-title{color:#e8e8f8}[data-theme=dark] .heatmap-sheet-close{background:#ffffff14;color:#aaa}[data-theme=dark] .heatmap-month-label,[data-theme=dark] .heatmap-legend-label{color:#555}[data-theme=dark] .hm-0{background:#ffffff12}[data-theme=dark] .hm-1{background:#818cf859}[data-theme=dark] .hm-2{background:#818cf8a6}[data-theme=dark] .hm-3{background:#818cf8}.onboarding-overlay{position:fixed;inset:0;background:#0000008c;display:flex;align-items:flex-end;justify-content:center;z-index:3000;padding:0 0 env(safe-area-inset-bottom)}.onboarding-card{background:#fff;border-radius:28px 28px 0 0;padding:32px 28px 36px;width:100%;max-width:480px;text-align:center;position:relative;animation:slideUp .35s cubic-bezier(.34,1.56,.64,1)}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.onboarding-skip{position:absolute;top:20px;right:20px;background:none;border:none;font-size:14px;color:#aaa;cursor:pointer;padding:4px 8px}.onboarding-icon{width:104px;height:104px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 24px;box-shadow:0 12px 32px #667eea66}.onboarding-title{font-size:22px;font-weight:700;color:#1a1a2e;margin:0 0 12px}.onboarding-text{font-size:15px;color:#888;line-height:1.6;margin:0 0 28px}.onboarding-dots{display:flex;justify-content:center;gap:6px;margin-bottom:28px}.onboarding-dot{width:8px;height:8px;border-radius:50%;background:#e0e0e0;transition:background .2s,transform .2s}.onboarding-dot.active{background:#667eea;transform:scale(1.25)}.onboarding-next{width:100%;padding:16px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:16px;font-size:16px;font-weight:600;cursor:pointer;letter-spacing:.3px}.mno-overlay{position:fixed;inset:0;z-index:9000;display:flex;align-items:center;justify-content:center;padding:24px;background:#0000;backdrop-filter:blur(0px);-webkit-backdrop-filter:blur(0px);transition:background .35s ease,backdrop-filter .35s ease,-webkit-backdrop-filter .35s ease}.mno-overlay.visible{background:#000000a6;backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}.mno-card{background:#fff;border-radius:28px;padding:36px 28px 28px;width:100%;max-width:340px;text-align:center;transform:translateY(80px) scale(.9);opacity:0;transition:transform .45s cubic-bezier(.34,1.56,.64,1),opacity .3s ease;box-shadow:0 24px 64px #00000059}.mno-card.visible{transform:translateY(0) scale(1);opacity:1}[data-theme=dark] .mno-card{background:#1e1e2e;box-shadow:0 24px 64px #000000a6}.mno-icon{font-size:72px;display:block;margin-bottom:12px;animation:mno-shake .7s ease .5s both}@keyframes mno-shake{0%,to{transform:rotate(0)}15%{transform:rotate(-14deg)}35%{transform:rotate(14deg)}55%{transform:rotate(-10deg)}75%{transform:rotate(10deg)}}.mno-big-emoji{font-size:88px;display:block;margin-bottom:12px;animation:mno-pop .55s cubic-bezier(.34,1.56,.64,1) .25s both}@keyframes mno-pop{0%{transform:scale(0) rotate(-25deg)}70%{transform:scale(1.2) rotate(8deg)}to{transform:scale(1) rotate(0)}}.mno-title{font-size:22px;font-weight:800;color:#1a1a2e;margin:0 0 8px}[data-theme=dark] .mno-title{color:#f0f0f8}.mno-sub{font-size:15px;color:#636e72;margin:0 0 20px;line-height:1.5}[data-theme=dark] .mno-sub{color:#9090b0}.mno-name{font-weight:700;color:#667eea}.mno-habit{font-size:13px;color:#b0b0c0;margin:-12px 0 20px}.mno-hint{font-size:14px;color:#b0b0c0;margin:0 0 14px}.mno-emoji-row{display:flex;gap:10px;justify-content:center;margin-bottom:18px}.mno-emoji-btn{font-size:30px;background:#667eea12;border:2px solid transparent;border-radius:14px;width:58px;height:58px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .18s,border-color .18s,transform .18s;flex-shrink:0}.mno-emoji-btn:hover:not(:disabled){background:#667eea26;border-color:#667eea;transform:scale(1.15)}.mno-emoji-btn:active:not(:disabled){transform:scale(.95)}.mno-emoji-btn:disabled{opacity:.45;cursor:not-allowed}[data-theme=dark] .mno-emoji-btn{background:#667eea1a}[data-theme=dark] .mno-emoji-btn:hover:not(:disabled){background:#667eea38}.mno-skip{background:none;border:none;color:#b0b0c0;font-size:14px;cursor:pointer;padding:6px 12px;border-radius:8px;font-family:inherit;transition:color .18s}.mno-skip:hover{color:#667eea}.mno-close-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:14px;padding:14px 36px;font-size:16px;font-weight:700;cursor:pointer;font-family:inherit;transition:transform .18s ease,box-shadow .18s ease;box-shadow:0 4px 16px #667eea59}.mno-close-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #667eea73}.mno-close-btn:active{transform:translateY(0)}:root{--primary: #667eea;--primary-dark: #764ba2;--primary-light: #ede9fe;--error: #ef4444;--gray: #9ca3af;--light-gray: #e5e7eb;--darker: #111827;--dark: #374151;--dark-gray: #6b7280;--light: #f9fafb;--white: #ffffff;--radius: 14px;--radius-lg: 24px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;color:var(--dark)}#root{width:100%;max-width:420px}.app{width:100%;position:relative}.app:before,.app:after{content:"";position:fixed;border-radius:50%;pointer-events:none;z-index:0}.app:before{width:320px;height:320px;top:-80px;right:-80px;background:#ffffff12}.app:after{width:240px;height:240px;bottom:-60px;left:-60px;background:#ffffff0d}.auth-container{background:var(--white);border-radius:var(--radius-lg);box-shadow:0 24px 64px #0000002e;padding:36px 36px 32px;width:100%;position:relative;z-index:1;animation:slideUp .35s cubic-bezier(.16,1,.3,1) both}.auth-container.fade-in{animation:slideUp .35s cubic-bezier(.16,1,.3,1) both}.auth-container.fade-out{animation:fadeOut .25s ease both}@keyframes slideUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.auth-logo{display:flex;flex-direction:column;align-items:center;gap:8px;margin-bottom:28px}.auth-logo-img{width:64px;height:64px;border-radius:16px;box-shadow:0 8px 24px #667eea59}.auth-logo-text{font-size:22px;font-weight:800;background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.4px}.auth-tabs{display:flex;background:var(--light);border-radius:12px;padding:4px;margin-bottom:24px;gap:4px}.auth-tab{flex:1;padding:10px;border:none;border-radius:9px;font-size:14px;font-weight:600;font-family:inherit;cursor:pointer;transition:all .2s ease;background:transparent;color:var(--dark-gray)}.auth-tab.active{background:var(--white);color:var(--primary);box-shadow:0 1px 6px #0000001a}.auth-tab:disabled{cursor:not-allowed;opacity:.6}.auth-subtitle{font-size:14px;color:var(--dark-gray);text-align:center;margin-bottom:20px;line-height:1.5}.auth-form{display:flex;flex-direction:column;gap:16px}.form-group{display:flex;flex-direction:column;gap:6px}.form-label{font-size:13px;font-weight:500;color:var(--dark)}.form-input{padding:13px 16px;border:1.5px solid var(--light-gray);border-radius:var(--radius);font-size:15px;font-family:inherit;background:var(--white);transition:border-color .2s,box-shadow .2s;color:var(--darker);width:100%}.form-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #667eea26}.form-input::placeholder{color:var(--gray)}.form-input.error{border-color:var(--error)}.error-message{font-size:13px;color:var(--error);padding:8px 12px;background:#fef2f2;border-radius:8px;border-left:3px solid var(--error)}.auth-button{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);color:#fff;border:none;padding:15px;border-radius:var(--radius);font-size:15px;font-weight:600;font-family:inherit;cursor:pointer;transition:transform .2s,box-shadow .2s;width:100%;display:flex;align-items:center;justify-content:center;gap:8px}.auth-button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 8px 24px #667eea66}.auth-button:active:not(:disabled){transform:translateY(0)}.auth-button:disabled{opacity:.55;cursor:not-allowed;transform:none!important;box-shadow:none!important}@keyframes spin{to{transform:rotate(360deg)}}.loading-spinner{width:22px;height:22px;border:2.5px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite;margin:0 auto}.loading-spinner-small{width:16px;height:16px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite;flex-shrink:0}.otp-header{text-align:center;margin-bottom:24px}.otp-title{font-size:22px;font-weight:700;color:var(--darker);margin-bottom:8px}.otp-desc{font-size:14px;color:var(--dark-gray);line-height:1.5}.otp-desc strong{color:var(--primary);font-weight:600}.otp-container{display:flex;gap:10px;justify-content:center;margin:8px 0}.otp-input{flex:1;min-width:0;max-width:52px;height:60px;border:2px solid var(--light-gray);border-radius:12px;text-align:center;font-size:22px;font-weight:700;color:var(--darker);font-family:Inter,monospace;transition:border-color .15s,box-shadow .15s,transform .15s;background:var(--white)}.otp-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #667eea26;transform:translateY(-2px)}.otp-input.filled{border-color:var(--primary);background:var(--primary-light);color:var(--primary-dark)}.otp-input.error{border-color:var(--error);animation:shake .4s ease}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}75%{transform:translate(6px)}}.resend-section{text-align:center;margin-top:16px}.resend-timer{font-size:13px;color:var(--gray)}.resend-btn{background:none;border:none;color:var(--primary);font-size:13px;font-weight:600;font-family:inherit;cursor:pointer;padding:4px 8px;border-radius:6px;transition:background .2s}.resend-btn:hover{background:var(--primary-light)}.back-container{text-align:center;margin-top:20px}.back-button{background:none;border:none;color:var(--dark-gray);font-size:13px;font-family:inherit;cursor:pointer;padding:6px 10px;border-radius:8px;transition:color .2s,background .2s}.back-button:hover{color:var(--dark);background:var(--light)}@media(max-width:480px){.auth-container{padding:28px 16px 24px}.auth-logo-img{width:56px;height:56px}.otp-input{max-width:46px;height:54px;font-size:20px}.otp-container{gap:8px}}@media(max-width:380px){body{padding:12px}.auth-container{padding:24px 14px 20px}.otp-input{max-width:42px;height:50px;font-size:18px}.otp-container{gap:6px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}input[type=password]{display:none!important;height:0!important;padding:0!important;margin:0!important;border:none!important;width:0!important;opacity:0!important}.form-group:has(input[type=password]){display:none!important}