/* Flat Cuban blue, red and white. Content determines height at every viewport. */
:root{--cuba-blue:#0057b8;--cuba-red:#d7192d;--cuba-ink:#172338;--cuba-line:#c2ccda;--pg-gradient:#0057b8}
html[data-course-theme="dark"] body{background:#103b70!important;color:#fff}
.ambient,.hero-photo__veil{display:none!important}
#app *,#app *::before,#app *::after,.primary-button,.primary-button::before,.topbar,.topbar *,.pg-course-welcome,.pg-course-welcome *,.v4-complete-panel,.v4-complete-panel *{background-image:none!important;text-shadow:none!important}
.topbar{background:#0c2e58!important;box-shadow:none!important;border-bottom:1px solid #416188}
#app{width:min(1480px,calc(100% - 64px));margin-inline:auto;padding:0}
#course-view{display:flex;flex-direction:column;min-height:0!important;gap:18px;padding:26px 0 32px}
#course-view[hidden]{display:none!important}
#module-context{width:100%;margin:0}
#step-dots{display:flex!important;justify-content:center;align-self:center;width:auto;max-width:100%;flex-wrap:wrap;gap:7px;margin:0 0 4px;padding:0;order:-1;min-height:10px}
#step-dots .step-dot{background:#9bb2cd}
#step-dots .step-dot.is-active{background:#fff}
#lesson-card{--lesson-paper:#fff;--lesson-ink:#172338;--lesson-muted:#4b5b70;--lesson-line:#c2ccda;--lesson-wash:#f2f5fa;--lesson-red:#d7192d;background:#fff!important;color:#172338!important;min-height:0!important;height:auto!important;flex:none;overflow:hidden;border:1px solid #c2ccda;border-radius:18px;box-shadow:none!important}
#lesson-card .card-inner{min-height:0!important;height:auto!important;padding:clamp(26px,3.5vw,52px);justify-content:flex-start}
#lesson-card :is(.card-title,.dialogue-title,.story-title,.pronunciation-rule h2,.grammar-copy h2,.culture-copy h2,.video-copy h2,.exercise-head h2,.recap-wrap h2){color:#172338!important;font-size:clamp(30px,3.4vw,52px);line-height:1.12;letter-spacing:-.025em}
#lesson-card .card-title{max-width:1100px;margin-inline:auto}
#lesson-card :is(.card-subtitle,.card-subtitle--small){font-size:clamp(17px,1.5vw,21px);line-height:1.6;color:#4b5b70!important}
#lesson-card :is(.card-kicker,.did-you-know){color:#c9162a!important;font-size:11px;letter-spacing:.13em}
#lesson-card .card-kicker::before{background:#d7192d}
#lesson-card .card-inner--center{align-items:stretch;text-align:left}
#lesson-card .card-inner--center>.card-title,#lesson-card .card-inner--center>.card-subtitle{margin-left:0;text-align:left;max-width:1100px}
#lesson-card .objective-grid{margin:30px 0 0;gap:18px;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;max-width:none}
#lesson-card .objective{display:flex;flex-direction:column;align-items:flex-start;padding:24px;border:1px solid #c2ccda!important;border-radius:12px;background:#fff!important;min-height:0;gap:12px}
#lesson-card .objective-doodle{display:block;object-fit:contain;width:104px;height:100px;max-width:none;margin:0 0 2px}
#lesson-card .objective strong{margin:0;border:1px solid #b9c8da;border-radius:30px;padding:4px 12px;color:#40546e!important;font-family:inherit;font-size:13px;font-weight:400;line-height:1.4}
#lesson-card .objective span:last-child{font-size:clamp(21px,1.9vw,28px);line-height:1.45;color:#172338!important}
#lesson-card .topic-label{display:table;border:1px solid #b9c8da;border-radius:30px;padding:6px 14px;font:400 15px/1.4 var(--font-body,Inter,sans-serif);color:#40546e;margin:8px 0 14px}
#lesson-card :is(.register-badge,.category-badge,.grammar-example__label){background:#fff;border:1px solid #b9c8da;border-radius:30px;color:#40546e;font-size:12px;font-weight:400;padding:4px 10px;letter-spacing:.01em}
#lesson-card :is(.example-box,.mini-example,.grammar-example,.vocab-item,.support-piece,.recap-item,.sound-panel,.model-reveal__content,.final-phrase){background:#fff!important;border:1px solid #c2ccda;border-radius:12px;box-shadow:none}
#lesson-card :is(.support-piece,.recap-item,.vocab-item){padding:22px;min-height:0}
#lesson-card :is(.support-piece strong,.recap-item strong,.vocab-word,.grammar-example strong){font-size:clamp(24px,2.25vw,34px);line-height:1.3;color:#172338}
#lesson-card :is(.translation,.vocab-item__en){color:#4b5b70;font-size:16px;line-height:1.55}
#lesson-card .note-box{background:#f2f5fa;border-left:3px solid #0057b8;color:#40546e;font-size:15px;margin-top:24px}
#lesson-card .phrase-es{font-size:clamp(42px,5.4vw,78px)}
#lesson-card .phrase-layout--single{max-width:none}
#lesson-card .culture-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);height:auto;min-height:0!important;align-items:center;gap:0}
#lesson-card .culture-photo{position:relative;margin:0;min-height:0!important;height:auto!important;aspect-ratio:4/3;align-self:stretch;max-height:none;background:#f2f5fa!important;overflow:hidden}
#lesson-card .culture-photo img{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:cover!important;background:#f2f5fa!important}
#lesson-card .culture-photo[data-image-fit="contain"]{aspect-ratio:1/1;max-height:560px;align-self:center;margin:24px}
#lesson-card .culture-photo[data-image-fit="contain"] img{object-fit:contain!important;padding:12px}
#lesson-card .culture-copy{padding:clamp(26px,3.2vw,48px);min-height:0;display:block;background:#fff!important}
#lesson-card .culture-copy h2{margin:18px 0 24px;font-size:clamp(30px,3vw,46px)}
#lesson-card .culture-copy__es{display:inline!important;font-family:var(--font-body,Inter,sans-serif);font-size:clamp(18px,1.45vw,22px);line-height:1.65;color:#243650!important;margin:0}
#lesson-card .culture-card--text{grid-template-columns:1fr}
#lesson-card .culture-card--text .culture-copy{max-width:1100px;padding:clamp(28px,4vw,60px)}
#lesson-card .culture-card--text .culture-copy h2{max-width:950px}
#lesson-card .video-wrap{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);align-items:center;min-height:0!important;height:auto!important;gap:clamp(24px,3vw,44px);padding:clamp(20px,2.5vw,36px)}
#lesson-card .video-media{margin:0;width:100%;align-self:center;min-height:0}
#lesson-card .video-frame{position:relative;width:100%;height:auto!important;aspect-ratio:16/9;min-height:0!important;max-height:none;border:1px solid #c2ccda;border-radius:10px;overflow:hidden;background:#061425}
#lesson-card .video-frame iframe{position:absolute;inset:0;width:100%;height:100%;min-height:0;border:0}
#lesson-card .video-copy{padding:0;min-height:0;background:#fff!important}
#lesson-card .video-copy h2{font-size:clamp(28px,3vw,46px);margin:18px 0 24px}
#lesson-card .video-copy p{font-size:clamp(17px,1.4vw,20px);line-height:1.65;color:#4b5b70;margin:0}
#lesson-card .video-wrap--short{grid-template-columns:minmax(0,.65fr) minmax(0,1fr);max-width:1000px;margin:auto}
#lesson-card .video-wrap--short .video-frame{aspect-ratio:9/16;max-width:340px;margin:auto}
#lesson-card .dialogue-wrap{max-width:1050px;margin:auto}
#lesson-card .dialogue-list{gap:12px}
#lesson-card .dialogue-title{display:block!important;margin:18px 0 24px}
#lesson-card .dialogue-line.speaker-a{border-left-color:#0057b8!important}
#lesson-card .dialogue-line{display:flex;align-items:flex-start;gap:18px;padding:20px 24px;border:1px solid #c2ccda;border-left:4px solid #0057b8;border-radius:10px;background:#fff!important;color:#172338!important}
#lesson-card .dialogue-line.speaker-b{background:#f2f5fa!important;border-left-color:#d7192d}
#lesson-card .dialogue-copy{display:block;flex:1;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;color:#172338!important}
#lesson-card .dialogue-copy strong,#lesson-card :is(.v4-speaker-a,.v4-speaker-b) strong{display:inline!important;font:600 clamp(20px,1.65vw,25px)/1.5 var(--font-body,Inter,sans-serif)!important;color:#172338!important;background:transparent!important}
#lesson-card .dialogue-avatar{background:#0057b8!important;color:#fff!important;width:36px;height:36px;min-width:36px;font:600 14px/36px var(--font-body,Inter,sans-serif)}
#lesson-card .dialogue-avatar.speaker-b{background:#d7192d!important}
#module-context .module-context__count{white-space:nowrap;flex-shrink:0}
#lesson-card .culture-card:has(img[src$="lydia-cabrera.jpg"]){grid-template-columns:minmax(200px,.55fr) minmax(0,1fr);gap:24px;padding:32px}
#lesson-card .culture-photo:has(img[src$="lydia-cabrera.jpg"]){aspect-ratio:auto;align-self:center;margin:0;background:#fff!important}
#lesson-card .culture-photo img[src$="lydia-cabrera.jpg"]{position:static;width:220px!important;height:auto!important;padding:0;background:#fff!important;margin:auto;display:block}
#lesson-card .dialogue-audio-control{background:#0057b8!important;border:1px solid #0057b8;color:#fff!important;min-height:76px;border-radius:10px;margin:24px 0;box-shadow:none}
#lesson-card .dialogue-audio-control :is(strong,small,span){color:#fff!important}
#lesson-card .dialogue-audio-control__icon{background:transparent!important;border:1px solid #ffffff80}
#lesson-card .dialogue-audio-control__progress{background:#fff!important;height:3px;right:auto;width:var(--audio-progress,0%)}
#lesson-card .dialogue-audio-control:hover{background:#d7192d!important;border-color:#d7192d}
#lesson-card .text-translation{display:inline;position:static!important;border:0;padding:0;margin:0 0 0 6px;background:transparent!important}
#lesson-card .text-translation summary{display:inline-flex;vertical-align:middle;align-items:center;justify-content:center;width:34px;height:34px;padding:6px;margin:0;border:1px solid #a8bad0;border-radius:50%;background:#fff;color:#0057b8;cursor:pointer;list-style:none}
#lesson-card .text-translation summary::-webkit-details-marker{display:none}
#lesson-card .text-translation summary svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#lesson-card .text-translation summary:hover,#lesson-card .text-translation[open] summary{background:#d7192d;color:#fff;border-color:#d7192d}
#lesson-card .translated-bar{display:block;margin:12px 0 0;padding:14px 18px;border:1px solid #c2ccda;border-left:3px solid #0057b8;border-radius:8px;background:#f2f5fa;color:#243650;font:400 17px/1.65 var(--font-body,Inter,sans-serif)}
#lesson-card .translated-bar small{display:block;font:400 11px/1.5 var(--font-body,Inter,sans-serif);color:#53667f;margin-bottom:5px}
#lesson-card .exercise-wrap{max-width:1100px;width:100%;margin:auto}
#lesson-card .exercise-head h2{max-width:1000px}
#lesson-card :is(.option-button,.order-token,.match-button){background:#fff;color:#172338;border:1px solid #aabbd0;font-size:clamp(18px,1.55vw,22px);padding:18px 22px;min-height:58px;box-shadow:none}
#lesson-card :is(.option-button,.order-token,.match-button):is(:hover,.is-selected){background:#0057b8;color:#fff;border-color:#0057b8}
#lesson-card :is(.option-button,.match-button).is-correct{background:#e7f6ee;color:#125e39;border-color:#279267}
#lesson-card :is(.option-button,.match-button).is-wrong{background:#fff0f2;color:#a30c21;border-color:#d7192d}
#lesson-card .type-input{background:#fff;border:1px solid #aabbd0;color:#172338;font-size:23px;padding:20px}
#lesson-card .order-bank{min-height:0;padding:16px}
#lesson-card .order-answer{min-height:74px;background:#f2f5fa;border-color:#aabbd0}
.primary-button,#continue-button{background:#0057b8!important;border:1px solid #6da8ec;color:#fff!important;box-shadow:none!important;transition:background-color .15s,border-color .15s;transform:none!important}
.primary-button:hover,#continue-button:hover{background:#d7192d!important;border-color:#f86675}
.primary-button:disabled,#continue-button:disabled{opacity:.65;background:#0057b8!important}
#continue-fill{display:none!important}
.primary-button::before,.primary-button::after{display:none!important}
#course-view .course-controls{justify-content:center;margin:4px 0 0;padding:0;min-height:0}
#continue-button{min-width:210px;border-radius:10px;min-height:60px}
.icon-button,.text-button{background:#0057b8;color:#fff;border-color:#618fc8;box-shadow:none}
.icon-button:hover,.text-button:hover{background:#d7192d!important;color:#fff!important}
#lesson-card :is(.source-link,.model-reveal summary){background:#fff;border:1px solid #b9c8da;color:#0057b8}
#lesson-card :is(.source-link,.model-reveal summary):hover{background:#d7192d;color:#fff;border-color:#d7192d}
.site-footer{background:#0c2e58;border-top:1px solid #416188;min-height:0;padding:18px 24px;gap:18px;box-shadow:none}
.pg-course-welcome[data-product="cuban-spanish"]{background:#123b6d!important;border-color:#496d96!important}
.pg-course-welcome .pg-course-enter{background:#d7192d!important;color:#fff!important;border:1px solid #f86675}
.pg-course-welcome .pg-course-enter:hover{background:#0057b8!important}
.v4-complete-panel{background:#fff!important;color:#172338!important}
.v4-complete-panel :is(h2,p,strong){color:#172338!important}
@media(max-width:900px){
 #app{width:calc(100% - 32px)}
 #lesson-card .video-wrap,#lesson-card .culture-card{grid-template-columns:1fr}
 #lesson-card .culture-card:has(img[src$="lydia-cabrera.jpg"]){grid-template-columns:1fr;padding:24px 0 0;gap:0}
 #lesson-card .video-wrap{gap:24px;padding:24px}
 #lesson-card .culture-photo{aspect-ratio:16/9;max-height:500px;align-self:auto}
 #lesson-card .culture-photo[data-image-fit="contain"]{aspect-ratio:4/3;max-height:400px;margin:20px 20px 0;align-self:auto}
 #lesson-card .video-wrap--short{grid-template-columns:minmax(0,.7fr) minmax(0,1fr)}
 #lesson-card .objective-grid{gap:12px}
 #lesson-card .objective{padding:18px}
}
@media(max-width:600px){
 #app{width:calc(100% - 24px)}
 #course-view{padding:18px 0 26px;gap:14px}
 #lesson-card{border-radius:12px}
 #lesson-card .card-inner{padding:24px 20px}
 #lesson-card .objective-grid{grid-template-columns:1fr;margin-top:22px}
 #lesson-card .objective{display:grid;grid-template-columns:72px minmax(0,1fr);column-gap:16px;row-gap:8px;padding:18px;align-items:start}
 #lesson-card .objective-doodle{grid-row:1/3;width:72px;height:76px}
 #lesson-card .objective strong{justify-self:start;font-size:12px}
 #lesson-card .objective span:last-child{font-size:21px}
 #lesson-card .culture-copy{padding:26px 22px}
 #lesson-card .culture-copy h2{font-size:31px}
 #lesson-card .video-wrap{padding:18px;gap:24px}
 #lesson-card .video-wrap--short{grid-template-columns:1fr}
 #lesson-card .video-copy h2{font-size:30px}
 #lesson-card .dialogue-line{gap:12px;padding:16px 13px}
 #lesson-card .dialogue-copy strong{font-size:19px!important}
 #lesson-card .dialogue-avatar{width:30px;height:30px;min-width:30px;line-height:30px}
 #lesson-card .dialogue-audio-control{padding:14px 12px}
 #lesson-card .dialogue-audio-control__copy small{font-size:10px}
 #lesson-card :is(.support-grid,.recap-grid,.vocab-grid){grid-template-columns:1fr}
 #lesson-card :is(.option-button,.order-token,.match-button){padding:14px 10px;font-size:17px}
}

/* Native course controls and subject-specific pencil illustrations. */
#route-button{display:none!important}
.topbar{grid-template-columns:minmax(0,1fr) minmax(100px,320px) minmax(0,1fr)!important}
.top-actions{justify-self:end}
.top-progress{width:100%;justify-self:center}
.top-progress__track{outline:1px solid #ff173c;box-shadow:0 0 5px #ff173c,0 0 12px #ff173c80!important}
.landing__actions :is(#start-button,#preview-route-button){display:inline-flex;justify-content:center;align-items:center;min-height:60px;padding:18px 28px;border:1px solid #6da8ec;border-radius:999px;background:#0057b8!important;color:#fff!important;font:800 14px/1.4 var(--font-body,Inter,sans-serif);text-decoration:none;box-shadow:none}
.landing__actions :is(#start-button,#preview-route-button):hover{background:#d7192d!important;border-color:#f86675}
#lesson-card .phrase-layout--single{grid-template-columns:minmax(0,1fr);width:100%;max-width:none}
#lesson-card .phrase-layout--single .phrase-display{width:100%;max-width:none}
#lesson-card .phrase-es{max-width:none;text-wrap:normal;line-height:1.08}
#lesson-card :is(.word-chip,.vocab-word),#lesson-card :is(.word-chip,.vocab-word):hover{display:inline-block;cursor:default;transform:none;background:transparent;color:#172338;border:0;border-radius:0;padding:0;box-shadow:none;transition:none}
#lesson-card .word-chips{gap:10px 22px}
#lesson-card .word-chip{font-size:16px;font-weight:500}
#lesson-card .vocab-item__en{font-weight:700}
#lesson-card .vocab-item small{display:table;padding:4px 10px;margin-top:10px;border:1px solid #b9c8da;border-radius:999px;font-weight:400}
#lesson-card .objective-doodle--sprite{position:relative;overflow:hidden;clip-path:inset(5%);width:104px;height:104px;flex-shrink:0}
#lesson-card .objective-doodle--sprite img{position:absolute;display:block;width:600%;height:400%;max-width:none;object-fit:fill;margin:0;padding:0}
#lesson-card .match-button[data-match-side="left"]{background:#0057b8;color:#fff;border-color:#0057b8}
#lesson-card .match-button[data-match-side="right"]{background:#d7192d;color:#fff;border-color:#d7192d}
#lesson-card .match-button[data-match-side="left"]:hover{background:#d7192d;border-color:#d7192d}
#lesson-card .match-button[data-match-side="right"]:hover{background:#0057b8;border-color:#0057b8}
#lesson-card .match-button.is-selected{outline:3px solid #172338;outline-offset:3px}
#lesson-card .match-button:is(.is-correct,.is-matched){background:#e7f6ee;color:#125e39;border-color:#279267;outline:none}
#lesson-card .match-button.is-wrong{background:#fff0f2;color:#a30c21;border-color:#d7192d}
.music-control-group .music-inline-volume{background:#0c2e58;border-color:#ec4054;box-shadow:none}
.music-control-group #ambient-volume{background:#ed233f!important;height:6px;accent-color:#ed233f}
.music-control-group #ambient-volume::-webkit-slider-runnable-track{height:6px;background:#ed233f;border-radius:999px}
.music-control-group #ambient-volume::-webkit-slider-thumb{width:16px;height:16px;margin-top:-5px;background:#fff;border:3px solid #ed233f;box-shadow:none}
.music-control-group #ambient-volume::-moz-range-track{height:6px;background:#ed233f;border-radius:999px}
.music-control-group #ambient-volume::-moz-range-thumb{width:10px;height:10px;background:#fff;border:3px solid #ed233f;box-shadow:none}
.owner-course-navigation{position:sticky;top:88px;z-index:45;display:grid;gap:8px;padding:12px 16px;background:#0c2e58;color:#fff;border:1px solid #7496c0;border-radius:14px;font:400 13px/1.5 var(--font-body,Inter,sans-serif)}
.owner-course-navigation__bar{display:flex;align-items:center;gap:10px;min-width:0}
.owner-course-navigation :is(select,input){min-width:0;max-width:100%;padding:9px 12px;color:#172338;background:#fff;border:1px solid #aabbd0;border-radius:8px;font:400 14px/1.4 var(--font-body,Inter,sans-serif)}
.owner-course-navigation [data-owner-module]{flex:1;max-width:380px}
.owner-course-navigation button{display:grid;place-items:center;flex-shrink:0;min-width:42px;min-height:42px;padding:6px 12px;border:1px solid #87b4e8;border-radius:999px;background:#0057b8;color:#fff;font:600 24px/1 sans-serif;cursor:pointer}
.owner-course-navigation button:hover{background:#d7192d;border-color:#f86675}
.owner-course-navigation button:disabled{opacity:.4;cursor:default}
.owner-course-navigation [data-owner-return]{font-size:12px;margin-left:auto;white-space:nowrap}
.owner-course-navigation output{font-size:12px;white-space:nowrap}
.owner-course-sections summary{display:inline-block;cursor:pointer;border-bottom:1px solid #87b4e8;font-size:12px}
.owner-course-sections__fields{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}
.owner-course-sections__fields label{display:grid;gap:5px}
.owner-course-sections__fields input{align-self:end}
.owner-course-sections [data-owner-screen]{grid-column:1/-1;width:100%}
.owner-course-navigation small{color:#b6cce5;font-size:11px}
.owner-course-navigation [data-owner-missing]{margin:0;padding:8px 12px;border:1px solid #f86675;border-radius:8px;color:#ffc4cb}
.owner-course-navigation [hidden]{display:none!important}
@media(max-width:760px){
 .topbar{grid-template-columns:1fr 1fr!important}
 .top-progress{grid-column:1/-1;grid-row:2;width:min(320px,100%);max-width:320px;justify-self:center}
 .top-actions{grid-column:2;grid-row:1}
 .owner-course-navigation{top:112px;padding:10px}
 .owner-course-navigation__bar{display:grid;grid-template-columns:42px 42px minmax(0,1fr) 42px;gap:6px}
 .owner-course-navigation [data-owner-module]{width:100%;font-size:12px;padding:10px 4px}
 .owner-course-navigation output{grid-column:1/4;text-align:left}
 .owner-course-navigation [data-owner-return]{grid-column:1/-1;justify-self:start;margin:0;min-height:32px}
 .owner-course-sections__fields{grid-template-columns:1fr}
 .owner-course-sections [data-owner-screen]{grid-column:1}
}
@media(max-width:600px){
 #lesson-card .objective-doodle--sprite{width:72px;height:72px}
 .landing__actions :is(#start-button,#preview-route-button){width:100%}
}
