:root{--page-background:linear-gradient(180deg, #080b10 0%, #111620 48%, #07090e 100%);--text:#f3f7fb;--heading:#fff;--muted:#a8b4c5;--muted-strong:#c9d4e2;--accent:#5eead4;--accent-strong:#38bdf8;--accent-soft:#5eead424;--accent-contrast:#041312;--warn:#fbbf24;--surface:#0f131ceb;--surface-strong:#171c27;--surface-soft:#1c222ee0;--tile:#171d29;--tile-hover:#1c2533;--tile-border:#cbd5e12e;--section-border:#cbd5e121;--control:#111827;--control-border:#cbd5e138;--panel:#0d1119;--panel-shadow:0 -24px 72px #0000008a;--selected:#5eead4;--selected-soft:#5eead429;--success:#22c55e;--success-soft:#22c55e29;--danger:#fb7185;--danger-soft:#fb718526;--focus-ring:0 0 0 3px #5eead438;color:var(--text);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-synthesis:none;text-rendering:optimizelegibility;background:#08090d;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html{min-width:320px;height:100%;overflow:hidden}body{overscroll-behavior:none;min-width:320px;height:100%;color:var(--text);background:var(--page-background);margin:0;overflow:hidden}#root{height:100%;overflow:hidden}button,input{font:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent}button:disabled{cursor:not-allowed;opacity:.55}button:focus-visible,input:focus-visible{box-shadow:var(--focus-ring);outline:none}.app-shell{height:100svh;max-width:720px;height:100dvh;min-height:0;padding:max(10px, env(safe-area-inset-top)) 10px max(10px, env(safe-area-inset-bottom));grid-template-rows:54px minmax(0,1fr);gap:10px;margin:0 auto;display:grid;overflow:hidden}.app-topbar{grid-template-columns:minmax(108px,auto) minmax(0,1fr) auto;align-items:center;gap:10px;min-height:0;padding:6px 0;display:grid}.app-brand,.brand-mini{align-items:center;gap:8px;min-width:0;display:flex}.app-brand{height:42px;overflow:hidden}.app-brand-mark,.brand-mark{border-radius:8px;flex:none;place-items:center;display:grid}.app-brand-mark{width:34px;height:34px;color:var(--accent-contrast);background:linear-gradient(135deg, var(--accent), #a7f3d0);box-shadow:0 8px 22px #5eead424}.app-title{min-width:0;color:var(--heading);text-overflow:ellipsis;white-space:nowrap;font-size:1rem;font-weight:950;line-height:1;overflow:hidden}.brand-mark{color:#fff;background:#0f766e;width:42px;height:42px;font-size:.78rem;font-weight:900;box-shadow:0 8px 22px #0f766e38}.brand-mini p,.brand-mini span,.status-kicker,h1,h2,h3{letter-spacing:0;margin:0}.brand-mini p{color:#102a2a;font-weight:900;line-height:1.05}.brand-mini span{color:#64748b;font-size:.82rem;font-weight:750;display:block}.lesson-screen{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:linear-gradient(#171c27eb,#0c1018f0);border:1px solid #0f766e29;border-radius:8px;grid-template-rows:minmax(0,1fr);gap:8px;min-height:0;padding:10px;display:grid;overflow:hidden;box-shadow:0 18px 48px #0000004d}.lesson-status{justify-content:space-between;align-items:flex-start;gap:10px;min-width:0;display:flex}.status-kicker{color:#0f766e;text-transform:uppercase;font-size:.72rem;font-weight:900}h1{color:#111827;font-size:clamp(1.38rem,8vw,2.2rem);line-height:1.02}h2{color:#101827;font-size:1.28rem}h3{color:#17202a;font-size:1rem}.app-title{color:var(--heading);font-size:clamp(.92rem,3.7vw,1.03rem);line-height:1}.sync-pill{width:36px;min-height:36px;color:var(--danger);background:var(--danger-soft);white-space:nowrap;border:1px solid #fb71854d;border-radius:999px;flex:0 0 36px;justify-content:center;align-items:center;padding:0;font-size:.72rem;font-weight:900;display:inline-flex}.top-progress{color:#134e4a;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:7px;min-width:0;font-size:.78rem;font-weight:900;display:grid}.top-actions{justify-content:flex-end;align-items:center;gap:6px;min-width:0;display:flex}.progress-track{background:#cbd5e11f;border-radius:999px;min-width:0;height:10px;overflow:hidden;box-shadow:inset 0 0 0 1px #cbd5e114}.progress-track span{border-radius:inherit;background:linear-gradient(90deg, var(--accent), var(--accent-strong), var(--warn));height:100%;transition:width .22s;display:block}.match-board{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-content:center;gap:10px;height:100%;min-height:0;display:grid}.word-column{grid-template-rows:repeat(5,minmax(66px,78px));align-content:center;gap:10px;min-height:0;display:grid}.word-tile{border:1px solid var(--tile-border);width:100%;min-width:0;height:100%;min-height:0;color:var(--text);text-align:center;background:linear-gradient(#1b2331,#131924);border-radius:8px;justify-content:center;align-items:center;gap:5px;padding:6px 8px;transition:transform .12s,border-color .12s,background-color .12s,color .12s,box-shadow .12s;display:flex;box-shadow:0 12px 24px #0000002e,inset 0 1px #ffffff0a}.word-tile:active{transform:scale(.982)}.word-tile.matched:active,.word-tile.wrong:active{transform:none}.word-tile span{overflow-wrap:anywhere;min-width:0;font-size:clamp(1.06rem,4.3vw,1.24rem);font-weight:900;line-height:1.08}.word-tile-with-action{grid-template-columns:minmax(0,1fr) 42px;padding:0;display:grid;overflow:hidden}.word-choice-button{width:100%;min-width:0;height:100%;min-height:0;color:inherit;text-align:center;background:0 0;border:0;justify-content:center;align-items:center;padding:6px 5px 6px 9px;display:flex}.priority-toggle{border:0;border-left:1px solid var(--tile-border);width:42px;height:100%;min-height:0;color:var(--muted);background:#ffffff0a;place-items:center;padding:0;display:grid}.priority-toggle.active{color:#090b10;background:#facc15;box-shadow:inset 0 0 0 1px #ffffff4d}.priority-toggle.active svg{fill:currentColor;stroke-width:2.6px}.word-tile.matched .priority-toggle{color:#dcfce7;background:#064e3b4d;border-left-color:#ffffff57}.word-tile.matched .priority-toggle.active{color:#111827;background:#facc15;box-shadow:inset 0 0 0 1px #ffffff75,0 0 0 1px #facc154d}.word-tile small{color:#7c2d12;background:#ffedd5;border-radius:999px;flex:none;padding:3px 6px;font-size:.62rem;font-weight:900}.word-tile.translation{justify-content:center}.word-tile.selected{color:var(--heading);border-color:var(--accent);box-shadow:var(--focus-ring), 0 12px 28px #5eead41a;background:linear-gradient(#143f49e0,#0e2931eb)}.word-tile.matched small{color:#ecfdf5;background:#ffffff2e}.word-tile.wrong{color:#fff;background:linear-gradient(#f43f5e,#be123c);border-color:#e11d48;animation:.26s shake}.completion-bar{color:#134e4a;background:#f0fdfa;border:1px solid #99f6e4;border-radius:8px;justify-content:space-between;align-items:center;gap:8px;padding:8px;font-size:.82rem;font-weight:850;display:flex}.menu-button{color:var(--accent-contrast);background:linear-gradient(135deg, var(--accent), #a7f3d0);border-color:#5eead46b;box-shadow:0 10px 24px #5eead41f}.menu-backdrop{z-index:20;background:#0f172a61;border:0;position:fixed;inset:0}.menu-panel{z-index:30;-webkit-overflow-scrolling:touch;max-height:min(86svh,760px);padding:8px 14px max(18px, env(safe-area-inset-bottom));border:1px solid var(--section-border);background:linear-gradient(#111720,#0c1018);border-radius:18px 18px 0 0;transition:transform .18s;position:fixed;bottom:0;left:0;right:0;overflow:auto;transform:translateY(106%);box-shadow:0 -24px 60px #0f172a42}.menu-panel.open{transform:translateY(0)}.menu-grip{background:#cbd5e1;border-radius:999px;width:42px;height:5px;margin:0 auto 10px}.menu-header,.sync-key-row,.inline-form{align-items:center;gap:8px;display:flex}.menu-header{justify-content:space-between;margin-bottom:12px}.panel-section{border-top:1px solid #f0dfc6;gap:10px;padding:16px 0;display:grid}.panel-section:first-of-type{border-top:0;padding-top:8px}.stack-form{gap:10px;display:grid}.section-heading{color:#0f766e;align-items:center;gap:8px;display:flex}.daily-goal-row{grid-template-columns:minmax(0,1fr) 88px;align-items:end;gap:10px;display:grid}.daily-goal-row strong{color:#134e4a;font-size:1.78rem;line-height:1;display:block}.daily-goal-row span,.goal-input,.empty-text{color:#64748b;font-size:.82rem;font-weight:800}.goal-input{gap:5px;display:grid}.goal-input input{text-align:center;min-height:38px;padding:8px 10px;font-weight:900}.goal-track{height:10px}.training-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.filter-option{border:1px solid var(--control-border);min-width:0;min-height:66px;color:var(--muted);text-align:left;background:linear-gradient(#141b27,#101620);border-radius:8px;align-content:center;gap:4px;padding:11px;display:grid}.filter-option strong,.filter-option span{overflow-wrap:anywhere;min-width:0;line-height:1.05}.filter-option strong{color:var(--heading);font-size:.9rem}.filter-option span{color:var(--accent);font-size:1.08rem;font-weight:900}.filter-option.active{border-color:var(--accent);box-shadow:inset 0 1px 0 #ffffff0d, var(--focus-ring);background:linear-gradient(#1444499e,#0f2930d1)}.filter-option:disabled{opacity:.45}.compact-text{color:#64748b;margin:0;font-size:.86rem;font-weight:700}.empty-text{margin:0}.difficult-list,.favorite-list,.custom-word-list{gap:10px;display:grid}.difficult-word,.favorite-word,.custom-word-row{background:#fff7ed;border:1px solid #fde4c7;border-radius:8px;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;min-width:0;padding:11px;display:grid}.difficult-word strong,.favorite-word strong,.custom-word-info strong{color:#17202a;overflow-wrap:anywhere;min-width:0;font-size:.96rem;line-height:1.05;display:block}.difficult-word span,.favorite-word span,.custom-word-info span{color:#64748b;overflow-wrap:anywhere;min-width:0;margin-top:3px;font-size:.82rem;font-weight:800;line-height:1.12;display:block}.favorite-unstar{color:#111827;background:#facc15;border-color:#facc1570}.favorite-unstar svg{fill:currentColor}.difficult-word small{color:#9f1239;white-space:nowrap;font-size:.72rem;font-weight:900}.custom-word-row.editing{align-items:start}.custom-edit-grid{gap:7px;display:grid}.custom-edit-grid input{min-height:38px;padding:8px 10px}.row-actions{gap:6px;display:flex}.grammar-static-preview{border:1px solid var(--control-border);background:var(--control);border-radius:8px;width:100%;min-width:0;height:148px;padding:0;overflow:hidden}.grammar-static-preview img{object-fit:cover;width:100%;height:100%;display:block}.grammar-modal{z-index:80;padding:max(18px, env(safe-area-inset-top)) 12px max(18px, env(safe-area-inset-bottom));place-items:center;display:grid;position:fixed;inset:0}.grammar-modal-backdrop{z-index:80}.grammar-modal-content{z-index:81;border:1px solid var(--tile-border);background:var(--panel);width:min(100%,720px);height:min(88svh,920px);box-shadow:var(--panel-shadow);border-radius:12px;place-items:center;display:grid;position:relative;overflow:hidden}.grammar-modal-content img{object-fit:contain;max-width:100%;max-height:100%}.grammar-modal-close{z-index:2;position:absolute;top:10px;right:10px}.compact-icon{flex-basis:42px;width:42px;min-height:42px}.sync-key-row{background:#f0fdfa;border:1px solid #99f6e4;border-radius:8px;justify-content:space-between;padding:10px}.sync-key-row code{overflow-wrap:anywhere;color:#134e4a;font-size:.8rem;font-weight:800}input{border:1px solid var(--control-border);width:100%;min-height:44px;color:var(--text);background:var(--control);border-radius:8px;outline:none;padding:10px 12px}.primary-action,.secondary-action,.icon-button{border:1px solid #0000;border-radius:8px;justify-content:center;align-items:center;gap:8px;min-height:44px;font-weight:900;display:inline-flex}.primary-action{color:var(--accent-contrast);background:linear-gradient(135deg, var(--accent), #a7f3d0);border-color:#5eead46b;padding:0 14px}.secondary-action{color:var(--text);background:var(--control);border-color:var(--control-border);padding:0 13px}.icon-button{width:44px;color:var(--text);background:var(--control);border-color:var(--control-border);flex:0 0 44px}.stat-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.stat-grid div{background:#fff7ed;border:1px solid #fde4c7;border-radius:8px;min-width:0;padding:11px}.stat-grid strong{color:#9a3412;font-size:1.18rem;display:block}.stat-grid span{color:#64748b;font-size:.8rem;font-weight:800}.brand-mark,.menu-button,.primary-action{color:var(--accent-contrast);background:linear-gradient(135deg, var(--accent), #a7f3d0);border-color:#5eead470}.brand-mark{box-shadow:0 10px 24px var(--accent-soft)}.brand-mini p,h1,h2,h3,.difficult-word strong,.favorite-word strong,.custom-word-info strong{color:var(--heading)}.brand-mini span,.top-progress,.compact-text,.daily-goal-row span,.goal-input,.empty-text,.difficult-word span,.favorite-word span,.custom-word-info span,.stat-grid span{color:var(--muted)}.status-kicker,.section-heading,.accordion-heading span{color:var(--accent)}.lesson-screen,.menu-panel{border-color:var(--section-border)}.lesson-screen{box-shadow:0 22px 52px #0000004d}.menu-panel{box-shadow:var(--panel-shadow);background:linear-gradient(#111720,#0c1018)}.menu-backdrop{background:#00000085}.menu-grip{background:var(--control-border)}.panel-section{border-top-color:var(--section-border)}.progress-track{background:var(--surface-soft)}.progress-track span{background:linear-gradient(90deg, var(--accent-strong), var(--accent), var(--warn))}.word-tile,input,.secondary-action,.icon-button{color:var(--text);border-color:var(--control-border);background:var(--control)}.word-tile{border-color:var(--tile-border);background:linear-gradient(#1b2331,#131924);box-shadow:0 12px 24px #0000002e,inset 0 1px #ffffff0a}.word-tile.selected{border-color:var(--selected);box-shadow:var(--focus-ring), 0 12px 28px #5eead41a;background:linear-gradient(#143f49e0,#0e2931eb)}.word-tile.matched{color:#fff;border-color:var(--success);background:linear-gradient(#16a34a,#15803d);box-shadow:0 8px 22px #22c55e3d}.word-tile.wrong{color:#fff;border-color:var(--danger);background:linear-gradient(#f43f5e,#be123c)}.completion-bar,.sync-key-row,.difficult-word,.favorite-word,.custom-word-row,.stat-grid div{color:var(--text);border-color:var(--tile-border);background:var(--surface-soft)}.daily-goal-row strong,.stat-grid strong,.sync-key-row code{color:var(--accent)}.difficult-word small{color:var(--danger)}.danger-icon{color:var(--danger);background:var(--danger-soft);border-color:#fb71854d}input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.accordion-section{gap:0}.accordion-heading{width:100%;min-height:46px;color:var(--muted);background:0 0;border:0;justify-content:space-between;align-items:center;gap:10px;padding:0;display:flex}.accordion-heading span{align-items:center;gap:8px;min-width:0;display:inline-flex}.accordion-heading strong{color:var(--heading);font-size:1rem}.accordion-content{gap:10px;padding-top:10px;display:grid}@keyframes shake{0%,to{transform:translate(0)}35%{transform:translate(-5px)}70%{transform:translate(5px)}}@media (hover:hover) and (pointer:fine){.word-tile:not(.selected,.matched,.wrong):hover{background:linear-gradient(#202a3a,#151d29);border-color:#5eead46b}.icon-button:hover,.secondary-action:hover,.filter-option:hover{background:var(--surface-soft);border-color:#5eead45c}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@media (min-width:760px){.app-shell{max-width:980px;padding-inline:24px}.lesson-screen{padding:18px}.word-column{grid-template-rows:repeat(5,minmax(72px,84px));gap:12px}.word-tile{padding-inline:12px}.menu-panel{width:390px;height:100svh;max-height:none;padding:max(16px, env(safe-area-inset-top)) 18px max(18px, env(safe-area-inset-bottom));border-radius:0;top:0;left:auto;transform:translate(106%)}.menu-panel.open{transform:translate(0)}.menu-grip{display:none}}@media (max-width:390px){.app-shell{gap:7px;padding-inline:8px}.app-topbar{grid-template-columns:minmax(96px,auto) minmax(0,1fr) auto;gap:7px}.app-brand{gap:6px}.app-brand-mark{width:30px;height:30px}.app-title{font-size:.88rem}.top-progress{gap:5px;font-size:.72rem}.lesson-screen{padding:7px}.word-column{grid-template-rows:repeat(5,minmax(60px,74px));gap:9px}.word-tile{padding:5px 6px}.word-tile span{font-size:clamp(.98rem,4vw,1.12rem)}}@media (max-height:720px){.app-shell{padding-top:max(6px, env(safe-area-inset-top));padding-bottom:max(6px, env(safe-area-inset-bottom));grid-template-rows:46px minmax(0,1fr);gap:6px}.app-topbar{padding:2px 0}.app-brand{height:38px}.app-brand-mark{width:30px;height:30px}.sync-pill{flex-basis:32px;width:32px;min-height:32px;font-size:.68rem}.progress-track{height:9px}.lesson-screen{gap:6px;padding:6px}.word-column{grid-template-rows:repeat(5,minmax(52px,64px));gap:7px}.word-tile{padding:4px 5px}.word-tile span{font-size:clamp(.88rem,3.7vw,1.04rem)}}