:root{--bg: #f6f3ec;--surface: #ffffff;--ink: #211e19;--ink2: #4e4941;--umschrift: #3a4f5c;--accent: #0a5663;--accent-press: #07434e;--accent-tint: #e4f0f5;--ok: #215c38;--ok-tint: #e5f2e8;--miss: #6e4518;--miss-tint: #f8e9e1;--line: #e4dfd4;--line-strong: #8c8477;--chevron: #756e64;--chip-line: #c9bcb0;--on-accent: #ffffff;--font-ui: "Commissioner", -apple-system, "Helvetica Neue", sans-serif;--font-mono: "Noto Sans Mono", monospace;--radius-card: 14px;--radius-sheet: 22px;--btn-height: 52px;--btn-height-small: 42px}*{box-sizing:border-box;margin:0}html,body,#root{height:100%}body{background:var(--bg);color:var(--ink);font-family:var(--font-ui);-webkit-font-smoothing:antialiased;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}.screen{max-width:480px;margin:0 auto;min-height:100%;padding:8px 20px 28px;display:flex;flex-direction:column}.btn{display:flex;align-items:center;justify-content:center;width:100%;height:var(--btn-height);border-radius:var(--radius-card);font-family:var(--font-ui);font-size:17px;font-weight:600;border:none;cursor:pointer}.btn-primary{background:var(--accent);color:var(--on-accent)}.btn-primary:active{background:var(--accent-press)}.btn-ghost{background:transparent;border:1.5px solid var(--accent);color:var(--accent)}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-card)}.field{margin-bottom:16px}.field label{display:block;font-size:13px;font-weight:500;color:var(--ink2);margin-bottom:6px}.field input{width:100%;height:var(--btn-height);border:1px solid var(--line-strong);background:var(--surface);border-radius:var(--radius-card);padding:0 16px;color:var(--ink);font-size:16px;font-family:var(--font-ui)}.field input:focus{outline:2px solid var(--accent);outline-offset:-1px}.gt-gr{font-weight:550;line-height:1.3;letter-spacing:.005em}.gt-tr{color:var(--umschrift);font-weight:400;font-family:var(--font-mono);letter-spacing:-.01em}.error-text{color:var(--miss);font-size:14.5px;margin-top:10px}.error-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0 12px;padding:10px 14px;border-radius:var(--radius-card);background:var(--miss-tint);border:1px solid var(--line);font-size:13.5px;color:var(--miss)}.error-banner button{background:none;border:none;color:var(--ink);font:inherit;font-weight:600;text-decoration:underline;cursor:pointer;white-space:nowrap}.mono{font-family:var(--font-mono)}.sess-head{height:44px;flex:none;display:flex;align-items:center;padding:0 20px;position:relative;margin:0 -20px}.sess-head .x{font-size:20px;color:var(--ink2);width:44px;background:none;border:none;text-align:left;cursor:pointer;font-family:var(--font-ui)}.dots{position:absolute;left:50%;transform:translate(-50%);display:flex;gap:9px;align-items:center}.dot{width:8px;height:8px;border-radius:50%;background:transparent;border:1.5px solid var(--line-strong)}.dot.done{background:var(--accent);border:none}.dot.now{background:transparent;border:2px solid var(--accent);width:10px;height:10px}.stage{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:0 4px}.stage.compact{flex:none;justify-content:flex-start;padding-top:14px;margin-bottom:16px}.stage.compact .instr{margin-bottom:12px}.stage .instr{font-size:16px;color:var(--ink2);line-height:1.45;margin-bottom:34px}.stage .word-meaning{font-size:16px;color:var(--ink2);margin-top:10px}.blank{border-bottom:2.5px solid var(--accent);padding:0 22px}.audio-row{display:flex;gap:14px;align-items:center;justify-content:center;margin-top:34px}.play{width:56px;height:56px;border-radius:50%;border:1.5px solid var(--accent);color:var(--accent);background:transparent;display:flex;align-items:center;justify-content:center;font-size:19px;cursor:pointer;flex:none}.play.small{width:42px;height:42px;font-size:15px}.slow-pill{height:42px;display:inline-flex;align-items:center;padding:0 16px;border:1.5px solid var(--line-strong);border-radius:999px;background:transparent;color:var(--ink2);font-size:14px;font-weight:500;font-family:var(--font-ui);cursor:pointer}.choices{display:flex;gap:12px;margin-bottom:14px}.choice{flex:1;padding:20px 8px 16px;text-align:center;cursor:pointer;font-family:var(--font-ui);color:var(--ink)}.choice.sel{border:2px solid var(--accent);background:var(--accent-tint);padding:19px 7px 15px}.choice .de-label{font-size:17px;font-weight:550}.choice .tr-label{font-family:var(--font-mono);color:var(--umschrift);font-size:20px;font-weight:500}.choice .num{font-size:26px;font-weight:550;font-variant-numeric:tabular-nums}.sess-foot{flex:none;padding-bottom:8px}.hint-row{display:flex;justify-content:center;gap:22px;padding:10px 0;font-size:13.5px}.hint-row button{background:none;border:none;color:var(--ink2);font-family:var(--font-ui);font-size:13.5px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}.tr-tap{background:none;border:none;font-family:var(--font-mono);color:var(--accent);text-decoration:underline;text-underline-offset:3px;cursor:pointer;margin-top:3px}.tr-tap-subtle{color:var(--ink2);text-decoration:none}.type-input{width:100%;height:var(--btn-height);border:1px solid var(--line-strong);background:var(--surface);border-radius:var(--radius-card);padding:0 16px;font-family:var(--font-mono);font-size:16px;color:var(--umschrift)}.type-input:focus{outline:2px solid var(--accent);outline-offset:-1px}.diag-chip{align-self:center;display:inline-block;background:var(--surface);color:var(--ink2);border:1px solid var(--chip-line);font-size:13px;font-weight:500;border-radius:999px;padding:4px 12px;margin-top:2px}.dim{flex:1;opacity:.55;display:flex;flex-direction:column;justify-content:flex-start;padding-top:40px;text-align:center}.sheet{flex:none;border-radius:var(--radius-sheet) var(--radius-sheet) 0 0;padding:22px 22px 30px;margin:0 -20px calc(-28px - env(safe-area-inset-bottom));padding-bottom:calc(30px + env(safe-area-inset-bottom))}.sheet.ok{background:var(--ok-tint)}.sheet.miss{background:var(--miss-tint)}.sheet .verdict{font-size:17px;font-weight:600;margin-bottom:14px}.sheet.ok .verdict{color:var(--ok)}.sheet.miss .verdict{color:var(--miss)}.sheet .playline{display:flex;align-items:center;gap:14px;margin-top:6px;text-align:left}.sheet .tutor{font-size:14.5px;color:var(--ink2);line-height:1.5;margin-top:14px}.sheet .again-chip{display:inline-block;background:var(--surface);color:var(--ink2);border:1px solid var(--chip-line);font-size:13px;font-weight:500;border-radius:999px;padding:4px 12px;margin-top:12px}.sheet .actions{display:flex;gap:10px;margin-top:18px}.answer-latin{font-family:var(--font-mono);color:var(--umschrift);font-size:24px}.diff-mark{text-decoration:none;border-bottom:2.5px solid var(--miss)}.dline{margin-bottom:22px}.dline .dash{color:var(--ink2);margin-right:6px}.run-word{cursor:pointer}.run-word.tapped{background:var(--accent-tint);border-radius:6px;padding:0 4px}.popover{background:var(--ink);color:var(--on-accent);border-radius:12px;padding:10px 14px;font-size:14px;display:inline-block;margin-top:8px}.popover-tr{color:#a9b7be;font-family:var(--font-mono);font-size:12px}.popover-play{background:none;border:none;color:var(--on-accent);font-size:14px;cursor:pointer;margin-left:8px}.task-card{background:var(--accent-tint);border:none;padding:16px 18px;margin-bottom:14px}.task-card .row{display:flex;gap:10px;margin-top:12px}.task-card .row .btn{height:var(--btn-height-small);font-size:15px}.sect{font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink2);margin-bottom:8px}.skill{display:flex;align-items:center;gap:12px;padding:13px 16px;border-bottom:1px solid var(--line)}.skill:last-child{border-bottom:none}.skill .g{width:20px;text-align:center;font-weight:700}.g-ok{color:var(--ok)}.g-mid{color:var(--accent)}.g-no{color:var(--ink2)}.skill .n{font-size:17px;flex:1}.dbg{font-family:var(--font-mono)}.dbg h2{font-family:var(--font-ui);font-size:20px;font-weight:700;margin:8px 0 16px}.dbg .lbl{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink2);margin:14px 0 6px}.dbg-row{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;padding:6px 0;border-bottom:1px dashed var(--line);font-variant-numeric:tabular-nums}.dbg-row .v{color:var(--accent)}.dbg-row .neg{color:var(--ink2)}.mini-bars{display:flex;gap:3px;align-items:center}.mini-bars i{width:26px;height:4px;border-radius:2px;background:var(--line-strong);opacity:.45;display:inline-block}.mini-bars i.f{opacity:1;background:var(--accent)}
