/* Lesson-owned layout. The course data, task bodies and action handlers stay in app.js. */
.copa-lesson{--lesson-ink:#143d32;--lesson-muted:#596958;--lesson-line:#d9ceb2;display:grid;grid-template-columns:230px minmax(0,1fr);margin:24px;border:1px solid #bdab77;border-radius:18px;overflow:hidden;background:#f7f1df;color:var(--lesson-ink);min-height:640px}
.copa-lesson-rail{padding:24px 18px;background:linear-gradient(150deg,#123e34,#052a24);color:#fff6df;display:flex;flex-direction:column;gap:24px;min-width:0}
.copa-lesson-back{display:flex;align-items:center;gap:8px;background:transparent;color:#ede5cc;min-height:44px;padding:4px 0;text-align:left;font-size:14px}
.copa-lesson-context .eyebrow{font-size:12px;letter-spacing:1.2px;color:#d8c68b}.copa-lesson-context>strong{display:block;font-family:Georgia,'Times New Roman',serif;font-size:25px;line-height:1.2;margin:10px 0}.copa-lesson-context p{font-size:14px;line-height:1.55;color:#d1d9c8;margin:0}
.copa-lesson-sections{display:grid;gap:9px}.copa-lesson-sections button{display:flex;align-items:center;gap:12px;text-align:left;min-height:52px;padding:12px;color:#e8ecdc;border:1px solid #8d98734a;border-radius:9px;background:transparent;font-size:16px;line-height:1.3}.copa-lesson-sections button>span{flex:1;min-width:0}.copa-lesson-sections button>svg{flex-shrink:0}.copa-lesson-sections button.active{background:#254e3f;border-color:#d8bb61;color:#fff3ca;box-shadow:inset 0 0 0 1px #ead08733}.copa-lesson-sections button:hover{background:#284f40}
.copa-lesson-progress{margin-top:auto;padding-top:22px;border-top:1px solid #c9ba813b}.copa-lesson-progress .track{height:9px;background:#ffffff20}.copa-lesson-progress .track>span{background:linear-gradient(90deg,#b8913d,#f4d678)}.copa-lesson-progress p{font-size:13px;line-height:1.5;margin:10px 0 0;color:#e4dfc7}
.copa-lesson-main{min-width:0;background:linear-gradient(120deg,#faf6e9,#f0e8d0)}.copa-lesson-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:30px 32px 24px;border-bottom:1px solid var(--lesson-line)}.copa-lesson-heading>div:first-child{min-width:0}.copa-lesson-heading .eyebrow{font-size:12px;line-height:1.6;letter-spacing:1px;color:var(--lesson-muted)}.copa-lesson-heading h1{font-family:Georgia,'Times New Roman',serif;font-size:36px;line-height:1.13;letter-spacing:-1px;margin:8px 0 10px;color:#102f27;overflow-wrap:anywhere}.copa-lesson-heading p{font-size:16px;line-height:1.6;color:var(--lesson-muted);margin:0;max-width:580px}
.copa-lesson-player{width:76px;flex-shrink:0;align-self:flex-start}.copa-lesson-player .club-avatar-art{display:block;width:76px;height:100px;margin:0;overflow:hidden;border-radius:10px;border:1px solid #c5b272}.copa-lesson-player img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 20%}
.copa-lesson .lesson-content{max-width:none;padding:28px 32px}.copa-lesson .learn-grid{display:block}.copa-lesson .section-heading{gap:12px;flex-wrap:wrap;align-items:center;margin-bottom:20px}.copa-lesson .section-heading h2{font-family:Georgia,'Times New Roman',serif;font-size:27px;line-height:1.2;margin:0}.copa-lesson .section-heading p{font-size:15px;line-height:1.5;color:var(--lesson-muted);margin-top:7px}.copa-lesson .vocab-controls{font-size:14px;gap:4px}.copa-lesson .vocab-controls button{width:44px;min-width:44px}
.copa-lesson .vocab-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.copa-lesson .vocab-card{display:grid;grid-template-columns:28px minmax(0,1fr);align-content:center;justify-items:start;gap:10px 12px;min-height:130px;text-align:left;padding:22px;background:#fffaf0;border:1px solid #ddd1b0;border-radius:12px;box-shadow:0 4px 12px #44391906}.copa-lesson .vocab-card .sound-circle{grid-column:1;grid-row:2;width:26px;height:26px;margin:0;background:none;box-shadow:none;color:#174c3b}.copa-lesson .vocab-card strong{grid-column:1/-1;grid-row:1;font-size:20px;line-height:1.4;font-weight:700;color:#173b30}.copa-lesson .vocab-card>span:last-child{grid-column:2;grid-row:2;font-size:16px;line-height:1.5;margin:0;color:#526253}.copa-lesson .vocab-card:hover{background:#fffdf6;border-color:#ab8a3c}.copa-lesson .learn-grid>section:first-child>.link-button{display:inline-flex;font-size:14px;min-height:44px;margin-top:10px}
.copa-lesson .btn.primary{background:linear-gradient(180deg,#f3d987,#c9a047);color:#17382b;border:1px solid #b8933e;box-shadow:inset 0 1px #fff2bf;font-size:16px;min-height:48px}.copa-lesson .btn.primary:disabled{opacity:.48}.copa-lesson .btn.soft{background:#e4dfc6;color:#234b37;border:1px solid #cbbf96;min-height:44px}.copa-lesson .btn.secondary{background:#fffaf0;color:#234b37;border-color:#cbbf96;min-height:44px}.copa-lesson-practice{margin-top:24px}
.copa-lesson-warmup,.copa-lesson .grammar-guide{border-top:1px solid var(--lesson-line);margin-top:22px;padding-top:18px}.copa-lesson-warmup>summary,.copa-lesson .grammar-guide>summary{font-size:17px;font-weight:700;line-height:1.5;cursor:pointer;min-height:44px}.copa-lesson-warmup .builder-section{margin:12px 0 0}.copa-lesson .grammar-guide>summary span{font-size:14px}.copa-lesson .grammar p,.copa-lesson .examples,.copa-lesson .quiet-note{font-size:15px;line-height:1.65;color:#536453}.copa-lesson .grammar h3{font-size:18px}.copa-lesson .warmup-note{font-size:13px;line-height:1.5}.copa-lesson .speech-bubble{background:#fffaf0;border-color:#d8ceb2;font-size:15px;line-height:1.5}.copa-lesson .speech-bubble:before{background:#fffaf0;border-color:#d8ceb2}
.copa-lesson-guide{display:block;flex-shrink:0;width:52px;height:64px;overflow:hidden;border-radius:10px}.copa-lesson-guide .club-avatar-art{display:block;width:100%;height:100%;margin:0}.copa-lesson-guide img{width:100%;height:100%;object-fit:cover;object-position:center 20%}
.copa-lesson .word{background:#fffaf0;border-color:#d1c8aa;color:#234838;min-height:44px;font-size:16px}.copa-lesson .word:disabled{background:#e4dfcf;color:#5d6454}.copa-lesson .build-zone{background:#f4edda;border-color:#ac9c6a}.copa-lesson .build-zone .word{background:#e8dec0;color:#173d2e}.copa-lesson .build-placeholder{font-size:15px;color:#65705f}.copa-lesson .mission-card{max-width:660px;padding:8px 0 20px}.copa-lesson .mission-card p{font-size:16px;line-height:1.6;max-width:540px}.copa-lesson .mission-card h2{font-family:Georgia,'Times New Roman',serif;font-size:29px}.copa-lesson .mission-medallion{background:#e5d7a4;color:#426142}.copa-lesson .mission-steps>div{background:#fffbef;border-color:#d7cba8}.copa-lesson .mission-steps span{font-size:13px;line-height:1.4}
.copa-task-guidance{display:grid;gap:12px;padding-top:20px;border-top:1px solid #c9ba813b}.copa-task-guidance>svg{color:#dcc37c}.copa-task-guidance>strong{font-size:18px}.copa-task-guidance>p{font-size:15px;line-height:1.6;color:#d1d9c8;margin:0}.copa-lesson .play-content{max-width:none;padding:26px 32px}.copa-lesson-task .copa-lesson-heading{padding-bottom:20px}.copa-lesson-task .copa-lesson-heading h1{font-size:30px}.copa-lesson .play-label{font-size:14px;line-height:1.45;color:#546854;flex-wrap:wrap;gap:5px}.copa-lesson .play-score{font-size:15px}.copa-lesson .track{background:#dfd8bb}.copa-lesson .track>span{background:#b19242}.copa-lesson .game-card{background:#fffaf0;border-color:#d8cbac;border-radius:14px;box-shadow:none;padding:26px}.copa-lesson .game-card h2{font-size:25px;line-height:1.35;color:#183c30}.copa-lesson .game-type{align-items:flex-start;flex-wrap:wrap}.copa-lesson .type-label{font-size:14px;color:#546b4e}.copa-lesson .game-type .pill{font-size:12px;background:#eee6cf;color:#405744;line-height:1.4}
.copa-lesson .choice{font-size:16px;line-height:1.5;background:#fffdf6;border-color:#d9cfae;color:#204331}.copa-lesson .choice-letter{background:#ece5cc;color:#536348;box-shadow:none}.copa-lesson .choice.selected{background:#ede0b0;border-color:#a07a2c;color:#173d2d}.copa-lesson .choice.selected .choice-letter{background:#173d2d;color:#fff6dc}.copa-lesson .choice.correct{background:#e2eedb;border-color:#668958;color:#254e31}.copa-lesson .choice.wrong{background:#f6e6cf;border-color:#c39063;color:#754e2b}.copa-lesson .choice:not(:disabled):hover{border-color:#a08645}.copa-lesson .listen-box,.copa-lesson .dialogue-card,.copa-lesson .passage{background:#efe8d0;border-color:#d6c79e;color:#234434}.copa-lesson .audio-caption,.copa-lesson .match-status{font-size:14px;line-height:1.55;color:#596c54}.copa-lesson .accents button{min-width:44px;min-height:44px;background:#eee5ca;border-color:#cfbf90}.copa-lesson .type-input{background:#fffdf6;border-color:#b5a576;color:#214532}.copa-lesson .match-item,.copa-lesson .sort-row,.copa-lesson .basket-item{background:#f6efdc;border-color:#d2c29a;font-size:15px}.copa-lesson .match-item.picked{background:#eddfa9;border-color:#a58a3a}.copa-lesson .match-item.matched{background:#dce9d1;color:#355b33;border-color:#8faa79}.copa-lesson .game-tools .small{font-size:14px}.copa-lesson .feedback p{font-size:16px;line-height:1.55}.copa-lesson .feedback{background:#e3edda;border-color:#b0c29d;color:#28503b}.copa-lesson .feedback.wrong{background:#f2e5c7;border-color:#cdb786;color:#674f2c}.copa-lesson .feedback-xp{font-size:14px}.copa-lesson .hint-box{font-size:15px;line-height:1.5;background:#f0e1ac;color:#5c4a27}
.copa-phrasebook .content{padding:24px 32px}.copa-phrasebook .phrase-filters{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:12px}.copa-phrasebook .field{font-size:16px;color:#244633;background:#fffaf0;border-color:#cdbf97;min-height:48px}.copa-phrasebook .phrase-entry{background:#fffaf0;border-color:#dbceb0;border-radius:12px;padding:20px;align-items:start}.copa-phrasebook .phrase-entry strong{font-size:20px;line-height:1.5;color:#214431}.copa-phrasebook .phrase-entry .phrase-words{min-width:0;overflow-wrap:anywhere}.copa-phrasebook .phrase-entry .phrase-words>span{font-size:16px;line-height:1.55;color:#586951}.copa-phrasebook .phrase-entry small,.copa-phrasebook .phrase-entry .tip{font-size:13px;line-height:1.5;color:#66745c}.copa-phrasebook .sound-circle{background:#ece1bd;color:#244d36;width:44px;min-width:44px;height:44px}.copa-phrasebook .phrase-dictionary-banner{margin-top:24px;background:#ece3c6;border-color:#d3c396}.copa-phrasebook .phrase-dictionary-banner p{font-size:15px}.copa-lesson :is(button,input,select,summary):focus-visible{outline:3px solid #af8736;outline-offset:3px}
@media(max-width:1000px){.copa-lesson{grid-template-columns:200px minmax(0,1fr);margin:18px}.copa-lesson-heading,.copa-lesson .lesson-content,.copa-lesson .play-content,.copa-phrasebook .content{padding:24px}.copa-lesson .vocab-card{padding:18px}.copa-phrasebook .phrasebook-grid{grid-template-columns:1fr}}
@media(max-width:760px){.copa-lesson{display:block;margin:16px;border-radius:14px;min-height:0}.copa-lesson-rail{padding:14px 16px;gap:12px}.copa-lesson-back{font-size:14px;min-height:36px}.copa-lesson-context{display:none}.copa-lesson-sections{display:flex;gap:6px}.copa-lesson-sections button{flex:1;justify-content:center;padding:10px 6px;gap:7px;min-height:48px;font-size:14px;text-align:center}.copa-lesson-sections button>span{flex:0}.copa-lesson-sections button>svg:first-child{width:18px}.copa-lesson-sections button>svg:last-child:not(:first-child){display:none}.copa-lesson-progress,.copa-task-guidance{display:none}.copa-lesson-heading,.copa-lesson .lesson-content,.copa-lesson .play-content,.copa-phrasebook .content{padding:20px 16px}.copa-lesson-heading{gap:10px}.copa-lesson-heading h1,.copa-lesson-task .copa-lesson-heading h1{font-size:28px}.copa-lesson-heading p{font-size:15px}.copa-lesson-player{width:56px}.copa-lesson-player .club-avatar-art{width:56px;height:78px}.copa-lesson .vocab-grid{gap:10px}.copa-lesson .vocab-card{padding:15px;min-height:138px;grid-template-columns:22px minmax(0,1fr);column-gap:7px}.copa-lesson .vocab-card strong{font-size:18px}.copa-lesson .vocab-card>span:last-child{font-size:15px}.copa-lesson .section-heading h2{font-size:25px}.copa-lesson .section-heading{margin-bottom:16px}.copa-lesson .game-card{padding:18px 15px}.copa-lesson .game-card h2{font-size:23px}.copa-lesson .play-top{gap:8px}.copa-lesson .play-label{font-size:13px}.copa-lesson .play-label>span{display:block;width:100%}.copa-lesson-task .copa-lesson-rail{padding:4px 16px}.copa-lesson-task .copa-lesson-back{min-height:44px}.copa-lesson .mission-card h2{font-size:26px}.copa-phrasebook .phrase-filters{grid-template-columns:1fr}.copa-phrasebook .phrase-entry{padding:16px}.copa-phrasebook .phrasebook-grid{gap:12px}}
@media(max-width:600px){.copa-lesson-sections button{min-width:0}.copa-lesson-sections button>svg:first-child{display:none}.copa-lesson-sections button>span{flex:1;overflow-wrap:normal}}
@media(max-width:370px){.copa-lesson{margin:12px}.copa-lesson-heading,.copa-lesson .lesson-content,.copa-lesson .play-content,.copa-phrasebook .content{padding:18px 14px}.copa-lesson-sections button{font-size:13px;gap:5px}.copa-lesson .vocab-grid{grid-template-columns:1fr}.copa-lesson .vocab-card{min-height:110px}.copa-lesson .game-tools{gap:8px;flex-wrap:wrap}.copa-lesson .game-tools .btn{font-size:15px}.copa-lesson .mission-steps{gap:5px}.copa-lesson .mission-steps span{font-size:12px}.copa-lesson-player{display:none}}