:root{--color-bg-primary:#f9f8f6;--color-bg-secondary:#f0ebe5;--color-bg-tertiary:#e6e0d8;--color-bg-card:rgba(255, 255, 255, 0.85);--color-accent-primary:#c66b3d;--color-accent-secondary:#a8572e;--color-accent-gradient:linear-gradient(135deg, #c66b3d 0%, #a8572e 100%);--color-text-primary:#2d2a26;--color-text-secondary:#5c554f;--color-text-muted:#8c857e;--color-success:#5a9e6f;--color-warning:#d4a373;--color-error:#c95d5d;--color-info:#6b8caf;--spacing-xs:0.25rem;--spacing-sm:0.5rem;--spacing-md:1rem;--spacing-lg:1.5rem;--spacing-xl:2rem;--spacing-2xl:3rem;--font-sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--font-display:'Playfair Display',Georgia,serif;--radius-sm:0.375rem;--radius-md:0.5rem;--radius-lg:0.75rem;--radius-xl:1rem;--shadow-sm:0 2px 4px rgba(45, 42, 38, 0.05);--shadow-md:0 6px 12px -2px rgba(45, 42, 38, 0.08);--shadow-lg:0 12px 24px -4px rgba(45, 42, 38, 0.12);--shadow-xl:0 24px 48px -8px rgba(45, 42, 38, 0.15);--glass-bg:rgba(255, 255, 255, 0.9);--glass-border:rgba(198, 107, 61, 0.15);--glass-blur:blur(12px);--transition-fast:150ms ease-in-out;--transition-base:250ms ease-in-out;--transition-slow:350ms ease-in-out}*{margin:0;padding:0;box-sizing:border-box}html{font-size:14px;scroll-behavior:smooth}body{font-family:var(--font-sans);background:var(--color-bg-primary);color:var(--color-text-primary);line-height:1.6;min-height:100vh;overflow-x:hidden}body::before{content:'';position:fixed;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 20% 50%,rgba(167,139,250,.1) 0,transparent 50%),radial-gradient(circle at 80% 80%,rgba(96,165,250,.1) 0,transparent 50%);z-index:-1;animation:gradientShift 15s ease infinite}@keyframes gradientShift{0%,100%{opacity:1}50%{opacity:.7}}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:700;line-height:1.2;color:var(--color-text-primary)}h1{font-size:2.5rem}h2{font-size:2rem}h3{font-size:1.5rem}.desktop-nav{position:fixed;top:0;left:0;width:100%;height:70px;background:var(--glass-bg);backdrop-filter:var(--glass-blur);border-bottom:1px solid var(--glass-border);display:flex;align-items:center;justify-content:space-between;padding:0 var(--spacing-xl);z-index:1000}.nav-brand{display:flex;align-items:center;gap:var(--spacing-md)}.nav-brand .brand-title{font-size:1.5rem;background:var(--color-accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.help-link{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius-md);text-decoration:none;color:var(--color-text-secondary);transition:all var(--transition-base);background:0 0}.help-link:hover{color:var(--color-accent-primary);background:rgba(198,107,61,.1);transform:scale(1.1)}.help-icon{font-size:1.2rem;line-height:1}.nav-links{display:flex;gap:var(--spacing-sm)}.nav-link{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);text-decoration:none;color:var(--color-text-secondary);transition:all var(--transition-base);position:relative}.nav-link:hover{color:var(--color-accent-primary);background:rgba(167,139,250,.1)}.nav-link.active{color:var(--color-accent-primary);background:rgba(167,139,250,.15)}.nav-link .nav-icon{font-size:1.25rem}.main-content{margin-top:70px;margin-bottom:80px;padding:var(--spacing-xl);max-width:1200px;margin-left:auto;margin-right:auto}.bottom-nav{position:fixed;bottom:0;left:0;width:100%;height:70px;background:var(--glass-bg);backdrop-filter:var(--glass-blur);border-top:1px solid var(--glass-border);display:none;justify-content:space-around;align-items:center;z-index:1000}.bottom-nav-link{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm);text-decoration:none;color:var(--color-text-secondary);transition:all var(--transition-base);flex:1}.bottom-nav-link .nav-icon{font-size:1.5rem}.bottom-nav-link .nav-text{font-size:.75rem}.bottom-nav-link.active{color:var(--color-accent-primary)}.hero{text-align:center;padding:var(--spacing-2xl) 0}.hero-title{font-size:3rem;margin-bottom:var(--spacing-md);background:var(--color-accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-subtitle{font-size:1.25rem;color:var(--color-text-secondary)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--spacing-lg);margin:var(--spacing-2xl) 0}.stat-card{background:var(--glass-bg);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg);padding:var(--spacing-xl);text-align:center;transition:all var(--transition-base)}.stat-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg);border-color:var(--color-accent-primary)}.stat-icon{font-size:2.5rem;margin-bottom:var(--spacing-md)}.stat-value{font-size:2.5rem;font-weight:700;color:var(--color-accent-primary);margin-bottom:var(--spacing-sm)}.stat-label{color:var(--color-text-secondary);font-size:.875rem;text-transform:uppercase;letter-spacing:.05em}.cta-section{margin:var(--spacing-2xl) 0;text-align:center}.cta-section h2{margin-bottom:var(--spacing-xl)}.cta-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--spacing-lg)}.cta-button{display:flex;align-items:center;justify-content:center;gap:var(--spacing-md);padding:var(--spacing-lg) var(--spacing-xl);background:var(--color-accent-gradient);border:none;border-radius:var(--radius-lg);color:#fff;font-size:1.125rem;font-weight:600;cursor:pointer;transition:all var(--transition-base);box-shadow:var(--shadow-md)}.cta-button:hover{transform:translateY(-3px);box-shadow:var(--shadow-xl)}.cta-button.large{padding:var(--spacing-xl) var(--spacing-2xl);font-size:1.25rem}.cta-icon{font-size:1.5rem}.categories-section{margin:var(--spacing-2xl) 0}.categories-section h2{text-align:center;margin-bottom:var(--spacing-xl)}.categories-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--spacing-lg)}.category-card{background:var(--glass-bg);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg);padding:var(--spacing-xl);text-align:center;transition:all var(--transition-base)}.category-card:hover{transform:scale(1.05);border-color:var(--color-accent-primary)}.category-icon{font-size:3rem;margin-bottom:var(--spacing-md)}.category-name{font-size:1.25rem;font-weight:600;margin-bottom:var(--spacing-sm)}.category-description{color:var(--color-text-secondary);font-size:.875rem}.flashcard-view{max-width:800px;margin:0 auto}.flashcard-header{text-align:center;margin-bottom:var(--spacing-xl)}.flashcard-header h1{margin-bottom:var(--spacing-lg)}.flashcard-controls{display:flex;gap:var(--spacing-md);justify-content:center;flex-wrap:wrap}.filter-select{padding:var(--spacing-sm) var(--spacing-md);background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-md);color:var(--color-text-primary);font-size:1rem;cursor:pointer;transition:all var(--transition-base)}.filter-select:hover{border-color:var(--color-accent-primary)}.filter-checkbox-wrapper{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-md);color:var(--color-text-primary);cursor:pointer;transition:all var(--transition-base)}.filter-checkbox-wrapper:hover{border-color:var(--color-accent-primary)}.filter-chip.vulgar-highlight{border-color:var(--color-error);color:var(--color-error);background:rgba(201,93,93,.1)}.filter-checkbox{accent-color:var(--color-accent-primary);width:1.2em;height:1.2em;cursor:pointer}.flashcard-progress{text-align:center;margin-bottom:var(--spacing-lg);font-size:1.125rem;color:var(--color-text-secondary)}.flashcard-container{perspective:1000px;margin-bottom:var(--spacing-xl)}.flashcard{width:100%;height:340px;cursor:pointer;position:relative}.flashcard-inner{position:relative;width:100%;height:100%;transition:transform .6s;-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.flashcard.flipped .flashcard-inner{transform:rotateY(180deg)}.flashcard-back,.flashcard-front{position:absolute;width:100%;height:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;border-radius:var(--radius-xl);padding:var(--spacing-2xl);display:flex;align-items:center;justify-content:center}.flashcard-front{background:var(--glass-bg);backdrop-filter:var(--glass-blur);border:2px solid var(--glass-border);transform:rotateY(0) translateZ(1px)}.flashcard-back{background:linear-gradient(135deg,rgba(167,139,250,.2) 0,rgba(96,165,250,.2) 100%);backdrop-filter:var(--glass-blur);border:2px solid var(--color-accent-primary);transform:rotateY(180deg) translateZ(1px)}.card-content{text-align:center;width:100%}.card-language{font-size:.875rem;text-transform:uppercase;letter-spacing:.1em;color:var(--color-accent-primary);margin-bottom:var(--spacing-md)}.card-expression{font-size:2rem;font-weight:700;margin-bottom:var(--spacing-lg);color:var(--color-text-primary)}.card-example{font-size:1.125rem;color:var(--color-text-secondary);font-style:italic;margin-bottom:var(--spacing-md)}.card-hint{font-size:.875rem;color:var(--color-text-muted);margin-top:var(--spacing-lg)}.card-category{display:flex;gap:var(--spacing-md);justify-content:center;margin-top:var(--spacing-lg)}.difficulty-badge{padding:var(--spacing-xs) var(--spacing-md);border-radius:var(--radius-sm);font-size:.75rem;font-weight:600;text-transform:uppercase}.difficulty-badge.beginner{background:rgba(74,222,128,.2);color:var(--color-success)}.difficulty-badge.intermediate{background:rgba(251,191,36,.2);color:var(--color-warning)}.difficulty-badge.advanced{background:rgba(248,113,113,.2);color:var(--color-error)}.category-badge{padding:var(--spacing-xs) var(--spacing-md);border-radius:var(--radius-sm);font-size:.75rem;background:rgba(96,165,250,.2);color:var(--color-info)}.flashcard-actions{display:flex;gap:var(--spacing-md);justify-content:center;margin-bottom:var(--spacing-lg)}.action-btn{padding:var(--spacing-md) var(--spacing-xl);border:none;border-radius:var(--radius-md);font-size:1rem;font-weight:600;cursor:pointer;transition:all var(--transition-base);display:flex;align-items:center;gap:var(--spacing-sm)}.action-btn.primary{background:var(--color-accent-gradient);color:#fff;box-shadow:var(--shadow-md)}.action-btn.primary:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.action-btn.secondary{background:var(--glass-bg);color:var(--color-text-primary);border:1px solid var(--glass-border)}.action-btn.secondary:hover{border-color:var(--color-accent-primary);color:var(--color-accent-primary)}.action-btn.danger{background:rgba(248,113,113,.2);color:var(--color-error);border:1px solid var(--color-error)}.action-btn.small{padding:var(--spacing-sm) var(--spacing-md);font-size:.875rem}.action-btn.icon-only{padding:var(--spacing-md);width:50px;justify-content:center;font-size:1.5rem}.action-btn.flip-action{flex:2;justify-content:center}.read-btn{background:0 0;border:none;cursor:pointer;font-size:1.5rem;color:var(--color-accent-primary);padding:var(--spacing-xs);border-radius:50%;transition:all var(--transition-base);display:inline-flex;align-items:center;justify-content:center;margin-left:var(--spacing-sm)}.read-btn:hover{background:rgba(255,140,66,.1);transform:scale(1.1)}.read-btn:active{transform:scale(.95)}.read-btn.disabled,.read-btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.read-btn.disabled:hover,.read-btn:disabled:hover{background:0 0;transform:none}.read-btn .loading-dots{display:inline-flex;gap:2px;font-size:1.2rem;letter-spacing:2px}.read-btn .loading-dots span{animation:dot-bounce 1.4s infinite ease-in-out;animation-fill-mode:both}.read-btn .loading-dots span:first-child{animation-delay:-.32s}.read-btn .loading-dots span:nth-child(2){animation-delay:-.16s}.read-btn .loading-dots span:nth-child(3){animation-delay:0s}@keyframes dot-bounce{0%,100%,80%{opacity:.3;transform:scale(.8)}40%{opacity:1;transform:scale(1)}}.flashcard-meta{display:flex;gap:var(--spacing-md);justify-content:center}.meta-btn{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-lg);background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-md);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-base)}.meta-btn:hover{border-color:var(--color-accent-primary);color:var(--color-accent-primary)}.meta-btn.active{background:rgba(167,139,250,.2);border-color:var(--color-accent-primary);color:var(--color-accent-primary)}.quiz-view{max-width:800px;margin:0 auto}.quiz-setup{text-align:center}.quiz-setup h1{margin-bottom:var(--spacing-md)}.quiz-description{color:var(--color-text-secondary);font-size:1.125rem;margin-bottom:var(--spacing-2xl)}.quiz-config{display:flex;flex-direction:column;gap:var(--spacing-lg);max-width:400px;margin:0 auto var(--spacing-2xl)}.config-group{text-align:left}.config-group label{display:block;margin-bottom:var(--spacing-sm);color:var(--color-text-secondary);font-weight:500}.quiz-header{margin-bottom:var(--spacing-md)}.quiz-header-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-md)}.quiz-header h2{text-align:center;margin-bottom:var(--spacing-sm);font-size:1.25rem}.quiz-timer{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background:var(--glass-bg);border:2px solid var(--glass-border);border-radius:var(--radius-md);font-size:1.125rem;font-weight:600;transition:all var(--transition-base)}.quiz-timer.warning{border-color:var(--color-error);background:rgba(248,113,113,.1);animation:pulse-warning 1s infinite}@keyframes pulse-warning{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}.timer-icon{font-size:1.25rem}.timer-value{font-size:1.5rem;color:var(--color-accent-primary);min-width:30px;text-align:center}.quiz-timer.warning .timer-value{color:var(--color-error)}.quiz-progress-bar{width:100%;height:8px;background:var(--color-bg-tertiary);border-radius:var(--radius-sm);overflow:hidden}.quiz-progress-fill{height:100%;background:var(--color-accent-gradient);transition:width var(--transition-base)}.quiz-question{background:var(--glass-bg);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-xl);padding:var(--spacing-lg);margin-bottom:var(--spacing-md)}.question-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:var(--color-accent-primary);margin-bottom:var(--spacing-sm)}.question-expression{font-size:1.5rem;font-weight:700;margin-bottom:var(--spacing-sm)}.question-example{font-size:.875rem;color:var(--color-text-secondary);font-style:italic;margin-bottom:var(--spacing-md)}.quiz-answers{display:flex;flex-direction:column;gap:var(--spacing-sm)}.answer-btn{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-sm) var(--spacing-md);background:var(--glass-bg);border:2px solid var(--glass-border);border-radius:var(--radius-md);color:var(--color-text-primary);font-size:1rem;text-align:left;cursor:pointer;transition:all var(--transition-base)}.answer-btn:hover:not(:disabled){border-color:var(--color-accent-primary);transform:translateX(5px)}.answer-btn.correct{border-color:var(--color-success);background:rgba(74,222,128,.1)}.answer-btn.wrong{border-color:var(--color-error);background:rgba(248,113,113,.1)}.answer-letter{display:flex;align-items:center;justify-content:center;width:28px;height:28px;background:var(--color-accent-gradient);border-radius:50%;color:#fff;font-weight:700;flex-shrink:0;font-size:.875rem}.quiz-score{text-align:center;font-size:1rem;color:var(--color-text-secondary);margin-top:var(--spacing-md)}.timeout-message{padding:var(--spacing-md);background:rgba(248,113,113,.15);border:2px solid var(--color-error);border-radius:var(--radius-md);margin-bottom:var(--spacing-md);text-align:center;font-size:1rem;color:var(--color-text-primary);animation:slideIn .3s ease}@keyframes slideIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.timeout-icon{font-size:1.5rem;margin-right:var(--spacing-sm)}.results-container{text-align:center;padding:var(--spacing-2xl)}.results-emoji{font-size:5rem;margin-bottom:var(--spacing-lg);animation:bounceIn .6s ease}@keyframes bounceIn{0%{transform:scale(0)}50%{transform:scale(1.1)}100%{transform:scale(1)}}.results-score{margin:var(--spacing-2xl) 0}.score-circle{width:200px;height:200px;margin:0 auto var(--spacing-lg);border-radius:50%;background:var(--color-accent-gradient);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-xl);animation:scaleIn .5s ease}@keyframes scaleIn{from{transform:scale(0) rotate(0)}to{transform:scale(1) rotate(360deg)}}.score-value{font-size:3rem;font-weight:700;color:#fff}.score-details{font-size:1.25rem;color:var(--color-text-secondary)}.results-message{font-size:1.25rem;color:var(--color-text-secondary);margin-bottom:var(--spacing-2xl)}.results-actions{display:flex;gap:var(--spacing-md);justify-content:center}.quiz-stats h3{margin:var(--spacing-2xl) 0 var(--spacing-lg)}.quiz-history-list{display:flex;flex-direction:column;gap:var(--spacing-md);margin-bottom:var(--spacing-lg)}.history-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md);background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-md)}.history-score{font-size:1.5rem;font-weight:700;min-width:60px;text-align:center}.history-score.excellent{color:var(--color-success)}.history-score.good{color:var(--color-warning)}.history-score.needs-work{color:var(--color-error)}.history-details{flex:1}.history-result{font-weight:600}.history-date{font-size:.875rem;color:var(--color-text-muted)}.average-score{text-align:center;padding:var(--spacing-md);background:var(--glass-bg);border-radius:var(--radius-md);font-size:1.125rem}.search-view{max-width:1000px;margin:0 auto}.search-header{margin-bottom:var(--spacing-xl)}.search-header h1{text-align:center;margin-bottom:var(--spacing-lg)}.search-bar{position:relative;max-width:600px;margin:0 auto}.search-input{width:100%;padding:var(--spacing-md) var(--spacing-xl);padding-right:3rem;background:var(--glass-bg);border:2px solid var(--glass-border);border-radius:var(--radius-lg);color:var(--color-text-primary);font-size:1.125rem;transition:all var(--transition-base)}.search-input:focus{outline:0;border-color:var(--color-accent-primary);box-shadow:0 0 0 3px rgba(167,139,250,.1)}.search-icon{position:absolute;right:var(--spacing-md);top:50%;transform:translateY(-50%);font-size:1.5rem;pointer-events:none}.filters-section{margin-bottom:var(--spacing-xl)}.filter-chips{display:flex;gap:var(--spacing-sm);justify-content:center;flex-wrap:wrap;margin-bottom:var(--spacing-md)}.filter-chip{padding:var(--spacing-sm) var(--spacing-lg);background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-md);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-base);font-size:.875rem}.filter-chip:hover{border-color:var(--color-accent-primary);color:var(--color-accent-primary)}.filter-chip.active{background:var(--color-accent-gradient);color:#fff;border-color:transparent}.difficulty-filters{display:flex;gap:var(--spacing-md);justify-content:center;flex-wrap:wrap}.results-info{text-align:center;margin-bottom:var(--spacing-lg);color:var(--color-text-secondary)}.expressions-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:var(--spacing-lg)}.expression-card{background:var(--glass-bg);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg);padding:var(--spacing-lg);transition:all var(--transition-base)}.expression-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg);border-color:var(--color-accent-primary)}.card-badges{display:flex;gap:var(--spacing-sm);margin-bottom:var(--spacing-md);flex-wrap:wrap}.learned-badge{padding:var(--spacing-xs) var(--spacing-sm);background:rgba(74,222,128,.2);color:var(--color-success);border-radius:var(--radius-sm);font-size:.75rem;font-weight:600}.card-main{margin-bottom:var(--spacing-md)}.card-french{font-size:1.25rem;font-weight:700;margin-bottom:var(--spacing-sm);color:var(--color-accent-primary)}.card-english{font-size:1rem;color:var(--color-text-secondary);margin-bottom:var(--spacing-md)}.card-example{padding:var(--spacing-md);background:rgba(0,0,0,.2);border-radius:var(--radius-sm);margin-bottom:var(--spacing-md)}.example-text{font-size:.875rem;font-style:italic;color:var(--color-text-secondary);margin-bottom:var(--spacing-xs)}.example-translation{font-size:.875rem;font-style:italic;color:var(--color-text-muted)}.card-footer{display:flex;justify-content:space-between;align-items:center}.card-category{font-size:.875rem;color:var(--color-text-muted)}.favorite-icon{background:0 0;border:none;font-size:1.5rem;cursor:pointer;transition:all var(--transition-fast)}.favorite-icon:hover{transform:scale(1.2)}.favorite-icon.active{animation:pulse .3s ease}@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.3)}}.favorites-view{max-width:1000px;margin:0 auto}.favorites-header{text-align:center;margin-bottom:var(--spacing-2xl)}.subtitle{color:var(--color-text-secondary);font-size:1.125rem}.favorites-count{text-align:center;margin-bottom:var(--spacing-lg);font-size:1.125rem;color:var(--color-text-secondary)}.remove-favorite-btn{padding:var(--spacing-xs) var(--spacing-md);background:rgba(248,113,113,.2);border:1px solid var(--color-error);border-radius:var(--radius-sm);color:var(--color-error);font-size:.875rem;cursor:pointer;transition:all var(--transition-base)}.remove-favorite-btn:hover{background:rgba(248,113,113,.3)}.progress-view{max-width:1000px;margin:0 auto}.progress-header{text-align:center;margin-bottom:var(--spacing-2xl)}.progress-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--spacing-lg);margin-bottom:var(--spacing-2xl)}.stat-card.large{grid-column:span 2}.progress-circle{position:relative;width:200px;height:200px;margin:var(--spacing-lg) auto}.progress-circle svg{width:100%;height:100%;transform:rotate(-90deg)}.progress-bg{fill:none;stroke:var(--color-bg-tertiary);stroke-width:8}.progress-fill{fill:none;stroke:url(#gradient);stroke-width:8;stroke-linecap:round;transition:stroke-dasharray 1s ease}.progress-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center}.progress-percentage{font-size:2.5rem;font-weight:700;color:var(--color-accent-primary)}.progress-count{font-size:1rem;color:var(--color-text-secondary)}.progress-section{margin-bottom:var(--spacing-2xl)}.progress-section h2{margin-bottom:var(--spacing-lg)}.category-progress-list{display:flex;flex-direction:column;gap:var(--spacing-md)}.category-progress-item{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-md);padding:var(--spacing-lg)}.category-info{display:flex;align-items:center;gap:var(--spacing-md);margin-bottom:var(--spacing-sm)}.category-count{margin-left:auto;font-weight:600}.progress-bar-container{display:flex;align-items:center;gap:var(--spacing-md)}.progress-bar{flex:1;height:8px;background:var(--color-bg-tertiary);border-radius:var(--radius-sm);overflow:hidden}.progress-bar-fill{height:100%;background:var(--color-accent-gradient);transition:width .5s ease}.quiz-chart{display:flex;align-items:flex-end;gap:var(--spacing-sm);height:200px;padding:var(--spacing-lg);background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-lg);margin-bottom:var(--spacing-md)}.chart-bar-container{flex:1;display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm);position:relative}.chart-bar{width:100%;min-height:20px;border-radius:var(--radius-sm) var(--radius-sm) 0 0;transition:all var(--transition-base);cursor:pointer;position:relative}.chart-bar:hover{opacity:.8}.chart-bar:hover .chart-tooltip{display:block}.chart-tooltip{display:none;position:absolute;bottom:100%;left:50%;transform:translateX(-50%);padding:var(--spacing-sm);background:var(--color-bg-secondary);border:1px solid var(--glass-border);border-radius:var(--radius-sm);font-size:.75rem;white-space:nowrap;z-index:10;margin-bottom:var(--spacing-xs)}.chart-label{font-size:.75rem;color:var(--color-text-muted)}.chart-legend{display:flex;gap:var(--spacing-lg);justify-content:center;flex-wrap:wrap}.legend-item{display:flex;align-items:center;gap:var(--spacing-sm);font-size:.875rem;color:var(--color-text-secondary)}.legend-color{width:16px;height:16px;border-radius:var(--radius-sm)}.legend-color.excellent{background:var(--color-success)}.legend-color.good{background:var(--color-warning)}.legend-color.needs-work{background:var(--color-error)}.progress-actions{text-align:center;margin-top:var(--spacing-2xl)}.empty-state{text-align:center;padding:var(--spacing-2xl);color:var(--color-text-secondary)}.empty-state.small{padding:var(--spacing-lg)}.empty-icon{font-size:4rem;margin-bottom:var(--spacing-lg);opacity:.5}.empty-state h3{margin-bottom:var(--spacing-md)}.empty-state p{margin-bottom:var(--spacing-lg)}.error-message{text-align:center;padding:var(--spacing-2xl)}.error-icon{font-size:4rem;margin-bottom:var(--spacing-lg)}.mobile-help-button{position:fixed;top:var(--spacing-md);right:var(--spacing-md);width:44px;height:44px;border-radius:50%;background:var(--color-accent-primary);color:#fff;display:none;align-items:center;justify-content:center;text-decoration:none;box-shadow:var(--shadow-lg);z-index:999;transition:all var(--transition-base)}.mobile-help-button:hover{background:var(--color-accent-secondary);transform:scale(1.1);box-shadow:var(--shadow-xl)}.mobile-help-button .help-icon{font-size:1.3rem;line-height:1}@media (max-width:768px){.desktop-nav{display:none}.mobile-help-button{display:flex}.bottom-nav{display:flex}.main-content{margin-top:0;padding:var(--spacing-md);padding-bottom:120px}.hero-title{font-size:2rem}.stats-grid{grid-template-columns:repeat(2,1fr)}.cta-grid{grid-template-columns:1fr}.categories-grid{grid-template-columns:1fr}.flashcard{height:200px}.card-expression{font-size:1.25rem;margin-bottom:var(--spacing-sm)}.flashcard-header{margin-bottom:var(--spacing-md)}.flashcard-header h1{margin-bottom:var(--spacing-sm);font-size:1.5rem}.flashcard-container{margin-bottom:var(--spacing-md)}.flashcard-actions{flex-direction:row;gap:var(--spacing-sm);margin-bottom:var(--spacing-md)}.action-btn{padding:var(--spacing-sm) var(--spacing-md);font-size:.9rem;flex:1;justify-content:center}.flashcard-meta{gap:var(--spacing-sm)}.meta-btn{padding:var(--spacing-sm);font-size:.8rem}.expressions-grid{grid-template-columns:1fr}.stat-card.large{grid-column:span 1}.filter-chips{justify-content:flex-start}.nav-link .nav-text{display:none}.quiz-header h2{font-size:1.1rem}.question-expression{font-size:1.25rem}.question-example{font-size:.8rem}.quiz-question{padding:var(--spacing-md)}}@media (max-width:480px){.hero-title{font-size:1.75rem}.stats-grid{grid-template-columns:1fr}.flashcard{height:300px}.card-expression{font-size:1.25rem}.progress-circle{width:150px;height:150px}.score-circle{width:150px;height:150px}.score-value{font-size:2rem}}.read-btn{background:0 0;border:none;cursor:pointer;font-size:1.5rem;color:var(--color-accent-primary);padding:var(--spacing-xs);border-radius:50%;transition:all var(--transition-base);display:inline-flex;align-items:center;justify-content:center;margin-left:var(--spacing-sm)}.read-btn:hover{background:rgba(255,140,66,.1);transform:scale(1.1)}.read-btn:active{transform:scale(.95)}.read-btn.disabled,.read-btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.read-btn.disabled:hover,.read-btn:disabled:hover{background:0 0;transform:none}.read-btn .loading-dots{display:inline-flex;gap:2px;font-size:1.2rem;letter-spacing:2px}.read-btn .loading-dots span{animation:dot-bounce 1.4s infinite ease-in-out;animation-fill-mode:both}.read-btn .loading-dots span:first-child{animation-delay:-.32s}.read-btn .loading-dots span:nth-child(2){animation-delay:-.16s}.read-btn .loading-dots span:nth-child(3){animation-delay:0s}@keyframes dot-bounce{0%,100%,80%{opacity:.3;transform:scale(.8)}40%{opacity:1;transform:scale(1)}}.quiz-header-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-md)}.quiz-timer{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background:var(--glass-bg);border:2px solid var(--glass-border);border-radius:var(--radius-md);font-size:1.125rem;font-weight:600;transition:all var(--transition-base)}.quiz-timer.warning{border-color:var(--color-error);background:rgba(248,113,113,.1);animation:pulse-warning 1s infinite}@keyframes pulse-warning{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}.timer-icon{font-size:1.25rem}.timer-value{font-size:1.5rem;color:var(--color-accent-primary);min-width:30px;text-align:center}.quiz-timer.warning .timer-value{color:var(--color-error)}.timeout-message{padding:var(--spacing-lg);background:rgba(248,113,113,.15);border:2px solid var(--color-error);border-radius:var(--radius-md);margin-bottom:var(--spacing-lg);text-align:center;font-size:1.125rem;color:var(--color-text-primary);animation:slideIn .3s ease}@keyframes slideIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.timeout-icon{font-size:1.5rem;margin-right:var(--spacing-sm)}.quiz-header{margin-bottom:var(--spacing-md)}.quiz-header h2{font-size:1.25rem;margin-bottom:var(--spacing-sm)}.quiz-question{padding:var(--spacing-lg);margin-bottom:var(--spacing-md)}.question-label{font-size:.75rem;margin-bottom:var(--spacing-sm)}.question-expression{font-size:1.5rem;margin-bottom:var(--spacing-sm)}.question-example{font-size:.875rem;margin-bottom:var(--spacing-md)}.quiz-answers{gap:var(--spacing-sm)}.answer-btn{padding:var(--spacing-sm) var(--spacing-md)}.quiz-score{font-size:1rem;margin-top:var(--spacing-md)}.timeout-message{padding:var(--spacing-md);margin-bottom:var(--spacing-md);font-size:1rem}@media (max-width:768px){.quiz-header h2{font-size:1.1rem}.question-expression{font-size:1.25rem}.question-example{font-size:.8rem}.quiz-question{padding:var(--spacing-md)}}