@layer reset,tokens,base,layout,components,utilities,feature;@layer reset.reset{*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0}}@layer tokens.tokens{:root{--bg: #f8fafc;--panel: #ffffff;--muted: #475569;--text: #0f172a;--accent: #0ea5e9;--bad: #ef4444;--good: #10b981;--card: #ffffff;--ring: #e2e8f0;--sb-track: rgba(0, 0, 0, .06);--sb-thumb: rgba(0, 0, 0, .22);--sb-thumb-hover: rgba(14, 165, 233, .45);--sb-thumb-active: rgba(14, 165, 233, .65);--sb-corner: transparent;--ring-strong: #94a3b8;--overlay: rgba(0, 0, 0, .18);--menu-active-bg: rgba(14, 165, 233, .12);--kpi-bg: rgba(148, 163, 184, .16);--panel-grad-1: var(--panel);--panel-grad-2: color-mix(in oklab, var(--panel) 92%, black 8%);--bg-spot: color-mix(in oklab, var(--accent) 18%, var(--bg) 82%);--bg-spot-fallback: #e6f2ff}:root[data-theme=dark]{--bg: #0f172a;--panel: #111827;--muted: #94a3b8;--text: #e5e7eb;--accent: #22d3ee;--bad: #f87171;--good: #34d399;--card: #0b1220;--ring: #1f2937;--sb-size: 10px;--sb-radius: 10px;--sb-track: rgba(255, 255, 255, .06);--sb-thumb: rgba(255, 255, 255, .22);--sb-thumb-hover: rgba(34, 211, 238, .45);--sb-thumb-active: rgba(34, 211, 238, .65);--sb-corner: transparent;--ring-strong: #1f2a44;--overlay: rgba(0, 0, 0, .35);--menu-active-bg: rgba(34, 211, 238, .07);--kpi-bg: rgba(15, 23, 42, .6);--panel-grad-1: #0b1220;--panel-grad-2: #0a0f1a;--bg-spot: color-mix(in oklab, var(--accent) 30%, #0a1224 70%);--bg-spot-fallback: #13203f}:root[data-theme=kids]{--bg: #fff7ef;--panel: #ffffff;--muted: #475569;--text: #0f172a;--accent: #ff7ac8;--bad: #ff5d5d;--good: #22c55e;--card: #ffffff;--ring: #ffd7ae;--sb-size: 10px;--sb-radius: 10px;--sb-track: rgba(0, 0, 0, .06);--sb-thumb: rgba(255, 122, 200, .55);--sb-thumb-hover: rgba(255, 122, 200, .75);--sb-thumb-active: rgba(255, 122, 200, .95);--sb-corner: transparent;--ring-strong: #f4b980;--overlay: rgba(0, 0, 0, .16);--menu-active-bg: rgba(255, 122, 200, .14);--kpi-bg: rgba(255, 215, 174, .28);--panel-grad-1: var(--panel);--panel-grad-2: color-mix(in oklab, var(--panel) 90%, var(--accent) 10%);--bg-spot: color-mix(in oklab, var(--accent) 28%, var(--bg) 72%);--bg-spot-fallback: #ffe8f5}}@layer base.base{html,body{min-height:100%}html{background:var(--bg);scrollbar-gutter:stable both-edges}body{background:transparent;color:var(--text);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;position:relative;z-index:0}body:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse clamp(700px,65vw,1200px) clamp(420px,45vh,800px) at 20% -10%,var(--bg-spot, var(--bg-spot-fallback)) 0%,var(--bg) 40%),var(--bg);transform:translateZ(0);will-change:transform}select,input{background:var(--panel);color:var(--text);border:1px solid var(--ring);padding:8px 10px;border-radius:10px;font-size:1rem}*{scrollbar-width:thin;scrollbar-color:var(--sb-thumb) var(--sb-track)}*::-webkit-scrollbar{width:var(--sb-size);height:var(--sb-size)}*::-webkit-scrollbar-track{background:var(--sb-track);border-radius:var(--sb-radius)}*::-webkit-scrollbar-thumb{background:var(--sb-thumb);border-radius:var(--sb-radius);border:1px solid var(--ring)}*::-webkit-scrollbar-thumb:hover{background:var(--sb-thumb-hover);border-color:var(--accent)}*::-webkit-scrollbar-thumb:active{background:var(--sb-thumb-active);border-color:var(--accent)}*::-webkit-scrollbar-corner{background:var(--sb-corner)}@media (prefers-reduced-motion: reduce){*::-webkit-scrollbar-thumb{transition:none}}}@layer layout.layout{.container{max-width:980px;margin:0 auto;padding:16px;box-sizing:border-box}.header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.title{font-size:22px;font-weight:700;letter-spacing:.2px}.controls{display:flex;gap:8px;flex-wrap:wrap}.grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}@media (max-width: 720px){.grid{grid-template-columns:1fr}}.col{background:linear-gradient(180deg,var(--panel-grad-1),var(--panel-grad-2));border:1px solid var(--ring);border-radius:16px;padding:14px}.col h3{margin:4px 0 12px;font-size:14px;color:var(--muted);font-weight:600;letter-spacing:.3px}.list{display:grid;gap:8px}.footer{display:flex;gap:10px;align-items:center;justify-content:space-between;margin-top:18px;flex-wrap:wrap}.kpis{display:flex;gap:10px;flex-wrap:wrap;color:var(--muted)}.kpi{background:var(--kpi-bg);border:1px solid var(--ring);padding:6px 10px;border-radius:10px}.card-row{display:flex;align-items:center;justify-content:space-between;gap:8px}.card-text{flex:1 1 auto}.layout{position:relative}.sidebar{position:fixed;inset:0 auto 0 0;width:260px;background:linear-gradient(180deg,var(--panel-grad-1),var(--panel-grad-2));border-right:1px solid var(--ring);transform:translate(-100%);transition:transform .2s ease;z-index:40;padding:16px 12px;display:flex;flex-direction:column;gap:8px;box-sizing:border-box}.sidebar.open{transform:translate(0)}.sidebar-header{font-weight:700;letter-spacing:.3px;color:var(--text);margin-bottom:8px;display:flex;align-items:center;justify-content:space-between;gap:8px}.sidebar-section{color:var(--muted);font-size:12px;margin:10px 6px 6px}.menu{display:grid;gap:6px}.menu-item{display:flex;align-items:center;gap:10px;padding-block:10px;padding-inline:12px;border-radius:12px;background:transparent;border:1px solid var(--ring);color:var(--text);cursor:pointer;text-align:start}.menu-item:hover{border-color:var(--ring-strong)}.menu-item.active{border-color:var(--accent);background:var(--menu-active-bg)}.sidebar-footer{margin-top:auto;color:var(--muted);font-size:12px;padding:8px 6px}.overlay{position:fixed;inset:0;background:var(--overlay);z-index:30;opacity:0;pointer-events:none;transition:opacity .2s ease}.overlay.show{opacity:1;pointer-events:auto}@media (min-width: 960px){.layout{display:grid;grid-template-columns:260px 1fr;gap:16px;align-items:start}.sidebar{position:sticky;top:16px;height:calc(100dvh - 32px);overflow:auto;transform:none}.overlay{display:none}.main{margin-left:0}.hamburger{display:none}}.hamburger{background:var(--panel);border:1px solid var(--ring);border-radius:10px;padding:6px 10px;cursor:pointer}.hamburger:hover{border-color:var(--accent)}}@layer components{@layer components{.btn{background:var(--panel);color:var(--text);border:1px solid var(--ring);padding:8px 12px;border-radius:12px;cursor:pointer}.btn:hover{border-color:var(--accent)}.btn.primary{background:linear-gradient(180deg,#0ea5e9,#0891b2);border:none}.select,.input{background:var(--panel);color:var(--text);border:1px solid var(--ring);padding:8px 10px;border-radius:10px}.box{background:var(--card);border:1px solid var(--ring);padding:10px 12px;border-radius:12px;-webkit-user-select:none;user-select:none}.progress{height:10px;border-radius:999px;background:#0b1220;border:1px solid var(--ring);overflow:hidden;width:180px}.bar{height:100%;width:0%;background:linear-gradient(90deg,#34d399,#22d3ee)}.icon-btn{background:transparent;border:1px solid #1b2741;padding:4px 6px;border-radius:8px;cursor:pointer;line-height:1;font-size:14px;margin-left:8px}.icon-btn:hover{border-color:#22d3ee}button svg,.menu-item svg,.icon-btn svg{flex-shrink:0;vertical-align:middle}.menu-item svg,.icon-btn svg,.header svg{stroke:var(--text);transition:stroke .15s ease,border-color .15s ease}.menu-item:hover svg,.icon-btn:hover svg,.header .btn:hover svg,.hamburger:hover svg{stroke:var(--accent)}.menu-item,.icon-btn,.header .btn,.hamburger{border-color:var(--ring);transition:border-color .15s ease}.menu-item:hover,.icon-btn:hover,.header .btn:hover,.hamburger:hover{border-color:var(--accent)}.menu-item,.icon-btn,.header .btn,.hamburger{transition:transform .08s ease,border-color .15s ease,background-color .15s ease,box-shadow .15s ease;will-change:transform}.menu-item:active,.icon-btn:active,.header .btn:active,.hamburger:active{transform:scale(.97)}.menu-item:hover,.icon-btn:hover,.header .btn:hover,.hamburger:hover{box-shadow:0 2px 10px #22d3ee26;background-color:#22d3ee12}.menu-item:focus-visible,.icon-btn:focus-visible,.header .btn:focus-visible,.hamburger:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.card{color:inherit;background:var(--card);border:1px solid var(--ring);padding:10px 12px;border-radius:12px;cursor:pointer;-webkit-user-select:none;user-select:none;transition:transform .08s ease,border-color .15s ease,background-color .15s ease,box-shadow .15s ease;will-change:transform;line-height:1.35;min-height:44px;display:flex;align-items:center}.card:hover{box-shadow:0 2px 10px color-mix(in oklab,var(--accent) 15%,transparent);border-color:var(--ring-strong);background-color:var(--menu-active-bg)}.card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.game-card{color:inherit;background:var(--card);border:1px solid #0f1b2f;padding:10px 12px;border-radius:12px;cursor:pointer;-webkit-user-select:none;user-select:none;transition:transform .08s ease,border-color .15s ease,background-color .15s ease,box-shadow .15s ease;will-change:transform;line-height:1.35;min-height:44px;display:flex;align-items:center}.game-card:hover{transform:scale(1.03);box-shadow:0 2px 10px #22d3ee26;border-color:var(--accent);background-color:#22d3ee12}.game-card:active{transform:scale(.97)}.game-card.selected{outline:2px solid var(--accent)}.game-card.matched{border-color:#34d39999;opacity:.75}.game-card.badflash{outline:2px solid var(--bad)}.header{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:12px;min-height:56px;padding-inline:12px;border-bottom:1px solid var(--ring);background:var(--bg);color:var(--text)}.header__menu{justify-self:start}.header__brand{display:inline-flex;align-items:center;gap:8px;min-width:0}.header__brandText{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.header__lang{display:inline-flex;align-items:center;gap:8px}.header__langLabel{color:var(--muted)}.header__langControl{position:relative;display:inline-flex;align-items:center}.header__langIcon{margin-inline-end:6px;opacity:.8}.header__select{min-width:104px}.header__user{display:inline-flex;align-items:center;gap:8px;justify-self:end}.pill{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:12px;font-size:12px;background:#ffffff1f}.pill--pro{background:#2196f340}.pill--free{background:#4caf5040}.pill--role{background:#ffd70033}.upper{text-transform:uppercase}.header .btn:not(.btn--icon)>svg{margin-inline-end:6px}@media (max-width: 479px){.header{display:flex;align-items:center;gap:8px;min-height:52px;flex-wrap:nowrap}.header__menu{flex:0 0 auto}.header__brand{flex:1 1 auto;min-width:0}.header__brandText{display:none}.header__lang,.header__user{flex:0 0 auto;white-space:nowrap;gap:6px}.header__langLabel,.header__user .pill,.header .btn .btn__label{display:none}.header__select{font-size:16px!important;line-height:1.2}.btn--icon{width:32px;height:32px}.header__select option,.select option{font-size:16px}}@media (min-width: 480px) and (max-width: 767px){.header__brandText{max-width:18ch}.header__select{min-width:84px}}@media (min-width: 768px){.header{min-height:60px}}@media (prefers-reduced-motion: reduce){.menu-item,.icon-btn,.header .btn,.hamburger,.card{transition:border-color .15s ease,background-color .15s ease}.menu-item:hover,.icon-btn:hover,.header .btn:hover,.hamburger:hover,.card:hover,.menu-item:active,.icon-btn:active,.header .btn:active,.hamburger:active,.card:active{transform:none}}.backdrop{position:fixed;inset:0;background:#0006;display:flex;align-items:center;justify-content:center;z-index:1000}.modal{color:var(--text);background:var(--bg);border:1px solid var(--ring);border-radius:12px;padding:16px;box-shadow:0 10px 30px #0003;max-width:880px;width:90vw}.modal .btn{color:inherit;-webkit-text-fill-color:currentColor}.modal__header,.modal__footer{display:flex;align-items:center}.modal__header{justify-content:space-between;gap:12px}.modal__footer{justify-content:flex-end;gap:8px}.table{width:100%;border-collapse:collapse}.table th,.table td{border-bottom:1px solid var(--ring);padding:6px 8px;text-align:left}.table th{font-size:12px;color:var(--muted)}.scrollbox-200{max-height:200px;overflow:auto}.scrollbox-220{max-height:220px;overflow:auto}.modal--sheet{max-width:none;width:100%;border-radius:12px 12px 0 0;margin-top:auto}@media (min-width: 480px){.modal--sheet{max-width:420px;width:90vw;border-radius:12px}}}@layer components{.MuiChip-root{background:var(--kpi-bg)!important;color:var(--text)!important;border:1px solid var(--ring)!important;border-radius:12px!important}.MuiChip-root:hover{border-color:var(--ring-strong)!important;background-color:var(--menu-active-bg)!important;box-shadow:0 2px 10px color-mix(in oklab,var(--accent) 15%,transparent)!important}.MuiChip-root:focus-visible{outline:2px solid var(--accent)!important;outline-offset:2px!important}.MuiChip-deleteIcon{color:var(--muted)!important}.MuiChip-deleteIcon:hover{color:var(--bad)!important}}@layer components{.MuiOutlinedInput-root{background:var(--panel)!important;color:var(--text)!important;border-radius:10px!important}.MuiOutlinedInput-notchedOutline{border-color:var(--ring)!important}.MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline{border-color:var(--ring-strong)!important}.MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline{border-color:var(--accent)!important}.MuiSelect-icon{color:var(--muted)!important}.MuiPaper-root.MuiMenu-paper{background:var(--panel)!important;color:var(--text)!important;border:1px solid var(--ring)!important}}}@layer utilities{@layer utilities{.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.row{display:inline-flex;align-items:center;gap:8px}.row.between{justify-content:space-between;width:100%}.stack{display:grid;gap:8px}.truncate{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.btn--icon{display:inline-grid;place-items:center;width:36px;height:36px;padding:0;border-radius:8px}}.text-sm{font-size:12px;line-height:1.4}.text-base{font-size:14px;line-height:1.5}.text-lg{font-size:16px;font-weight:600}.text-muted{color:var(--muted)}.text-primary{color:var(--text)}.kpi--done{background:var(--good);color:var(--ring)}.kpi--pending{background:var(--ring);color:var(--text)}.icon-success,.icon-default,.icon-muted{vertical-align:-2px;display:inline-flex;stroke:currentColor;fill:none}.icon-success{color:var(--good, #16a34a)}.icon-default{color:var(--accent, var(--text))}.icon-muted{color:var(--muted, #94a3b8)}}@layer feature.feature{.topic-picker{border:1px solid var(--ring);border-radius:12px;background:var(--panel);width:100%;box-sizing:border-box}.topicbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border-bottom:1px solid var(--ring);background:#00000014}.topicbar .current{display:flex;align-items:center;gap:8px;min-width:0;color:var(--text);flex:1}.topicbar .dot{width:8px;height:8px;border-radius:999px;background:var(--good);flex:0 0 auto}.topicbar .title{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.topicbar .search.input{min-width:240px}.topicbar .toggle.btn{white-space:nowrap}.topic-body{padding:12px;max-height:52vh;overflow:auto}.topic-error{color:var(--bad);margin-top:8px;font-size:13px}.topic-section{margin-bottom:20px}.topic-row-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;padding-inline:4px}.topic-row-title{margin:0;font-size:16px;color:var(--text)}.shelf{overflow-x:auto;padding-bottom:6px;overflow-y:hidden;scrollbar-gutter:stable both-edges}.shelf-inner{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(180px,1fr);gap:12px;contain:paint}.topic-card{display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;text-align:left;padding:16px;border-radius:12px;background:var(--card);border:1px solid var(--ring);transition:border-color .15s ease,background-color .15s ease,box-shadow .15s ease;box-shadow:0 1px 2px #0000000a}.topic-card:hover{box-shadow:0 2px 10px #22d3ee26;border-color:var(--accent);background-color:#22d3ee12}.topic-card.is-selected{outline:none;box-shadow:inset 0 0 0 2px var(--accent),0 4px 12px #22d3ee2e}.topic-card .t-title{font-weight:600;margin-bottom:6px;color:var(--text)}.topic-card .t-meta{font-size:12px;color:var(--muted)}.lesson-shelf{margin-top:10px;overflow-x:auto;padding-bottom:6px;scrollbar-gutter:auto}.lesson-pill{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;border:1px solid var(--ring);background:#0f172a;padding:8px 12px;border-radius:999px;cursor:pointer;transition:border-color .15s ease,background-color .15s ease,box-shadow .15s ease}.lesson-pill:hover{border-color:var(--accent);box-shadow:0 2px 10px #22d3ee26;background-color:#22d3ee12}.lesson-pill.is-current{outline:none;box-shadow:inset 0 0 0 2px #38bdf8;border-color:#38bdf8}.lesson-pill.is-busy{opacity:.6;pointer-events:none}.lesson-pill .l-title{font-size:13px;color:var(--text)}.badge-current{font-size:11px;padding:2px 6px;border-radius:999px;background:var(--accent);color:#001018;font-weight:700}.topic-empty{text-align:center;padding:40px 0;color:var(--muted)}.topic-empty .reload.btn{border-color:var(--ring)}.topic-card:focus-visible,.lesson-pill:focus-visible,.topicbar .toggle.btn:focus-visible,.topicbar .search.input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media (prefers-reduced-motion: reduce){.topic-card,.lesson-pill{transition:border-color .15s ease,background-color .15s ease}}.topic-section>.shelf>.shelf-inner{display:flex!important;flex-wrap:wrap!important;gap:12px;justify-content:center;align-content:flex-start}.topic-section>.shelf>.shelf-inner>.topic-card{flex:0 1 140px;max-width:100%;width:auto}@media (max-width: 480px){.topic-section>.shelf>.shelf-inner>.topic-card{flex-basis:100%}}.topicbar-actions{display:flex;align-items:center;gap:8px}@media (max-width: 640px){.topicbar{flex-wrap:wrap;gap:8px 12px}.topicbar-actions{flex:1 0 100%;order:2}.topicbar .search.input{min-width:0;width:100%;flex:1 1 auto}.topicbar .toggle.btn{flex:0 0 auto}}.topicbar .toggle.btn{display:inline-flex;align-items:center;gap:6px}.topicbar .toggle .icon{line-height:0;display:inline-flex}@media (max-width: 640px){.topicbar .toggle .toggle-label{display:none}}@layer feature{.backdrop{position:fixed;inset:0;z-index:11000;display:grid;place-items:center;background:#00000080;padding:16px;overscroll-behavior:contain}.modal{background:var(--panel);color:var(--text);border:1px solid var(--ring);border-radius:12px;width:min(720px,92vw);max-height:85vh;box-shadow:0 30px 80px #0000008c;display:flex;flex-direction:column;overflow:hidden}.modal__header,.modal__footer{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px;background:var(--panel);z-index:1}.modal__header{position:sticky;top:0;border-bottom:1px solid var(--ring)}.modal__footer{position:sticky;bottom:0;border-top:1px solid var(--ring)}.modal__body{padding:12px;overflow:auto}.modal__body .table{width:100%}.modal__body th,.modal__body td{word-break:break-word}@media (max-width: 640px){.backdrop{padding:0}.modal{width:100vw;height:100vh;max-height:100vh;border-radius:0}.modal__header{padding-top:calc(12px + env(safe-area-inset-top,0px))}.modal__footer{padding-bottom:calc(12px + env(safe-area-inset-bottom,0px))}}}@layer feature{.modal{width:clamp(520px,92vw,880px);max-height:78vh}@supports (height: 1dvh){.modal{max-height:clamp(70dvh,82dvh,88dvh)}}.modal__body{padding:12px;overflow:auto;overscroll-behavior:contain}.scrollbox-200{max-height:260px;overflow:auto}.scrollbox-220{max-height:320px;overflow:auto}@supports (height: 1dvh){.scrollbox-200{max-height:min(34dvh,280px)}.scrollbox-220{max-height:min(42dvh,360px)}}@media (max-width: 640px){.backdrop{padding:0}.modal{width:100vw;height:100vh;max-height:100vh;border-radius:0}@supports (height: 1svh){.modal{height:100svh;max-height:100svh}}@supports (height: 1dvh){.modal{height:100dvh;max-height:100dvh}}.modal__header{padding-top:calc(12px + env(safe-area-inset-top,0px))}.modal__footer{padding-bottom:calc(12px + env(safe-area-inset-bottom,0px))}.scrollbox-200{max-height:40svh}.scrollbox-220{max-height:48svh}}}@layer feature{.backdrop{position:fixed;inset:0;display:grid;place-items:center;background:#00000080;padding:16px;z-index:11000}.modal{display:flex;flex-direction:column;width:min(720px,92vw);max-height:82vh;background:var(--panel);color:var(--text);border:1px solid var(--ring);border-radius:12px;box-shadow:0 30px 80px #0000008c;overflow:hidden}.modal__header,.modal__footer{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px;background:var(--panel);z-index:1}.modal__header{position:sticky;top:0;border-bottom:1px solid var(--ring)}.modal__footer{position:sticky;bottom:0;border-top:1px solid var(--ring)}.modal__body{flex:1 1 auto;min-height:0;overflow:auto;padding:12px}.topic-card.scrollbox-200,.topic-card.scrollbox-220{display:block;overflow:auto}.scrollbox-200{max-height:260px}.scrollbox-220{max-height:320px}@media (max-width: 640px){.backdrop{padding:0}.modal{width:100vw;height:100vh;max-height:100vh;border-radius:0}.modal__header{padding-top:calc(12px + env(safe-area-inset-top,0px))}.modal__footer{padding-bottom:calc(12px + env(safe-area-inset-bottom,0px))}}}}@layer feature.feature{.curriculum-picker{border:1px solid var(--ring);border-radius:12px;background:var(--panel);padding:12px}.curriculum-picker .toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;flex-wrap:wrap}.curriculum-picker .toolbar .search{flex:1 1 260px;min-width:180px}.curriculum-picker .toolbar .search input{width:100%;padding:10px 12px;border-radius:10px;background:var(--card);border:1px solid var(--ring);color:var(--text);outline:none}.curriculum-picker .toolbar .actions{display:flex;gap:8px;flex:0 0 auto}.curriculum-picker .create-panel{border:1px solid var(--ring);border-radius:12px;background:var(--card);padding:12px;margin-bottom:12px}.curriculum-picker .create-panel .row{display:flex;gap:12px;align-items:center;margin-bottom:10px}.curriculum-picker .create-panel .row.right{justify-content:flex-end}.curriculum-picker .create-panel .row.compact{display:grid;grid-template-columns:1fr auto 14px auto;gap:10px;align-items:center}.curriculum-picker .create-panel .title-input,.curriculum-picker .create-panel .lang-select{padding:10px 12px;border-radius:10px;border:1px solid var(--ring);outline:none}.curriculum-picker .create-panel .title-input{background:var(--bg);color:var(--text)}.curriculum-picker .create-panel .lang-select{background:var(--card);color:var(--text)}.curriculum-picker .create-panel .arrow{text-align:center;color:var(--muted)}.curriculum-picker .lesson-list{border:1px dashed var(--ring);border-radius:10px;padding:8px;max-height:clamp(420px,50vh,680px);overflow:auto;background:var(--bg);-webkit-overflow-scrolling:touch}.curriculum-picker .lesson-row-wrap{border-radius:8px;padding:6px}.curriculum-picker .lesson-row-wrap:is(:hover,.is-checked){background:#ffffff05}.curriculum-picker .lesson-row-wrap.is-checked{box-shadow:inset 0 0 0 1px #22d3ee40}.curriculum-picker .lesson-row{display:grid;grid-template-columns:auto auto minmax(120px,1fr) minmax(0,2fr) auto auto;gap:8px;align-items:center;width:100%}.curriculum-picker .pill{display:inline-flex;align-items:center;padding:2px 8px;border-radius:999px;background:var(--panel);border:1px solid var(--ring);color:var(--muted);font-size:12px;white-space:nowrap}.curriculum-picker .lesson-title{color:var(--text);font-size:12px;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.curriculum-picker .lesson-row .chips{display:flex;gap:6px;align-items:center;white-space:normal;flex-wrap:wrap;max-width:140px;overflow:hidden;text-overflow:ellipsis}.curriculum-picker .lesson-row .chips.expanded{overflow:visible;white-space:normal;flex-wrap:wrap}.curriculum-picker .chip{display:inline-flex;align-items:center;padding:2px 8px;border-radius:999px;background:var(--panel);border:1px solid var(--ring);color:var(--muted);font-size:12px}.curriculum-picker .chip.small{font-size:11px;padding:2px 6px}.curriculum-picker .chip.x-small{font-size:10px;padding:1px 6px}.curriculum-picker .lesson-row .more-btn{white-space:nowrap;justify-self:end}.curriculum-picker .lesson-row .row-check{width:18px;height:18px}.curriculum-picker .lesson-expanded{margin-top:6px;display:flex;gap:6px;flex-wrap:wrap}.curriculum-picker .lesson-expanded .chip{max-width:none}.curriculum-picker .curriculum-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}.curriculum-picker .curriculum-card{display:flex;flex-direction:column;justify-content:space-between;background:var(--card);border:1px solid var(--ring);border-radius:12px;padding:12px;transition:transform .08s ease,border-color .15s ease,background-color .15s ease,box-shadow .15s ease;box-shadow:0 1px 2px #0000000a}.curriculum-picker .curriculum-card:hover{transform:translateY(-1px)}.curriculum-picker .curriculum-card.active{border-color:var(--accent);box-shadow:0 0 0 2px #22d3ee33}.curriculum-picker .card-header .title-line{display:flex;align-items:center;justify-content:space-between;gap:6px}.curriculum-picker .curriculum-title{color:var(--text);font-weight:600;line-height:1.2;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.curriculum-picker .badge{padding:2px 8px;border-radius:999px;font-size:12px;background:var(--panel);border:1px solid var(--ring);color:var(--accent)}.curriculum-picker .langs{display:flex;align-items:center;gap:8px;margin-top:6px}.curriculum-picker .langs .arrow{color:var(--muted)}.curriculum-picker .card-body{margin:8px 0;color:var(--muted)}.curriculum-picker .lesson-chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}.curriculum-picker .chip.more{color:var(--accent)}.curriculum-picker .card-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px}.curriculum-picker .details{margin-top:8px}.curriculum-picker .details summary{cursor:pointer;color:var(--muted)}.curriculum-picker .details-list{margin-top:6px;border-top:1px dashed var(--ring);padding-top:6px}.curriculum-picker .details-row{display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:center;padding:6px 0}.curriculum-picker .details-row .label{color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.curriculum-picker .mini-chips{display:flex;gap:6px;flex-wrap:wrap}.curriculum-picker .btn,.curriculum-picker .btn-ghost,.curriculum-picker .btn-danger{padding:8px 12px;border-radius:10px;border:1px solid var(--ring);background:var(--panel);color:var(--text);cursor:pointer;transition:background-color .15s ease,border-color .15s ease,transform .08s ease;-webkit-tap-highlight-color:transparent}.curriculum-picker .btn:hover{border-color:var(--accent)}.curriculum-picker .btn-ghost{background:transparent;color:var(--muted)}.curriculum-picker .btn-ghost:hover{color:var(--text);border-color:var(--ring)}.curriculum-picker .btn-danger{border-color:#3a1f20;background:#2a0f12;color:#ff9aa2}.curriculum-picker .btn-danger:hover{border-color:var(--bad);color:#ffe5e7}.curriculum-picker .btn.small,.curriculum-picker .btn-ghost.small{padding:6px 10px;font-size:12px}.curplay-row{display:grid;grid-template-columns:28px 1fr auto;align-items:center}.curplay-row .meta{display:flex;flex-direction:column;justify-content:center;min-width:0;line-height:1.3}.curplay-row.is-locked{opacity:.65}.curplay-row.is-unlocked{opacity:1}.curplay-row.is-done{opacity:.9}.curplay-row:is(.is-unlocked,.is-done):is(:hover,:focus-visible){box-shadow:0 0 0 2px var(--ring) inset}.curplay-row[disabled]{pointer-events:none;cursor:not-allowed;box-shadow:none}.curplay-row .pill{display:flex;justify-content:center;align-items:center;width:24px;height:24px;border-radius:50%;color:#fff}@media (max-width: 1024px){.curriculum-picker .curriculum-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}}@media (max-width: 640px){.curriculum-picker .create-panel .row.compact{grid-template-columns:1fr auto 12px auto}.curriculum-picker .lesson-row{grid-template-columns:auto minmax(120px,1fr) minmax(80px,1fr) auto auto;gap:6px}.curriculum-picker .lesson-row .chips{max-width:100px}.curriculum-picker .toolbar{gap:8px}.curriculum-picker .curriculum-card{padding:10px}}@media (max-width: 480px){.curriculum-picker .toolbar .search{flex:1 1 100%;min-width:0}.curriculum-picker .toolbar .actions{width:100%;justify-content:flex-end}.curriculum-picker .create-panel .row.compact{grid-template-columns:1fr}.curriculum-picker .create-panel .arrow{display:none}.curriculum-picker .create-panel .lang-select{width:100%}.curriculum-picker .lesson-row{grid-template-columns:auto 1fr auto auto}.curriculum-picker .lesson-row .chips{display:none}.curriculum-picker .lesson-title{font-size:12px}}@media (max-width: 360px){.curriculum-picker{padding:10px}.curriculum-picker .curriculum-grid{grid-template-columns:1fr}.curriculum-picker .curriculum-card{padding:8px}.curriculum-picker .badge{font-size:11px;padding:2px 6px}.curriculum-picker .btn,.curriculum-picker .btn-ghost,.curriculum-picker .btn-danger{padding:8px 10px}}}@layer feature.feature{.avatar-scope{--skin: #f6d6bd;--hair: #3b2f2f;--eye: #1b1b1b;--mouth: #b65c5c;--acc: #2e3a59;--bg: #f2f4f8}.avatar-scope .skin{fill:var(--skin)}.avatar-scope .hair{fill:var(--hair)}.avatar-scope .eye{fill:var(--eye);stroke:var(--eye)}.avatar-scope .mouth{fill:var(--mouth);stroke:var(--mouth)}.avatar-scope .acc{color:var(--acc);stroke:currentColor}.avatar-scope .bg{fill:var(--bg)}.avatar{width:128px;height:128px;border-radius:999px;border:1px solid var(--border, #e5e7eb);background:var(--bg);display:grid;place-items:center;overflow:hidden}.avatar svg{width:100%;height:100%;display:block}.avatar-sm{width:64px;height:64px}.avatar-md{width:128px;height:128px}.avatar-lg{width:160px;height:160px}.avatar-editor{display:grid;gap:12px}.avatar-preview{display:flex;align-items:center;gap:12px}.avatar-swatches{display:grid;grid-template-columns:repeat(6,24px);gap:8px}.avatar-swatch{width:24px;height:24px;border-radius:50%;border:1px solid rgba(0,0,0,.12);cursor:pointer}.avatar-swatch:is(:hover,:focus-visible){outline:2px solid #6366f1;outline-offset:2px}.avatar-swatch[aria-pressed=true],.avatar-swatch.is-selected{outline:2px solid #111827;outline-offset:2px}.avatar-part-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(44px,1fr));gap:8px}.avatar-part{width:44px;height:44px;border-radius:8px;border:1px solid var(--border, #e5e7eb);background:#fff;display:grid;place-items:center;cursor:pointer}.avatar-part svg{width:90%;height:90%}.avatar-part:is(:hover,:focus-visible){border-color:#6366f1;box-shadow:0 0 0 2px #6366f140}.avatar-part.is-active{border-color:#111827;box-shadow:0 0 0 2px #11182726}button.avatar-part,button.avatar-swatch{background:none;border:none;padding:0;margin:0;font:inherit}@media (prefers-color-scheme: dark){.avatar{border-color:#2a2f3a}.avatar-part{background:#111318;border-color:#2a2f3a}}}@layer feature.feature{.listen-wrap{display:grid;gap:16px;margin-top:12px}.listen-card{display:flex;align-items:center;gap:12px;padding:16px;border:1px solid #0f1b2f;border-radius:14px;background:linear-gradient(180deg,#0b1220,#0a0f1a)}.icon-btn.big{padding:10px 12px}.listen-actions{display:flex;gap:8px;flex-wrap:wrap}.choices{display:grid;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr))}@media (max-width: 560px){.choices{grid-template-columns:1fr}}.choice{background:var(--panel);color:var(--text);border:1px solid var(--ring);padding:12px 14px;border-radius:12px;cursor:pointer;text-align:center;transition:transform .08s ease,border-color .15s ease,background-color .15s ease,box-shadow .15s ease;will-change:transform}.choice:hover{transform:scale(1.03);border-color:var(--accent);box-shadow:0 2px 10px #22d3ee26;background-color:#22d3ee12}.choice:active{transform:scale(.96)}.choice.picked{border-color:#60a5fa}.choice.correct{border-color:#34d399;background-color:#34d3991f}.choice.wrong{border-color:#f87171;background-color:#f871711f}.choices-inline{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-start}.choices-inline .choice{flex:0 0 auto;min-width:80px;text-align:center}.blank{display:inline-block;min-width:40px;padding:6px 10px;border-radius:10px;border:1px dashed var(--ring);color:transparent;text-shadow:0 0 0 var(--muted)}}@layer feature.feature{.toast{position:fixed;right:16px;bottom:16px;z-index:100;background:var(--panel);border:1px solid var(--ring);color:var(--text);padding:12px 14px;border-radius:12px;box-shadow:0 8px 24px #00000059;min-width:280px}.toast-row{display:flex;gap:12px;align-items:center}.toast-body{display:grid;gap:6px}.toast-title{font-weight:700}.toast-desc,.toast-count{color:var(--muted)}.toast-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:4px}.toast .btn{padding:6px 10px;border-radius:10px}.ring{position:relative;width:48px;height:48px;flex:0 0 auto}.ring svg{display:block;transform:rotate(-90deg)}.ring-track{fill:none;stroke:var(--ring);stroke-width:4}.ring-progress{fill:none;stroke:var(--accent);stroke-width:4;transition:stroke-dashoffset .25s linear}.ring-label{position:absolute;inset:0;display:grid;place-items:center;font-weight:700;font-size:12px}}@layer feature.feature{.breadcrumbs-wrap{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--ring);background:var(--card);border-radius:12px;margin-bottom:8px}.breadcrumbs-left{display:flex;align-items:baseline;gap:8px;flex:1;justify-content:flex-start;text-align:left}.breadcrumbs-left.is-center{justify-content:center;text-align:center}.breadcrumbs-crumbs{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}.breadcrumbs-crumb{font-size:13px;color:var(--muted);white-space:nowrap}.breadcrumbs-crumb-strong{font-size:15px;font-weight:700;color:var(--text);white-space:nowrap}.breadcrumbs-sep{opacity:.6;color:var(--muted)}.breadcrumbs-pill{margin-left:6px;font-size:11px;color:var(--muted);border:1px solid var(--ring);border-radius:999px;padding:2px 8px;white-space:nowrap}.breadcrumbs-wrap:focus-within{box-shadow:inset 0 0 0 2px #22d3ee40}.breadcrumbs-crumbs>*{max-width:100%;overflow:hidden;text-overflow:ellipsis}}@layer feature.feature{.reports-filter{display:grid;gap:10px;align-items:end;grid-template-columns:1fr}@media (min-width: 480px){.reports-filter{grid-template-columns:1fr 1fr}}@media (min-width: 768px){.reports-filter{grid-template-columns:1fr 1fr 1fr}}@media (min-width: 1024px){.reports-filter{grid-template-columns:1fr 1fr 1fr auto auto}}.reports-actions{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}.reports-kpis{display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}.reports-kpis .kpi{padding:8px 10px;border:1px solid var(--ring);border-radius:10px;background:var(--panel)}.table-wrap{overflow:auto;-webkit-overflow-scrolling:touch}.table-wrap table{border-collapse:collapse}.table-wrap thead th{position:sticky;top:0;background:var(--card);z-index:1}.table-wrap th,.table-wrap td{border-bottom:1px solid var(--ring)}.table-wrap td{white-space:nowrap}.reports-tab input[type=date]::-webkit-calendar-picker-indicator{filter:invert(.2);opacity:.8;cursor:pointer}.reports-tab input[type=date]{color-scheme:light dark}.mobile-only{display:none!important}@media (max-width: 640px){.desktop-only{display:none!important}.mobile-only{display:inline!important}.reports-tab .col-lessons,.reports-tab .col-attempts,.reports-tab .col-best,.reports-tab .col-last,.reports-tab .col-updated,.reports-tab .col-learners,.reports-tab .col-avg{display:none}}@media (min-width: 641px){.desktop-only{display:inline}.mobile-only{display:none}}@layer feature{.finish-panel{position:relative;display:grid;gap:16px;padding:16px}.finish-title{font-size:18px;font-weight:700}.badge-best{position:absolute;top:10px;right:10px;display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;border:1px solid var(--border, #1e293b);background:#ffd7001a;box-shadow:0 1px #00000040;font-weight:700}.finish-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px}.stat{min-width:0}.finish-subtitle{font-weight:600}.breakdown-list{display:grid;gap:8px;grid-template-columns:1fr}.sparkline-wrap{width:100%;overflow:hidden}.cta-bar{margin-top:4px;padding:12px;border:1px solid var(--border, #1e293b);border-radius:10px;display:flex;align-items:center;gap:12px;justify-content:space-between;flex-wrap:wrap}.cta-text{font-weight:600}.cta-actions{display:flex;gap:8px}}}@layer feature.feature{.class-detail .header{align-items:center;gap:8px}.class-detail .header__left{min-width:0}.class-detail .meta{flex-wrap:wrap;gap:8px}.class-detail .header__right{gap:8px}@media (max-width: 599px){.class-detail .meta__id{display:none}.class-detail .header{align-items:flex-start}}.class-detail .tabs{display:flex;align-items:center;gap:8px}.class-detail .tabs__list{display:flex;gap:8px;overflow-x:auto;scroll-behavior:smooth;padding-bottom:2px;scrollbar-gutter:stable both-edges;flex:1 1 auto;min-width:0}.class-detail .tabs__list>.btn{flex:0 0 auto;white-space:nowrap}.class-detail .tabs__arrow{flex:0 0 auto}.class-detail .tabs__select{display:none;position:relative;z-index:5}.class-detail .tabs__selectControl{width:100%}@media (max-width: 479px){.class-detail .tabs--scroll{display:none}.class-detail .tabs__select{display:block}}}@layer feature.feature{.wordmatch-lists{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start}@media (max-width: 640px){.wordmatch-lists{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(100px,1fr);overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}.wordmatch-lists>*{min-width:100px;scroll-snap-align:start}}}@layer feature{.modal__backdrop{position:fixed;inset:0;display:grid;place-items:center;padding:16px;background:var(--overlay);z-index:1000;animation:modalFade .15s ease-out}.modal__panel{width:min(560px,calc(100% - 32px));max-height:min(90vh,720px);overflow:auto;background:var(--card);color:var(--text);border:1px solid var(--ring);border-radius:12px;box-shadow:0 10px 30px #00000059,0 2px 10px #00000040;transform-origin:center;animation:modalPop .18s ease-out}.modal__header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 16px;border-bottom:1px solid var(--ring)}.modal__title{margin:0;font-weight:700;font-size:16px}.modal__body{padding:12px 16px}.modal__footer{padding:12px 16px;border-top:1px solid var(--ring)}body.modal-open{overflow:hidden}@keyframes modalFade{0%{opacity:0}to{opacity:1}}@keyframes modalPop{0%{opacity:0;transform:scale(.98) translateY(4px)}to{opacity:1;transform:scale(1) translateY(0)}}@media (prefers-reduced-motion: reduce){.modal__backdrop,.modal__panel{animation:none!important}}}