:root{font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#102744;background:#f3f6fa;font-synthesis:none;--navy:#102744;--blue:#145bcc;--yellow:#ffd64d;--muted:#526579;--line:#d9e2ed;--accent:#145bcc;--tint:#eaf2ff}*{box-sizing:border-box}body{margin:0}button,a,input{touch-action:manipulation}button,a{ -webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{cursor:default}a{color:inherit}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid #f1ad00;outline-offset:4px}[hidden]{display:none!important}.shell{max-width:780px;margin:auto;padding:0 22px 48px}.top{display:flex;align-items:center;justify-content:space-between;padding:22px 0 15px;gap:14px}.brand{text-decoration:none;font-size:18px;font-weight:800;letter-spacing:-.4px}.brand span{color:var(--blue)}.tag{font-size:14px;color:var(--muted)}.route{display:flex;align-items:center;gap:8px;margin:4px 0 24px;padding:14px;background:white;border:1px solid var(--line);border-radius:18px}.route a{flex:1;position:relative;display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;text-decoration:none;font-weight:650;font-size:15px;border-radius:11px}.route a.active{background:var(--navy);color:white}.route b{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#eaf0f7;color:var(--navy);font-size:14px}.route .active b{background:var(--yellow)}.route .route-line{width:12px;height:2px;background:#a6b6c9}.heading{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.heading h1{font-size:clamp(29px,6vw,43px);line-height:1.07;letter-spacing:-1.5px;margin:10px 0}.eyebrow{font-weight:800;color:var(--accent);font-size:13px;letter-spacing:1.5px;text-transform:uppercase}.heading p{font-size:16px;color:var(--muted);line-height:1.5;margin:0;max-width:460px}.bus{width:130px;height:96px;object-fit:contain;flex-shrink:0}.player{background:var(--navy);color:white;border-radius:18px;padding:19px 20px;display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap}.play-main{border:0;border-radius:12px;min-height:50px;background:var(--yellow);color:var(--navy);font-weight:800;padding:12px 17px;display:flex;align-items:center;gap:10px}.play-main svg{width:21px;height:21px}.speed{display:flex;align-items:center;gap:9px;font-size:15px;min-height:44px}.speed input{width:20px;height:20px;accent-color:var(--yellow)}.audio-note{font-size:13px;color:#607185;line-height:1.5;margin:9px 2px 21px}.audio-status{font-size:14px;width:100%;margin:0}.tabs{display:flex;gap:8px;border-bottom:1px solid var(--line);margin-bottom:20px}.tab{border:0;background:transparent;padding:14px 17px;font-weight:750;color:var(--muted);border-bottom:3px solid transparent}.tab[aria-selected=true]{color:var(--navy);border-color:var(--accent)}.tools{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:15px}.tools p{font-size:14px;color:var(--muted);margin:0}.text-button{border:1px solid var(--line);background:white;color:var(--navy);border-radius:9px;min-height:44px;padding:9px 12px;font-weight:650;font-size:14px}.lines{display:grid;gap:10px}.line{display:grid;grid-template-columns:28px 1fr 44px;gap:12px;background:white;border:1px solid var(--line);border-radius:16px;padding:18px 16px;transition:border-color .15s}.line.speaking{border:2px solid var(--accent);padding:17px 15px;background:var(--tint)}.speaker{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--tint);color:var(--accent);font-size:13px;font-weight:800;margin-top:1px}.speaker.b{background:#fff0bc;color:#664e00}.uk{font-size:23px;line-height:1.35;margin:0;font-weight:750;overflow-wrap:anywhere;letter-spacing:-.3px}.latin{font-size:16px;margin:5px 0 0;color:var(--muted);line-height:1.5}.hear{border:1px solid var(--line);background:white;border-radius:50%;color:var(--accent);width:44px;height:44px;display:grid;place-items:center}.hear svg{width:21px;height:21px}.translation{margin-top:9px}.translation summary{font-size:14px;color:var(--accent);cursor:pointer;padding:4px 0;min-height:30px;list-style-position:inside}.translation p{font-size:16px;line-height:1.5;margin:5px 0 0;color:var(--navy)}.variants{margin-top:28px}.variants h2,.practice h2{font-size:21px;letter-spacing:-.5px;margin:0 0 8px}.variants>p{font-size:15px;line-height:1.5;color:var(--muted);margin:0 0 15px}.practice{margin:24px 0;padding:23px;border-radius:18px;background:var(--tint);border-left:4px solid var(--accent)}.practice p{font-size:16px;line-height:1.6;margin:0}.pronunciation{padding:4px 0 15px;color:var(--muted);font-size:14px;line-height:1.6}.pronunciation summary{cursor:pointer;min-height:40px;padding-top:10px}.pronunciation p{margin:5px 0}.next{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:24px;text-decoration:none;font-weight:750;border-top:1px solid var(--line);padding:20px 2px}.next span:last-child{font-size:25px}.quiz-card{background:white;border:1px solid var(--line);padding:24px;border-radius:18px}.quiz-top{display:flex;justify-content:space-between;align-items:center;font-size:14px;color:var(--muted);margin-bottom:17px}.quiz-card h2{font-size:21px;margin:20px 0 16px}.quiz-phrase{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:19px;background:var(--tint);border-radius:12px}.options{display:grid;gap:10px}.option{min-height:54px;text-align:left;border:1px solid var(--line);border-radius:12px;background:white;padding:14px 17px;color:var(--navy);line-height:1.4}.option.correct{background:#e6f5ec;border-color:#268557}.option.wrong{background:#fff2e0;border-color:#d29122}.feedback{min-height:30px;margin:16px 0;line-height:1.5}.feedback.correct{color:#176543}.feedback.wrong{color:#805511}.primary{border:0;border-radius:11px;background:var(--navy);color:white;min-height:48px;padding:13px 18px;font-weight:700}.quiz-done{padding:12px 0}.quiz-done h2{font-size:27px}.quiz-done p{line-height:1.6}.footer{color:var(--muted);font-size:13px;line-height:1.6;margin-top:30px}.footer a{text-underline-offset:3px}body[data-station='2']{--accent:#087453;--tint:#e9f6ef}body[data-station='3']{--accent:#7943a8;--tint:#f3edfa}@media(max-width:520px){.shell{padding:0 15px 32px}.top{padding-top:18px}.tag{font-size:13px}.route{padding:8px;gap:3px;margin-bottom:22px}.route a{font-size:13px;gap:5px}.route b{width:25px;height:25px}.route .route-line{width:5px}.bus{width:88px;height:80px}.heading{align-items:flex-start}.heading h1{font-size:31px}.player{padding:16px;gap:8px}.play-main{font-size:15px;padding:12px}.speed{font-size:14px}.line{gap:9px;padding:16px 12px;grid-template-columns:25px 1fr 44px}.line.speaking{padding:15px 11px}.uk{font-size:22px}.speaker{width:25px;height:25px}.tools p{max-width:140px}.quiz-card{padding:18px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.extra-note,.goal-done{padding:18px 20px;margin:16px 0 20px;background:var(--tint);border-radius:14px;font-size:15px;line-height:1.5}.extra-note p,.goal-done p{margin:6px 0 0}.extension-divider{font-size:14px;font-weight:750;color:var(--accent);padding:15px 3px 8px}.brand{white-space:nowrap}@media(max-width:380px){.brand{font-size:15px}.tag{font-size:12px}.heading h1{font-size:28px}.bus{width:72px}.tools p{font-size:13px}.text-button{font-size:13px;padding:9px}.route a{font-size:12px}.route-line{display:none}.route{gap:2px}}

.uk{display:none;font-size:18px;color:var(--muted);font-weight:500;margin-bottom:5px}.show-script .uk{display:block}.latin{font-size:24px;font-weight:750;line-height:1.4;color:var(--navy);margin-top:0;overflow-wrap:anywhere}.script-toggle{display:flex;align-items:center;gap:9px;font-size:14px;min-height:44px;color:var(--muted);margin:-8px 0 9px}.script-toggle input{width:19px;height:19px;accent-color:var(--accent)}@media(max-width:520px){.latin{font-size:22px}.uk{font-size:17px}}

/* Ukrainian blue and yellow on a dark reading surface. */
:root{color-scheme:dark;color:#f1f6ff;background:#071c3b;--navy:#f1f6ff;--blue:#005bbb;--yellow:#ffd500;--muted:#b1c4df;--line:#2b4566;--accent:#ffd500;--tint:#122f52}
body[data-station='2'],body[data-station='3']{--accent:#ffd500;--tint:#122f52}
body{background:#071c3b}.shell{max-width:760px}.top{border-bottom:1px solid #294360;margin-bottom:18px;padding-bottom:19px}.brand{display:flex;align-items:center;gap:12px;font-size:18px}.brand span{color:#f1f6ff}.brand small{display:block;margin-top:3px;font-size:13px;font-weight:500;color:var(--muted);letter-spacing:0}.emblem{object-fit:contain;display:block}.tag{display:flex;align-items:center;gap:9px}.flag{display:inline-block;width:33px;height:22px;background:linear-gradient(#005bbb 0 50%,#ffd500 50%);border-radius:1px;box-shadow:0 0 0 1px #ffffff20}
.route{background:#0c2648;border-color:#2b4566}.route a{color:#c9d9ef}.route a.active{background:#005bbb;color:#fff}.route b{background:#1e3b60;color:#d8e8ff}.route .active b{color:#071c3b}.route .route-line{background:#4a6585}
.heading{margin:27px 0 23px}.heading h1{letter-spacing:-1px}.eyebrow{color:#ffd500}.player{background:#005bbb;border:1px solid #246dc2;color:white}.play-main{color:#071c3b;background:#ffd500}.audio-note{color:#aec3df}.tabs{border-color:#2b4566}.tab{color:#aec3df}.tab[aria-selected=true]{color:#fff}.text-button,.hear{background:#132f52;color:#ffd500;border-color:#3b5879}.line{background:#0e294c;border-color:#2b4566}.line.speaking{background:#173858;border-color:#ffd500}.speaker{color:#ffdf46;background:#214466}.speaker.b{color:#d6eaff;background:#005bbb}.uk,.show-script .uk{display:block;font-size:16px;color:#adc3df;font-weight:400;margin:0 0 5px;line-height:1.4}.latin{font-size:25px;color:#fff;font-weight:750;line-height:1.35}.translation summary{color:#ffd500}.translation p{color:#e6f0ff}.practice{background:#122f52}.quiz-card{background:#0e294c}.quiz-phrase{background:#173858}.option{background:#112f53;color:#f1f6ff;border-color:#365274}.option.correct{background:#123f35;border-color:#69c99d}.option.wrong{background:#493615;border-color:#f3c058}.feedback.correct{color:#86e1b7}.feedback.wrong{color:#ffdb88}.primary{background:#ffd500;color:#071c3b}.next{border-color:#2b4566;color:#ffd500}.extra-note,.goal-done{background:#122f52}.salute{display:grid;gap:5px;margin:30px 0 22px}.salute>span:first-child{font-size:16px;color:#abc0db}.salute>span:nth-child(2){font-size:21px;color:#ffd500;font-weight:700}.salute small{font-size:13px;font-weight:400;color:#b1c4df}.footer{border-top:1px solid #2b4566;padding-top:5px}.quiz-done .text-button{margin-top:8px}button:hover{filter:brightness(1.08)}
@media(max-width:520px){.latin{font-size:23px}.uk{font-size:15px}.heading h1{font-size:34px}.heading{margin-top:23px}.brand{font-size:17px}.tag{font-size:13px}.emblem{width:25px;height:35px}}@media(max-width:380px){.heading h1{font-size:31px}.latin{font-size:21px}.tag{font-size:12px}.flag{width:27px;height:18px}.brand{font-size:16px}}

/* Lesson interactions */
.emblem-button{position:relative;border:0;padding:5px;background:transparent;border-radius:8px;min-width:42px;min-height:49px}.emblem-button[aria-pressed=true]{background:#244465}.emblem-speaker{position:absolute;right:0;bottom:0;color:#ffd500;font-size:15px}.brand{gap:8px}.brand small{display:flex;align-items:center;gap:6px}.brand .flag{width:21px;height:14px}.language-label{font-size:13px;display:grid;gap:6px;color:var(--muted);min-width:0}.language-label select{min-height:42px;max-width:168px;border:1px solid #3c5676;border-radius:8px;padding:8px;background:#122f52;color:#fff;font:inherit;font-size:15px}.header-right{display:grid;justify-items:end;gap:7px}.usage-time{font-size:12px;color:#a4b9d4}.tabs{gap:0}.tab{flex:1;padding:13px 6px;font-size:14px}.tools{font-size:14px;gap:12px}.tools>span{color:var(--muted)}.training-actions{display:flex;flex-wrap:wrap;gap:10px;margin:23px 0 8px}.inline-variants{min-width:0;border:1px solid #697140;border-radius:16px;background:#102a49;overflow:hidden}.inline-variants>header{display:flex;justify-content:space-between;padding:12px 15px;color:#ffdb3d;font-size:14px}.variant-carousel{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}.variant-carousel::-webkit-scrollbar{display:none}.variant-slide{min-width:100%;width:100%;scroll-snap-align:start;scroll-snap-stop:always}.variant-slide .line{border:0;border-radius:0;background:transparent}.variant-slide .line.speaking{padding:18px 16px;background:#183a60}.variant-controls{display:flex;align-items:center;gap:10px;padding:4px 12px 12px}.variant-controls>span{flex:1;font-size:12px;color:#b1c4df;text-align:center}.variant-controls button{font-size:25px;min-width:43px;line-height:1}.phrase-emoji{font-size:25px;white-space:nowrap}.order-task h2{font-size:22px;line-height:1.3}.order-task>p{font-size:15px;line-height:1.6;color:#b1c4df}.order-task h3{font-size:16px;display:flex;justify-content:space-between;margin:24px 0 13px}.empty-order{color:#a9bdd8;padding:20px;border:1px dashed #46617e;border-radius:12px;font-size:14px}.ordered-lines{display:grid;gap:8px}.order-row{display:flex;align-items:center;gap:10px;background:#163454;padding:12px;border-radius:11px;min-width:0}.order-row>div,.order-row>span:last-child{min-width:0;flex:1}.order-row .latin,.order-choice .latin{display:block;font-size:20px;line-height:1.4}.order-row .uk,.order-choice .uk{font-size:14px;margin:0 0 3px}.order-row>small{font-size:12px;color:#a8bfdb;min-width:12px}.order-choice{display:flex;align-items:center;gap:12px;background:#102a49;color:#f1f6ff;border:1px solid #46617e;border-radius:11px;padding:14px;text-align:left;min-height:64px}.order-choice .speaker{flex-shrink:0}.order-pool{display:grid;gap:10px;margin-top:22px}.game-card h2{font-size:24px;margin:16px 0}.game-card p{line-height:1.6}.game-card form label{display:grid;gap:9px;font-size:15px;margin:20px 0 12px}.game-card input{width:100%;border:1px solid #50698a;border-radius:9px;padding:13px;background:#071c3b;color:white;font:inherit;min-height:50px}.privacy-note{font-size:13px;color:#aec3df;line-height:1.6}.players{display:grid;gap:10px}.player-choice{display:flex;justify-content:space-between;align-items:center;gap:10px;min-height:60px;border:1px solid #567093;background:#143b65;color:#fff;padding:15px;border-radius:10px;text-align:left}.player-choice span{color:#ffd500;font-size:14px}.game-self{color:#b7cbe5;font-size:14px}.game-history{display:grid;gap:8px;margin:22px 0}.game-history small{display:block;margin-top:7px;font-size:14px;color:#c5d7ef}.game-history .hear{flex-shrink:0}.game-option .latin{display:block;font-size:23px}.turn-status{margin-top:25px;border-top:1px solid #395579;padding-top:10px}.waiting-message{padding:16px;background:#173858;border-radius:12px}button:disabled{opacity:.6;cursor:default}button:hover:disabled{filter:none}@media(max-width:380px){.top{gap:8px}.brand{font-size:15px}.brand small{font-size:12px}.language-label select{max-width:145px;font-size:14px}.language-label{font-size:12px}.tab{font-size:12px;padding:13px 4px}.game-option .latin{font-size:21px}.order-row .latin,.order-choice .latin{font-size:18px}.emblem-button{padding:3px;min-width:34px}.phrase-emoji{font-size:22px}}

/* Two conversation lanes in the Ukrainian flag palette. */
.emblem-button,.emblem-button[aria-pressed=true]{background:transparent;border:0;box-shadow:none}.emblem-button[aria-pressed=true] .emblem{filter:brightness(1.35)}.conversation-labels{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:18px 0 13px;color:#ffd500;font-weight:800;font-size:18px}.conversation-labels span:last-child{text-align:right}.conversation{display:flex;flex-direction:column;gap:13px}.conversation-turn{width:calc(50% - 9px);min-width:0}.role-A{align-self:flex-start}.role-B{align-self:flex-end}.conversation .line{position:relative;display:block;background:#005bbb;border:0;border-radius:11px;padding:38px 14px 14px;box-shadow:none;color:#ffd500}.conversation .line>.speaker{position:absolute;top:10px;left:14px;background:transparent;color:#ffd500;width:auto;height:auto;font-size:13px}.conversation .line>.hear{position:absolute;right:8px;top:5px;width:34px;height:34px;min-height:34px;background:transparent;border:0;color:#ffd500}.conversation .latin{color:#ffd500;font-size:24px}.conversation .uk{color:#d9eaff;font-size:15px}.conversation .translation summary{color:#fff0a0}.conversation .translation p{color:#fff}.conversation .line.speaking{outline:2px solid #ffd500;padding:38px 14px 14px;background:#005bbb}.inline-variants{background:#005bbb;border:1px solid #ffd500;border-radius:12px}.inline-variants>header{font-size:12px;gap:4px;padding:9px}.inline-variants .line{border-radius:0}.variant-controls{padding:4px 8px 8px;gap:3px}.variant-controls>span{font-size:11px;color:#e6f1ff}.variant-controls button{background:transparent;border-color:#ffd500;color:#ffd500;min-width:29px;width:29px;padding:3px;min-height:36px}.inline-variants>header span{white-space:nowrap}.order-slots{display:flex;flex-direction:column;gap:11px}.slot-row{position:relative;width:calc(50% - 9px)}.order-slot{display:block;width:100%;min-height:100px;border:2px dashed #ffd500;border-radius:11px;background:#005bbb;color:#ffd500;text-align:left;padding:13px;position:relative}.order-slot.selected{outline:3px solid #ffd500;outline-offset:3px}.order-slot.filled{border-style:solid}.order-slot:disabled{opacity:1}.order-slot>small{display:block;font-size:12px;margin-bottom:8px}.slot-plus{display:block;text-align:center;font-size:30px;color:#ffd500}.order-slot .latin{font-size:20px;color:#ffd500;display:block}.order-slot .uk{font-size:14px;color:#dceaff}.clear-slot{position:absolute;top:-8px;right:-8px;width:30px;height:30px;border:0;border-radius:50%;background:#ffd500;color:#005bbb;font-size:23px}.order-pool{grid-template-columns:1fr 1fr;gap:10px}.order-choice{display:block;position:relative;padding:30px 12px 12px;background:#005bbb;border:1px solid #ffd500;color:#ffd500}.order-choice .latin{color:#ffd500;font-size:19px}.order-choice .uk{color:#dceaff}.chunk-role{position:absolute;top:8px;left:12px;font-size:12px;font-weight:800}.order-slot .chunk-role{display:none}.quiz-card,.quiz-phrase,.option,.order-row,.practice,.game-card,.game-option,.player-choice,.waiting-message{background:#005bbb;border-color:#2b77cc}.quiz-card .latin,.order-row .latin,.game-option .latin{color:#ffd500}.quiz-card{border-radius:14px}.option{border-color:#ffd500;color:#ffd500}.text-button,.hear{background:#005bbb;border-color:#3179ce;color:#ffd500}.primary{background:#ffd500;color:#005bbb}.line .speaker.b{background:transparent}.extra-note,.goal-done{background:#005bbb}.player{background:#005bbb}.game-card input{background:#004b9f;border-color:#ffd500}.game-self,.privacy-note{color:#dfedff}.order-task>p{color:#dceaff}.language-label select{background:#005bbb;border-color:#2b77cc}.game-history .order-row{border:1px solid #5694d8}.game-card .practice{border:1px solid #ffd500}.feedback.correct{color:#c2ffbf}.feedback.wrong{color:#ffe886}@media(max-width:520px){.conversation .latin{font-size:21px}.conversation .line{padding-left:10px;padding-right:10px}.conversation .uk{font-size:14px}.order-slot .latin{font-size:18px}.order-choice .latin{font-size:18px}.conversation-turn,.slot-row{width:calc(50% - 6px)}.conversation-labels{gap:12px}.order-task{padding:15px}.variant-controls>span{font-size:10px}.phrase-emoji{font-size:21px}}

.order-choice{padding-top:14px}.order-choice[draggable=true],.order-slot[draggable=true]{cursor:grab;touch-action:none}.order-slot.drop-hover{background:#ffd500;color:#005bbb;outline:3px solid #ffd500;outline-offset:3px}.order-slot.drop-hover .latin{color:#005bbb}.dragging{opacity:.45}.drag-ghost{position:fixed;z-index:9999;pointer-events:none;margin:0;padding:13px;background:#ffd500;border:2px solid #fff2a2;border-radius:12px;color:#005bbb;box-shadow:0 10px 32px #00183e77;opacity:.96}.drag-ghost .latin{display:block;color:#005bbb;font-size:20px}.drag-ghost .uk{color:#164678;font-size:14px}.drag-ghost .chunk-role{display:none}

/* Compact text-only dialogue chunks, with left/right speaker positions. */
.shell{padding:0 12px 24px}.top{padding:10px 0;margin-bottom:12px}.header-right{gap:3px}.language-label{gap:3px}.language-label select{min-height:36px;padding:6px}.heading{margin:12px 0}.heading h1{font-size:30px;margin:5px 0;line-height:1.1}.heading p{display:none}.eyebrow{font-size:11px;letter-spacing:1px}.player{padding:7px 10px;gap:6px;border-radius:10px}.play-main{min-height:40px;padding:8px 12px;font-size:15px}.speed{min-height:40px;font-size:13px}.audio-note{display:none}.audio-status{font-size:12px}.tabs{margin:8px 0 10px}.tab{padding:10px 4px}.tools{margin-bottom:8px;font-size:12px;gap:6px}.tools .text-button{min-height:36px;padding:6px 8px;font-size:12px}.conversation,.order-slots{gap:4px}.conversation-turn,.slot-row{width:calc(50% - 3px)}.conversation .line,.conversation .line.speaking,.variant-slide .line.speaking{padding:0;border-radius:7px}.phrase-text{display:block;width:100%;min-height:44px;border:0;border-radius:7px;padding:8px 10px;text-align:left;background:transparent;color:#ffd500}.phrase-text[aria-pressed=true]{box-shadow:inset 0 0 0 2px #ffd500}.conversation .latin,.order-slot .latin,.order-choice .latin,.game-history .latin{font-size:19px;line-height:1.2;font-weight:650;overflow-wrap:normal}.phrase-translation{padding:0 10px 8px;margin:0;color:#fff;font-size:14px;line-height:1.3}.order-slot,.order-choice{min-height:44px;padding:8px 10px;border-width:1px;border-radius:7px}.order-task{padding:10px}.order-task h2{font-size:18px;margin:2px 0 7px}.order-task>p{font-size:12px;line-height:1.4;margin:0 0 10px}.order-pool{gap:5px;margin-top:10px}.training-actions{gap:6px;margin:10px 0}.training-actions .text-button{font-size:12px;min-height:36px;padding:6px 8px}.feedback{min-height:0;margin:10px 0}.feedback:empty{display:none}.order-task>.primary{margin-top:4px;min-height:40px;padding:9px 12px}.inline-variants{position:relative;border-radius:7px;overflow:hidden}.inline-variants>header{position:absolute;right:7px;top:4px;padding:0;font-size:10px;z-index:1}.inline-variants>header strong{display:none}.variant-slide .phrase-text{padding-top:16px;padding-bottom:6px}.variant-controls{padding:0 4px 3px;gap:4px;justify-content:space-between}.variant-controls>span{display:none}.variant-controls button{border:0;min-height:24px;min-width:36px;width:36px;font-size:22px;padding:0;line-height:1}.extension-divider{font-size:11px;padding:5px 2px}.game-history{display:flex;flex-direction:column;gap:4px;margin:12px 0}.game-history .order-row{width:calc(50% - 3px);display:block;text-align:left;border-radius:7px;min-height:44px;padding:8px 10px}.game-option{padding:10px;min-height:44px}.game-option .latin{font-size:19px;line-height:1.25}.salute>span{font-size:20px;color:#ffd500;font-weight:700}.footer{margin-top:20px}.salute{margin:16px 0 10px}.drag-ghost{padding:8px 10px}.drag-ghost .latin{font-size:19px;line-height:1.2}@media(max-width:420px){.shell{padding-left:8px;padding-right:8px}.heading h1{font-size:26px}.brand{font-size:15px}.brand small{font-size:11px}.emblem{width:22px;height:31px}.emblem-button{min-height:38px;min-width:30px}.language-label{font-size:11px}.language-label select{font-size:13px;max-width:137px}.conversation .latin,.order-slot .latin,.order-choice .latin,.game-history .latin{font-size:17px}.phrase-text,.order-slot,.order-choice,.game-history .order-row{padding-left:8px;padding-right:8px}.order-task{padding:8px}.tab{font-size:12px}.tools>span{max-width:120px}}

body[data-mode="order"] .heading,body[data-mode="order"] .player,body[data-mode="order"] .extra-note,body[data-mode="game"] .heading,body[data-mode="game"] .player,body[data-mode="game"] .extra-note{display:none}.inline-variants>header{display:none}.variant-slide .phrase-text{padding-top:8px}

/* Variants read between their arrows; speed sits beside the play button. */
.inline-variants{display:grid;grid-template-columns:30px minmax(0,1fr) 30px;align-items:stretch}.variant-carousel{grid-column:2;grid-row:1;min-width:0}.variant-controls{display:contents}.variant-controls button{display:flex;align-items:center;justify-content:center;width:30px;min-width:30px;min-height:44px;height:100%;padding:0;border:0;border-radius:0;font-size:38px;font-weight:600;line-height:1;align-self:stretch}.variant-controls #variant-prev{grid-column:1;grid-row:1}.variant-controls #variant-next{grid-column:3;grid-row:1}.variant-slide .phrase-text{text-align:center;padding:8px 2px;height:auto}.variant-slide .phrase-translation{text-align:center;padding-left:2px;padding-right:2px}.variant-slide{display:flex;align-items:center}.variant-slide .line{height:auto;width:100%}.player{justify-content:flex-start;gap:8px}.speed-toggle{position:relative;display:block;flex-shrink:0;cursor:pointer}.speed-toggle input{position:absolute;inset:0;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}.speed-icons{display:flex;gap:2px;padding:3px;border:1px solid #ffd500;border-radius:11px;pointer-events:none}.speed-icons>span{display:grid;place-items:center;width:36px;height:34px;border-radius:7px;font-size:23px;line-height:1}.speed-normal{background:#ffd500}.speed-slow{background:transparent}.speed-toggle input:checked+.speed-icons .speed-normal{background:transparent}.speed-toggle input:checked+.speed-icons .speed-slow{background:#ffd500}.speed-toggle input:focus-visible+.speed-icons{outline:3px solid #fff0a0;outline-offset:3px}

.player{background:transparent;border:0;padding:0;gap:8px}.play-main{width:44px;height:44px;min-height:44px;flex-shrink:0;border-radius:50%;padding:0;justify-content:center;font-size:21px;line-height:1}
.speed-icons{border-radius:999px}.speed-icons>span{width:34px;height:34px;border-radius:50%}

.language-label select{width:76px;max-width:76px;font-size:24px;text-align:center;padding:3px 9px;min-height:40px}.language-label{justify-items:end}

.chunk-emoji{display:inline-block;white-space:nowrap;font-size:.88em;line-height:1;vertical-align:-.04em;font-weight:400;letter-spacing:0}

.order-variant{display:grid;grid-template-columns:26px minmax(0,1fr) 26px;align-items:stretch;border:1px solid #ffd500;border-radius:7px;background:#005bbb}.order-variant .order-slot{border:0;border-radius:0;text-align:center;padding:8px 2px;min-width:0}.order-variant-arrow{display:flex;align-items:center;justify-content:center;border:0;background:transparent;color:#ffd500;font-size:36px;line-height:1;padding:0;min-height:44px;min-width:0}.order-variant .latin{overflow-wrap:normal}

/* One shared ten-second clock for each answer, in the flag colours. */
.turn-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.turn-heading h2{font-size:21px;line-height:1.3;margin:10px 0}
.answer-timer{position:relative;display:grid;place-items:center;width:52px;height:52px;flex:0 0 52px;color:#ffd500;font-size:22px;font-weight:750;font-variant-numeric:tabular-nums}
.answer-timer svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg);fill:none;stroke-width:3}
.timer-track{stroke:#071c3b}.timer-progress{stroke:#ffd500;stroke-dasharray:100;stroke-dashoffset:0;stroke-linecap:round}
.game-card #restart-game{margin:0 0 12px}

body.embedded .top .brand,body.embedded .footer{display:none}body.embedded .top{justify-content:flex-end;margin:0 0 10px;padding-bottom:8px}body.embedded .shell{padding-top:4px}

/* A calm golden success cue: the button stays usable throughout. */
.order-task>.order-success{display:flex;align-items:center;gap:10px;color:#ffd500;margin:14px 0}
.success-check{flex:none;width:32px;height:32px;color:#ffd500}
.success-glow{animation:success-glow 1.8s ease-in-out 3;box-shadow:0 0 0 2px #ffd50066,0 0 12px #ffd50055}
@keyframes success-glow{0%,100%{box-shadow:0 0 0 2px #ffd50066,0 0 12px #ffd50055}50%{box-shadow:0 0 0 5px #ffd50033,0 0 26px #ffd500bb}}
@media(prefers-reduced-motion:reduce){.success-glow{animation:none;box-shadow:0 0 0 2px #ffd50099,0 0 15px #ffd50077}}

/* Shared reference lessons and original feeling recordings. */
:root{--muted:#aec3df;--accent:#ffd500;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
body{background:#071c3b;color:#f1f6ff}body[data-station]{--accent:#ffd500;--tint:#122f52}
[hidden]{display:none!important}.shell{max-width:780px;margin:0 auto;padding-left:22px;padding-right:22px}.top{border-bottom:1px solid #2b4566;padding-top:17px;padding-bottom:15px;align-items:center}.header-right{display:flex;flex-wrap:wrap;align-items:end;justify-content:flex-end;gap:12px}.lesson-label{display:grid;gap:6px;min-width:0;font-size:11px;color:#aec3df}.lesson-label select{font:inherit;font-size:13px;width:208px;max-width:100%;min-height:42px;padding:8px 10px;border:1px solid #3c5676;border-radius:7px;background:#122f52;color:#f1f6ff}.language-label{font-size:11px}.language-label select{min-height:42px}.heading{margin:23px 0 17px}.heading h1{font-size:30px;line-height:1.2;letter-spacing:-.7px}.heading p{font-size:13px;line-height:1.5}.eyebrow{font-size:10px;letter-spacing:1px}.play-main{width:48px;height:48px;min-height:48px}.audio-note{font-size:11px;line-height:1.55;margin:9px 0 20px}.audio-status{font-size:12px;line-height:1.5}.tab{min-height:48px;border-bottom:2px solid transparent}.tab[aria-selected=true]{color:#ffd500;border-bottom-color:#ffd500}.tabs{margin-bottom:18px}.lesson-settings{display:flex;align-items:end;flex-wrap:wrap;gap:13px;margin-bottom:18px}.mood-label{display:grid;gap:5px;flex:1;min-width:180px;max-width:248px;color:#aec3df;font-size:11px}.mood-label select{min-height:48px;max-width:100%;border:1px solid #3c5676;border-radius:7px;background:#122f52;color:#f1f6ff;padding:9px 12px;font:inherit;font-size:16px}.person-control{margin:0;padding:0;border:0;min-width:0}.person-control legend{padding:0;margin-bottom:5px;color:#aec3df;font-size:11px}.target-switch{display:flex;border:1px solid #3c5676;border-radius:7px;overflow:hidden}.target-btn{min-height:46px;padding:8px 13px;border:0;background:#122f52;color:#aec3df;font-size:13px}.target-btn+.target-btn{border-left:1px solid #3c5676}.target-btn[aria-pressed=true]{background:#ffd500;color:#071c3b}.target-btn:focus-visible{outline-offset:-3px}.target-btn[aria-pressed=true]:focus-visible{outline-color:#071c3b}.tools{align-items:center;flex-wrap:wrap;margin-bottom:14px;gap:8px 12px}.reading-toggle{display:flex;align-items:center;gap:7px;min-height:44px;font-size:11px;color:#aec3df}.reading-toggle input{width:17px;height:17px;margin:0;accent-color:#ffd500}.conversation{display:flex;flex-direction:column;gap:13px}.conversation-turn{width:calc(100% - 76px);max-width:584px}.conversation-turn.role-A{align-self:flex-start}.conversation-turn.role-B{align-self:flex-end}.conversation-turn.role-C{align-self:center;width:min(460px,calc(100% - 50px))}.conversation .line{display:block;padding:0;border:1px solid transparent;border-radius:8px;background:#005bbb;overflow:hidden}.conversation .role-A>.line{border-bottom-left-radius:2px}.conversation .role-B>.line{border-bottom-right-radius:2px}.conversation .role-C>.line{background:#0e2e56;border-color:#31547a}.conversation .line.speaking{padding:0;border-color:#ffd500;background:#0968c9;box-shadow:0 0 0 2px #ffd50020}.line-meta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 12px;padding:9px 12px 0;color:#e0ecff;font-size:10px;line-height:1.4}.recording-label{font-size:9px}.phrase-text{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:48px;padding:8px 12px 10px;border:0;background:transparent;color:#ffd500;text-align:left}.phrase-words{display:block;min-width:0;flex:1}.uk,.show-script .uk{display:block;font-size:25px;font-weight:650;line-height:1.3;letter-spacing:-.3px;color:#ffd500;margin:0;overflow-wrap:anywhere;word-break:normal;hyphens:none}.conversation .latin,.order-slot .latin,.quiz-phrase .latin,.game-option .latin,.game-history .latin,.drag-ghost .latin{display:block;font-size:13px;font-weight:450;line-height:1.5;color:#d5e6ff;margin-top:5px;overflow-wrap:anywhere}.sentence-play{display:grid;place-items:center;flex:0 0 25px;width:25px;height:25px;border-radius:50%;background:#ffd500;color:#071c3b;font-size:10px}.phrase-translation{padding:0 12px 11px;margin:0;color:#e1edff;font-size:13px;line-height:1.5}.no-recording .sentence-play{background:#d1dfef;color:#183c66}.no-recording .recording-label{color:#ffe875}.inline-variants{border-color:#b7a743;background:#005bbb;border-radius:7px}.inline-variants .line-meta{font-size:9px;padding-top:8px}.variant-slide .phrase-text{padding:6px;text-align:left}.variant-slide .uk{font-size:24px}.variant-controls button{min-height:48px;color:#ffd500}.variant-slide .phrase-translation{text-align:left;padding-left:6px;padding-right:6px}.practice{padding:14px 16px;margin:20px 0 0;border-radius:7px;border-left-width:3px;background:#0e294c}.practice h2{font-size:15px}.practice p{font-size:12px;line-height:1.65}.training-actions{margin-top:16px;gap:9px}.text-button,.primary,.option,.quiz-card,.quiz-phrase,.order-task,.game-card{border-radius:7px}.primary,.option,.text-button{min-height:48px}.quiz-card{padding:18px;border-color:#2b4566}.quiz-phrase{padding:15px}.quiz-phrase>div{min-width:0}.quiz-phrase .uk{font-size:25px}.quiz-card h2{font-size:19px}.quiz-top{font-size:11px;gap:12px}.option{font-size:14px}.order-task h2{font-size:19px}.order-task>p{font-size:12px;line-height:1.5}.order-slot .uk,.game-history .uk,.game-option .uk{font-size:22px}.slot-row.role-C{align-self:center;width:calc(100% - 50px)}.order-slots .slot-row{width:calc(100% - 76px);max-width:584px}.order-slots .role-B{align-self:flex-end}.order-slots .role-A{align-self:flex-start}.order-slots .role-C{align-self:center}.order-slot{min-height:54px;padding:11px 13px}.order-slot:disabled{opacity:1}.order-variant .order-slot{text-align:left}.order-variant-arrow{min-height:48px}.order-row.role-C,.game-history .order-row.role-C{align-self:center;width:calc(100% - 44px);background:#0e2e56}.game-history .order-row{width:calc(100% - 62px);max-width:584px;min-height:52px;padding:10px 12px}.game-history .order-row.role-A{align-self:flex-start}.game-history .order-row.role-B{align-self:flex-end}.chorus-label{display:block;font-size:10px;color:#d7e6f9;margin-bottom:5px}.game-option{padding:12px}.game-option .uk{font-size:22px}.turn-heading{gap:12px}.turn-heading h2{font-size:19px}.game-card #nickname{min-height:48px}.course-tools{border:1px solid #2b4566;border-radius:7px;padding:10px 12px;margin:0 0 15px;color:#aec3df;font-size:11px}.course-tools summary{cursor:pointer;min-height:28px;line-height:1.6}.course-tools strong{font-family:ui-monospace,monospace;color:#ffd500;letter-spacing:.03em}.course-tools p{line-height:1.6;margin:8px 0}.course-tools form{display:flex;align-items:end;gap:10px;margin:12px 0}.course-tools form label{display:grid;gap:5px;min-width:0;flex:1}.course-tools input{min-width:0;width:100%;min-height:44px;border:1px solid #3c5676;border-radius:7px;background:#122f52;color:#f1f6ff;padding:9px 10px;font-size:14px;font-family:inherit}.course-tools .text-button{font-size:11px;min-height:44px;padding:8px 10px}.copy-link-field{margin-top:6px}#course-feedback:empty{display:none}.footer{margin-top:24px;padding-top:15px;border-top:1px solid #2b4566;font-size:10px}.footer p{margin:5px 0}.usage-time{font-size:10px}.skip-link{position:fixed;z-index:100;top:8px;left:8px;min-height:48px;padding:12px;background:#ffd500;color:#071c3b;border-radius:7px;transform:translateY(-150%)}.skip-link:focus{transform:none}.noscript-message{max-width:736px;margin:30px auto;padding:20px;color:#f1f6ff}select:focus-visible{outline:2px solid #ffd500;outline-offset:3px}
@media(max-width:620px){.shell{padding-left:16px;padding-right:16px}.top{flex-wrap:wrap;gap:11px}.brand{font-size:17px}.header-right{gap:9px;flex:1;justify-content:flex-end}.lesson-label select{width:180px;font-size:12px}.heading h1{font-size:28px}.tools{align-items:center}.conversation-turn{width:calc(100% - 28px)}.conversation-turn.role-C{width:calc(100% - 34px)}.uk{font-size:24px}.order-slots .slot-row{width:calc(100% - 26px)}.game-history .order-row{width:calc(100% - 26px)}.lesson-settings{gap:10px}.mood-label{max-width:none}.person-control{flex:1}.target-switch{width:100%}.target-btn{flex:1}.course-tools form{flex-wrap:wrap}.language-label select{width:66px;max-width:66px}.order-slot .uk,.game-option .uk,.game-history .uk{font-size:21px}.quiz-card{padding:14px}}
@media(max-width:430px){.shell{padding-left:12px;padding-right:12px}.top{display:grid;grid-template-columns:minmax(0,1fr);gap:9px}.brand{font-size:17px}.header-right{display:flex;justify-content:space-between;width:100%;gap:12px}.lesson-label{flex:1}.lesson-label select{width:100%;min-height:44px}.language-label{min-width:66px}.language-label select{min-height:44px}.heading{margin-top:20px}.heading h1{font-size:27px}.heading p{font-size:12px}.tab{font-size:12px;padding-inline:4px}.lesson-settings{gap:11px}.mood-label{min-width:160px;flex-basis:100%}.person-control{flex:1 1 100%}.tools{flex-direction:column;align-items:stretch;gap:5px}.reading-toggle{min-height:40px}.conversation-turn{width:calc(100% - 16px)}.conversation-turn.role-C{width:calc(100% - 24px)}.line-meta{padding:8px 10px 0;font-size:9px}.recording-label{font-size:8px}.phrase-text{padding:8px 10px;gap:9px}.uk{font-size:23px}.sentence-play{flex-basis:23px;width:23px;height:23px;font-size:9px}.phrase-translation{padding:0 10px 10px;font-size:12px}.variant-slide .uk{font-size:22px}.conversation .latin,.order-slot .latin,.quiz-phrase .latin,.game-option .latin,.game-history .latin{font-size:12px}.practice{padding:12px}.practice p{font-size:12px}.training-actions{gap:7px}.training-actions .primary,.training-actions .text-button{font-size:11px;min-height:44px;padding:9px}.quiz-phrase{padding:12px}.quiz-phrase .uk{font-size:23px}.quiz-card h2{font-size:18px}.order-slot .uk,.game-option .uk,.game-history .uk{font-size:20px}.order-slots .slot-row,.game-history .order-row{width:calc(100% - 16px)}.turn-heading h2{font-size:18px}.answer-timer{width:48px;height:48px;flex-basis:48px}.option{font-size:13px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

/* Latin reading aid is primary; the shared switch adds the original script. */
.phrase-copy{display:block;min-width:0;flex:1}
.phrase-copy>.latin{display:block;font-size:24px;font-weight:650;line-height:1.4;letter-spacing:normal;color:#ffd500;margin:0;overflow-wrap:anywhere}
.phrase-copy>.uk{display:block;font-size:16px;font-weight:450;line-height:1.5;letter-spacing:normal;color:#d5e6ff;margin:5px 0 0;overflow-wrap:anywhere}
body:not(.show-cyrillic) [data-cyrillic]{display:none}
.lesson-controls .script-toggle{position:relative;display:inline-flex;align-items:center;gap:8px;min-height:44px;margin:0 0 0 auto;padding:8px 11px;border:1px solid #3c5676;border-radius:24px;color:#d5e6ff;font-size:12px;cursor:pointer}
.lesson-controls .script-toggle input{position:absolute;width:1px;height:1px;opacity:0;margin:0}
.script-track{position:relative;display:block;flex:0 0 30px;width:30px;height:18px;border-radius:10px;background:#3c5676;transition:background .15s}
.script-track:before{content:'';position:absolute;width:12px;height:12px;top:3px;left:3px;border-radius:50%;background:#d5e6ff;transition:transform .15s}
.script-toggle input:checked+.script-track{background:#ffd500}
.script-toggle input:checked+.script-track:before{transform:translateX(12px);background:#071c3b}
.script-toggle:has(input:focus-visible){outline:3px solid #ffd500;outline-offset:3px}
.tools{justify-content:flex-end}
@media(max-width:430px){.phrase-copy>.latin{font-size:22px}.phrase-copy>.uk{font-size:15px}.order-slot .phrase-copy>.latin,.game-option .phrase-copy>.latin,.game-history .phrase-copy>.latin{font-size:20px}.lesson-controls .script-toggle{padding-inline:9px;font-size:11px;gap:6px}}
@media(prefers-reduced-motion:reduce){.script-track,.script-track:before{transition:none}}

/* Choose a feeling where the answer appears. */
.emotion-picker{min-width:0;margin:2px 12px 13px;padding:12px 0 0;border:0;border-top:1px solid #ffffff35}
.emotion-picker legend{float:left;width:100%;padding:0;margin:0 0 10px;color:#eef5ff;font-size:13px;font-weight:650}
.emotion-options{clear:both;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.emotion-choice{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:0;min-height:74px;padding:8px 3px;border:1px solid #a4c8ef;border-radius:10px;background:#07458b;color:#fff;font:inherit;font-size:12px;cursor:pointer}
.emotion-emoji{font-size:28px;line-height:1.2}
.emotion-choice:hover{background:#146ac0;border-color:#fff}
.emotion-choice[aria-pressed=true]{background:#ffd500;border:2px solid #ffd500;color:#071c3b;font-weight:700}
.emotion-choice:focus-visible{outline:3px solid #fff;outline-offset:2px}
.emotion-check{position:absolute;right:6px;top:3px;font-size:14px;font-weight:800}
@media(min-width:650px){.emotion-options{grid-template-columns:repeat(6,minmax(0,1fr))}.emotion-choice{font-size:10px}}

.speaker-emoji { font-size: 22px; line-height: 1.15; }
.role-toggle .speed-icons > span { width: auto; min-width: 76px; height: 38px; padding: 0 10px; border-radius: 999px; font-size: 13px; font-weight: 700; color: #eef5ff; }
.role-toggle input:not(:checked) + .speed-icons .speed-normal,
.role-toggle input:checked + .speed-icons .speed-slow { color: #071c3b; }

.dialog-toggles { display: flex; align-items: center; gap: 8px; max-width: 100%; }
.dialog-toggles .speed-icons > span { min-width: 0; height: 42px; padding: 0 8px; white-space: nowrap; }
@media (max-width: 390px) {
 .dialog-toggles { gap: 5px; }
 .dialog-toggles .speed-icons > span { padding: 0 5px; font-size: 11px; }
}


/* The complete dialogue stays open until full-dialogue playback starts. */
.conversation {
 display: block;
 height: auto;
 overflow: visible;
 padding: 0;
 border: 0;
 background: transparent;
 scrollbar-width: none;
}
.conversation::-webkit-scrollbar { display: none; width: 0; height: 0; }
.conversation-track {
 display: flex;
 flex-direction: column;
 gap: 13px;
 position: relative;
}
.conversation-track > .conversation-turn { flex: none; }
.conversation.is-playing {
 height: var(--conversation-height, 360px);
 overflow: hidden;
 overflow: clip;
 overflow-anchor: none;
}
.conversation.is-playing .conversation-track {
 padding-top: 48px;
 will-change: transform;
}

/* One stable border around the whole bubble, including translation and choices. */
.conversation .line { border: 2px solid transparent; outline: none; box-shadow: none; }
.conversation .line.speaking { border-color: #ffd500; outline: none; box-shadow: none; }
.conversation .phrase-text[aria-pressed=true] { box-shadow: none; }
.conversation .phrase-text:focus-visible { outline: none; }
.conversation .line:has(.phrase-text:focus-visible) { border-color: #ffd500; }

/* One control row: playback, voice, translation, then script at the right edge. */
.lesson-controls {
 display: flex;
 align-items: center;
 flex-wrap: wrap;
 gap: 10px;
 margin-bottom: 18px;
}
.lesson-controls .player { flex: 0 0 auto; flex-wrap: nowrap; }
.lesson-controls #dialog-settings,
.lesson-controls .lesson-settings,
.lesson-controls .dialog-toggles { display: contents; }
.lesson-controls .script-toggle { flex: 0 0 auto; margin: 0 0 0 auto; }
@media (max-width: 620px) {
 .lesson-controls { gap: 8px; }
}

.top { display: flex; flex-wrap: nowrap; align-items: center; justify-content: space-between; padding-block: 5px; gap: 8px; }
.top .header-right { flex: 0 0 auto; width: auto; }
.top .language-label select { min-height: 44px; }

.lesson-controls .speed-icons > span { height: 36px; }
.next-step { display: flex; justify-content: flex-end; margin-top: 24px; padding-top: 16px; border-top: 1px solid #3c5676; }
.next-step .primary { display: inline-flex; align-items: center; gap: 10px; }

.top .header-right { flex-wrap: nowrap; align-items: center; gap: 6px; }
.top .role-toggle .speed-icons > span { width: auto; min-width: 0; height: 36px; padding: 0 6px; white-space: nowrap; }
@media (max-width: 390px) {
 .top .brand { gap: 4px; font-size: 14px; }
 .top .language-label { min-width: 0; }
 .top .language-label select { width: 49px; font-size: 18px; padding-inline: 3px; }
 .top .role-toggle .speed-icons > span { font-size: 11px; }
}

.quiz-prompt { display: flex; align-items: center; gap: clamp(8px, 2vw, 16px); }
.quiz-prompt > div { min-width: 0; }
.quiz-countdown { position: relative; display: grid; flex: 0 0 46px; width: 46px; height: 46px; place-items: center; color: #ffd500; font-size: 14px; font-weight: 750; font-variant-numeric: tabular-nums; }
.quiz-countdown svg { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.quiz-countdown circle { fill: none; stroke: #ffffff40; stroke-width: 3; }
.quiz-countdown .quiz-countdown-progress { stroke: currentColor; stroke-dasharray: 100; stroke-dashoffset: calc(100 - var(--elapsed, 0)); stroke-linecap: round; }
.quiz-countdown small { font-size: 10px; }
.quiz-correct-answer { margin: 12px 0 0; font-weight: 650; }

.quiz-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 14px; }
.quiz-controls .speed-icons > span { width: auto; min-width: 0; height: 36px; padding: 0 8px; white-space: nowrap; }

.game-option.game-choice-revealed { background: #12473b; border: 2px solid #8af1ad; animation: game-answer-flash 650ms ease-out; }
.game-option.game-choice-wrong { border: 2px solid #ffacac; }
.game-choice-mark { float: right; margin-inline-start: 8px; font-weight: 800; }
.game-choice-revealed .game-choice-mark { color: #8af1ad; }
.game-choice-wrong .game-choice-mark { color: #ffacac; }
@keyframes game-answer-flash { from { box-shadow: 0 0 0 4px #8af1ad; } to { box-shadow: 0 0 0 0 #8af1ad00; } }
@media (prefers-reduced-motion: reduce) { .game-option.game-choice-revealed { animation: none; } }

.learning-clock { display: flex; align-items: center; justify-content: flex-end; gap: 8px; margin-block: 8px; font-size: 13px; color: #d5e6ff; }
#learning-clock { color: #ffd500; font-size: 18px; font-weight: 800; font-variant-numeric: tabular-nums; }
.learning-finished { position: fixed; inset: 0; z-index: 10; display: grid; place-items: center; padding: 24px; background: #005bbb; color: #ffd500; text-align: center; }
.learning-finished h1 { color: inherit; font-size: clamp(34px, 8vw, 76px); margin: 0; }

.feedback.wrong, .game-choice-wrong .game-choice-mark { color: #ffc0c0; }