/* MR. LAM red-and-gold banner, with readable native navigation controls. */
.toolbar {
 background:
  linear-gradient(180deg,#ffffff26,transparent 20%,transparent 76%,#23000433),
  radial-gradient(120% 155% at 52% 35%,#c81225 0%,#980010 52%,#690008 100%);
 border:1px solid #f6ddd5;border-bottom:3px solid #c6a250;
 border-radius:0 0 22px 22px;
 box-shadow:inset 0 0 0 1px #ffffffa6,inset 0 0 0 3px #ffffff24,
  inset 0 2px 2px #ffffff73,inset 0 -2px 2px #3e00174d,0 5px 14px #52122324;
 backdrop-filter:none;-webkit-backdrop-filter:none;
}
.toolbar .brand {color:#fff;min-width:0;flex-shrink:1}
.toolbar .brand strong {font-weight:800;text-shadow:0 1px 2px #59000866}
.toolbar .brand small {color:#ffe393;font-weight:600}
.toolbar .monogram {
 border:2px solid #e8c870;background:linear-gradient(145deg,#fffef8,#fff2cf);
 color:#990b21;box-shadow:inset 0 0 0 2px #fff,0 2px 6px #53000b40;
}
.toolbar .controls {flex-shrink:0}
.toolbar .controls button,.toolbar .controls select {
 color:#8e1229;border:1px solid #efd9b1;border-radius:14px;
 background:linear-gradient(145deg,#fff,#fff8f1);
 box-shadow:inset 0 1px 1px #fff,0 2px 5px #50000b26;
 font-weight:700;
}
.toolbar .controls button:not(:disabled):hover,
.toolbar .controls select:hover {background:#fff0d9;border-color:#ffdb85}
.toolbar .controls button:disabled {opacity:.48}
.toolbar :is(button,select,a):focus-visible {outline:3px solid #ffe08a;outline-offset:3px}
.toolbar .controls select option {color:#651329;background:#fff}

/* Ruby glass controls against the quiet silver section rails. */
.glass-rail-button {
 color:#fff;text-shadow:0 1px 2px #52041799;border:1px solid #ffe0e8bd;
 background:radial-gradient(120% 90% at 14% 0%,#ffffff70,transparent 56%),linear-gradient(150deg,#d83258eb 0%,#b10c35eb 48%,#850b2bf5 100%);
 box-shadow:inset 0 1px 1px #ffffffe6,inset 1px 0 1px #ffffff75,inset 0 -2px 3px #4e052866,inset 0 0 0 2px #ffffff1f,0 3px 8px #5d0a2c38;
 backdrop-filter:blur(16px) saturate(160%);-webkit-backdrop-filter:blur(16px) saturate(160%);
 transition:background-color 160ms,box-shadow 160ms,border-color 160ms;
}
.glass-rail-button:hover {
 color:#fff;border-color:#fff0cd;
 background:radial-gradient(120% 90% at 14% 0%,#ffffff85,transparent 56%),linear-gradient(150deg,#e64465f2,#c31540f2 48%,#960c32f5);
 box-shadow:inset 0 1px 2px #fff,inset 0 -2px 3px #71052c66,inset 0 0 0 2px #ffffff26,0 4px 10px #65092345;
}
.glass-rail-button[aria-expanded=true] {
 color:#fff5c4;border-color:#ffe49b;
 background:radial-gradient(120% 90% at 14% 0%,#ffffff60,transparent 56%),linear-gradient(150deg,#c9274e,#990b2d 55%,#720824);
 box-shadow:inset 0 1px 2px #fff1c8,inset 0 -2px 3px #4a041c80,0 0 0 2px #ffe09c66,0 4px 10px #5d0a2c45;
}
.glass-rail-button:focus-visible {outline:3px solid #b84a60;outline-offset:3px}
@media(max-width:700px) {
 .toolbar {border-radius:0 0 17px 17px}
 .toolbar .brand {width:100%}
 .toolbar .brand strong {letter-spacing:.7px}
 .toolbar .controls button,.toolbar .controls select {border-radius:11px}
}
@media(prefers-reduced-motion:reduce) {.glass-rail-button {transition:none}}

/* The lesson starts directly below the banner and uses the full available width. */
body {background:#f5f6f8}
#reader {max-width:none;width:100%;padding:0;margin:0}
.source-access {display:none}
.book-page {border-left:0;border-right:0;margin-bottom:16px;box-shadow:0 5px 16px #75162b0b}
.page-heading,.exercise-page .page-heading {
 color:#fff5dd;
 background:radial-gradient(ellipse at 12% 0%,#ffb8c34d,transparent 65%),linear-gradient(120deg,#be1735,#980d29 70%,#760b22);
 border:1px solid #f2c5c9;border-radius:0 0 22px 22px;
 box-shadow:inset 0 1px 1px #fff9,inset 0 -2px 3px #56031d40,0 3px 8px #72112a14;
 min-height:86px;
}
.page-heading h2,.exercise-page .page-heading h2 {font-size:1.45em;font-weight:600;margin:18px 30px;text-shadow:0 1px 2px #65001966}
.unit-badge {
 color:#fff;
 background:radial-gradient(ellipse at 5% 0%,#ffffff80,transparent 67%),linear-gradient(145deg,#ed6e86b3,#c22649c9 55%,#9d1436e6);
 border:1px solid #ffffff75;border-radius:0 0 23px 0;
 box-shadow:inset 0 1px 2px #fff9,inset 1px 0 1px #ffffff70,inset 0 -2px 3px #54071f45,2px 0 8px #6500221a;
 backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);
}
.exercise-page .unit-badge {border-radius:0 0 0 23px}
.book-section,.native-book-layout .book-section {background:#fff;border-bottom-color:#e4e7eb}
.book-section:before,.native-book-layout .book-section:before,.exercise.has-guidance:before {
 background:linear-gradient(105deg,#f9fafbef,#edf0f4e8);
 border-right:1px solid #e0e4e9;box-shadow:inset 1px 0 1px #fff;
 backdrop-filter:blur(16px) saturate(105%);-webkit-backdrop-filter:blur(16px) saturate(105%);
 opacity:1;
}
.native-card,.native-illustrated,.native-columns {border-color:#e4e7eb;box-shadow:inset 0 1px 0 #fff,0 2px 6px #18263809}
.exercise:not(.has-guidance):before {color:#fff4d8;background:linear-gradient(145deg,#d94b68,#a50d31 65%,#800b26);border-color:#eab6c3;box-shadow:inset 0 1px 2px #fffd,0 2px 5px #7d15321f}
@media(max-width:700px){.page-heading,.exercise-page .page-heading{min-height:74px;border-radius:0 0 15px 15px}.page-heading h2,.exercise-page .page-heading h2{font-size:1.12em;margin:14px 16px}.unit-badge strong{font-size:32px}}