:root{font-family:Avenir Next,Segoe UI,sans-serif;color:#102033;background:radial-gradient(circle at top left,rgba(203,228,255,.92),transparent 28%),radial-gradient(circle at bottom right,rgba(255,223,180,.55),transparent 24%),linear-gradient(160deg,#f5f9ff,#eef3fb 52%,#e8eef8);color-scheme:light}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;min-width:320px;min-height:100vh}html[data-theme=dark]{color-scheme:dark}html[data-theme=dark] body{color:#eef4ff;background:radial-gradient(circle at top left,rgba(49,76,125,.42),transparent 26%),radial-gradient(circle at bottom right,rgba(124,64,40,.3),transparent 24%),linear-gradient(160deg,#0d1422,#121c2d 52%,#172235)}button,input,textarea{font:inherit}button{transition:transform .18s ease,box-shadow .18s ease,opacity .18s ease}button:hover:not(:disabled){transform:translateY(-1px)}button:disabled{opacity:.7;cursor:not-allowed}a{color:inherit}code{font-family:SF Mono,Roboto Mono,monospace}.auth-shell,.app-shell{min-height:100vh;padding:1.5rem}.auth-shell{display:grid;place-items:center}.app-card h1,.page-heading h3{margin:0}.auth-card,.app-card{padding:clamp(1.5rem,3vw,3rem)}.auth-card{width:min(420px,100%);background:#ffffffd6;border:1px solid rgba(16,32,51,.08);border-radius:28px;box-shadow:0 24px 70px #26496c24}.auth-card-compact{padding:1.1rem}.auth-form-panel{padding:1.25rem;border-radius:22px;background:#f7fafff0;border:1px solid rgba(20,70,160,.08)}.auth-page{display:grid;gap:1.25rem}.page-heading{display:grid;gap:.55rem}.page-heading h3{font-size:clamp(1.5rem,2.8vw,2.15rem);color:#102033}.page-heading p{margin:0;line-height:1.5;color:#60788f}.form-stack{display:grid;gap:1rem}.form-stack label{display:grid;gap:.45rem;font-weight:700;color:#17385d}.form-stack input,.form-stack textarea,.search-input{width:100%;border:1px solid rgba(16,32,51,.15);border-radius:16px;padding:.95rem 1rem;background:#fff;color:#102033}.form-stack input:focus,.form-stack textarea:focus,.search-input:focus{outline:2px solid rgba(15,109,178,.18);border-color:#0f6db2}.form-stack textarea{resize:vertical;min-height:7rem}.primary-button,.secondary-button{border-radius:999px;padding:.9rem 1.3rem;cursor:pointer;font-weight:700}.primary-button{border:0;color:#fff;background:linear-gradient(135deg,#0f6db2,#1446a0);box-shadow:0 14px 30px #1446a02e}.secondary-button{border:1px solid rgba(20,70,160,.22);color:#1446a0;background:#fff}.button-row{display:flex;gap:.85rem;flex-wrap:wrap}.button-inline-status{display:inline-flex;align-items:center;gap:.55rem}.spinner{width:1rem;height:1rem;border-radius:999px;border:2px solid rgba(20,70,160,.18);border-top-color:#1446a0;animation:spin .85s linear infinite}.auth-inline-links{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.8rem;font-size:.94rem}.auth-inline-links a{color:#42617f;text-decoration:none;font-weight:600}.auth-inline-links a:hover{color:#1446a0}.field-error,.error-copy,.field-hint{color:#a22626}.field-error{font-size:.92rem;font-weight:600}.error-copy{margin:0;line-height:1.5}.field-hint{font-size:.88rem;font-weight:500;color:#68839f}.info-banner,.success-banner,.dev-banner{padding:.95rem 1rem;border-radius:16px;line-height:1.5}.info-banner{background:#eef5ff;border:1px solid #cfddf7;color:#21486f}.success-banner{background:#edf9f2;border:1px solid #cbe8d6;color:#206041}.dev-banner{background:#fff7e9;border:1px solid #f2ddb0;color:#7b5b10}.app-shell{display:block}.application-shell{min-height:100vh}.topbar{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.85rem 1rem;background:#ffffffd1;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-bottom:1px solid rgba(16,32,51,.08)}.menu-toggle{width:3rem;height:3rem;border-radius:18px;border:1px solid rgba(16,32,51,.12);background:#fff;display:inline-flex;flex-direction:column;justify-content:center;gap:.28rem;padding:0 .7rem}.menu-toggle span{display:block;height:2px;background:#102033;border-radius:999px}.brand-block strong{font-size:clamp(1.2rem,2.8vw,1.9rem)}.topbar-user{color:#60788f;font-weight:600}.app-body{display:flex;align-items:stretch}.side-nav{width:280px;background:#ffffffe6;border-right:1px solid rgba(16,32,51,.08);padding:1.2rem;display:grid;gap:1.2rem;min-height:calc(100vh - 74px)}.side-nav-header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.side-nav-header h2{margin:0}.side-nav-close{display:none;border:0;background:transparent;color:#60788f;font-weight:700}.side-nav-links{display:grid;gap:.55rem}.side-nav-link,.side-nav-action{border-radius:18px;padding:.95rem 1rem;text-decoration:none;font-weight:700;color:#23425f;background:#f5f9ffcc;border:1px solid rgba(16,32,51,.06)}.side-nav-link-active{background:linear-gradient(135deg,#ffd23f,#ff6f61);color:#fff;box-shadow:0 18px 38px #ff6f6138}.side-nav-footer{margin-top:auto;display:grid;gap:.65rem}.side-nav-action{text-align:left}.side-nav-action.muted{color:#49657f}.side-nav-action.danger{color:#8a2831}.side-nav-backdrop{display:none}.app-content{flex:1;padding:1rem}.app-card{width:min(760px,100%);background:#ffffffd6;border:1px solid rgba(16,32,51,.08);border-radius:28px;box-shadow:0 24px 70px #26496c24;display:grid;gap:1.5rem}.workspace-shell{width:min(1180px,100%);margin:0 auto;display:grid;gap:1rem}.workspace-header{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start}.workspace-header-inline{margin-bottom:0}.workspace-actions{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center;justify-content:flex-end}.workspace-copy{max-width:44rem}.eyebrow{margin:0 0 .35rem;color:#68839f;font-size:.82rem;text-transform:uppercase;letter-spacing:.08em}.workspace-header h1,.panel-heading h2{margin:0}.workspace-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);gap:1rem}.workspace-panel{background:#ffffffd6;border:1px solid rgba(16,32,51,.08);border-radius:28px;box-shadow:0 24px 70px #26496c24;padding:1.1rem;display:grid;gap:.85rem}.workspace-panel-secondary{background:#f7faffd6}.panel-heading{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start}.panel-heading p,.workspace-header p{margin:0;line-height:1.4;color:#60788f}.search-input{max-width:24rem}.user-pill{padding:.75rem 1rem;border-radius:18px;background:#ffffffb3;border:1px solid rgba(16,32,51,.08);display:grid;gap:.15rem}.user-pill strong{font-size:.96rem}.user-pill span{color:#68839f;font-size:.88rem}.term-list{display:grid;gap:.75rem}.term-card{border:1px solid rgba(16,32,51,.08);border-radius:20px;background:#f8fbff;padding:.35rem;display:grid;gap:.35rem}.term-card-selected{border-color:#1446a057;box-shadow:0 12px 28px #1446a01a}.term-card-button,.text-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background:transparent;text-align:left;color:inherit}.term-card-button{padding:.8rem;display:grid;gap:.55rem;cursor:pointer}.term-card-top,.term-card-main{display:flex;justify-content:space-between;gap:.8rem;align-items:baseline}.term-card-top span,.term-phonetic{color:#68839f;font-size:.9rem}.term-target{font-size:1.15rem;direction:rtl}.text-button{cursor:pointer;color:#a22626;font-weight:700;padding:.2rem .8rem .7rem}.empty-state{padding:1.2rem;border-radius:20px;background:#f8fbff;border:1px dashed rgba(16,32,51,.18);display:grid;gap:.4rem}.empty-state p{margin:0;color:#60788f}.dashboard-page,.training-page{display:grid;gap:1rem}.hero-card,.dashboard-card,.training-card,.training-hero{background:#ffffffe0;border-radius:30px;box-shadow:0 24px 70px #26496c24}.hero-card{padding:1.3rem;color:#fff;background:linear-gradient(135deg,#ffd323,#ff9f43 36%,#ff6b81);display:grid;gap:.8rem}.hero-card h1,.dashboard-card h2,.training-hero h1,.training-card h2,.training-card h3{margin:0}.hero-trophy{font-size:2.25rem}.hero-copy{margin:0;max-width:42rem;font-size:1rem}.hero-highlight{background:#ffffff38;border-radius:20px;padding:.8rem 1rem;display:grid;gap:.25rem}.hero-actions{display:flex;flex-wrap:wrap;gap:.8rem}.hero-button{text-decoration:none;border-radius:20px;padding:.9rem 1.1rem;font-weight:800}.hero-button-bright{background:#ffffff3d;color:#fff}.hero-button-soft{background:#ffffffeb;color:#d95462}.dashboard-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:1rem}.dashboard-card{padding:1.15rem;display:grid;gap:.8rem}.progress-card{grid-row:span 2}.metric-block{display:grid;gap:.45rem}.metric-row{display:flex;justify-content:space-between;gap:1rem;font-size:1rem}.metric-block p{margin:0;color:#60788f}.meter{height:1rem;border-radius:999px;background:#d9dde4;overflow:hidden}.meter span{display:block;height:100%;border-radius:inherit}.meter-green span{background:#27c45b}.meter-blue span{background:#4385ff}.meter-gold span{background:#ff9f0a}.meter-coral span{background:#ff6b81}.shortcut-grid,.stats-card{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.category-chip-grid,.recent-list{display:grid;gap:.65rem}.category-chip{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem .9rem;border-radius:18px;background:#f7f9ff;border:1px solid rgba(16,32,51,.06)}.recent-item{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem .9rem;border-radius:18px;background:#fff;border:1px solid rgba(16,32,51,.06)}.recent-target,.dashboard-empty-copy,.recent-meta{color:#60788f}.recent-target,.recent-meta span{display:block}.recent-meta{text-align:right}.shortcut-card,.stat-tile{border:0;border-radius:22px;min-height:92px;display:grid;place-items:center;text-align:center;font-weight:800;color:#fff;text-decoration:none;padding:1rem}.shortcut-orange{background:#f7a300}.shortcut-green{background:#23b26d}.shortcut-blue{background:#3aa0e8}.shortcut-slate{background:#73849d}.stat-tile{gap:.35rem}.stat-tile strong{font-size:2.3rem}.stat-green{background:#28c860}.stat-lime{background:#53c95b}.stat-violet{background:#6a5cf6}.stat-coral{background:#ff7d66}.training-hero{padding:1.75rem;background:linear-gradient(135deg,#4a90e224,#695bff1f);border:1px solid rgba(84,119,255,.14)}.training-progress{display:grid;gap:.4rem}.training-progress-bars{display:flex;height:.95rem;border-radius:999px;overflow:hidden;background:#1020331f}.training-progress-good,.training-progress-bad{display:block;height:100%}.training-progress-good{background:#27c45b}.training-progress-bad{background:#ff6b81}.training-progress-copy{font-size:.92rem;font-weight:700;color:#49657f}.training-progress-legend{display:flex;flex-wrap:wrap;gap:.55rem}.training-progress-pill{border-radius:999px;padding:.35rem .7rem;font-size:.82rem;font-weight:700}.training-progress-pill-good{background:#27c45b24;color:#13763a}.training-progress-pill-bad{background:#ff6b8124;color:#b3384c}.training-layout{display:grid;grid-template-columns:1fr;gap:1rem}.training-card{padding:1.6rem}.training-card-accent{background:linear-gradient(135deg,#fff6d8,#fff 42%,#edf5ff);display:grid;gap:1rem}.training-answer-box{min-height:110px;border-radius:22px;border:2px dashed rgba(20,70,160,.24);display:grid;align-items:center;background:#ffffffbf;padding:1rem}.training-answer-input{width:100%;border:0;background:transparent;font-size:1.35rem;color:#102033;outline:none}.training-toggle-row{display:flex;flex-wrap:wrap;gap:.8rem}.training-chip{border-radius:999px;background:#1446a014;color:#21486f;padding:.55rem .85rem;font-weight:700}.training-feedback{display:grid;gap:.75rem}.training-feedback p{margin:0;color:#42576d;line-height:1.5}.training-results-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem}.training-summary-card{border-radius:22px;padding:1rem;display:grid;gap:.25rem;text-align:center}.training-summary-card strong{font-size:2rem}.training-summary-card-correct{background:#fff3}.training-summary-card-wrong{background:#ffffff29}.training-summary-card-accented{background:#ffffff47}.training-summary-bars{display:grid;gap:.55rem}.training-summary-row{display:flex;justify-content:space-between;gap:1rem;font-weight:700}.training-correct{color:#1d9e4d}.training-wrong{color:#c04343}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.profile-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.profile-card{padding:1rem;border-radius:18px;background:#f6f9fe;border:1px solid rgba(20,70,160,.08)}.profile-label{display:block;margin-bottom:.45rem;color:#68839f;font-size:.82rem;text-transform:uppercase;letter-spacing:.08em}.settings-grid{display:grid;grid-template-columns:minmax(0,1fr)}.settings-panel{max-width:780px}.theme-option-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.theme-option-card{border:1px solid rgba(16,32,51,.08);border-radius:24px;background:linear-gradient(180deg,#fffffffa,#f4f8ffeb);padding:1.25rem;display:grid;gap:.45rem;text-align:left;color:#17385d;cursor:pointer;box-shadow:0 16px 34px #23425f14}.theme-option-card strong{font-size:1.15rem}.theme-option-card span:last-child{color:#60788f;line-height:1.5}.theme-option-card-active{border-color:#5960ff3d;box-shadow:0 18px 42px #5d61ff2e}.theme-option-icon{font-size:1.45rem}html[data-theme=dark] .auth-card,html[data-theme=dark] .app-card,html[data-theme=dark] .auth-form-panel,html[data-theme=dark] .topbar,html[data-theme=dark] .side-nav,html[data-theme=dark] .workspace-panel,html[data-theme=dark] .dashboard-card,html[data-theme=dark] .training-card,html[data-theme=dark] .training-hero,html[data-theme=dark] .term-card,html[data-theme=dark] .category-chip,html[data-theme=dark] .recent-item,html[data-theme=dark] .profile-card,html[data-theme=dark] .empty-state{background:#0f1724e0;border-color:#b8cae314;color:#eef4ff;box-shadow:0 24px 70px #00000038}html[data-theme=dark] .workspace-panel-secondary,html[data-theme=dark] .auth-form-panel,html[data-theme=dark] .empty-state,html[data-theme=dark] .term-card,html[data-theme=dark] .training-answer-box,html[data-theme=dark] .training-chip,html[data-theme=dark] .shortcut-card,html[data-theme=dark] .side-nav-link,html[data-theme=dark] .side-nav-action,html[data-theme=dark] .search-input,html[data-theme=dark] .form-stack input,html[data-theme=dark] .form-stack textarea,html[data-theme=dark] .theme-option-card,html[data-theme=dark] .menu-toggle{background:#192437eb;color:#eef4ff;border-color:#b8cae31f}html[data-theme=dark] .page-heading h3,html[data-theme=dark] .workspace-header h1,html[data-theme=dark] .panel-heading h2,html[data-theme=dark] .dashboard-card h2,html[data-theme=dark] .training-card h2,html[data-theme=dark] .training-card h3,html[data-theme=dark] .brand-block strong,html[data-theme=dark] .term-target,html[data-theme=dark] .metric-row,html[data-theme=dark] .recent-item strong{color:#f5f8ff}html[data-theme=dark] .page-heading p,html[data-theme=dark] .panel-heading p,html[data-theme=dark] .workspace-header p,html[data-theme=dark] .topbar-user,html[data-theme=dark] .field-hint,html[data-theme=dark] .metric-block p,html[data-theme=dark] .recent-target,html[data-theme=dark] .recent-meta,html[data-theme=dark] .dashboard-empty-copy,html[data-theme=dark] .training-progress-copy,html[data-theme=dark] .training-feedback p,html[data-theme=dark] .auth-inline-links a{color:#aabbd4}html[data-theme=dark] .menu-toggle span{background:#eef4ff}html[data-theme=dark] .secondary-button{background:#192437eb;color:#eef4ff;border-color:#b8cae31f}html[data-theme=dark] .theme-option-card span:last-child{color:#aabbd4}html[data-theme=dark] .theme-option-card-active{border-color:#8997ff73;box-shadow:0 20px 44px #00000052}html[data-theme=dark] .training-progress-pill-good{background:#27c45b33;color:#8bf4ad}html[data-theme=dark] .training-progress-pill-bad{background:#ff6b8133;color:#ffb3c0}@media (max-width: 720px){.auth-shell,.app-shell{padding:.9rem}.auth-card,.app-card{padding:1.25rem}.auth-form-panel{padding:1rem}.profile-grid{grid-template-columns:1fr}.button-row>*{width:100%}.workspace-header,.panel-heading{flex-direction:column}.workspace-actions{width:100%;justify-content:flex-start}.search-input{max-width:none}.topbar{padding:.8rem .9rem}.topbar-user{display:none}.app-content{padding:.85rem}.hero-card,.dashboard-card,.training-card,.training-hero,.workspace-panel{border-radius:24px}.hero-card,.training-hero,.dashboard-card,.workspace-panel,.training-card{padding:1rem}.dashboard-grid,.shortcut-grid,.stats-card,.training-layout,.training-results-grid,.theme-option-grid{grid-template-columns:1fr}}@media (max-width: 980px){.workspace-grid{grid-template-columns:1fr}.side-nav{position:fixed;inset:74px auto 0 0;transform:translate(-110%);transition:transform .24s ease;z-index:40;box-shadow:24px 0 60px #1020332e}.side-nav-open{transform:translate(0)}.side-nav-close{display:inline-flex}.side-nav-backdrop{position:fixed;top:74px;right:0;bottom:0;left:0;background:#1020333d;opacity:0;pointer-events:none;transition:opacity .24s ease;z-index:35;display:block}.side-nav-backdrop-visible{opacity:1;pointer-events:auto}}