/* Brand colour belongs to sections and actions, not to the reading text. */
body.login-page { font-family: Futura, 'Source Han Sans SC', sans-serif; }
body.ui-refined.ui-colorful {
  --bg: #f6f9fc;
  --accent: #197bbb;
  --accent-strong: #12649a;
  --mint: #d9efdf;
  --yellow: #ffdf68;
  --violet: #89a9d6;
  --muted: #627580;
  --text: #263c48;
  --line: #dbe6ec;
  background: var(--bg);
}
body.ui-refined.ui-colorful .topbar-colors { height: 5px; }
body.ui-refined.ui-colorful .topbar-colors span:nth-child(1) { background: #f5826b; }
body.ui-refined.ui-colorful .topbar-colors span:nth-child(2) { background: #ffdf68; }
body.ui-refined.ui-colorful .topbar-colors span:nth-child(3) { background: #8fcfa9; }
body.ui-refined.ui-colorful .topbar-colors span:nth-child(4) { background: #76b8e0; }
body.ui-refined.ui-colorful .topbar { border-bottom: 1px solid #dce8ed; }
body.ui-refined.ui-colorful .staff-navigation .staff-home[aria-current],
body.ui-refined.ui-colorful .staff-nav-group.is-current > summary { color: #5e4a12; background: #ffdf68; box-shadow: inset 0 -3px #e7bb3b; }
body.ui-refined.ui-colorful.member-page .topbar nav > a.active { background: #dceffb; color: #1d6e9f; box-shadow: inset 0 -3px #62add9; }
body.ui-refined.ui-colorful.member-page .topbar nav > a:nth-child(1).active { background: #ffebbd; color: #77551b; box-shadow: inset 0 -3px #e8bf48; }
body.ui-refined.ui-colorful.member-page .topbar nav > a:nth-child(3).active { background: #ddf0e3; color: #28734f; box-shadow: inset 0 -3px #7dbb94; }
body.ui-refined.ui-colorful.member-page .topbar nav > a:nth-child(4).active { background: #ffe1d8; color: #984f3d; box-shadow: inset 0 -3px #ec997f; }
body.ui-refined.ui-colorful .member-points-menu > summary { background: #fff8df; border-color: #ead58f; }
body.ui-refined.ui-colorful .primary { background: #197bbb; border-color: #197bbb; color: #fff; }
body.ui-refined.ui-colorful .primary:hover { background: #12649a; border-color: #12649a; }
body.ui-refined.ui-colorful .secondary { background: #e0f1e6; border-color: #a5d0b6; color: #286544; }
body.ui-refined.ui-colorful .secondary:hover { background: #cce9d6; border-color: #7cb48f; }
body.ui-refined.ui-colorful .page-head {
  min-height: 112px; padding: 22px 26px; margin-bottom: 24px;
  border: 0; border-left: 6px solid #77b696; border-radius: 0; background: #e1f0e8;
}
body.ui-refined.ui-colorful.route-vocab .page-head,
body.ui-refined.ui-colorful.route-assessment .page-head { background: #e1edf9; border-left-color: #76a7d2; }
body.ui-refined.ui-colorful.route-teacher-classes .page-head { background: #fff0c5; border-left-color: #e7ba49; }
body.ui-refined.ui-colorful.route-teacher-learning .page-head { background: #ffe5dc; border-left-color: #e99379; }
body.ui-refined.ui-colorful .page-head h1 { color: #273f4a; }
body.ui-refined.ui-colorful .page-head p { color: #5b7178; }
body.ui-refined.ui-colorful .shell > .split > .form-panel { padding: 22px; border: 0; border-top: 4px solid #e8c157; background: #fff6db; }
body.ui-refined.ui-colorful .shell > .split > .panel:not(.form-panel) { border-top: 4px solid #89b8d5; }
body.ui-refined.ui-colorful .panel-head { padding: 4px 0 14px; border-color: #d2e1e7; }
body.ui-refined.ui-colorful th { color: #315f67; background: #e1eff2; border-bottom-color: #cbdee3; }
body.ui-refined.ui-colorful tbody tr:hover { background: #fff9e9; }
body.ui-refined.ui-colorful .member-search-bar input { border-color: #a9c5d7; }
body.ui-refined.ui-colorful .teacher-class-create { border-top: 4px solid #8fc8aa; padding: 20px; background: #e8f4ec; }
body.ui-refined.ui-colorful .teacher-class-card { border-top: 4px solid #80b4d9; }
body.ui-refined.ui-colorful .teacher-class-card:nth-child(3n+2) { border-top-color: #8cc8a3; }
body.ui-refined.ui-colorful .teacher-class-card:nth-child(3n+3) { border-top-color: #edb568; }
body.ui-refined.ui-colorful .teacher-class-head h2 { color: #245d7d; }
body.ui-refined.ui-colorful .teacher-add-student { padding: 16px 0; }
body.ui-refined.ui-colorful .metrics > div:nth-child(1) { background: #ffe8dd; }
body.ui-refined.ui-colorful .metrics > div:nth-child(2) { background: #e0f1e5; }
body.ui-refined.ui-colorful .metrics > div:nth-child(3) { background: #fff0c6; }
body.ui-refined.ui-colorful .metrics > div:nth-child(4) { background: #e0eef9; }
body.ui-refined.ui-colorful .teacher-learning-card > header { background: #e0effa; }
body.ui-refined.ui-colorful .teacher-report-metrics > div:nth-child(1) { background: #e0effa; }
body.ui-refined.ui-colorful .teacher-report-metrics > div:nth-child(2) { background: #e2f2e7; }
body.ui-refined.ui-colorful .teacher-report-metrics > div:nth-child(3) { background: #fff2cb; }
body.ui-refined.ui-colorful .teacher-report-metrics > div:nth-child(4) { background: #ffe7de; }

body.ui-refined.ui-colorful .member-hero {
  min-height: 180px; padding: 26px 190px 26px 30px; border: 0; background: #dff0fc;
  position: relative; overflow: hidden; align-items: center;
}
body.ui-refined.ui-colorful .member-hero::after {
  display: block; content: ''; position: absolute; inset: auto 24px 16px auto;
  width: 136px; height: 142px; background: url('/static/brand_assets/ip/muu-workbook-qr.png') center / contain no-repeat;
}
body.ui-refined.ui-colorful .member-hero h1 { color: #224c66; font-size: 32px; }
body.ui-refined.ui-colorful .member-hero p { color: #4d7488; }
body.ui-refined.ui-colorful.route-home .member-hero { background: #fff0bf; }
body.ui-refined.ui-colorful.route-home .member-hero h1 { color: #484524; }
body.ui-refined.ui-colorful.route-home .member-hero p { color: #786d43; }
body.ui-refined.ui-colorful.route-reading .member-hero { background: #dff0e4; }
body.ui-refined.ui-colorful.route-reading .member-hero h1 { color: #30664a; }
body.ui-refined.ui-colorful .member-person { border-left: 1px solid #adc7cd; font-size: 13px; min-width: 150px; }
body.ui-refined.ui-colorful .member-eyebrow { color: #68837c; }
body.ui-refined.ui-colorful .home-record-summary { gap: 0; border: 0; }
body.ui-refined.ui-colorful .home-record-summary > div:nth-child(1) { background: #fff8e3; }
body.ui-refined.ui-colorful .home-record-summary > div:nth-child(2) { background: #e9f4ed; }
body.ui-refined.ui-colorful .home-record-summary > div:nth-child(3) { background: #e9f2fb; }
body.ui-refined.ui-colorful .home-record-summary > div:nth-child(4) { background: #fff0e9; }
body.ui-refined.ui-colorful .home-record-summary > div:nth-child(5) { background: #fff5d7; }
body.ui-refined.ui-colorful .home-record-summary > div { border-right-color: #ffffffb3; }
body.ui-refined.ui-colorful.route-home .page-head { min-height: 74px; padding: 16px 20px; margin: 0; background: #e3eff8; border-left: 4px solid #85b0cf; }
body.ui-refined.ui-colorful.route-home .page-head h2 { color: #355e7a; }
body.ui-refined.ui-colorful .daily-ar-section > header { padding: 18px 22px; background: #e1f0e5; border: 0; }
body.ui-refined.ui-colorful .daily-ar-section > header h2 { color: #305f46; }
body.ui-refined.ui-colorful .daily-ar-section > header > div:first-child > span { color: #498362; }
body.ui-refined.ui-colorful .daily-ar-score { border-left-color: #b8d3b4; }
body.ui-refined.ui-colorful .daily-ar-card { border-top: 4px solid #86afd4; }
body.ui-refined.ui-colorful .daily-ar-card:nth-child(2n) { border-top-color: #ebaa88; }
body.ui-refined.ui-colorful .daily-ar-number { background: #e0eef9; }
body.ui-refined.ui-colorful .daily-ar-number span { color: #43799f; }
body.ui-refined.ui-colorful .daily-ar-card:nth-child(2n) .daily-ar-number { background: #ffeadf; }
body.ui-refined.ui-colorful .daily-ar-card:nth-child(2n) .daily-ar-number span { color: #b27457; }
body.ui-refined.ui-colorful .club-switch { border-right: 4px solid #f6f9fc; }
body.ui-refined.ui-colorful .club-switch-listening { background: #dfeffb; }
body.ui-refined.ui-colorful .club-switch-reading { background: #e0f1e5; }
body.ui-refined.ui-colorful .club-switch-courses { background: #fff0c5; }
body.ui-refined.ui-colorful .club-switch-records { background: #ffe5dc; }
body.ui-refined.ui-colorful .club-switch:hover { filter: brightness(.98); }
body.ui-refined.ui-colorful .club-switch strong { color: #344d5a; }
body.ui-refined.ui-colorful .club-library-head { padding: 16px 20px; background: #e5f1fa; border-left: 4px solid #83b4d6; }
body.ui-refined.ui-colorful .club-library-reading .club-library-head { background: #e5f2e8; border-left-color: #8abe9a; }
body.ui-refined.ui-colorful .listening-filter-row { background: #fff; padding: 10px 14px; }
body.ui-refined.ui-colorful .listening-filter-row > strong { color: #587181; }
body.ui-refined.ui-colorful .filter-pill.active { background: #ffdf68; color: #624b14; border-color: #e5bc40; }
body.ui-refined.ui-colorful .listening-resource-card { border-top: 4px solid #80b5d8; }
body.ui-refined.ui-colorful .listening-resource-card:nth-child(3n+2) { border-top-color: #88c6a0; }
body.ui-refined.ui-colorful .listening-resource-card:nth-child(3n+3) { border-top-color: #edb294; }
body.ui-refined.ui-colorful .listening-card-meta .cefr-badge { background: #ffebad; color: #755921; border-color: #e2c377; }
body.ui-refined.ui-colorful .listening-player-hero { border-top: 5px solid #8cb9d7; background: #eaf4fb; }
body.ui-refined.ui-colorful .cw-heading { padding: 20px 24px; background: #ffe7dd; border: 0; }
body.ui-refined.ui-colorful .cw-heading h1 { color: #784e3e; }
body.ui-refined.ui-colorful .cw-heading img { width: 90px; height: 96px; }
body.ui-refined.ui-colorful .cw-phase h2 { background: #dceee5; border-top: 4px solid #73b18e; color: #306346; }
body.ui-refined.ui-colorful .cw-after h2 { background: #ffe9aa; border-top-color: #e2b643; color: #715821; }
body.ui-refined.ui-colorful .cw-task { color: #365b6b; }
body.ui-refined.ui-colorful .cw-task:hover { background: #edf6fc; }

@media (max-width: 760px) {
  body.ui-refined.ui-colorful .page-head { min-height: 0; padding: 18px; }
  body.ui-refined.ui-colorful .member-hero { display: block; min-height: 0; padding: 20px 100px 20px 20px; }
  body.ui-refined.ui-colorful .member-hero h1 { font-size: 26px; line-height: 1.4; }
  body.ui-refined.ui-colorful .member-hero::after { width: 76px; height: 86px; right: 12px; bottom: 18px; }
  body.ui-refined.ui-colorful .member-hero .member-person { display: grid; grid-template-columns: minmax(0, 1fr); min-width: 0; width: auto; margin: 14px 0 0; padding: 0; border: 0; }
  body.ui-refined.ui-colorful .member-hero p { font-size: 13px; }
  body.ui-refined.ui-colorful .daily-ar-section > header { padding: 16px; }
  body.ui-refined.ui-colorful .daily-ar-section > header h2 { font-size: 20px; }
  body.ui-refined.ui-colorful .club-switch { border-bottom: 4px solid #f6f9fc; }
  body.ui-refined.ui-colorful .club-library-head { padding: 14px 16px; }
  body.ui-refined.ui-colorful .cw-heading { padding: 18px; }
  body.ui-refined.ui-colorful .cw-heading img { width: 68px; height: 78px; }
}
