:root{--bg: #f6f4ef;--surface: #ffffff;--ink: #17241f;--ink-soft: #4a5a52;--line: #e2ddd2;--brand: #0f2e2a;--brand-2: #2f6f5e;--brand-soft: #e3efe9;--accent: #c98a3d;--danger: #b04a3a;--danger-soft: #f7e6e2;--ok: #2f6f5e;--ok-soft: #e3efe9;--warn: #a67417;--warn-soft: #f7efdd;--radius: 14px;--shadow: 0 1px 3px rgba(15, 46, 42, .08), 0 4px 16px rgba(15, 46, 42, .06);--font: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;overscroll-behavior-y:none}#root{min-height:100dvh}button{font-family:inherit;font-size:1rem;cursor:pointer}input,textarea{font-family:inherit;font-size:1rem}.app-shell{max-width:780px;margin:0 auto;padding:16px 16px calc(24px + env(safe-area-inset-bottom));min-height:100dvh;display:flex;flex-direction:column}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0 16px}.topbar .brand{font-weight:700;color:var(--brand);letter-spacing:.2px}.topbar .who{display:flex;align-items:center;gap:8px;font-size:.9rem;color:var(--ink-soft)}.avatar{width:32px;height:32px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:#fff;font-weight:700;flex:0 0 auto}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px;margin-bottom:12px}.card h2{margin:0 0 8px;font-size:1.05rem}.card h3{margin:12px 0 6px;font-size:.98rem}.muted{color:var(--ink-soft);font-size:.92rem}.row{display:flex;gap:10px;align-items:center}.row.wrap{flex-wrap:wrap}.spread{justify-content:space-between}.btn{border:1px solid var(--brand);background:var(--brand);color:#fff;border-radius:10px;padding:10px 16px;font-weight:600;transition:filter .15s ease}.btn:hover{filter:brightness(1.08)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.secondary{background:transparent;color:var(--brand)}.btn.ghost{background:transparent;border-color:var(--line);color:var(--ink-soft)}.btn.danger{background:var(--danger);border-color:var(--danger)}.btn.small{padding:6px 10px;font-size:.88rem}.btn.block{width:100%}.btn.selected{background:var(--brand-2);border-color:var(--brand-2)}.option{display:flex;gap:10px;align-items:flex-start;width:100%;text-align:left;border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:12px 14px;margin-bottom:8px;color:var(--ink);transition:border-color .12s ease,background .12s ease}.option:hover{border-color:var(--brand-2)}.option.selected{border-color:var(--brand-2);background:var(--brand-soft)}.option.correct{border-color:var(--ok);background:var(--ok-soft)}.option.wrong{border-color:var(--danger);background:var(--danger-soft)}.option .key{font-weight:700;color:var(--brand-2);flex:0 0 auto}.field{display:block;width:100%;border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--surface);color:var(--ink);margin-bottom:10px}.field:focus{outline:2px solid var(--brand-2);outline-offset:1px}.btn:focus-visible,.option:focus-visible,.chip:focus-visible,button.card:focus-visible{outline:2px solid var(--brand-2);outline-offset:2px}textarea.field{min-height:110px;resize:vertical}.progress{height:8px;border-radius:999px;background:var(--line);overflow:hidden}.progress>div{height:100%;background:var(--brand-2);border-radius:999px;transition:width .25s ease}.badge{display:inline-block;border-radius:999px;padding:2px 10px;font-size:.78rem;font-weight:600;background:var(--brand-soft);color:var(--brand)}.badge.warn{background:var(--warn-soft);color:var(--warn)}.badge.danger{background:var(--danger-soft);color:var(--danger)}.badge.ok{background:var(--ok-soft);color:var(--ok)}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}@media (max-width: 560px){.grid2{grid-template-columns:1fr}}.stat{display:flex;flex-direction:column;gap:2px}.stat .num{font-size:1.5rem;font-weight:700;color:var(--brand)}.stat .lbl{font-size:.8rem;color:var(--ink-soft)}.error-box{background:var(--danger-soft);border:1px solid var(--danger);color:var(--danger);border-radius:10px;padding:10px 12px;margin-bottom:10px;font-size:.92rem}.empty{text-align:center;color:var(--ink-soft);padding:28px 12px;font-size:.95rem}.spinner{width:28px;height:28px;border:3px solid var(--line);border-top-color:var(--brand-2);border-radius:50%;animation:spin .8s linear infinite;margin:24px auto}@keyframes spin{to{transform:rotate(360deg)}}.center{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60dvh;text-align:center;padding:24px}.expl{background:var(--brand-soft);border:1px solid var(--brand-2);border-radius:12px;padding:14px;margin:10px 0;font-size:.95rem;white-space:pre-wrap}.expl h4{margin:0 0 8px;font-size:1rem}.audio-btns{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}.chip{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:9px 14px;font-size:.85rem;color:var(--ink-soft)}.chip.selected{border-color:var(--brand-2);background:var(--brand-soft);color:var(--brand);font-weight:600}.nav-tabs{display:flex;gap:6px;overflow-x:auto;padding-bottom:6px;margin-bottom:12px;-webkit-overflow-scrolling:touch}.nav-tabs button{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:7px 14px;white-space:nowrap;color:var(--ink-soft);font-size:.88rem}.nav-tabs button.active{background:var(--brand);border-color:var(--brand);color:#fff;font-weight:600}ul.checklist{margin:8px 0;padding-left:20px}li{margin-bottom:4px}.wordcard{border:2px solid var(--brand-2);border-radius:var(--radius);padding:18px;text-align:center;background:var(--surface)}.wordcard .en{font-size:1.7rem;font-weight:700;color:var(--brand)}.wordcard .ipa{color:var(--ink-soft);font-size:1rem;margin:2px 0 6px}.wordcard .hu{font-size:1.15rem;margin-top:6px}@media (prefers-reduced-motion: reduce){*{animation-duration:1ms!important;transition-duration:1ms!important}}html.reduce-motion *{animation-duration:1ms!important;transition-duration:1ms!important}