/* Shared MusicClassLab logo and wordmark. */
html{scrollbar-gutter:stable}
header{box-sizing:border-box;height:72px!important;padding:0;background:#fff;color:#10243e;border-bottom:1px solid #dfe6ee;align-items:center}
header>.site-header-inner{box-sizing:border-box;width:min(1160px,calc(100% - 36px));max-width:none;height:71px;margin:0 auto;padding:0;display:flex;align-items:center;gap:18px}
header .site-header-inner>nav{width:100%;height:71px;display:flex;align-items:center}
header .brand{display:flex;align-items:center;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:22px!important;font-weight:850!important;letter-spacing:-.6px;text-decoration:none;color:#10243e;white-space:nowrap;flex-shrink:0;margin-right:auto;line-height:1.2}
header .brand-logo{display:block;width:56px;height:50px;object-fit:contain;margin-right:10px;flex:0 0 56px}
header .brandword em{font-style:normal;color:#55708f}
@media(max-width:620px){header .brand-logo{width:46px;height:42px;flex-basis:46px;margin-right:8px}header .brand{font-size:19px!important}header>.site-header-inner{gap:10px}}

/* Keep module navigation available while scrolling and presenting. */
header,body.present header{display:block!important;position:sticky;top:0;z-index:45}
body.present header .site-header-inner{width:min(1160px,calc(100% - 36px))}
body.present .exitPresent{display:none!important}
body.present .game,body.present .md-game,body.present .spotlight{min-height:calc(100vh - 104px)!important}
@media(max-width:620px){header .present{font-size:11px;padding:9px 8px;white-space:nowrap}header>.site-header-inner{gap:8px}}

/* Resources share the main header line. */
header .site-header-inner>nav{gap:14px}header .navlink,header .resource-link{font-size:13px;font-weight:650;white-space:nowrap;color:#42546a;text-decoration:none}header .resource-link:hover{text-decoration:underline}header .resource-link:focus-visible,header .resource-menu summary:focus-visible{outline:2px solid #183b68;outline-offset:4px}.resource-menu{display:none;position:relative;font-size:12px;color:#183b68;flex-shrink:0}.resource-menu summary{cursor:pointer;font-weight:750;padding:9px 0}.resource-menu>div{position:absolute;right:0;top:100%;min-width:210px;background:#fff;border:1px solid #dfe6ee;border-radius:10px;padding:8px;box-shadow:0 8px 24px #10243e22}.resource-menu a{display:block;padding:12px;color:#183b68;text-decoration:none;font-weight:650}.resource-menu a:hover{background:#edf2f8;border-radius:6px}body.present .resource-link,body.present .resource-menu{display:none!important}@media(max-width:1150px){header .navlink{display:none}header .site-header-inner>nav{gap:18px}}@media(max-width:760px){header .resource-link{display:none}.resource-menu{display:block}header .back{display:none}header .site-header-inner{gap:12px}}@media(max-width:450px){header .brand{font-size:16px!important}header .brand-logo{width:36px;height:38px;flex-basis:36px;margin-right:6px}header .site-header-inner{width:calc(100% - 24px);gap:8px}header .present{font-size:10px;padding:8px 6px}}
/* Quiet emphasis for recommended resources. */
header .resource-link{background:#edf3fa;color:#183b68;padding:8px 10px;border-radius:8px;font-weight:700}header .resource-link:hover{background:#e2ecf7;text-decoration:none}.resource-menu summary{background:#edf3fa;padding:8px 10px;border-radius:8px}

/* Distinct outline for result verification. */
header a.navlink[href="check-result.html"]{color:#183b68;border:1px solid #9db3cd;border-radius:8px;padding:7px 10px;font-weight:700;background:transparent}header a.navlink[href="check-result.html"]:hover{background:#f5f8fc;border-color:#183b68}header a.navlink[href="check-result.html"]:focus-visible{outline:2px solid #183b68;outline-offset:3px}

/* Compact language control shared by every page. */
header .language-switch{display:flex;align-items:center;flex-shrink:0;margin:0!important}header .language-switch select{font:650 12px Inter,Arial,sans-serif;color:#183b68;background:#fff;border:1px solid #b8c9da;border-radius:8px;padding:8px 5px;width:103px;cursor:pointer}header .language-switch select:focus-visible{outline:2px solid #183b68;outline-offset:2px}.locale-notice{max-width:1000px;margin:20px auto;padding:14px 20px;color:#183b68;background:#edf3fa;border-radius:10px;font-size:14px}@media(max-width:900px){header .resource-link{display:none}header .resource-menu{display:block}header .site-header-inner,header .site-header-inner>nav{gap:10px}}@media(max-width:540px){header .resource-menu{display:none}header .language-switch select{width:83px;font-size:11px;padding:7px 2px}header .present{font-size:10px;padding:7px 5px}header .brand{font-size:15px!important}header .brand-logo{width:30px;height:35px;flex-basis:30px;margin-right:5px}}
/* Longer US course names use the classroom cards, keeping the header on one line. */
html[lang="en-US"] header .navlink[href="#ks3"],html[lang="en-US"] header .navlink[href="#gcse"],html[lang="en-US"] header .navlink[href="#alevel"]{display:none}
@media(max-width:1350px){header .navlink[href="#ks3"],header .navlink[href="#gcse"],header .navlink[href="#alevel"]{display:none}}

.region-dialog{box-sizing:border-box;width:min(480px,calc(100% - 32px));padding:26px;border:1px solid #d4dfeb;border-radius:18px;background:#fff;color:#18364d;box-shadow:0 20px 70px #10243e33;font:16px/1.5 Inter,Arial,sans-serif}.region-dialog::backdrop{background:#10243e55}.region-dialog h2{font-size:22px;line-height:1.2;margin:0 0 12px;color:#12395b}.region-dialog p{margin:0 0 22px}.region-actions{display:flex;flex-wrap:wrap;gap:10px}.region-actions a,.region-actions button{box-sizing:border-box;display:inline-block;border:1px solid #183b68;border-radius:9px;padding:10px 13px;font:700 13px/1.4 Inter,Arial,sans-serif;cursor:pointer;text-decoration:none}.region-actions a{background:#183b68;color:#fff}.region-actions button{background:#fff;color:#183b68}.region-actions a:focus-visible,.region-actions button:focus-visible{outline:3px solid #6d9bd0;outline-offset:3px}

/* Tools have their own filled navigation style. */
header a.navlink[href="#tools"]{display:inline-flex!important;align-items:center;background:#183b68;color:#fff;border:1px solid #183b68;border-radius:8px;padding:8px 11px;font-weight:750}header a.navlink[href="#tools"]:hover{background:#244d80}header a.navlink[href="#tools"]:focus-visible{outline:2px solid #6d9bd0;outline-offset:3px}
html[data-hide-revision="true"] a[href*="revision-guides"]{display:none!important}html[data-hide-revision="true"] .resource-cards{grid-template-columns:1fr}
@media(max-width:640px){header .resource-menu{display:none}header a.navlink[href="#tools"]{font-size:11px;padding:7px 8px}}
