:root{--color-primary: #2563eb;--color-primary-hover: #1d4ed8;--color-primary-light: #eff6ff;--color-primary-rgb: 37, 99, 235;--color-success: #16a34a;--color-warning: #f59e0b;--color-danger: #dc2626;--color-text: #1e293b;--color-text-secondary: #475569;--color-text-muted: #94a3b8;--color-bg: #f8fafc;--color-surface: #ffffff;--color-surface-hover: #f1f5f9;--color-border: #e2e8f0;--shadow-sm: 0 1px 2px rgba(0,0,0,.06);--shadow-md: 0 2px 6px rgba(0,0,0,.08);--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif}@media(prefers-color-scheme:dark){:root{--color-primary: #60a5fa;--color-primary-hover: #3b82f6;--color-primary-light: #1e3a5f;--color-primary-rgb: 96, 165, 250;--color-text: #e2e8f0;--color-text-secondary: #cbd5e1;--color-text-muted: #64748b;--color-bg: #0f172a;--color-surface: #1e293b;--color-surface-hover: #334155;--color-border: #334155;--shadow-sm: 0 1px 2px rgba(0,0,0,.3);--shadow-md: 0 2px 6px rgba(0,0,0,.4)}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background:var(--color-bg);color:var(--color-text);line-height:1.5;-webkit-font-smoothing:antialiased}h1{font-size:1.75rem;font-weight:700;letter-spacing:-.02em}h2{font-size:1.25rem;font-weight:600}.btn{display:inline-flex;align-items:center;gap:.4rem;padding:.5rem 1rem;font-size:.875rem;font-weight:500;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-text);cursor:pointer;transition:all .15s}.btn:hover{background:var(--color-surface-hover)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.btn-primary:hover{background:var(--color-primary-hover)}.btn-danger{background:var(--color-danger);color:#fff;border-color:var(--color-danger)}.btn-link{background:none;border:none;color:var(--color-primary);cursor:pointer;font-size:.875rem;padding:.25rem}.btn-link:hover{text-decoration:underline}.btn-link.btn-danger{color:var(--color-danger)}label{display:block;margin-bottom:1rem;font-size:.875rem;font-weight:500;color:var(--color-text-secondary)}input,select,textarea{display:block;width:100%;margin-top:.25rem;padding:.5rem .75rem;font-size:.875rem;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-text)}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px rgba(var(--color-primary-rgb),.15)}.error{color:var(--color-danger);font-size:.85rem;margin:.5rem 0}.loading{display:flex;align-items:center;justify-content:center;min-height:100vh;color:var(--color-text-muted)}.empty-state{text-align:center;padding:3rem 1rem;color:var(--color-text-muted)}.landing{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:2rem;gap:2rem}.hero{text-align:center;max-width:480px}.hero h1{font-size:2.5rem;color:var(--color-primary);margin-bottom:.5rem}.hero-tagline{font-size:1.1rem;color:var(--color-text-secondary);margin-bottom:1.5rem}.hero-features{list-style:none;text-align:left}.hero-features li{padding:.3rem 0;font-size:.95rem;color:var(--color-text-secondary)}.hero-features li:before{content:"✓ ";color:var(--color-success);font-weight:700}.auth-card{width:100%;max-width:380px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:1.5rem;box-shadow:var(--shadow-md)}.auth-tabs{display:flex;gap:0;margin-bottom:1.25rem;border-bottom:2px solid var(--color-border)}.auth-tabs button{flex:1;padding:.5rem;background:none;border:none;border-bottom:2px solid transparent;margin-bottom:-2px;font-size:.875rem;font-weight:500;color:var(--color-text-muted);cursor:pointer}.auth-tabs button.active{color:var(--color-primary);border-bottom-color:var(--color-primary)}.auth-card .btn-primary{width:100%;justify-content:center;margin-top:.5rem}.dashboard{max-width:720px;margin:0 auto;padding:0 1rem 2rem}.dashboard-header{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 0;border-bottom:1px solid var(--color-border);margin-bottom:1.5rem}.dashboard-header h1{color:var(--color-primary)}.header-actions{display:flex;align-items:center;gap:.75rem;font-size:.85rem;color:var(--color-text-muted)}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.due-banner{background:var(--color-primary-light);border:1px solid var(--color-primary);border-radius:var(--radius-md);padding:.75rem 1rem;margin-bottom:1.5rem;cursor:pointer;font-size:.9rem;transition:background .15s}.due-banner:hover{background:rgba(var(--color-primary-rgb),.15)}.glossary-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.75rem}.glossary-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:1rem;cursor:pointer;transition:box-shadow .15s,border-color .15s}.glossary-card:hover{box-shadow:var(--shadow-md);border-color:var(--color-primary)}.glossary-card h3{font-size:.95rem;margin-bottom:.25rem}.glossary-card p{font-size:.8rem;color:var(--color-text-muted)}.lang-badge{font-size:.7rem;background:var(--color-surface-hover);padding:.15rem .4rem;border-radius:var(--radius-sm);color:var(--color-text-muted)}.due-badge{font-size:.7rem;background:var(--color-primary-light);color:var(--color-primary);padding:.15rem .4rem;border-radius:var(--radius-sm);margin-left:.3rem}.create-form{display:flex;gap:.5rem;align-items:end;margin-bottom:1.5rem;padding:1rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);flex-wrap:wrap}.create-form input{flex:2;min-width:150px}.create-form select{flex:1;min-width:100px}.glossary-edit{max-width:720px;margin:0 auto;padding:0 1rem 2rem}.page-header{display:flex;align-items:center;gap:1rem;padding:1.25rem 0;border-bottom:1px solid var(--color-border);margin-bottom:1.5rem}.word-actions{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}.word-count{font-size:.85rem;color:var(--color-text-muted)}.add-word-form{display:flex;gap:.5rem;margin-bottom:1.5rem}.add-word-form input{flex:1}.word-table{width:100%;border-collapse:collapse;font-size:.875rem}.word-table th{text-align:left;padding:.5rem .75rem;font-weight:600;color:var(--color-text-secondary);border-bottom:2px solid var(--color-border);font-size:.8rem}.word-table td{padding:.5rem .75rem;border-bottom:1px solid var(--color-border)}.word-table tbody tr:hover{background:var(--color-surface-hover)}.generate-page{max-width:560px;margin:0 auto;padding:0 1rem 2rem}.mode-tabs{display:flex;gap:0;border-bottom:2px solid var(--color-border);margin-bottom:1.5rem}.mode-tabs button{padding:.5rem 1rem;background:none;border:none;border-bottom:2px solid transparent;margin-bottom:-2px;font-size:.875rem;font-weight:500;color:var(--color-text-muted);cursor:pointer}.mode-tabs button.active{color:var(--color-primary);border-bottom-color:var(--color-primary)}.lang-row{display:flex;gap:1rem}.lang-row label{flex:1}.credits-note{font-size:.8rem;color:var(--color-text-muted);margin-top:.75rem}.credits-page{max-width:560px;margin:0 auto;padding:0 1rem 2rem}.balance-section{text-align:center;padding:1.5rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);margin-bottom:1.5rem}.balance-label{font-size:.85rem;color:var(--color-text-muted)}.balance-value{font-size:2rem;font-weight:700;color:var(--color-primary)}.tiers-section{margin-bottom:2rem}.tiers-section h2{margin-bottom:1rem}.tiers-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.75rem}.tier-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:1.25rem;text-align:center;transition:border-color .15s}.tier-card:hover{border-color:var(--color-primary)}.tier-card h3{font-size:1rem;margin-bottom:.25rem}.tier-price{font-size:1.25rem;font-weight:700;color:var(--color-primary);margin-bottom:.75rem}.tier-card .btn-primary{width:100%}.credits-info{margin-bottom:2rem}.credits-info h2{margin-bottom:.5rem}.credits-info p{font-size:.875rem;color:var(--color-text-secondary);margin-bottom:.5rem}.credits-info ul{list-style:none;padding:0}.credits-info li{padding:.25rem 0;font-size:.85rem;color:var(--color-text-secondary)}.credits-info li:before{content:"• ";color:var(--color-primary)}.transactions-section{margin-bottom:2rem}.transactions-section h2{margin-bottom:.75rem}.amount-positive{color:var(--color-success)}.amount-negative{color:var(--color-danger)}.payment-success{background:#f0fdf4;border:1px solid #bbf7d0;color:#166534;border-radius:var(--radius-md);padding:.75rem 1rem;margin-bottom:1rem}.payment-cancelled{background:#fffbeb;border:1px solid #fde68a;color:#92400e;border-radius:var(--radius-md);padding:.75rem 1rem;margin-bottom:1rem}@media(prefers-color-scheme:dark){.payment-success{background:#052e16;color:#86efac;border-color:#166534}.payment-cancelled{background:#451a03;color:#fcd34d;border-color:#92400e}}.legal-page{max-width:640px;margin:0 auto;padding:0 1rem 2rem}.legal-page section{margin-bottom:1.5rem}.legal-page h2{margin-bottom:.5rem;font-size:1.1rem}.legal-page p,.legal-page li{font-size:.875rem;color:var(--color-text-secondary);line-height:1.6}.legal-page ul{padding-left:1.25rem;margin:.5rem 0}.legal-updated{font-size:.8rem;color:var(--color-text-muted);margin-bottom:1.5rem}.landing-footer{text-align:center;margin-top:2rem;font-size:.8rem;color:var(--color-text-muted)}.landing-footer a{color:var(--color-text-muted)}.landing-footer a:hover{color:var(--color-primary)}.landing-footer p{margin-top:.25rem}.account-page{max-width:480px;margin:0 auto;padding:0 1rem 2rem}.account-section{margin-bottom:2rem;padding:1.25rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md)}.account-section h2{margin-bottom:.5rem}.account-section p{font-size:.875rem;color:var(--color-text-secondary);margin-bottom:.5rem}.account-section input{margin-bottom:.5rem}.deletion-warning{border-color:var(--color-danger);background:#fef2f2}@media(prefers-color-scheme:dark){.deletion-warning{background:#450a0a}}.practice-page{max-width:560px;margin:0 auto;padding:2rem 1rem}.practice-setup{max-width:320px}.practice-progress{text-align:center;font-size:.85rem;color:var(--color-text-muted);margin-bottom:1rem}.flashcard{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:2.5rem 2rem;text-align:center;min-height:200px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:box-shadow .15s}.flashcard:hover{box-shadow:var(--shadow-md)}.flashcard-question{font-size:1.5rem;font-weight:600}.flashcard-answer{font-size:1.3rem;color:var(--color-primary);margin-top:1rem;padding-top:1rem;border-top:1px solid var(--color-border);width:100%}.flashcard-explanation{font-size:.85rem;color:var(--color-text-muted);margin-top:.5rem;font-style:italic}.flashcard-hint{font-size:.8rem;color:var(--color-text-muted);margin-top:1rem}.confidence-buttons{display:flex;gap:.5rem;justify-content:center;margin-top:1.5rem}.confidence-hard{border-color:#ef4444;color:#ef4444}.confidence-hard:hover{background:#fef2f2}.confidence-ok{border-color:#f59e0b;color:#92400e}.confidence-ok:hover{background:#fffbeb}.confidence-easy{border-color:#22c55e;color:#166534}.confidence-easy:hover{background:#f0fdf4}@media(prefers-color-scheme:dark){.confidence-hard:hover{background:#450a0a}.confidence-ok:hover{background:#451a03}.confidence-easy:hover{background:#052e16}}.practice-done{text-align:center;padding:3rem 1rem}.practice-done h2{font-size:1.5rem;margin-bottom:.5rem}.done-stats{display:flex;gap:1rem;justify-content:center;margin:1rem 0}.stat{padding:.4rem .8rem;border-radius:var(--radius-sm);font-size:.85rem;font-weight:500}.stat-easy{background:#f0fdf4;color:#166534}.stat-ok{background:#fffbeb;color:#92400e}.stat-hard{background:#fef2f2;color:#991b1b}@media(prefers-color-scheme:dark){.stat-easy{background:#052e16;color:#86efac}.stat-ok{background:#451a03;color:#fcd34d}.stat-hard{background:#450a0a;color:#fca5a5}}.done-actions{display:flex;gap:.5rem;justify-content:center;margin-top:1.5rem}.shared-page{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:2rem}.shared-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:2.5rem;text-align:center;max-width:400px;width:100%;box-shadow:var(--shadow-md)}.shared-card h1{color:var(--color-primary);margin-bottom:1.5rem}.shared-card h2{margin-bottom:.5rem}.shared-card p{color:var(--color-text-secondary);margin-bottom:.5rem}.shared-card .btn-primary{margin-top:1rem}.test-page{max-width:560px;margin:0 auto;padding:2rem 1rem}.test-question{text-align:center}.test-question h2{font-size:1.5rem;margin-bottom:1.5rem}.test-question form{display:flex;gap:.5rem}.test-question input{flex:1;font-size:1.1rem;text-align:center}.test-score{font-size:1.5rem;font-weight:700;color:var(--color-primary);margin:.5rem 0 1rem}.test-results{padding:1rem 0}.answer-feedback{padding:.75rem 1rem;border-radius:var(--radius-sm);margin-top:1rem;font-size:.9rem}.feedback-correct{background:#f0fdf4;color:#166534;border:1px solid #bbf7d0}.feedback-wrong{background:#fef2f2;color:#991b1b;border:1px solid #fecaca}@media(prefers-color-scheme:dark){.feedback-correct{background:#052e16;color:#86efac;border-color:#166534}.feedback-wrong{background:#450a0a;color:#fca5a5;border-color:#7f1d1d}}.row-correct td{color:var(--color-success)}.row-wrong td:nth-child(2){color:var(--color-danger)}@media(max-width:640px){.dashboard-header{flex-direction:column;align-items:flex-start;gap:.5rem}.create-form,.add-word-form{flex-direction:column}.glossary-grid{grid-template-columns:1fr}.landing{padding:1rem}.test-question form,.confidence-buttons{flex-direction:column}}
