/* BeeBright exercises: the same warm, rounded presentation as the home page. */
:root{color:#58443c;background:#fffaf3}body{background-color:#fffaf3;color:#58443c}body::before{background-image:url('assets/geometric-pattern.svg'),url('assets/topographic-pattern.svg');background-size:700px 700px;opacity:.85}
header{border-color:#eadfce}header .brand,header .brand>span{color:#e78b3d}header .brand>span{color:#efb14f}header small{color:#8c7869;letter-spacing:.1px}
h1,h2,h3,.subject-picker-heading h1,.subject-top h1{color:#674d3f;letter-spacing:-.035em;font-family:'BeeBright Rounded','BeeBright Sans',sans-serif;font-weight:900}p,.muted{color:#887569}
.small,.profile-choice,.profile-form input{background:#fffdf8bf;border:1px solid #eadcca;box-shadow:0 3px 0 #e5d9c980;color:#795a44}.small:hover{background:#ffeddb}.small,.profile-choice{border-radius:15px}
.welcome,.panel,.grade-picker .hub-hero{background:#fff1d9a6;border:1px solid #efd7b8;box-shadow:0 5px 0 #dfc9ac55,0 12px 30px #a8814d08;border-radius:28px}.welcome h1,.welcome p{color:#795338}.eyebrow{color:#a8805f}
.tile,body[data-grade] .tile,body.grade-picker .grade-card[href]{background:#fffdf8b8;border:1px solid #e8d8c6;border-bottom:4px solid var(--grade-tint,#e9d5bd)!important;box-shadow:0 6px 16px #a079450c;border-radius:23px;transition:transform .18s,background .18s}.tile:hover{background:#fff5e7e8;transform:translateY(-3px)}
body.grade-picker .grade-card[href] h2{background:none;-webkit-text-fill-color:var(--grade-ink);color:var(--grade-ink)}.grade-card .grade-number{background:none}.grade-card .grade-action{font-family:'BeeBright Rounded','BeeBright Sans',sans-serif;font-weight:900}
.primary,body[data-grade] .primary,.quiz-actions #check{background:#ff984f;color:#603115;border:1px solid #f4944d;box-shadow:0 4px 0 #cf7738;border-radius:16px;font-family:'BeeBright Rounded','BeeBright Sans',sans-serif;font-weight:900;text-transform:none;letter-spacing:0}
.primary:hover,body[data-grade] .primary:hover,.quiz-actions #check:hover{background:#ffa65f}.primary:disabled,body[data-grade] .primary:disabled,.quiz-actions #check:disabled{background:#eddfd0!important;border-color:#e7d8c7;color:#9b8a79!important;box-shadow:none;opacity:1}
.question-panel{background:#fffdf7dd;border-color:#e9d9c6;box-shadow:0 6px 0 #e4d3bd88,0 15px 36px #9e79400b}.question,.quiz-active .question{color:#634c3d;font-weight:900;line-height:1.4}.test-heading,.meta{color:#947b65}.progress{background:#eadfce}.progress div{background:#efac67}
.option,body[data-grade] .option{background:#ffffffb8;border:1px solid #e8dccc;color:#644e40;box-shadow:0 3px 0 #e5d9c8;border-radius:15px;font-family:'BeeBright Rounded','BeeBright Sans',sans-serif;font-weight:800;transition:background .15s,border-color .15s,transform .15s}.option:hover:not(:disabled){background:#fff0dcd9;border-color:#dfa872}.option.selected,body[data-grade] .option.selected{background:#ffebd4;border-color:#edaa6c;box-shadow:0 3px 0 #dda06b}
.option.correct,body[data-grade] .option.correct{background:#eaf4dc!important;border-color:#8dac68!important;color:#426432!important;box-shadow:0 3px 0 #8dac68}.option.wrong,body[data-grade] .option.wrong{background:#ffead4!important;border-color:#e6a06b!important;color:#8d512a!important;box-shadow:0 3px 0 #e6a06b}
.feedback{border-radius:17px}.feedback-correct{background:#eaf4dc!important;color:#426432}.feedback-incorrect{background:#ffead4!important;color:#8d512a}.subject-lessons{background:#fff9edbb;border-color:#e8d7c1}.profile-panel{background:#fff9efed;border:1px solid #e7d4b9;box-shadow:0 20px 60px #85653622}.profile-panel h1{font-weight:1000}.score{color:#dc7d39}.hub-back,.back{color:#9b724e}.sticker{background:#fff2dca8}
@media(max-width:650px){body::before{background-size:500px 500px}.welcome,.panel{border-radius:22px}.quiz-active .quiz-actions{background:#fff8edf5;border-color:#e8d8c2;backdrop-filter:none}.subject-picker .subject-card{border-radius:20px}.profile-panel{border-radius:25px}.quiz-active .option{min-height:46px}}
@media(prefers-reduced-motion:reduce){.tile,.option{transition:none}}
/* Replace the inherited pale headline gradient with a readable solid fill. */
body.grade-picker .hub-hero h1{color:#5c3b28;background:none;-webkit-text-fill-color:#5c3b28;-webkit-background-clip:border-box;background-clip:border-box;font-size:clamp(40px,4vw,54px);font-weight:1000;line-height:1.1;letter-spacing:-.035em;text-shadow:none;margin:10px 0 12px}
body.grade-picker .hub-hero .eyebrow{color:#86572f}body.grade-picker .hub-hero p{color:#795338}
@media(max-width:650px){body.grade-picker .hub-hero h1{font-size:clamp(24px,6.2vw,34px);line-height:1.12;margin:7px 0 9px}}
@media(max-height:480px) and (min-width:480px){body.grade-picker .hub-hero h1{font-size:32px}}