:root{--background:#fff;--foreground:#171717;--primary:#2563eb;--primary-hover:#1d4ed8;--secondary:#6b7280;--border:#e5e7eb;--muted:#f3f4f6}@media (prefers-color-scheme:dark){:root{--background:#0a0a0a;--foreground:#ededed;--primary:#3b82f6;--primary-hover:#60a5fa;--secondary:#9ca3af;--border:#374151;--muted:#1f2937}}*{box-sizing:border-box;margin:0;padding:0}html,body{max-width:100vw;overflow-x:hidden}body{color:var(--foreground);background:var(--background);-webkit-font-smoothing:antialiased;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.5}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}.btn{cursor:pointer;border:none;border-radius:.5rem;padding:.75rem 1.5rem;font-size:1rem;font-weight:500;transition:background-color .15s,opacity .15s;display:inline-block}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background-color:var(--primary);color:#fff}.btn-primary:hover:not(:disabled){background-color:var(--primary-hover)}.btn-secondary{background-color:var(--muted);color:var(--foreground);border:1px solid var(--border)}.btn-secondary:hover:not(:disabled){background-color:var(--border)}.container{max-width:1200px;margin:0 auto;padding:2rem}.landing{text-align:center;justify-content:center;align-items:center;min-height:100vh;display:flex}.landing h1{margin-bottom:.5rem;font-size:3rem}.landing .tagline{color:var(--secondary);margin-bottom:2rem;font-size:1.25rem}.landing .cta{justify-content:center;gap:1rem;margin-bottom:4rem;display:flex}.landing .features{text-align:left;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:2rem;margin-top:4rem;display:grid}.landing .feature h3{margin-bottom:.5rem}.landing .feature p{color:var(--secondary)}.login{justify-content:center;align-items:center;min-height:100vh;display:flex}.login-container{width:100%;max-width:400px;padding:2rem}.login-container h1{margin-bottom:.5rem;font-size:1.5rem}.login-container>p{color:var(--secondary);margin-bottom:2rem}.login-container form{flex-direction:column;gap:1rem;display:flex}.login-container input{border:1px solid var(--border);background:var(--background);color:var(--foreground);border-radius:.5rem;padding:.75rem 1rem;font-size:1rem}.login-container input:focus{outline:2px solid var(--primary);outline-offset:2px}.login-container .message{border-radius:.5rem;margin-top:1rem;padding:.75rem}.login-container .message.success{color:#166534;background:#dcfce7}.login-container .message.error{color:#991b1b;background:#fee2e2}.dashboard{min-height:100vh}.dashboard-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:1rem 2rem;display:flex}.dashboard-header h1{font-size:1.25rem}.dashboard-header nav{align-items:center;gap:1.5rem;display:flex}.dashboard-header nav button{color:var(--secondary);cursor:pointer;background:0 0;border:none}.dashboard-header nav button:hover{color:var(--foreground)}.dashboard-content{max-width:800px;margin:0 auto;padding:2rem}.dashboard-content section{margin-bottom:2rem}.dashboard-content h2{margin-bottom:.5rem;font-size:1.5rem}.dashboard-content h3{margin-bottom:1rem;font-size:1.125rem}.dashboard-content .actions{gap:1rem;display:flex}.placeholder-text{color:var(--secondary);background:var(--muted);border-radius:.5rem;padding:2rem}.session{min-height:100vh}.session-header{border-bottom:1px solid var(--border);padding:1rem 2rem}.session-header .back-link{color:var(--secondary);font-size:.875rem}.session-header h1{margin-top:.5rem;font-size:1.25rem}.session-content{max-width:800px;margin:0 auto;padding:2rem}.session-placeholder .placeholder-card{background:var(--muted);border-radius:.5rem;padding:2rem}.session-placeholder h2{margin-bottom:1rem}.session-placeholder ul{margin:1rem 0 1.5rem 1.5rem}.placeholder-note{color:var(--secondary);margin-top:1rem}.billing{min-height:100vh}.billing-header{border-bottom:1px solid var(--border);padding:1rem 2rem}.billing-header .back-link{color:var(--secondary);font-size:.875rem}.billing-header h1{margin-top:.5rem;font-size:1.25rem}.billing-content{max-width:800px;margin:0 auto;padding:2rem}.billing-content h2{margin-bottom:1rem;font-size:1.25rem}.current-plan{margin-bottom:3rem}.plan-card{background:var(--muted);border-radius:.5rem;padding:1.5rem}.plan-info{align-items:center;gap:1rem;display:flex}.plan-name{font-size:1.25rem;font-weight:600}.plan-status{text-transform:uppercase;border-radius:9999px;padding:.25rem .75rem;font-size:.75rem}.status-active{color:#166534;background:#dcfce7}.status-canceled{color:#991b1b;background:#fee2e2}.period-end{color:var(--secondary);margin-top:.5rem;font-size:.875rem}.plan-options{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem;display:grid}.plan-option{border:1px solid var(--border);border-radius:.5rem;padding:1.5rem}.plan-option.featured{border-color:var(--primary);border-width:2px}.plan-option h3{margin-bottom:.5rem}.plan-option .price{margin-bottom:1rem;font-size:1.5rem;font-weight:600}.plan-option ul{margin-bottom:1.5rem;list-style:none}.plan-option ul li{color:var(--secondary);padding:.25rem 0}.plan-option ul li:before{content:"✓ ";color:var(--primary)}.current-badge{background:var(--muted);color:var(--secondary);border-radius:.25rem;padding:.5rem 1rem;font-size:.875rem;display:inline-block}@media (prefers-color-scheme:dark){.login-container .message.success{color:#dcfce7;background:#166534}.login-container .message.error{color:#fee2e2;background:#991b1b}.status-active{color:#dcfce7;background:#166534}.status-canceled{color:#fee2e2;background:#991b1b}}.session-header{flex-wrap:wrap;align-items:center;gap:1rem;display:flex}.session-header h1{flex:1}.session-progress{color:var(--secondary);background:var(--muted);border-radius:9999px;padding:.25rem .75rem;font-size:.875rem}.session-error{color:#991b1b;background:#fee2e2;border-radius:.5rem;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.5rem;padding:1rem;display:flex}.session-loading{flex-direction:column;justify-content:center;align-items:center;gap:1rem;padding:4rem 2rem;display:flex}.loading-spinner{border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;width:2rem;height:2rem;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.session-start .start-card{text-align:center;background:var(--muted);border-radius:.5rem;padding:3rem 2rem}.session-start h2{margin-bottom:1rem;font-size:1.5rem}.session-start p{color:var(--secondary);max-width:500px;margin:0 auto 1rem}.session-info{margin-bottom:1.5rem;font-size:.875rem}.btn-large{padding:1rem 2rem;font-size:1.125rem}.session-item .item-card{background:var(--muted);border-radius:.5rem;margin-bottom:1.5rem;padding:2rem}.item-meta{gap:.75rem;margin-bottom:1.5rem;display:flex}.item-type,.item-skill{text-transform:uppercase;background:var(--background);border-radius:.25rem;padding:.25rem .5rem;font-size:.75rem}.item-type{color:var(--primary);font-weight:600}.item-skill{color:var(--secondary)}.item-prompt{background:var(--background);text-align:center;border-radius:.5rem;margin-bottom:1.5rem;padding:1rem;font-size:1.5rem}.item-input{gap:.75rem;display:flex}.item-input input{border:2px solid var(--border);background:var(--background);color:var(--foreground);border-radius:.5rem;flex:1;padding:.75rem 1rem;font-size:1rem}.item-input input:focus{border-color:var(--primary);outline:none}.item-reason{color:var(--secondary);text-align:center;margin-top:1rem;font-size:.75rem}.item-feedback{text-align:center;border-radius:.5rem;padding:1.5rem}.item-feedback.correct{color:#166534;background:#dcfce7}.item-feedback.incorrect{color:#991b1b;background:#fee2e2}.feedback-result{margin-bottom:.5rem;font-size:1.25rem;font-weight:600}.feedback-expected{font-size:1rem}.feedback-expected strong{font-weight:600}.session-controls{text-align:center}.session-complete-prompt .complete-card{text-align:center;background:var(--muted);border-radius:.5rem;padding:3rem 2rem}.session-complete-prompt h2{margin-bottom:1rem}.session-complete-prompt p{color:var(--secondary);margin-bottom:1.5rem}.session-complete .summary-hero{text-align:center;background:linear-gradient(135deg,var(--primary)0%,#7c3aed 100%);color:#fff;border-radius:.5rem;margin-bottom:1.5rem;padding:2rem}.summary-hero h2{margin-bottom:.5rem;font-size:1.75rem}.items-completed{opacity:.9;font-size:1.125rem}.items-completed strong{font-size:1.5rem}.summary-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;margin-bottom:1.5rem;display:grid}.summary-card{background:var(--muted);border-radius:.5rem;padding:1.5rem}.summary-card h3{color:var(--secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:1rem;font-size:1rem}.stat-row{border-bottom:1px solid var(--border);justify-content:space-between;padding:.5rem 0;display:flex}.stat-row:last-child{border-bottom:none}.stat-label{color:var(--secondary)}.stat-value{font-weight:600}.mastery-high{color:#16a34a}.mastery-medium{color:#ca8a04}.mastery-low{color:#dc2626}.estimate-number{color:var(--primary);text-align:center;margin-bottom:.5rem;font-size:3rem;font-weight:700}.estimate-label{text-align:center;color:var(--secondary);margin-bottom:1rem}.estimate-note{text-align:center;color:var(--secondary);font-size:.875rem}.skills-card,.reviews-card{grid-column:1/-1}.skills-subtitle{color:var(--secondary);margin-bottom:1rem;font-size:.875rem}.skills-list,.reviews-list{list-style:none}.skill-item{border-bottom:1px solid var(--border);align-items:center;gap:1rem;padding:.75rem 0;display:flex}.skill-item:last-child{border-bottom:none}.skill-name{width:150px;font-size:.875rem}.skill-bar-container{background:var(--border);border-radius:4px;flex:1;height:8px;overflow:hidden}.skill-bar{border-radius:4px;height:100%;transition:width .3s}.skill-bar.mastery-high{background:#16a34a}.skill-bar.mastery-medium{background:#ca8a04}.skill-bar.mastery-low{background:#dc2626}.skill-percent{text-align:right;width:50px;font-size:.875rem;font-weight:600}.review-item{border-bottom:1px solid var(--border);justify-content:space-between;padding:.75rem 0;display:flex}.review-item:last-child{border-bottom:none}.review-skill{font-size:.875rem}.review-status{border-radius:.25rem;padding:.25rem .5rem;font-size:.75rem}.review-status.overdue{color:#991b1b;background:#fee2e2}.review-status.upcoming{color:#1e40af;background:#dbeafe}.complete-actions{justify-content:center;gap:1rem;margin-top:2rem;display:flex}@media (prefers-color-scheme:dark){.session-error{color:#fee2e2;background:#991b1b}.item-feedback.correct{color:#dcfce7;background:#166534}.item-feedback.incorrect{color:#fee2e2;background:#991b1b}.review-status.overdue{color:#fecaca;background:#7f1d1d}.review-status.upcoming{color:#bfdbfe;background:#1e3a8a}}.alert{border-radius:.5rem;max-width:736px;margin:0 auto 1.5rem;padding:1rem}.alert-success{color:#166534;background:#dcfce7;border:1px solid #86efac}.alert-info{color:#1e40af;background:#dbeafe;border:1px solid #93c5fd}.usage-section{margin-bottom:2rem}.usage-card{background:var(--muted);border-radius:.5rem;padding:1.5rem}.usage-unlimited{text-align:center}.usage-badge-pro{color:#fff;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:9999px;margin-bottom:.5rem;padding:.25rem .75rem;font-size:.875rem;font-weight:600;display:inline-block}.usage-count{margin-bottom:.25rem;font-size:1.125rem}.usage-note{color:var(--secondary);font-size:.875rem}.usage-progress{margin-bottom:1rem}.usage-bar{background:var(--border);border-radius:6px;height:12px;margin-bottom:.5rem;overflow:hidden}.usage-fill{background:linear-gradient(90deg,var(--primary)0%,#06b6d4 100%);border-radius:6px;height:100%;transition:width .3s}.usage-text{color:var(--secondary);font-size:.875rem}.usage-remaining{color:#16a34a;font-weight:500}.limit-reached{text-align:center;padding:1rem 0}.limit-message{color:#dc2626;margin-bottom:1rem;font-weight:500}.plan-name-pro{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.plan-current{border-color:#16a34a!important}.price-period{color:var(--secondary);font-size:.875rem;font-weight:400}.featured-badge{color:#fff;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:9999px;padding:.25rem .75rem;font-size:.75rem;font-weight:600;position:absolute;top:-10px;right:20px}.plan-option.featured{position:relative}@media (prefers-color-scheme:dark){.alert-success{color:#dcfce7;background:#166534;border-color:#166534}.alert-info{color:#bfdbfe;background:#1e3a8a;border-color:#1e3a8a}.usage-remaining{color:#4ade80}.limit-message{color:#f87171}}