/* Coffee art direction: warm light, editorial shelves, explicit correction marks. */
html[data-palette=coffee]{--a-bg:#191614;--a-panel:#27211d;--a-raised:#372e27;--a-line:#514336;--a-accent:#f0c78d;--a-muted:#c5b6a6;--a-text:#f6eddf;--a-on:#2b2016}
html[data-palette=coffee] .app{background:radial-gradient(ellipse at 85% 0%,#7f502324,transparent 650px),#191614}
html[data-palette=coffee] .app .site-header{background:#191614ed;border-bottom-color:#dfb57b1a;backdrop-filter:blur(18px)}
html[data-palette=coffee] .app .brand-link{box-shadow:0 4px 18px #0002}
html[data-palette=coffee] .app .nav-dropdown.current summary{background:#f0c78d16;color:#f0c78d}
html[data-palette=coffee] .app .nav-dropdown summary:hover{background:#f0c78d12}
html[data-palette=coffee] .app .studio-home{padding-top:28px}
html[data-palette=coffee] .app .studio-hero{position:relative;grid-template-columns:1.06fr 1fr;gap:38px;padding:38px 38px 40px;border:1px solid #b7925d25;border-radius:30px;background:radial-gradient(ellipse at 95% 15%,#b2793824,transparent 65%),linear-gradient(135deg,#30261e,#211c18);box-shadow:inset 0 1px #f4d3a016,0 22px 55px #0002;min-height:460px;margin-bottom:28px}
html[data-palette=coffee] .app .studio-hero-copy{padding:0}
html[data-palette=coffee] .app .studio-hero h1{font-size:49px;line-height:1.25;letter-spacing:-.035em;font-weight:750;text-wrap:balance}
html[data-palette=coffee] .app .studio-hero .studio-kicker{display:inline-flex;align-items:center;gap:9px;border:1px solid #f0c78d40;background:#f0c78d0d;padding:8px 12px;border-radius:8px;color:#efcd9e;letter-spacing:.09em}
html[data-palette=coffee] .app .studio-hero-copy>p{color:#d0bdab;font-size:16px;line-height:1.9}
html[data-palette=coffee] .app .studio-scene{height:380px;border-radius:80px 20px 20px 20px;box-shadow:0 18px 35px #0005,inset 0 0 0 1px #f0c78d20;transform:rotate(1deg)}
html[data-palette=coffee] .app .button.primary{background:linear-gradient(180deg,#f5d6a6,#e4b773);color:#2b2016;border:1px solid #f5d6a6;box-shadow:inset 0 1px #fff6,0 4px 0 #8e6336,0 10px 24px #0003;border-radius:13px;font-weight:750}
html[data-palette=coffee] .app .button.primary:active{transform:translateY(3px);box-shadow:inset 0 1px #fff2,0 1px 0 #8e6336}
html[data-palette=coffee] .app .button.secondary{background:linear-gradient(#3b3027,#2b241e);border-color:#6b533c;border-radius:13px;box-shadow:inset 0 1px #f0c78d12;color:#efdbbe}
/* Continue card shares the reading feature's cream and coffee colours. */
html[data-palette=coffee] .app .studio-continue{background:#e4d4b8;border:1px solid #e4d4b8;box-shadow:inset 0 1px #fff5,0 8px 22px #0002;border-radius:16px;margin-bottom:38px;color:#302519;transition:border-color .2s,box-shadow .2s}
html[data-palette=coffee] .app .studio-continue small{color:#665039}
html[data-palette=coffee] .app .studio-continue strong{color:#302519}
html[data-palette=coffee] .app .studio-continue .continue-fraction{color:#302519}
html[data-palette=coffee] .app .studio-continue .continue-fraction i{color:#665039}
html[data-palette=coffee] .app .studio-continue>svg{color:#665039}
html[data-palette=coffee] .app .studio-continue:hover{border-color:#f0e3ce;box-shadow:inset 0 1px #fff7,0 10px 26px #0003}
html[data-palette=coffee] .app .studio-continue:focus-visible{outline:2px solid #e4d4b8;outline-offset:4px}
@media(prefers-reduced-motion:reduce){html[data-palette=coffee] .app .studio-continue{transition:none}}
html[data-palette=coffee] .app .continue-icon{color:#665039;background:#d6c3a2;box-shadow:inset 0 1px #fff4;border:1px solid #66503914}
html[data-palette=coffee] .app .studio-skills{grid-template-columns:repeat(6,minmax(0,1fr));gap:22px}
html[data-palette=coffee] .app .studio-skill{grid-column:span 2;border:1px solid #d3a66529;background:linear-gradient(160deg,#30271f,#211d19);border-radius:20px;box-shadow:inset 0 1px #ffe3b80b,0 9px 25px #0002}
html[data-palette=coffee] .app .studio-skill:nth-child(-n+2){grid-column:span 3;display:grid;grid-template-columns:.92fr 1.08fr;align-items:center}
html[data-palette=coffee] .app .studio-skill:nth-child(-n+2) .studio-skill-image{height:100%;min-height:220px;aspect-ratio:auto}
html[data-palette=coffee] .app .studio-skill:nth-child(n+3){grid-column:span 3;display:grid;grid-template-columns:130px minmax(0,1fr);align-items:center;padding:16px;gap:20px}
html[data-palette=coffee] .app .studio-skill:nth-child(n+3) .studio-skill-image{aspect-ratio:1;height:auto;border-radius:14px}
html[data-palette=coffee] .app .studio-skill:nth-child(n+3) .studio-skill-copy{padding:5px 8px 5px 0}
html[data-palette=coffee] .app .studio-skill-copy>p{margin:10px 0 15px;line-height:1.75}
html[data-palette=coffee] .app .studio-skill:hover{border-color:#d7ad74;box-shadow:0 14px 32px #0004;transform:translateY(-3px)}
html[data-palette=coffee] .app .skill-title-line>svg:first-child{color:#e6bd84}
html[data-palette=coffee] .app .studio-feature{background:linear-gradient(130deg,#35291f,#241f1a);border-color:#b7925d30;border-radius:23px}
html[data-palette=coffee] .app .reading-feature{background:#e4d4b8;color:#302519;border:0;box-shadow:0 15px 35px #0003}
html[data-palette=coffee] .app .reading-feature h2,html[data-palette=coffee] .app .reading-feature strong{color:#302519}
html[data-palette=coffee] .app .reading-feature :is(p,.studio-kicker,.feature-action){color:#665039}
html[data-palette=coffee] .app .studio-section-heading h2{font-size:29px;letter-spacing:-.025em}
html[data-palette=coffee] .app .studio-levels button[aria-pressed=true]{background:#f0c78d;color:#302519;box-shadow:0 2px 12px #0002}
/* Reading and writing get their own material treatment instead of another generic card. */
html[data-palette=coffee] .app .material-card>.reading-text{background:#241e19;border:1px solid #d9b37822;border-radius:3px 20px 20px 3px;border-inline-start:3px solid #be925a;padding:32px 38px;box-shadow:0 14px 40px #0002;max-width:800px}
html[data-palette=coffee] .app .material-card>.reading-text p:first-child:first-letter{font-size:1.5em;color:#f0c78d;font-weight:600}
html[data-palette=coffee] .app .material-illustration{border-radius:22px;box-shadow:0 14px 32px #0004;outline:1px solid #c69b5c33;outline-offset:7px}
html[data-palette=coffee] .app .listening-player{background:radial-gradient(at top left,#ad7a3430,transparent 80%),#2b231c;border:1px solid #ac824e65;box-shadow:inset 0 1px #f9dba81a,0 18px 30px #0003;border-radius:24px;padding:27px}
html[data-palette=coffee] .app .audio-speed button{border-radius:9px;border-color:#695037;min-width:54px;min-height:44px;color:#dcc4a7}
html[data-palette=coffee] .app .audio-speed button[aria-pressed=true]{background:#efc78d;color:#34271b;box-shadow:0 3px 0 #8b643d}
html[data-palette=coffee] .app textarea{background:#211c17;border-color:#97714466;border-radius:14px;box-shadow:inset 0 4px 14px #0003;color:#f6eddf;line-height:1.9}
html[data-palette=coffee] .app .writing-checklist{background:#2c241d;border-color:#c89c5e35}
/* A stronger visual language for the knowledge and the correction itself. */
html[data-palette=coffee] .app :is(.word-example mark,.reason-term){background:#e9bd79;color:#302113;box-shadow:0 2px 0 #a8793b;border:1px solid #f2d09d;border-radius:5px;padding:2px 5px;font-weight:700;box-decoration-break:clone;-webkit-box-decoration-break:clone}
html[data-palette=coffee] .app .reason-term{font-size:.96em;line-height:1.9}
html[data-palette=coffee] .app .sentence-repair{display:grid;grid-template-columns:minmax(0,1fr) 25px minmax(0,1fr);align-items:stretch;gap:15px;background:transparent;border:0;padding:0;margin:25px 0}
html[data-palette=coffee] .app .repair-row{display:block;padding:22px;border-radius:17px;min-width:0}
html[data-palette=coffee] .app .repair-before{background:#3a2528;border:1px solid #b8798266}
html[data-palette=coffee] .app .repair-after{background:#23372d;border:1px solid #96c7a777;box-shadow:0 10px 25px #0002}
html[data-palette=coffee] .app .repair-dot{margin-bottom:12px;background:none;color:#f2aeb5}
html[data-palette=coffee] .app .repair-after .repair-dot{color:#bce5be}
html[data-palette=coffee] .app .repair-row small{font-size:12px;letter-spacing:.025em;color:#dfc5c6;margin-bottom:13px}
html[data-palette=coffee] .app .repair-after small{color:#bcdac9}
html[data-palette=coffee] .app .repair-before p{font-size:20px;color:#efd6d7;line-height:1.9}
html[data-palette=coffee] .app .repair-after p{font-size:22px;font-weight:650;color:#e4f0e6;line-height:1.9}
html[data-palette=coffee] .app .repair-bridge{align-self:center;transform:rotate(-90deg);color:#dab479;background:#3a2f23;border-radius:50%;width:26px;height:26px}
html[data-palette=coffee] .app :is(.sentence-repair del,.note-card del){background:#f0a6af;color:#491d26;border:1px solid #ffd4d8;border-radius:5px;text-decoration-color:#7a263b;text-decoration-thickness:2px;padding:3px 7px;box-shadow:0 2px 0 #a65d6b;font-weight:650;box-decoration-break:clone;-webkit-box-decoration-break:clone}
html[data-palette=coffee] .app :is(.sentence-repair mark,.note-card mark,.answer-result mark){background:#bde4bf;color:#193b2a;border:1px solid #e3f8dc;border-radius:5px;padding:3px 7px;box-shadow:0 2px 0 #709b75;font-weight:800;box-decoration-break:clone;-webkit-box-decoration-break:clone}
html[data-palette=coffee] .app .reason-block{background:#33291e;border:1px solid #b38a4d44;border-radius:17px;padding:24px;margin:25px 0}
html[data-palette=coffee] .app .reason-block h4{font-size:14px;color:#f1cb95;margin:0 0 15px;gap:9px}
html[data-palette=coffee] .app .reason-block p{color:#efdfc7;font-size:16px;line-height:2}
html[data-palette=coffee] .app .evidence-card{border-inline-start:3px solid #e8bc7a;border-radius:0 16px 16px 0;background:#30261c;padding:20px 24px}
html[data-palette=coffee] .app .evidence-card blockquote{color:#efd5b2;font-size:19px;line-height:1.9}
html[data-palette=coffee] .app .question-card{background:linear-gradient(150deg,#2c251f,#211c18);border:1px solid #b08a563d;box-shadow:inset 0 1px #f6d9ad14,0 18px 50px #0003;border-radius:25px}
html[data-palette=coffee] .app .question-position{display:inline-flex;align-items:center;gap:7px;background:#493621;color:#f2cd96;border:1px solid #c5955260;border-radius:10px;padding:10px 13px}
html[data-palette=coffee] .app .question-position i{color:#ceb18e}
html[data-palette=coffee] .app .option{background:#251f1b;border:1px solid #6b5540;box-shadow:inset 0 1px #fff1,0 3px 0 #110e0b;color:#f0e4d7;min-height:64px}
html[data-palette=coffee] .app .option-letter{background:#3e3023;border:1px solid #8e6a3c66;color:#e5c49a}
html[data-palette=coffee] .app .option.selected{border:2px solid #e9bc78;background:#493723;box-shadow:0 0 0 3px #eccb8c10}
html[data-palette=coffee] .app .option.selected .option-letter{background:#f1cb92;color:#342414}
html[data-palette=coffee] .app .option.correct,html[data-palette=coffee] .app .option.correct.selected{background:#263c2e;border-color:#b6dfb8;color:#e1f1df;box-shadow:inset 4px 0 #b6dfb8}
html[data-palette=coffee] .app .option.wrong,html[data-palette=coffee] .app .option.wrong.selected{background:#462a30;border-color:#e5a0ad;color:#f8dce0;box-shadow:inset 4px 0 #e5a0ad}
html[data-palette=coffee] .app .option.correct .option-letter{background:#bde4bf;color:#193b2a}html[data-palette=coffee] .app .option.wrong .option-letter{background:#f0a6af;color:#491d26}
html[data-palette=coffee] .app .feedback-heading h3{font-size:23px;color:#f5dfbc}
html[data-palette=coffee] .app .feedback-symbol{background:#493623;color:#efc78e;box-shadow:inset 0 1px #f4d7ad33,0 3px 12px #0003;width:48px;height:48px}
html[data-palette=coffee] .app .note-card{background:#29221b;border-color:#b38a4d44;box-shadow:inset 3px 0 #d0a36955}
html[data-palette=coffee] .app .note-card .sentence-repair{margin-top:22px}
html[data-palette=coffee] .app .unit-tabs a.active{background:#f0c78d;color:#322216;box-shadow:0 3px 0 #916a3a;border-color:#e4b374}
html[data-palette=coffee] .app .map-index{display:grid;place-items:center;min-width:26px;height:26px;border-radius:7px;background:#f0c78d;color:#302113}
html[data-palette=coffee] .app .node-detail blockquote{background:#473522;color:#ffe6bc;border-color:#e6b677;font-size:19px}
html[data-palette=coffee] .app .word-image-frame{outline:1px solid #d6ae7444;outline-offset:7px;box-shadow:0 24px 45px #0005}
html[data-palette=coffee] .app .word-pronunciation button{background:#3b3025;border:1px solid #b18b5555;color:#f2d6ae;box-shadow:inset 0 1px #fff1;min-height:46px}
html[data-palette=coffee] .app .word-combinations span{background:#32281e;border-color:#ae854344;box-shadow:inset 0 1px #fff1}
html[data-palette=coffee] .app :focus-visible{outline:3px solid #ffd592;outline-offset:4px}
html[data-palette=coffee] .app ::selection{background:#f1ca8e;color:#302113}
@media(min-width:1000px){html[data-palette=coffee] .app .studio-skills .skill-title-line h3{font-size:21px}}
@media(max-width:700px){html[data-palette=coffee] .app .studio-hero{display:flex;padding:25px 23px 23px;gap:28px;min-height:0;border-radius:24px}html[data-palette=coffee] .app .studio-hero h1{font-size:35px;line-height:1.3}html[data-palette=coffee] .app .studio-hero-copy>p{font-size:15px}html[data-palette=coffee] .app .studio-scene{height:235px;border-radius:45px 15px 15px 15px;transform:none}html[data-palette=coffee] .app .studio-skills{grid-template-columns:1fr;gap:19px}html[data-palette=coffee] .app .studio-skill:nth-child(n){grid-column:auto;display:block;padding:0}html[data-palette=coffee] .app .studio-skill:nth-child(n) .studio-skill-image{width:100%;height:auto;min-height:0;aspect-ratio:1.85;border-radius:0}html[data-palette=coffee] .app .studio-skill:nth-child(n) .studio-skill-copy{padding:22px}html[data-palette=coffee] .app .sentence-repair{grid-template-columns:1fr;gap:11px}html[data-palette=coffee] .app .repair-row{padding:19px}html[data-palette=coffee] .app .repair-bridge{transform:none;justify-self:center;margin:0}html[data-palette=coffee] .app .repair-row p{font-size:19px}html[data-palette=coffee] .app .reason-block{padding:19px}html[data-palette=coffee] .app .feedback-heading h3{font-size:20px}html[data-palette=coffee] .app .material-card>.reading-text{padding:24px 22px}html[data-palette=coffee] .app .listening-player{padding:20px}html[data-palette=coffee] .app .question-card{padding:23px 18px}html[data-palette=coffee] .app .option{font-size:16px}}
@media(prefers-reduced-motion:reduce){html[data-palette=coffee] .app .studio-scene{transform:none}}
@media print{html[data-palette=coffee] .app{background:white;color:black}}

/* Refined coffee: champagne light, smoked copper and quiet edge reflections. */
html[data-palette=coffee] .app{background:radial-gradient(ellipse at 90% 0%,#90633b19,transparent 800px),radial-gradient(ellipse at 0% 45%,#b48c6010,transparent 750px),#191614}
html[data-palette=coffee] .app :is(.studio-hero,.studio-skill,.question-card,.listening-player,.note-card){position:relative;isolation:isolate;background-image:radial-gradient(ellipse at 8% 0%,#ead2b313,transparent 50%),linear-gradient(145deg,#302922,#221e1a 65%,#29221c);border-color:#c6a78029;box-shadow:inset 0 1px 0 #fff0d915,inset 0 -1px 0 #0005,0 15px 40px #0003}
html[data-palette=coffee] .app :is(.studio-hero,.studio-skill,.question-card,.listening-player,.note-card)::before{content:"";position:absolute;pointer-events:none;z-index:1;top:0;left:12%;right:12%;height:1px;background:linear-gradient(90deg,transparent,#f6e4c969 38%,#c9a26a33 70%,transparent)}
html[data-palette=coffee] .app .studio-hero{background-image:radial-gradient(ellipse at 88% 10%,#d8aa6a27,transparent 48%),radial-gradient(ellipse at 2% 0%,#f6dfbf0d,transparent 60%),linear-gradient(140deg,#332a22,#211d19 80%)}
html[data-palette=coffee] .app .studio-skill{transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
@media(hover:hover){html[data-palette=coffee] .app .studio-skill:hover{border-color:#d7b98c66;box-shadow:inset 0 1px #fff0d92b,0 18px 42px #0005,0 0 25px #b8955b08;transform:translateY(-3px)}}
html[data-palette=coffee] .app .button.primary{background:linear-gradient(115deg,#c29d68 0%,#e4c79c 25%,#f4dfbd 42%,#d9b582 70%,#cba46f);border-color:#f1dbb580;box-shadow:inset 0 1px #fff9e6a1,inset 0 -1px #8e673e55,0 3px 0 #745231,0 8px 20px #0003;color:#302318;position:relative;transition:filter .2s,transform .2s,box-shadow .2s}
@media(hover:hover){html[data-palette=coffee] .app .button.primary:hover{filter:brightness(1.07);box-shadow:inset 0 1px #fff9e6b0,0 3px 0 #745231,0 6px 24px #d4ac6726}}
html[data-palette=coffee] .app .button.secondary{background:linear-gradient(130deg,#493c2c44,#27221c 55%);border-color:#b59a714a;box-shadow:inset 0 1px #f5dfbd19;color:#e5d4b9}
html[data-palette=coffee] .app .repair-before{background:linear-gradient(145deg,#312724,#29221f);border:1px solid #b6978230;box-shadow:inset 0 1px #e0c1ac0a}
html[data-palette=coffee] .app .repair-after{position:relative;background:radial-gradient(ellipse at 0% 0%,#d8bd8b16,transparent 85%),linear-gradient(145deg,#352f26,#2b261f);border:1px solid #d0b58652;box-shadow:inset 0 1px #f3dfb92e,0 9px 24px #0002}
html[data-palette=coffee] .app .repair-before p{color:#c4b8ac;font-size:20px;font-weight:400;line-height:1.85}
html[data-palette=coffee] .app .repair-after p{color:#f2e8d7;font-size:20px;font-weight:500;line-height:1.85}
html[data-palette=coffee] .app .repair-row small{color:#afa094;font-size:12px;letter-spacing:.04em}
html[data-palette=coffee] .app .repair-after small{color:#d5be95}
html[data-palette=coffee] .app .repair-dot{color:#bf9b89}
html[data-palette=coffee] .app .repair-after .repair-dot{color:#e2c79a}
html[data-palette=coffee] .app .repair-bridge{color:#bda681;background:linear-gradient(135deg,#40372b,#2b251e);box-shadow:inset 0 1px #e6d2ad1c}
html[data-palette=coffee] .app :is(.sentence-repair del,.note-card del){background:#b3836812;color:#d7ab94;border:0;border-bottom:1px dotted #bb8d7090;box-shadow:none;border-radius:0;padding:1px 3px;text-decoration-color:#c49379;text-decoration-thickness:1.5px;font-weight:500}
html[data-palette=coffee] .app :is(.sentence-repair mark,.note-card mark,.answer-result mark){background:linear-gradient(180deg,transparent 58%,#d9b77d27 58%);color:#ffe5b7;border:0;border-bottom:2px solid #dcc08f;border-radius:2px 2px 0 0;padding:1px 4px;box-shadow:none;font-weight:750}
html[data-palette=coffee] .app :is(.word-example mark,.reason-term){background:linear-gradient(180deg,transparent 64%,#cfac7226 64%);color:#efd3a4;border:0;border-bottom:1px solid #bb98635c;border-radius:0;padding:1px 2px;box-shadow:none;font-weight:650;box-decoration-break:clone;-webkit-box-decoration-break:clone}
html[data-palette=coffee] .app .reason-block{background:linear-gradient(115deg,#c7a3750b,transparent 60%),#28231e;border:1px solid #bfa17826;box-shadow:inset 0 1px #f1ddbc0a;border-radius:15px}
html[data-palette=coffee] .app .reason-block h4{color:#d8be96;font-weight:600}
html[data-palette=coffee] .app .reason-block p{color:#d2c5b5;line-height:2.05;font-weight:400}
html[data-palette=coffee] .app .feedback-heading h3{color:#ece1d1;font-weight:650}
html[data-palette=coffee] .app .feedback-symbol{background:linear-gradient(135deg,#64503955,#32291f);color:#d1b68b;box-shadow:inset 0 1px #efd4a62b,0 5px 18px #0002}
html[data-palette=coffee] .app .option.correct,html[data-palette=coffee] .app .option.correct.selected{background:linear-gradient(110deg,#bda3771c,#29251e);border-color:#c6ae8280;color:#f1e5d0;box-shadow:inset 3px 0 #cfb585,inset 0 1px #e9d8b71a}
html[data-palette=coffee] .app .option.wrong,html[data-palette=coffee] .app .option.wrong.selected{background:linear-gradient(110deg,#996d5216,#2c2420);border-color:#a27d6766;color:#d7c1b0;box-shadow:inset 3px 0 #a98268}
html[data-palette=coffee] .app .option.correct .option-letter{background:#554832;color:#f6ddb2;border-color:#c4a36d55}
html[data-palette=coffee] .app .option.wrong .option-letter{background:#44332a;color:#d8b098;border-color:#b28d7255}
html[data-palette=coffee] .app .unit-tabs a.active{background:linear-gradient(120deg,#e5cca2,#ccaa77);color:#34281c;box-shadow:inset 0 1px #fff4dc80,0 2px 0 #745638;border-color:#f2d9ae40}
html[data-palette=coffee] .app .evidence-card{background:linear-gradient(115deg,#b7956310,transparent),#27221d;border-inline-start:2px solid #bfa06e;box-shadow:inset 0 1px #dac4a110}
html[data-palette=coffee] .app .evidence-card blockquote{color:#e1cba8}
@media(max-width:700px){html[data-palette=coffee] .app .repair-row p{font-size:19px}}
@media(prefers-reduced-motion:reduce){html[data-palette=coffee] .app :is(.studio-skill,.button){transition:none}}

html[data-palette=coffee] .app .repair-row p{text-wrap:pretty}

/* Selected warm logo preview, local coffee palette only. */
html[data-palette=coffee] .app .brand-link,
html[data-palette=coffee] .app .footer-main .brand{background:transparent;border:0;border-radius:0;box-shadow:none;padding:0}
html[data-palette=coffee] .app .brand-image{width:190px;height:64px;max-width:100%}
html[data-palette=coffee] .app .brand-image img{content:url('/brand/english-rove-coffee-preview.png.webp');width:100%;height:100%;object-fit:contain}
@media(max-width:540px){html[data-palette=coffee] .app .brand-image{width:125px;height:42px}}

/* Support pages share the approved coffee text contrast, not the old light-theme green. */
html[data-palette=coffee] .app .support-page .support-lead,html[data-palette=coffee] .app .support-page .support-date{color:var(--a-muted,#c5b6a6)}
