:root{--bg-darkest: #f8f9fa;--bg-dark: #ffffff;--bg-darker: #f1f3f5;--bg-dark-card: #ffffff;--neon-accent: #7c3aed;--neon-accent-dim: #6d28d9;--neon-accent-bright: #8b5cf6;--accent-secondary: #ec4899;--accent-tertiary: #06b6d4;--text-white: #1f2937;--text-light: #374151;--text-gray: #6b7280;--text-dim: #9ca3af;--primary: #7c3aed;--primary-light: #8b5cf6;--primary-dark: #6d28d9;--secondary: #ec4899;--accent: #7c3aed;--success: #10b981;--warning: #f59e0b;--danger: #ef4444;--danger-dark: #dc2626;--bg-light: #f8f9fa;--bg-white: #ffffff;--surface: #ffffff;--text-primary: #1f2937;--text-secondary: #4b5563;--text-disabled: #9ca3af;--divider: rgba(0, 0, 0, .08);--elevation-1: none;--elevation-2: none;--elevation-4: none;--elevation-8: none;--transition: all .3s cubic-bezier(.4, 0, .2, 1);--transition-fast: all .15s cubic-bezier(.4, 0, .2, 1);--timer-font-size-desktop: 72px;--timer-font-size-mobile: 48px;--timer-min-height: 40vh;--border-radius-button: 12px;--animation-duration: .15s;--animation-easing: cubic-bezier(.4, 0, .2, 1);--system-font: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", Arial, sans-serif;--touch-target-min: 44px;--mobile-spacing-xs: 4px;--mobile-spacing-sm: 8px;--mobile-spacing-md: 12px;--mobile-spacing-lg: 16px;--mobile-header-height: 56px;--mobile-bottom-nav-height: 64px;--mobile-card-padding: 12px;--mobile-font-size-sm: .85rem;--mobile-font-size-base: .95rem;--mobile-border-radius: 24px}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--system-font);background:linear-gradient(135deg,#faf5ff,#f0f9ff,#fdf4ff);color:var(--text-primary);min-height:100vh;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scrollbar-gutter:stable}.App{min-height:100vh;background:transparent}.header{background:linear-gradient(135deg,#7c3aed,#8b5cf6,#a855f7);color:#fff;padding:6px 12px;display:flex;justify-content:space-between;align-items:center;border-bottom:none;position:sticky;top:0;z-index:1000;box-shadow:0 2px 10px #7c3aed26;gap:8px;min-height:44px}.app-title{display:flex;align-items:center;gap:8px;font-size:1.2rem;font-weight:500;color:#fff;letter-spacing:.5px;flex-shrink:1;min-width:0}.app-title-short{display:none}.rocket-icon{font-size:2rem}.user-profile{display:flex;align-items:center;gap:16px;cursor:pointer;padding:8px 16px;border-radius:24px;transition:var(--transition)}.user-profile:hover{background:#ffffff1a;transform:translateY(-2px)}.user-profile:active{transform:translateY(0)}.avatar{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,#ec4899,#f472b6);display:flex;align-items:center;justify-content:center;font-weight:600;font-size:1.2rem;color:#fff;border:3px solid white;transition:var(--transition);box-shadow:0 4px 12px #ec48994d}.user-profile:hover .avatar{transform:scale(1.05);box-shadow:0 6px 16px #ec489966}.user-info{display:flex;flex-direction:column;gap:6px}.username{font-weight:500;font-size:.95rem;color:#fff}.xp-bar{width:100px;height:4px;background:#ffffff4d;border-radius:0;overflow:hidden}.xp-fill{height:100%;background:var(--neon-accent);transition:width .5s cubic-bezier(.4,0,.2,1)}.level-badge{background:#fff3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:6px 14px;border-radius:24px;font-weight:600;font-size:.9rem;color:#fff;border:2px solid rgba(255,255,255,.3);transition:var(--transition)}.user-profile:hover .level-badge{background:#ffffff4d;border-color:#ffffff80}.nav-tabs{display:flex;background:var(--surface);padding:4px 8px;gap:2px;overflow-x:auto;border-bottom:1px solid var(--divider)}@media (max-width: 768px){.nav-tabs{display:none!important}}.nav-tab{padding:10px 20px;border-radius:20px;cursor:pointer;transition:var(--transition-fast);white-space:nowrap;display:flex;align-items:center;gap:8px;color:var(--text-secondary);font-weight:500;border:none;background:transparent;font-size:inherit;font-family:inherit}.nav-tab:hover{background:#1976d214;color:var(--primary)}.nav-tab.active{background:linear-gradient(135deg,#7c3aed,#8b5cf6);color:#fff;border:none;box-shadow:0 4px 15px #7c3aed4d}.nav-tab.active:hover{box-shadow:0 6px 20px #7c3aed66}.tab-icon{font-size:1.1rem}.container{max-width:1200px;margin:8px auto;padding:0 12px;overflow:visible}@media (max-width: 768px){.container{margin:0 auto;padding:0 8px}}.card{background:var(--surface);border-radius:24px;padding:20px;border:none;margin-bottom:16px;overflow:visible;position:relative;box-shadow:0 4px 20px #0000000d}.card:hover{box-shadow:0 8px 30px #7c3aed1a}.timer-card{position:relative;text-align:center;background:var(--surface);overflow:visible}.motivation-message{margin-bottom:16px;padding:12px 16px;background:var(--bg-dark-card);border-radius:24px;border:1px solid var(--divider)}.motivation-message h3{color:var(--primary);margin-bottom:8px;font-weight:500;font-size:1.1rem}.timer-settings{display:flex;justify-content:center;gap:20px;margin-bottom:20px;flex-wrap:wrap}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-size:.9rem;font-weight:600}.form-group select,.form-group input,.form-group textarea{padding:14px 16px;border-radius:8px;border:2px solid var(--divider);background:var(--surface);color:var(--text-primary);font-family:inherit;font-size:1rem;transition:var(--transition);box-shadow:inset 0 2px 4px #0000000d}.form-group select:focus,.form-group input:focus,.form-group textarea:focus{outline:none;border-color:var(--neon-accent)}.form-group textarea{resize:vertical;min-height:100px;line-height:1.6}.timer-display{font-size:var(--timer-font-size-desktop);font-weight:300;margin:32px 0;color:var(--primary);font-family:var(--system-font);letter-spacing:-.02em;min-height:var(--timer-min-height);display:flex;align-items:center;justify-content:center}.study-mode .timer-display,.break-mode .timer-display{color:var(--neon-accent)}.progress-bar{width:100%;height:8px;background:var(--divider);border-radius:24px;overflow:hidden;margin-bottom:32px}.progress-fill{height:100%;background:var(--neon-accent);transition:width .5s ease}.timer-mode-switcher{display:flex;justify-content:center;gap:15px;margin-bottom:25px}.btn{padding:14px 28px;border:1px solid var(--divider);border-radius:24px;cursor:pointer;font-weight:500;font-family:var(--system-font);transition:all var(--animation-duration) var(--animation-easing);font-size:1rem;min-width:48px;min-height:48px}.btn:disabled{opacity:.3;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg,#7c3aed,#8b5cf6);color:#fff;border:none;font-weight:600;transform:translateY(0);box-shadow:0 4px 15px #7c3aed4d}.btn-primary:hover:not(:disabled){background:linear-gradient(135deg,#6d28d9,#7c3aed);transform:translateY(-2px);box-shadow:0 6px 20px #7c3aed66}.btn-primary:active:not(:disabled){background:linear-gradient(135deg,#5b21b6,#6d28d9);transform:translateY(0) scale(.98);transition:all 50ms ease}.btn-secondary{background:var(--surface);color:var(--text-primary);border:1px solid var(--divider)}.btn-secondary:hover:not(:disabled){background:var(--bg-light);border-color:var(--primary);transform:translateY(-1px)}.btn-secondary:active:not(:disabled){transform:translateY(0)}.btn-tertiary{background:var(--danger);color:#fff}.btn-tertiary:hover:not(:disabled){background:#d32f2f;transform:translateY(-1px)}.btn-tertiary:active:not(:disabled){transform:translateY(0)}.btn-mode{background:var(--surface);color:var(--text-secondary);border:2px solid var(--divider);box-shadow:none}.btn-mode:hover:not(:disabled){border-color:var(--primary);color:var(--primary)}.btn-mode.active{background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:var(--elevation-2)}.btn-mode.active:hover{background:var(--primary-dark)}.subject-buttons{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:24px 0 32px}.subject-btn{padding:12px 20px;border:2px solid var(--divider);background:var(--surface);color:var(--text-secondary);border-radius:24px;cursor:pointer;transition:var(--transition-fast);font-weight:500;min-height:44px}.subject-btn:hover:not(:disabled){border-color:var(--primary);color:var(--primary);transform:translateY(-2px)}.subject-btn.active{background:linear-gradient(135deg,#7c3aed,#8b5cf6);border-color:transparent;color:#fff;box-shadow:0 4px 15px #7c3aed4d}.subject-btn.active:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #7c3aed66}.subject-btn:active:not(:disabled){transform:scale(.95);transition:all 50ms ease}.subject-btn:disabled{opacity:.4;cursor:not-allowed;background:var(--bg-light);color:var(--text-disabled);border-color:var(--divider)}.timer-controls{display:flex;justify-content:center;gap:15px;flex-wrap:wrap;max-width:100%;overflow:visible}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-top:16px}.stat-item{text-align:center;padding:16px;background:var(--surface);border-radius:24px;box-shadow:0 4px 15px #0000000d}.stat-item:hover{box-shadow:0 8px 25px #7c3aed26}.stat-number{font-size:2.5rem;font-weight:700;color:var(--primary);display:block;margin-bottom:4px;letter-spacing:-.03em}.stat-label{font-size:.95rem;color:var(--text-secondary);font-weight:500}.badges-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:20px;margin-top:24px}.badge{padding:24px;border-radius:16px;text-align:center;transition:var(--transition);cursor:pointer;position:relative;overflow:hidden}.badge.earned{background:linear-gradient(135deg,#7c3aed,#8b5cf6);border:none;color:#fff;box-shadow:0 4px 15px #7c3aed4d}.badge.unearned{background:#f3f4f6;border:2px dashed #d1d5db;opacity:.6;color:#9ca3af}.badge:hover{transform:translateY(-4px)}.badge.earned:hover{box-shadow:0 8px 25px #7c3aed66}.badge-icon{font-size:2.5rem;display:block;margin-bottom:12px;transition:var(--transition)}.badge:hover .badge-icon{transform:scale(1.05)}.badge-name{font-size:.95rem;font-weight:500}.note-form{margin-top:20px}.note-form .form-group{margin-bottom:20px}.note-form .btn{width:100%}.qa-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.question-list{display:flex;flex-direction:column;gap:15px}.question-item{padding:24px;background:var(--surface);border-radius:24px;cursor:pointer;transition:var(--transition);border:1px solid var(--divider);border-left:4px solid transparent}.question-item:hover{background:var(--bg-dark-card);border-left-color:var(--neon-accent);border-color:var(--neon-accent)}.subject-tag{display:inline-block;padding:6px 16px;background:var(--neon-accent);color:var(--bg-darkest);border-radius:24px;font-size:.85rem;font-weight:600;margin-bottom:12px;border:1px solid var(--neon-accent)}.question-item h3{margin:12px 0;font-size:1.15rem;font-weight:500;color:var(--text-primary)}.question-meta{display:flex;gap:24px;font-size:.9rem;color:var(--text-secondary);margin-top:12px}@media (max-width: 768px){:root{--timer-font-size-desktop: var(--timer-font-size-mobile)}.header{padding:8px 12px}.app-title{font-size:1.1rem;gap:8px}.user-profile{gap:6px;padding:4px 6px}.avatar{width:36px;height:36px;font-size:1rem}.nav-tabs{padding:4px 8px;gap:2px}.nav-tab{padding:8px 12px;font-size:.85rem;gap:6px}.container{padding:0 10px;margin:10px auto}.card{padding:14px;margin-bottom:12px;border-radius:10px}.timer-display{font-size:var(--timer-font-size-mobile);letter-spacing:-.01em;margin:20px 0}.stats-grid{grid-template-columns:repeat(2,1fr);gap:8px}.stat-item{padding:12px}.stat-number{font-size:1.5rem}.badges-container{grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:8px}.btn{padding:12px 20px;font-size:.9rem;min-height:44px}.subject-buttons{gap:6px;margin:12px 0 16px}.subject-btn{padding:10px 14px;font-size:.85rem;min-height:40px}.timer-controls{gap:8px}.motivation-message{padding:10px 12px;margin-bottom:12px}.motivation-message h3{font-size:1rem}}@media (max-width: 480px){.container{padding:0 8px;margin:8px auto}.timer-display{font-size:var(--timer-font-size-mobile)}.stats-grid{grid-template-columns:repeat(2,1fr);gap:6px}.stat-item{padding:10px}.stat-number{font-size:1.3rem}}.pomodoro-sets{display:flex;justify-content:center;align-items:center;gap:16px;margin:24px 0}.set-indicator{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.2rem;font-weight:600;transition:all var(--animation-duration) var(--animation-easing);position:relative}.set-indicator.completed{background:var(--neon-accent);color:var(--bg-darkest);border:1px solid var(--neon-accent)}.set-indicator.current{background:var(--bg-dark);border:3px solid var(--neon-accent);color:var(--neon-accent)}.set-indicator.upcoming{background:var(--surface);border:2px solid var(--divider);color:var(--text-disabled)}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--bg-dark)}::-webkit-scrollbar-thumb{background:var(--neon-accent);border-radius:24px}::-webkit-scrollbar-thumb:hover{background:var(--neon-accent-bright)}::selection{background:var(--neon-accent);color:var(--bg-darkest)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes scalePop{0%{transform:scale(.8);opacity:0}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}.card{animation:fadeIn .4s ease-out}.stat-item{animation:scalePop .3s ease-out;animation-fill-mode:backwards}.stat-item:nth-child(1){animation-delay:.1s}.stat-item:nth-child(2){animation-delay:.15s}.stat-item:nth-child(3){animation-delay:.2s}.stat-item:nth-child(4){animation-delay:.25s}.badge{animation:scalePop .3s ease-out;animation-fill-mode:backwards}.badge:nth-child(1){animation-delay:.05s}.badge:nth-child(2){animation-delay:.1s}.badge:nth-child(3){animation-delay:.15s}.badge:nth-child(4){animation-delay:.2s}.badge:nth-child(5){animation-delay:.25s}.badge:nth-child(6){animation-delay:.3s}.question-item,.ranking-item,.note-card{animation:slideInUp .4s ease-out;animation-fill-mode:backwards}.question-item:nth-child(1),.ranking-item:nth-child(1),.note-card:nth-child(1){animation-delay:.05s}.question-item:nth-child(2),.ranking-item:nth-child(2),.note-card:nth-child(2){animation-delay:.1s}.question-item:nth-child(3),.ranking-item:nth-child(3),.note-card:nth-child(3){animation-delay:.15s}.question-item:nth-child(4),.ranking-item:nth-child(4),.note-card:nth-child(4){animation-delay:.2s}.ripple{position:relative;overflow:hidden}.ripple:after{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#ffffff80;transform:translate(-50%,-50%);transition:width .6s,height .6s}.ripple:active:after{width:300px;height:300px;transition:width 0s,height 0s}h2{color:var(--text-primary);font-weight:700;font-size:1.75rem;margin-bottom:16px;letter-spacing:-.02em}h3{color:var(--text-primary);font-weight:600;font-size:1.25rem;margin-bottom:12px;letter-spacing:-.01em}a{color:var(--neon-accent);text-decoration:none;transition:var(--transition)}a:hover{color:var(--neon-accent-bright);text-decoration:underline}*:focus-visible{outline:2px solid var(--neon-accent);outline-offset:2px}.subject-stats{display:flex;flex-direction:column;gap:20px;margin-top:20px}.subject-stat-item{padding:16px;background:var(--surface);border-radius:24px;border:1px solid var(--divider);transition:var(--transition)}.subject-stat-item:hover{transform:translate(4px);box-shadow:var(--elevation-2)}.subject-stat-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.subject-stat-name{font-weight:500;color:var(--text-primary)}.subject-stat-time{font-weight:600;color:var(--primary);font-size:1.1rem}.subject-stat-bar{width:100%;height:8px;background:var(--divider);border-radius:24px;overflow:hidden}.subject-stat-fill{height:100%;background:var(--neon-accent);transition:width .5s cubic-bezier(.4,0,.2,1)}.modal{display:none;position:fixed;inset:0;background:#00000080;z-index:9999;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal.active{display:flex}.modal-content{background:var(--surface);border-radius:24px;max-width:500px;width:90%;max-height:90vh;overflow-y:auto;border:1px solid var(--divider);animation:modalSlideIn .3s ease}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(-50px)}to{opacity:1;transform:translateY(0)}}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid var(--divider)}.modal-header h3{margin:0;font-size:1.25rem;font-weight:500}.close-modal{background:none;border:none;font-size:2rem;cursor:pointer;color:var(--text-secondary);transition:var(--transition);width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%}.close-modal:hover{background:var(--bg-light);color:var(--text-primary)}.university-list{margin-top:24px}.university-buttons{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;margin-top:16px}.university-btn{padding:16px;border:2px solid var(--divider);background:var(--surface);color:var(--text-primary);border-radius:24px;cursor:pointer;transition:var(--transition);font-weight:500;text-align:left}.university-btn:hover{border-color:var(--primary);background:var(--bg-light)}.university-selector{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.university-selector .university-btn{padding:10px 16px;font-size:.9rem}.university-selector .university-btn.selected{background:var(--primary);border-color:var(--primary);color:#fff}.university-selector .university-btn:disabled{opacity:.4;cursor:not-allowed}.ranking-group-title{font-size:1rem;font-weight:600;margin:16px 0 8px;padding:8px 12px;background:var(--surface);border-radius:24px;border-left:3px solid var(--neon-accent)}.ranking-item.current-user{background:#1976d21a;border:2px solid var(--primary)}.university-btn.active{background:var(--primary);border-color:var(--primary);color:#fff;box-shadow:var(--elevation-2)}.user-rank-card{display:flex;align-items:center;gap:20px;padding:20px;background:var(--surface);border-radius:24px;margin-bottom:24px;border:2px solid var(--neon-accent)}.rank-badge{font-size:2rem;font-weight:700;color:var(--neon-accent);min-width:60px;text-align:center}.ranking-list{display:flex;flex-direction:column;gap:12px}.ranking-item{display:flex;align-items:center;gap:16px;padding:16px;background:var(--surface);border-radius:24px;border:1px solid var(--divider);transition:var(--transition)}.ranking-item:hover{background:var(--surface);transform:translate(4px);box-shadow:var(--elevation-2)}.ranking-item.user-ranking{background:var(--bg-dark-card);border:2px solid var(--neon-accent)}.rank-number{font-size:1.5rem;font-weight:700;min-width:50px;text-align:center}.ranking-user-info{display:flex;align-items:center;gap:12px;flex:1}.ranking-avatar{width:40px;height:40px;border-radius:50%;background:var(--neon-accent);display:flex;align-items:center;justify-content:center;color:var(--bg-darkest);font-weight:600;border:1px solid var(--neon-accent)}.ranking-name{font-weight:500;display:flex;align-items:center;gap:8px}.ranking-level{font-size:.85rem;color:var(--text-secondary)}.ranking-time{font-size:1.2rem;font-weight:600;color:var(--neon-accent);min-width:80px;text-align:right}.online-badge{font-size:.7rem;animation:blink 2s infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:.5}}.add-friend-form{padding:20px;background:var(--surface);border-radius:24px;border:1px solid var(--divider)}.btn-remove-friend{background:none;border:none;color:var(--text-secondary);font-size:1.5rem;cursor:pointer;width:32px;height:32px;border-radius:50%;transition:var(--transition);display:flex;align-items:center;justify-content:center}.btn-remove-friend:hover{background:var(--danger);color:#fff}.recommended-users{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}.community-page{overflow-x:hidden}.community-page .card{overflow:visible}.community-page .ranking-item{flex-wrap:wrap}@media (max-width: 480px){.recommended-users{grid-template-columns:1fr}.recommended-user-card{padding:12px}.ranking-item{padding:10px 12px;gap:10px}.ranking-time{font-size:1rem;min-width:60px}}.recommended-user-card{display:flex;align-items:center;gap:16px;padding:16px;background:var(--surface);border-radius:24px;border:1px solid var(--divider);transition:var(--transition)}.recommended-user-card:hover{background:var(--surface);box-shadow:var(--elevation-2);transform:translateY(-2px)}.notes-feed{display:flex;flex-direction:column;gap:20px;margin-top:20px}.note-card{background:var(--surface);border-radius:24px;padding:20px;border:1px solid var(--divider);transition:var(--transition)}.note-card:hover{box-shadow:var(--elevation-2);transform:translateY(-2px)}.note-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.note-user{display:flex;align-items:center;gap:12px}.note-username{font-weight:500;color:var(--text-primary)}.note-time{font-size:.85rem;color:var(--text-secondary)}.note-content{display:flex;flex-direction:column;gap:16px}.note-section{padding:12px;background:var(--surface);border-radius:24px;border:1px solid var(--divider)}.note-section strong{display:block;margin-bottom:8px;color:var(--primary)}.note-section p{color:var(--text-primary);line-height:1.6}.note-footer{margin-top:16px;padding-top:16px;border-top:1px solid var(--divider)}.btn-like{background:none;border:2px solid var(--divider);padding:8px 16px;border-radius:20px;cursor:pointer;transition:var(--transition);font-size:.95rem;color:var(--text-secondary)}.btn-like:hover{border-color:var(--primary);color:var(--primary);background:#1976d20d}.qa-filters{display:flex;gap:8px;margin:20px 0;flex-wrap:wrap}.filter-btn{padding:8px 16px;border:2px solid var(--divider);background:var(--surface);color:var(--text-secondary);border-radius:20px;cursor:pointer;transition:var(--transition);font-size:.9rem}.filter-btn:hover{border-color:var(--primary);color:var(--primary)}.filter-btn.active{background:var(--primary);border-color:var(--primary);color:#fff}.answer-card{padding:16px;background:var(--surface);border-radius:24px;border:1px solid var(--divider);margin-bottom:16px}.answer-form{margin-top:32px;padding-top:24px;border-top:2px solid var(--divider)}.answer-form h4{margin-bottom:16px;color:var(--text-primary)}.dropdown-menu-button{transition:background .2s ease;cursor:pointer}.dropdown-menu-button:hover{background:#667eea1a!important}.dropdown-menu-button.logout-button:hover{background:#f443361a!important}.user-profile *{cursor:inherit}.profile-page{max-width:800px;margin:0 auto}.profile-info{text-align:center}.stat-item{display:flex;justify-content:space-between;padding:16px;border-bottom:1px solid var(--divider)}.stat-item:last-child{border-bottom:none}.stat-item span{color:var(--text-secondary)}.stat-item strong{color:var(--primary);font-size:1.1rem}.question-list{display:flex;flex-direction:column;gap:16px}.question-item{display:flex;align-items:flex-start;gap:12px;padding:20px;background:var(--surface);border-radius:24px;border:1px solid var(--divider);transition:var(--transition)}.question-item:hover{box-shadow:var(--elevation-4);transform:translateY(-2px)}.bottom-nav{display:none;position:fixed;bottom:0;left:0;right:0;height:var(--mobile-bottom-nav-height);background:#fff;border-top:1px solid rgba(0,0,0,.05);z-index:1000;box-shadow:0 -4px 20px #0000000d}.bottom-nav-items{display:flex;justify-content:space-around;align-items:center;height:100%;padding:0 4px}.bottom-nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:var(--touch-target-min);min-height:var(--touch-target-min);padding:4px 8px;border:none;background:transparent;color:var(--text-secondary);font-size:.7rem;cursor:pointer;transition:var(--transition-fast);border-radius:var(--mobile-border-radius);gap:2px}.bottom-nav-item:active{background:#32ff321a;transform:scale(.95)}.bottom-nav-item.active{color:var(--neon-accent)}.bottom-nav-item .nav-icon{font-size:1.25rem;line-height:1}.bottom-nav-item .nav-label{font-weight:500;white-space:nowrap}@media (max-width: 768px){.bottom-nav{display:block}.nav-tabs{display:none}.container{padding-bottom:calc(var(--mobile-bottom-nav-height) + 16px)}.header{height:var(--mobile-header-height);padding:8px 12px}.app-title{font-size:1.1rem;gap:6px}.app-title .rocket-icon{font-size:1.5rem}.app-title-text{display:none}.app-title-short{display:inline}.user-info{display:none}.user-profile{padding:4px;gap:8px}.avatar{width:36px;height:36px;font-size:.95rem}.level-badge{padding:4px 10px;font-size:.8rem}.modal-content{width:95%;max-width:none;max-height:85vh;margin:auto 2.5%;border-radius:24px}.modal-header{padding:16px}.close-modal{width:var(--touch-target-min);height:var(--touch-target-min);font-size:1.5rem}.card{padding:var(--mobile-card-padding);border-radius:var(--mobile-border-radius);margin-bottom:var(--mobile-spacing-md)}.btn{min-height:var(--touch-target-min);min-width:var(--touch-target-min);padding:10px 16px}.btn-like{min-height:var(--touch-target-min);padding:10px 16px}.badges-container{grid-template-columns:repeat(3,1fr);gap:var(--mobile-spacing-sm)}.badge{aspect-ratio:1 / 1;padding:12px 8px;display:flex;flex-direction:column;align-items:center;justify-content:center}.badge-icon{font-size:1.8rem;margin-bottom:6px}.badge-name{font-size:.75rem;text-align:center;line-height:1.2}.timer-display{font-size:3.5rem;min-height:auto;margin:16px 0}.timer-settings{flex-direction:column;gap:12px;align-items:stretch}.timer-settings .form-group,.timer-settings select{width:100%}.timer-controls{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--mobile-spacing-sm)}.timer-controls .btn{width:100%}.timer-mode-switcher{gap:var(--mobile-spacing-sm)}.subject-buttons{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--mobile-spacing-sm)}.subject-btn{min-height:var(--touch-target-min);padding:10px 12px;font-size:var(--mobile-font-size-sm)}.stats-grid{grid-template-columns:repeat(2,1fr);gap:var(--mobile-spacing-sm)}.stat-item{padding:var(--mobile-spacing-md);flex-direction:column;text-align:center;gap:4px}.stat-number{font-size:1.4rem}.stat-label{font-size:var(--mobile-font-size-sm)}.university-selector{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--mobile-spacing-sm)}.university-selector .university-btn{width:100%;text-align:center;min-height:var(--touch-target-min)}.ranking-item{padding:var(--mobile-spacing-md);gap:var(--mobile-spacing-sm)}.rank-number{font-size:1.2rem;min-width:40px}.ranking-avatar{width:32px;height:32px;font-size:.85rem}.ranking-time{font-size:1rem;min-width:50px}.user-rank-card{flex-direction:column;text-align:center;gap:12px;padding:16px}.rank-badge{font-size:1.5rem;min-width:auto}.add-friend-form{padding:var(--mobile-spacing-lg)}.add-friend-form>.form-group>div{flex-direction:column;gap:var(--mobile-spacing-sm)}.add-friend-form input,.add-friend-form .btn{width:100%}.qa-filters{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:4px}.qa-filters::-webkit-scrollbar{display:none}.filter-btn{flex-shrink:0;min-height:var(--touch-target-min)}.question-item{padding:var(--mobile-spacing-md);flex-direction:column;gap:var(--mobile-spacing-sm)}.question-meta{font-size:.8rem;gap:8px}.note-form textarea{width:100%}.note-card{padding:var(--mobile-spacing-md)}.note-section{padding:var(--mobile-spacing-sm)}.subject-stat-item{padding:var(--mobile-spacing-md)}.subject-stat-header{margin-bottom:8px}.subject-stat-bar{height:6px}.roadmap-tabs{display:flex;gap:var(--mobile-spacing-sm);overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:4px}.roadmap-tabs::-webkit-scrollbar{display:none}.roadmap-tabs button{flex-shrink:0;min-height:var(--touch-target-min)}h2{font-size:1.4rem;margin-bottom:12px}h3{font-size:1.1rem;margin-bottom:8px}@media (hover: none){.badge:hover,.question-item:hover,.ranking-item:hover,.note-card:hover,.subject-stat-item:hover{transform:none;box-shadow:var(--elevation-1)}}}.creator-button{position:fixed;bottom:calc(var(--mobile-bottom-nav-height) + 16px);left:50%;transform:translate(-50%);width:64px;height:64px;border-radius:32px;background:linear-gradient(135deg,#7c3aed,#ec4899);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 25px #7c3aed66;transition:all .2s cubic-bezier(.4,0,.2,1);z-index:1100}.creator-button:hover{transform:translate(-50%) scale(1.08);box-shadow:0 12px 35px #7c3aed80}.creator-button:active{transform:translate(-50%) scale(.95);transition:all 50ms cubic-bezier(.4,0,.2,1)}.creator-icon{font-size:2rem;line-height:1;filter:brightness(1.1)}@media (min-width: 769px){.creator-button{display:none}}@media (max-width: 768px){.creator-button{display:flex}.container{padding-bottom:calc(var(--mobile-bottom-nav-height) + 96px)}}@media (max-width: 380px){.bottom-nav-item{padding:4px;font-size:.65rem}.bottom-nav-item .nav-icon{font-size:1.1rem}.timer-display{font-size:3rem}.badges-container{grid-template-columns:repeat(2,1fr)}.university-selector{grid-template-columns:1fr}.creator-button{width:56px;height:56px;bottom:calc(var(--mobile-bottom-nav-height) + 12px)}.creator-icon{font-size:1.6rem}}.btn-tertiary{background:var(--danger-dark);color:#fff}.btn-tertiary:hover:not(:disabled){background:#b71c1c}.scroll-indicator{position:relative}.scroll-indicator:after{content:"";position:absolute;right:0;top:0;bottom:0;width:24px;background:linear-gradient(to right,transparent,var(--surface));pointer-events:none}@media (max-width: 768px){.header{padding:4px 10px;gap:6px;min-height:40px}.app-title{gap:4px;font-size:.95rem;flex-shrink:1;min-width:0}.app-title-text{display:none}.app-title-short{display:inline}.rocket-icon{font-size:1.2rem;flex-shrink:0}.auth-register-btn{padding:4px 10px!important;font-size:.7rem!important;gap:3px!important;border-radius:14px!important;min-width:auto!important;min-height:28px!important;display:flex!important;align-items:center!important;justify-content:center!important}.auth-register-text{display:inline;font-size:.7rem}.auth-register-btn span:first-child{font-size:.85rem}.user-profile{flex-shrink:0}.avatar{width:28px!important;height:28px!important;font-size:.8rem!important}.user-info{display:none}.level-badge{width:22px!important;height:22px!important;font-size:.65rem!important}}@media (max-width: 480px){.header{padding:4px 6px}.app-title{font-size:1rem;gap:4px}.rocket-icon{font-size:1.3rem}.auth-register-btn{padding:6px 10px!important;font-size:.75rem!important;min-width:40px!important;min-height:40px!important}.auth-register-btn span:first-child{font-size:1.3rem}.avatar{width:28px!important;height:28px!important;font-size:.9rem!important}.level-badge{width:24px!important;height:24px!important;font-size:.75rem!important}}
