/* Cream clouds, sage meadows, olive greens, and mountain stone. */
:root{--bg:#f2f6f6;--panel:#fffefa;--red:#5c7b83;--muted:#6e7e82;--line:#d5dfe0;--ink:#384c55;--sage:#dce9e9;--sage-hover:#e8f0f0;--focus:#83a6b3}
body{background:var(--bg);color:var(--ink)}
header{background:#fffefaed;border-color:var(--line)}header .logo .logo-wordmark{color:var(--ink)}header .logo .logo-icon{background:var(--sage);color:#42636e}header .logo small,.status,.tag{color:#6e7e82}header a{color:#526f79}.status:before{color:#81936c}
.language-switch{border-color:#c3cdb6;color:#526f79}.language-switch:hover{background:#e3ead8;color:#384c55}
h1,h2,h3,summary,.info-hero h1{color:var(--ink)}.eyebrow,.info-hero h1 span{color:#5c7b83}.section-title .tag{color:#6e7e82}
.workspace,.card{background:var(--panel);border-color:var(--line)}aside{background:#edf2f0;border-color:var(--line)}
.filter button,#explore .filter button{background:#f7f9f6;border:1px solid #cbdadc;color:#526f79}
.filter button:hover,#explore .filter button:hover{background:var(--sage-hover);border-color:#aabfc3;color:#365764}
.filter button.active,#explore .filter button.active{background:var(--sage);border-color:#a6bdc1;color:#345561;font-weight:600}
#tenseList button{color:#586e75;border-color:#d8e1df}#tenseList button:hover{background:#eaf2f0;color:#365764}#tenseList button.active{background:var(--sage);border-left-color:#88a8ab;color:#345561}#tenseList small{color:#778a8c}
.modebar button,.primary{background:var(--sage);border:1px solid #b8cdd0;color:#345561}
.modebar button:hover,.modebar button.active,.modebar button:focus-visible{background:#d4e5e7;border-color:#9db8c1;color:#345561;outline:2px solid #aec7ca;outline-offset:2px}
.primary:hover{background:#d0e2e4;color:#345561}.secondary{background:#f8f8ef;border-color:#bdcfd1;color:#526f79}.secondary:hover{background:#e8f0f0;color:#345561}
button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--focus);outline-offset:3px}
.badge{color:#5c7b83;border-color:#c2d3d3}.formula{background:#ecf2ed;color:#42636e;border-color:#9bb7b7}.usage,#explore .usage,.example p,#explore .example p{color:#60727a}.example,.row{border-color:#dce3e1}.row span,#explore .row span{color:#73858a}
.note,#explore .note{background:#edf3ee;color:#60727a}.note b{color:#5c7b83}select,.card input,#practice #answer{background:#fffef9;border-color:#becfd1;color:var(--ink)}input::placeholder{color:#7d8472}.card p,.card label,.training .practiceSettings p,details p{color:#65777d}details{border-color:#d5dfe0}[lang="en"],.usage [lang="en"],.note [lang="en"]{color:#6e7e82}
.support-panel{background:#fffefa;border-color:#c6cdb7}.support-panel p,.info-lead,.info-grid .card p,.home-story p{color:#65777d}.support-status{background:#edf1e2;color:#526f79;border-color:#c6cdb7}.home-story,.page-nav,footer{border-color:#d5dfe0}.home-story a,.page-nav a{color:#5c7b83}footer{color:#7a7c6d}
.donation-section{background:#e8f0ef;border-color:#ccdcdb}.donation-section p,.donation-small{color:#65777d}.donation-action{border-color:#cadad8}.donation-symbol{color:#7e9fa5}.donation-action .primary{color:#345561}
.video-home.training>header{background:#e8f0ef}.video-home.training>header .logo .logo-wordmark,.video-home.training>header .logo small,.video-home.training>header nav a,.video-home.training>header .language-switch{color:#42636e;text-shadow:none}.video-home.training>header nav a,.video-home.training>header .language-switch{border-color:#c6cdb7;background:#f8f8ef}.video-home.training>header .logo .logo-icon{color:#42636e;background:#dce9e9;border-color:#bdcfd1}

/* Keep all text over the video white, independent of the study palette. */
.video-home .hero .video-welcome h1,.video-home .hero .video-welcome h1 span,.video-home .hero .video-welcome .eyebrow,.video-home .hero .video-welcome p,.video-home .hero .hero-end{color:#fff}
/* Mode buttons use fill changes for pointer hover and selection. */
.modebar button{background:#e0ebed;border-color:#b8cdd0;outline:none;box-shadow:none;transition:background-color .15s}
.modebar button:hover{background:#cbdfe5;border-color:#b8cdd0;color:#345561;outline:none;box-shadow:none}
.modebar button.active,.modebar button:active{background:#bcd5de;border-color:#b8cdd0;color:#2e505e;outline:none;box-shadow:none}
.modebar button:focus:not(:focus-visible){outline:none;box-shadow:none}
.modebar button:focus-visible{outline:2px solid #7497a5;outline-offset:3px}
/* Black canvas with mountain-blue, sage, and cloud-cream accents. */
:root{--bg:#090b0b;--panel:#131918;--ink:#e9ede6;--line:#303c3a;--muted:#a7b7b8;--red:#bdd8df}
body{background:#090b0b;color:#e9ede6}header,.video-home.training>header{background:#101615;border-color:#303c3a}header .logo .logo-wordmark,header a{color:#e9ede6}header .logo small,.status,.tag{color:#a7b7b8}header .logo .logo-icon{background:#dce9e9;color:#42636e}.language-switch{background:#1b2729;color:#d4e7eb;border-color:#496168}.language-switch:hover{background:#cbdfe5;color:#345561}
h1,h2,h3,summary,.info-hero h1{color:#edf0e9}.eyebrow,.info-hero h1 span{color:#bdd8df}.section-title .tag{color:#a7b7b8}
.workspace,.card,.support-panel{background:#131918;border-color:#303c3a}aside{background:#18211e;border-color:#303c3a}.filter button,#explore .filter button{background:#222f30;color:#d3e1e2;border-color:#425b5e}.filter button:hover,#explore .filter button:hover{background:#cbdfe5;color:#345561}.filter button.active,#explore .filter button.active{background:#cbdfe5;color:#345561;border-color:#a6bdc1}
#tenseList button{color:#bdccc6;border-color:#303c3a}#tenseList button:hover{background:#273a36;color:#e9ede6}#tenseList button.active{background:#dce9e0;border-left-color:#9bb7a6;color:#354b42}#tenseList small{color:#9bafa7}#tenseList button.active small{color:#526f62}.badge{background:#25322d;color:#d5e2ca;border-color:#526350}
.formula{background:#25312b;color:#e1e7d5;border-color:#9bad83}.usage,#explore .usage,.example p,#explore .example p{color:#c1ccc9}.example,.row,details{border-color:#303c3a}.row span,#explore .row span{color:#aabcb9}.note,#explore .note{background:#202c27;color:#c3cfc7}.note b{color:#c7d9b9}select,.card input,#practice #answer{background:#0e1514;color:#e9ede6;border-color:#49605a}input::placeholder{color:#99acab}.card p,.card label,.training .practiceSettings p,details p{color:#bdccca}[lang="en"],.usage [lang="en"],.note [lang="en"]{color:#aebfbc}
.secondary{background:#1d2b2c;color:#d1e2e6;border-color:#496168}.secondary:hover{background:#cbdfe5;color:#345561}.support-panel p,.info-lead,.info-grid .card p,.home-story p{color:#bdccca}.support-status{background:#27352b;color:#d7e4cb;border-color:#526350}.home-story,.page-nav,footer{border-color:#303c3a}.home-story a,.page-nav a{color:#bdd8df}footer{color:#9cadab}
.donation-section{background:#182320;border-color:#354b43}.donation-section p,.donation-section .donation-small{color:#bdccca}.donation-action{border-color:#354b43}.donation-symbol{color:#c8dabb}
.video-home.training>header .logo .logo-wordmark,.video-home.training>header .logo small,.video-home.training>header nav a,.video-home.training>header .language-switch{color:#d7e5e7}.video-home.training>header nav a,.video-home.training>header .language-switch{background:#1d2b2c;border-color:#496168}.video-home.training>header .logo .logo-icon{background:#dce9e9;color:#42636e}

html{scroll-behavior:smooth}#about,#practice,#explore{scroll-margin-top:28px}.practiceSettings{display:block}.practiceSettings select{max-width:100%;width:100%}.bottom{grid-template-columns:1fr}#practice{padding:32px}.home-story .info-grid{margin-top:28px}.home-story .info-grid p{font-size:15px}.home-story .info-grid h2{font-size:22px}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Compact practice controls and an uncropped About portrait. */
#practice>h3:not(#question){font-size:20px;line-height:1.35;margin:12px 0 18px;letter-spacing:-.3px}
#practice .practiceSettings{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;max-width:760px;margin:0 0 18px}
#practice .practiceSettings label{font-size:12px;margin:0 0 6px;line-height:1.4}
#practice .practiceSettings select{font-size:14px;line-height:1.4;padding:8px 28px 8px 10px;min-height:38px;width:100%;min-width:0}
.about-intro{display:grid;grid-template-columns:minmax(240px,420px) minmax(0,1fr);align-items:center;gap:38px}
.about-photo{display:block;width:100%;height:auto;aspect-ratio:1913/1280;object-fit:contain;border-radius:8px}
.about-intro-copy h2{margin:12px 0;font-size:27px}.about-intro-copy p{font-size:16px;line-height:1.75}
@media(max-width:650px){#practice .practiceSettings{grid-template-columns:1fr;gap:12px}.about-intro{grid-template-columns:1fr;gap:24px}.about-photo{max-width:420px}.about-intro-copy h2{font-size:24px}}
/* CONJUGAISON / NOIR — black and red. */
:root{--bg:#090909;--panel:#151515;--ink:#f3f0ec;--line:#343034;--muted:#b4afb3;--red:#ff3344;--sage:#ff3344;--focus:#ff7782}
body{background:var(--bg);color:var(--ink)}header,.video-home.training>header{background:#111;border-color:var(--line)}header .logo .logo-wordmark,header a{color:var(--ink)}header .logo .logo-icon{background:#ff3344;color:#090909;border-color:#ff3344}header .logo small,.status,.tag{color:#b4afb3}.status:before{color:#ff3344}.language-switch{background:#241317;border-color:#74303a;color:#ffe4e7}.language-switch:hover{background:#ff3344;border-color:#ff3344;color:#090909}
h1,h2,h3,summary,.info-hero h1{color:var(--ink)}.eyebrow,.info-hero h1 span{color:#ff6472}.section-title .tag{color:#b4afb3}.workspace,.card,.support-panel{background:#151515;border-color:#343034}aside{background:#111;border-color:#343034}
.filter button,#explore .filter button{background:#191719;color:#d5cfd3;border-color:#44383e}.filter button:hover,#explore .filter button:hover{background:#492029;color:#fff}.filter button.active,#explore .filter button.active{background:#ff3344;border-color:#ff3344;color:#090909}
#tenseList button{color:#c6bfc4;border-color:#302a2e}#tenseList button:hover{background:#29171c;color:#fff}#tenseList button.active{background:#422027;border-left-color:#ff3344;color:#fff}#tenseList small{color:#aa9ca4}#tenseList button.active small{color:#ff9ba4}.badge{background:#29171c;color:#ffb2ba;border-color:#70333e}
.modebar button,.primary{background:#ff3344;border:1px solid #ff3344;color:#090909}.modebar button:hover,.primary:hover{background:#ff7681;border-color:#ff7681;color:#090909;outline:none;box-shadow:none}.modebar button.active,.modebar button:active{background:#bd2334;border-color:#bd2334;color:#fff;outline:none;box-shadow:none}.modebar button:focus-visible{outline:2px solid #ff9ba4;outline-offset:3px}.secondary{background:#24161b;border-color:#74303a;color:#ffced4}.secondary:hover{background:#442029;color:#fff}
.formula{background:#251b1e;color:#f1dfe4;border-color:#ff3344}.usage,#explore .usage,.example p,#explore .example p{color:#c5bdc2}.example,.row,details{border-color:#343034}.row span,#explore .row span{color:#b3a7af}.note,#explore .note{background:#21191d;color:#cbbec6}.note b{color:#ff7784}select,.card input,#practice #answer{background:#0c0c0c;color:#f3f0ec;border-color:#58424c}input::placeholder{color:#a697a0}.card p,.card label,.training .practiceSettings p,details p{color:#c7bdc4}[lang="en"],.usage [lang="en"],.note [lang="en"]{color:#b5a8b1}
.support-panel p,.info-lead,.info-grid .card p,.home-story p{color:#c7bdc4}.support-status{background:#2d1920;color:#ffc9d0;border-color:#74303a}.home-story,.page-nav,footer{border-color:#343034}.home-story a,.page-nav a{color:#ff8e9a}footer{color:#a89da4}.donation-section{background:#1b1215;border-color:#59303b}.donation-section p,.donation-section .donation-small{color:#c7bdc4}.donation-action{border-color:#59303b}.donation-symbol{color:#ff6472}.donation-action .primary{color:#090909}
.video-home.training>header .logo .logo-wordmark,.video-home.training>header .logo small,.video-home.training>header nav a,.video-home.training>header .language-switch{color:#ffe2e6}.video-home.training>header nav a,.video-home.training>header .language-switch{background:#24161b;border-color:#74303a}.video-home.training>header .logo .logo-icon{background:#ff3344;color:#090909;border-color:#ff3344}.video-home>header .logo .logo-icon{background:#ff3344;color:#090909;border-color:#ff3344}
.video-home .hero .video-welcome h1,.video-home .hero .video-welcome h1 span,.video-home .hero .video-welcome .eyebrow,.video-home .hero .video-welcome p,.video-home .hero .hero-end{color:#fff}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline-color:#ff9ba4}

.account-link{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;flex-shrink:0;border:1px solid #74303a;border-radius:50%;color:#ffe4e7;background:#241317}.account-link:hover{background:#ff3344;color:#090909;border-color:#ff3344}.video-home>header .account-link{background:#ffffff14;color:#fff;border-color:#ffffff66}.video-home>header .account-link:hover{background:#ff3344;border-color:#ff3344;color:#090909}
.login-page{min-height:100svh;background:radial-gradient(ellipse at 50% 40%,#34131b 0%,#090909 60%)}.login-page header{background:transparent;border:0;justify-content:space-between;min-height:90px}.login-brand{display:flex;align-items:center;gap:10px;color:#f3f0ec;font-size:17px;font-weight:700;letter-spacing:2px}.login-brand>span{display:grid;place-items:center;background:#ff3344;color:#090909;width:38px;height:40px;font-size:18px;letter-spacing:-1px}.login-main{max-width:560px;margin:0 auto;padding:8vh 24px 70px}.login-card{background:#151113;border:1px solid #59303b;padding:44px 36px;border-radius:12px;text-align:center}.login-icon{margin:0 auto 25px;border:1px solid #74303a;background:#2b161c;color:#ff8794;width:60px;height:60px;border-radius:50%;display:grid;place-items:center}.login-icon svg{width:26px;height:26px}.login-card .eyebrow{font-size:9px;letter-spacing:1.5px;line-height:1.8}.login-card h1{font-size:34px;letter-spacing:-1px;line-height:1.2;margin:20px 0 14px}.login-card p{font-size:15px;line-height:1.7;color:#c7bdc4}.signin-button{display:flex;align-items:center;justify-content:space-between;background:#ff3344;color:#090909;padding:15px 18px;min-height:50px;font-size:15px;letter-spacing:0;font-weight:700;margin:30px 0 15px;border-radius:5px}.signin-button:hover{background:#ff7681}.login-card .login-note{font-size:12px;color:#aa9ca4}.login-back{display:inline-block;margin-top:24px;font-size:13px;letter-spacing:0;color:#ff9ba4}@media(max-width:600px){.login-main{padding-top:5vh}.login-card{padding:32px 23px}.login-brand{font-size:13px;letter-spacing:1px}.account-link{width:36px;height:36px}}

.logout-form{display:flex;justify-content:flex-end;padding:16px 0}.logout-form button{font-size:12px;padding:8px 12px}
