*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif;font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh}:focus-visible{outline:2px solid var(--primary, #4f46e5);outline-offset:2px}button{font-family:inherit}@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}@supports (padding: max(0px)){body{padding-left:max(0px,env(safe-area-inset-left));padding-right:max(0px,env(safe-area-inset-right))}}.progress-view{padding:20px;max-width:800px;margin:0 auto}.progress-view.loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:300px;gap:16px;color:var(--text-muted, #6b7280)}.spinner{width:40px;height:40px;border:3px solid var(--border-color, #e5e7eb);border-top-color:var(--primary, #4f46e5);border-radius:50%;animation:spin .8s linear infinite}.progress-view.empty{text-align:center;padding:60px 20px}.progress-view.empty p{color:var(--text-secondary, #4b5563);margin-bottom:24px}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px;margin-bottom:32px}.stat-card{background:var(--card-bg, white);border-radius:12px;padding:20px;text-align:center;box-shadow:0 1px 3px #0000001a}.stat-card.primary{background:var(--primary, #4f46e5);color:#fff}.stat-value{font-size:32px;font-weight:700;line-height:1.2}.stat-label{font-size:14px;font-weight:500;margin-top:4px}.stat-card.primary .stat-label{opacity:.9}.stat-detail{font-size:12px;margin-top:8px;opacity:.7}.progress-bar-section{margin-bottom:32px}.progress-bar-section h3{font-size:18px;margin-bottom:16px;color:var(--text-primary, #1f2937)}.progress-bar-container{background:var(--card-bg, white);padding:20px;border-radius:12px;box-shadow:0 1px 3px #0000001a}.progress-bar{height:24px;background:var(--bg-secondary, #f3f4f6);border-radius:12px;overflow:hidden;display:flex}.progress-segment{height:100%;transition:width .3s ease}.progress-segment.mastered{background:var(--success, #10b981)}.progress-segment.learning{background:var(--info, #3b82f6)}.progress-segment.available{background:var(--warning, #f59e0b)}.progress-legend{display:flex;flex-wrap:wrap;gap:16px;margin-top:16px;justify-content:center}.legend-item{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--text-secondary, #4b5563)}.legend-item .dot{width:12px;height:12px;border-radius:50%}.legend-item.mastered .dot{background:var(--success, #10b981)}.legend-item.learning .dot{background:var(--info, #3b82f6)}.legend-item.available .dot{background:var(--warning, #f59e0b)}.legend-item.locked .dot{background:var(--bg-secondary, #d1d5db)}.quick-actions{display:flex;gap:12px;justify-content:center;margin-bottom:32px}.recommendations-section{margin-bottom:32px}.recommendations-section h3{font-size:18px;margin-bottom:8px;color:var(--text-primary, #1f2937)}.section-description{color:var(--text-muted, #6b7280);font-size:14px;margin-bottom:16px}.recommendation-list{display:flex;flex-direction:column;gap:12px}.recommendation-card{display:flex;justify-content:space-between;align-items:center;background:var(--card-bg, white);padding:16px 20px;border-radius:10px;box-shadow:0 1px 3px #0000001a}.rec-info{flex:1}.rec-name{font-weight:600;color:var(--text-primary, #1f2937);margin-bottom:4px}.rec-meta{font-size:13px;color:var(--text-muted, #6b7280)}.rec-description{font-size:13px;color:var(--text-secondary, #4b5563);margin-top:6px;line-height:1.4}.btn-small{padding:8px 16px;font-size:13px}.last-study{text-align:center;font-size:13px;color:var(--text-muted, #6b7280);padding-top:16px;border-top:1px solid var(--border-color, #e5e7eb)}.flashcard{background:var(--card-bg, white);border-radius:12px;box-shadow:0 4px 6px #0000001a;padding:24px;max-width:600px;margin:0 auto;outline:none}.flashcard:focus{box-shadow:0 4px 6px #0000001a,0 0 0 3px var(--focus-ring, #4f46e5)}.flashcard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid var(--border-color, #e5e7eb)}.concept-badge{background:var(--primary-light, #eef2ff);color:var(--badge-text, #4f46e5);padding:4px 12px;border-radius:16px;font-size:14px;font-weight:500}.card-type{color:var(--text-muted, #6b7280);font-size:12px;text-transform:capitalize}.flashcard-content{min-height:200px}.question-section{margin-bottom:20px}.question{font-size:20px;font-weight:500;color:var(--text-primary, #1f2937);margin:0 0 16px;line-height:1.4}.answer-input{width:100%;padding:12px 16px;font-size:16px;border:2px solid var(--border-color, #e5e7eb);border-radius:8px;outline:none;transition:border-color .2s}.answer-input:focus{border-color:var(--primary, #4f46e5)}.choices{display:flex;flex-direction:column;gap:10px}.choices.true-false{flex-direction:row}.choice-button{padding:12px 20px;font-size:16px;background:var(--bg-secondary, #f9fafb);color:var(--text-primary, #1f2937);border:2px solid var(--border-color, #e5e7eb);border-radius:8px;cursor:pointer;transition:all .2s;text-align:left}.choice-button:hover{border-color:var(--primary, #4f46e5);background:var(--primary-light, #eef2ff)}.choices.true-false .choice-button{flex:1;text-align:center}.hints-section{margin:16px 0}.hint{background:var(--warning-light, #fef3c7);color:var(--warning-dark, #92400e);padding:10px 14px;border-radius:8px;margin-bottom:8px;font-size:14px}.answer-section{background:var(--bg-secondary, #f9fafb);padding:20px;border-radius:8px;margin-top:16px}.answer-label{font-size:12px;text-transform:uppercase;color:var(--text-muted, #6b7280);margin-bottom:8px;font-weight:600}.answer{font-size:18px;font-weight:600;color:var(--text-primary, #1f2937)}.user-answer{margin-top:12px;padding:10px 14px;border-radius:6px;font-size:14px}.user-answer.correct{background:var(--success-light, #d1fae5);color:var(--success-dark, #065f46)}.user-answer.incorrect{background:var(--error-light, #fee2e2);color:var(--error-dark, #991b1b)}.explanation{margin-top:16px;padding-top:16px;border-top:1px solid var(--border-color, #e5e7eb);font-size:14px;color:var(--text-secondary, #4b5563);line-height:1.5}.rating-section{margin-top:24px;text-align:center}.rating-prompt{margin-bottom:16px;color:var(--text-secondary, #4b5563)}.rating-buttons{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.rating-button{display:flex;flex-direction:column;align-items:center;padding:12px 16px;border:2px solid transparent;border-radius:8px;cursor:pointer;transition:all .2s;min-width:60px}.rating-number{font-size:20px;font-weight:700}.rating-label{font-size:11px;margin-top:4px}.rating-0{background:#fef2f2;color:#991b1b}.rating-1{background:#fef2f2;color:#dc2626}.rating-2{background:#fff7ed;color:#c2410c}.rating-3{background:#fefce8;color:#a16207}.rating-4{background:#ecfdf5;color:#059669}.rating-5{background:#ecfdf5;color:#047857}.rating-button:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.flashcard-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:24px;padding-top:16px;border-top:1px solid var(--border-color, #e5e7eb)}.btn-primary,.btn-secondary{padding:10px 20px;font-size:14px;font-weight:500;border-radius:8px;cursor:pointer;transition:all .2s}.btn-primary{background:var(--primary, #4f46e5);color:#fff;border:none}.btn-primary:hover{background:var(--primary-dark, #4338ca)}.btn-secondary{background:transparent;color:var(--text-secondary, #4b5563);border:1px solid var(--border-color, #e5e7eb)}.btn-secondary:hover{background:var(--bg-secondary, #f9fafb)}.study-view{padding:20px;max-width:700px;margin:0 auto}.study-view.complete{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;text-align:center}.complete-icon{font-size:64px;margin-bottom:20px}.study-view.complete h2{font-size:28px;margin-bottom:12px;color:var(--text-primary, #1f2937)}.study-view.complete p{color:var(--text-secondary, #4b5563);margin-bottom:24px}.study-view.no-session{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;text-align:center;gap:16px}.study-view.no-session h2{font-size:28px;margin-bottom:8px;color:var(--text-primary, #1f2937)}.study-view.no-session .view-description{color:var(--text-secondary, #4b5563);margin-bottom:16px;max-width:400px}.session-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid var(--border-color, #e5e7eb)}.session-progress{display:flex;align-items:center;gap:12px}.progress-text{font-weight:600;color:var(--text-primary, #1f2937)}.progress-bar-mini{width:120px;height:6px;background:var(--bg-secondary, #e5e7eb);border-radius:3px;overflow:hidden}.progress-fill{height:100%;background:var(--primary, #4f46e5);transition:width .3s ease;border-radius:3px}.btn-text{background:none;border:none;color:var(--text-muted, #6b7280);cursor:pointer;font-size:14px;padding:8px}.btn-text:hover{color:var(--text-primary, #1f2937)}.keyboard-help{display:flex;justify-content:center;gap:24px;margin-top:24px;padding-top:16px;border-top:1px solid var(--border-color, #e5e7eb)}.keyboard-help span{font-size:12px;color:var(--text-muted, #9ca3af);background:var(--bg-secondary, #f3f4f6);padding:4px 10px;border-radius:4px}:root{--primary: #4f46e5;--primary-dark: #4338ca;--primary-light: #eef2ff;--success: #10b981;--success-light: #d1fae5;--success-dark: #065f46;--warning: #f59e0b;--warning-light: #fef3c7;--warning-dark: #92400e;--error: #ef4444;--error-light: #fee2e2;--error-dark: #991b1b;--info: #3b82f6;--info-light: #dbeafe;--text-primary: #1f2937;--text-secondary: #4b5563;--text-muted: #6b7280;--bg-primary: #ffffff;--bg-secondary: #f9fafb;--card-bg: #ffffff;--border-color: #e5e7eb;--focus-ring: rgba(79, 70, 229, .5);--badge-text: #4f46e5;--header-height: 60px;--footer-height: 40px}@media(prefers-color-scheme:dark){:root{--text-primary: #f9fafb;--text-secondary: #d1d5db;--text-muted: #9ca3af;--bg-primary: #111827;--bg-secondary: #1f2937;--card-bg: #1f2937;--border-color: #374151;--primary-light: #312e81;--badge-text: #a5b4fc}}*{box-sizing:border-box}body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background-color:var(--bg-secondary);color:var(--text-primary);min-height:100vh}.app{min-height:100vh;display:flex;flex-direction:column}.app.loading,.app.error{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}.spinner{width:48px;height:48px;border:4px solid var(--border-color);border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.app-header{height:var(--header-height);background:var(--bg-primary);border-bottom:1px solid var(--border-color);display:flex;align-items:center;justify-content:space-between;padding:0 20px;position:sticky;top:0;z-index:100}.app-title{font-size:20px;font-weight:700;margin:0;cursor:pointer;color:var(--text-primary)}.app-nav{display:flex;gap:8px}.nav-btn{background:transparent;border:none;padding:8px 16px;font-size:14px;font-weight:500;color:var(--text-secondary);cursor:pointer;border-radius:6px;transition:all .2s}.nav-btn:hover{background:var(--bg-secondary);color:var(--text-primary)}.nav-btn.active{background:var(--primary-light);color:var(--primary)}.app-main{flex:1;padding:20px;max-width:1000px;margin:0 auto;width:100%}.app-footer{height:var(--footer-height);background:var(--bg-primary);border-top:1px solid var(--border-color);display:flex;align-items:center;justify-content:center}.app-footer p{margin:0;font-size:12px;color:var(--text-muted)}.btn-primary,.btn-secondary{padding:10px 20px;font-size:14px;font-weight:500;border-radius:8px;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:8px}.btn-primary{background:var(--primary);color:#fff;border:none}.btn-primary:hover{background:var(--primary-dark)}.btn-secondary{background:transparent;color:var(--text-secondary);border:1px solid var(--border-color)}.btn-secondary:hover{background:var(--bg-secondary);color:var(--text-primary)}.graph-view{padding:20px}.graph-view h2{margin:0 0 8px;font-size:24px}.view-description{color:var(--text-muted);margin-bottom:24px}.graph-stats{display:flex;gap:24px;margin-bottom:24px;flex-wrap:wrap}.graph-stats .stat{display:flex;flex-direction:column;align-items:center;background:var(--card-bg);padding:16px 24px;border-radius:8px;box-shadow:0 1px 3px #0000001a}.graph-stats .stat-value{font-size:28px;font-weight:700;color:var(--primary)}.graph-stats .stat-label{font-size:12px;color:var(--text-muted);text-transform:uppercase}.graph-actions{display:flex;gap:12px;margin-bottom:24px}.validation-result{padding:16px;border-radius:8px;margin-bottom:24px}.validation-result.valid{background:var(--success-light);color:var(--success-dark)}.validation-result.invalid{background:var(--error-light);color:var(--error-dark)}.validation-result h3{margin:0 0 12px}.validation-error,.validation-warning{padding:8px 0;border-top:1px solid rgba(0,0,0,.1)}.concept-list h3{margin-bottom:16px}.concept-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}.concept-card{background:var(--card-bg);padding:16px;border-radius:8px;border-left:4px solid var(--border-color);box-shadow:0 1px 3px #0000001a}.concept-card.status-mastered{border-left-color:var(--success)}.concept-card.status-learning{border-left-color:var(--info)}.concept-card.status-available{border-left-color:var(--warning)}.concept-card.status-locked{border-left-color:var(--border-color);opacity:.7}.concept-name{font-weight:600;margin-bottom:4px}.concept-meta{font-size:12px;color:var(--text-muted)}.concept-status{margin-top:8px;font-size:11px;text-transform:uppercase;font-weight:600}.settings-view{padding:20px}.settings-view h2{margin:0 0 8px;font-size:24px}.settings-section{background:var(--card-bg);padding:20px;border-radius:8px;margin-bottom:20px;box-shadow:0 1px 3px #0000001a}.settings-section h3{margin:0 0 16px;font-size:16px}.settings-section button{margin-right:12px;margin-bottom:8px}.settings-section p{margin:8px 0;color:var(--text-secondary);line-height:1.6}@media(max-width:600px){.app-header{flex-direction:column;height:auto;padding:12px;gap:12px}.app-nav{width:100%;justify-content:center}.graph-stats{gap:12px}.graph-stats .stat{flex:1;min-width:80px;padding:12px}.graph-stats .stat-value{font-size:24px}}