.is-reading { overflow: hidden; }
.book-reader {
  --reader-paper: #f3ead8;
  --reader-ink: #262b27;
  --reader-muted: #667065;
  --reader-green: #243c32;
  --reader-text-scale: 1;
  color-scheme: light;
  color: var(--reader-ink);
  background: var(--reader-paper);
  padding: 0;
  width: min(1280px, calc(100vw - 64px));
  height: min(880px, calc(100dvh - 64px));
  max-width: none;
  max-height: none;
  border: 1px solid #bdaa8066;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 36px 110px #0009, 0 0 0 5px #e2c99a08;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  text-align: left;
}
.book-reader::backdrop { background: #0a110dda; backdrop-filter: blur(8px); }
.book-reader, .book-reader * { box-sizing: border-box; }
.book-reader button, .book-reader a { -webkit-tap-highlight-color: transparent; }
.book-reader button { font: inherit; cursor: pointer; }
.book-reader button:disabled { cursor: default; opacity: .35; }
.book-reader :focus-visible { outline: 2px solid #af712f; outline-offset: 4px; }
.book-reader h2, .book-reader h3, .book-reader p, .book-reader figure { margin: 0; }
.book-reader button { min-height: 44px; }
.book-reader svg { flex-shrink: 0; }
.reader-shell { display: flex; height: 100%; }
.reader-sidebar {
  width: 264px;
  flex: 0 0 264px;
  background: radial-gradient(ellipse at 0 0, #4c594636, transparent 80%), #20362e;
  color: #e6dfcf;
  display: flex;
  flex-direction: column;
  padding: 22px 26px 25px;
  border-right: 1px solid #142a2250;
  overflow-y: auto;
}
.reader-back { display: flex; align-items: center; gap: 10px; padding: 0; border: 0; background: none; color: #c4c5b6; font-size: 11px !important; }
.reader-back svg { width: 16px; }
.reader-back:hover { color: #fff4dc; }
.reader-identity { margin-top: 38px; }
.reader-edition, .reader-contents-label { font-size: 8px; letter-spacing: 1.65px; line-height: 1.6; color: #d3b983; }
.reader-book-title { margin-top: 18px !important; font-family: Georgia, 'Times New Roman', serif; font-weight: 400; font-size: 30px; line-height: 1.12; letter-spacing: -.5px; }
.reader-book-subtitle { color: #bdc5b9; font-size: 12px; line-height: 1.6; margin-top: 13px !important; }
.reader-category { margin-top: 20px !important; padding-top: 18px; border-top: 1px solid #d8d4b623; color: #d4bc90; font-size: 9px; text-transform: uppercase; letter-spacing: 1.7px; }
.reader-contents { margin-top: 42px; }
.reader-contents ol { list-style: none; padding: 0; margin: 13px -12px 0; display: grid; gap: 6px; }
.reader-contents button { width: 100%; display: flex; align-items: baseline; gap: 12px; text-align: left; padding: 12px; background: none; color: #bec6ba; border: 1px solid transparent; border-radius: 4px; font-size: 12px; line-height: 1.45; }
.reader-contents button:hover { background: #ffffff08; color: #fcf4e2; }
.reader-contents button[aria-current] { background: #ded5ac12; border-color: #d6c79b25; color: #fff3d8; }
.reader-toc-number { color: #c0ac7b; font-size: 9px; padding-top: 2px; }
.reader-sidebar-note { margin-top: auto; padding-top: 32px; display: flex; align-items: center; gap: 12px; }
.reader-sidebar-star { font-size: 32px; color: #c5a773; }
.reader-sidebar-note p { color: #b0bba9; font-size: 11px; line-height: 1.6; white-space: pre-line; font-family: Georgia, serif; font-style: italic; }
.reader-paper { flex: 1; min-width: 0; display: flex; flex-direction: column; background: radial-gradient(ellipse at 15% 0, #fff9e875, transparent 80%), var(--reader-paper); }
.reader-toolbar { display: flex; justify-content: space-between; align-items: center; min-height: 69px; padding: 0 30px 0 40px; border-bottom: 1px solid #4d563620; flex-shrink: 0; }
.reader-position, .reader-tools { display: flex; align-items: center; gap: 14px; }
.reader-position { font-size: 9px; letter-spacing: 1.1px; color: #69725d; }
.reader-position > span:first-child { color: #353e2f; }
.reader-toolbar-divider { color: #aaab93; }
.reader-duration { font-size: 8px; letter-spacing: 1px; color: #737962; }
.reader-text-size { display: flex; margin-left: 5px; }
.reader-text-size button { width: 44px; color: #68705d; padding: 0; background: none; border: 0; font-family: Georgia, serif; font-size: 14px; }
.reader-text-size button:hover { color: #252d22; }
.reader-close { display: grid; place-items: center; background: #65735209; border: 1px solid #64714e24; width: 44px; border-radius: 50%; color: #48533e; }
.reader-close:hover { background: #65735218; }
.reader-scroll { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-color: #aaa68e transparent; scrollbar-width: thin; }
.reader-article { padding: 41px 40px 38px; }
.reader-kicker { color: #727653; font-size: 9px; line-height: 1.6; letter-spacing: 1.8px; text-transform: uppercase; font-weight: 600; }
.reader-chapter-title { font-family: Georgia, 'Times New Roman', serif; font-size: clamp(30px, 3.2vw, 45px); font-weight: 400; line-height: 1.13; letter-spacing: -1.4px; margin-top: 14px !important; max-width: 700px; text-wrap: balance; }
.reader-chapter-title:focus { outline: none; }
.reader-lead { font-family: Georgia, 'Times New Roman', serif; color: #667057; font-size: calc(18px * var(--reader-text-scale)); line-height: 1.55; margin-top: 19px !important; max-width: 690px; }
.reader-columns { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 34px; margin-top: 30px; padding-top: 29px; border-top: 1px solid #66704d2b; }
.reader-prose { min-width: 0; font-size: calc(14px * var(--reader-text-scale)); line-height: 1.85; color: #424b3c; }
.reader-prose > p + p { margin-top: 17px; }
.reader-takeaways { margin-top: 26px; }
.reader-takeaways h3 { text-transform: uppercase; font-size: 9px; letter-spacing: 1.5px; color: #606943; }
.reader-takeaways ul { list-style: none; padding: 0; margin: 13px 0 0; }
.reader-takeaways li { position: relative; padding-left: 18px; margin-top: 9px; line-height: 1.6; }
.reader-takeaways li::before { position: absolute; left: 0; top: .65em; width: 5px; height: 5px; background: #9b9e70; content: ''; transform: rotate(45deg); }
.reader-code { margin: 21px 0 0; padding: 17px; border-radius: 4px; background: #e7e1cf; border: 1px solid #53614420; color: #334733; line-height: 1.7; overflow-x: auto; font-size: calc(11px * var(--reader-text-scale)); }
.reader-code code { font-family: 'Cascadia Code', Consolas, monospace; }
.reader-visual { min-width: 0; }
.reader-figure { background: #faf6eb; border: 1px solid #a4a58750; border-radius: 5px; padding: 23px 20px 20px; }
.reader-figure-eyebrow { font-size: 8px; letter-spacing: 1.6px; color: #7c7f60; font-weight: 600; }
.reader-figure-title { font-family: Georgia, serif; font-size: 22px; font-weight: 400; line-height: 1.3; letter-spacing: -.4px; margin-top: 10px !important; }
.reader-figure figcaption { font-size: 10px; line-height: 1.65; color: #727761; margin-top: 20px; padding-top: 14px; border-top: 1px solid #7e89632b; }
.reader-diagram { list-style: none; padding: 0; margin: 22px 0 0; }
.reader-node { position: relative; display: flex; gap: 12px; padding: 14px; border: 1px solid #c4c7ac; background: #f1f0e4; border-radius: 3px; }
.reader-node-index { font-size: 9px; color: #848b6d; line-height: 1.8; flex-shrink: 0; }
.reader-node-body { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.reader-node strong { font-size: 12px; line-height: 1.4; font-weight: 600; }
.reader-node-body > span { font-size: 10px; line-height: 1.6; color: #72775f; }
.reader-node--accent { background: #e7ecdd; border-color: #98ab80; color: #34482d; }
.reader-node--danger { background: #f4e6d8; border-color: #c9ab85; color: #7a5736; }
.reader-node--danger .reader-node-body > span { color: #8b735a; }
.reader-diagram--flow .reader-node + .reader-node { margin-top: 24px; }
.reader-diagram--flow .reader-node + .reader-node::before { position: absolute; left: 50%; top: -23px; height: 21px; content: '↓'; color: #939979; font-size: 15px; line-height: 20px; }
.reader-diagram--compare { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.reader-diagram--compare .reader-node { flex-direction: column; gap: 8px; }
.reader-diagram--compare .reader-node:nth-child(odd):last-child { grid-column: 1 / -1; }
.reader-diagram--sequence { margin-left: 7px; padding-left: 16px; border-left: 1px solid #a6ad8b; }
.reader-diagram--sequence .reader-node { margin-top: 12px; }
.reader-diagram--sequence .reader-node::before { content: ''; position: absolute; left: -21px; top: 19px; width: 7px; height: 7px; background: #819269; border: 2px solid #faf6eb; border-radius: 50%; }
.reader-pitfall { border-left: 2px solid #b19a67; margin-top: 22px; padding: 0 0 0 16px; }
.reader-pitfall-label { font-size: 8px; letter-spacing: 1.5px; color: #8a7953; }
.reader-pitfall h3 { margin-top: 7px !important; font-family: Georgia, serif; font-size: 16px; font-weight: 400; color: #5d5b42; }
.reader-pitfall p { margin-top: 7px !important; font-size: calc(11px * var(--reader-text-scale)); line-height: 1.75; color: #737360; }
.reader-footer { min-height: 75px; padding: 13px 30px; border-top: 1px solid #4d563626; display: flex; align-items: center; justify-content: space-between; gap: 15px; flex-shrink: 0; background: #f4eddd; }
.reader-previous, .reader-next { border: 0; display: flex; align-items: center; gap: 12px; font-size: 11px !important; }
.reader-previous { padding: 0 10px; background: none; color: #58664b; }
.reader-previous svg { width: 17px; }
.reader-next { padding: 0 20px; border-radius: 4px; background: #304b39; color: #f6efdd; }
.reader-next:hover { background: #243e2d; }
.reader-next svg { width: 17px; }
.reader-progress { display: flex; gap: 5px; }
.reader-progress span { width: 19px; height: 3px; background: #cdd0b8; border-radius: 1px; }
.reader-progress .is-filled { background: #7b8960; }
.reader-sources { margin-top: 33px; padding-top: 24px; border-top: 1px solid #66704d2b; }
.reader-sources h3 { font-family: Georgia, serif; font-size: 20px; font-weight: 400; }
.reader-sources > p { font-size: 11px; color: #73775f; margin-top: 8px !important; }
.reader-sources ul { list-style: none; padding: 0; margin: 12px 0 0; }
.reader-sources li { margin-top: 4px; }
.reader-source { display: inline-flex; align-items: center; gap: 5px; min-height: 32px; font-size: 11px; color: #516544; text-decoration-color: #a9ad8f; text-underline-offset: 4px; }
.reader-source:hover { color: #263f28; }
.reader-completion { margin-top: 30px; background: #e5e8d6; border: 1px solid #aeb7977a; border-radius: 4px; text-align: center; padding: 29px 22px; }
.reader-completion-check { display: inline-grid; place-items: center; border: 1px solid #99ab81; width: 34px; height: 34px; border-radius: 50%; color: #5f7950; margin-bottom: 13px; }
.reader-completion h3 { font-family: Georgia, serif; font-size: 26px; font-weight: 400; margin-top: 10px !important; color: #374b32; }
.reader-completion-actions { margin-top: 20px; display: flex; flex-direction: column; align-items: center; gap: 4px; }
.reader-next-volume { display: inline-flex; align-items: center; justify-content: center; gap: 12px; background: #35503a; color: #fbf4e5; padding: 8px 18px; border: 0; border-radius: 3px; font-size: 12px !important; }
.reader-return { color: #60754e; background: none; border: 0; font-size: 11px !important; }
.reader-lab-intro { font-size: 11px; line-height: 1.7; color: #747761; margin-top: 12px !important; }
.reader-lab-toggle { margin-top: 15px; width: 100%; padding: 9px 12px; border: 1px solid #929f7770; border-radius: 3px; color: #48603d; background: #e9eddf; font-size: 11px !important; }
.reader-lab-toggle:hover { background: #dfe5d3; }
.reader-cap-network { margin-top: 23px; display: grid; grid-template-columns: 1fr 44px 1fr; align-items: center; }
.reader-replica { border: 1px solid #a8b297; background: #ecf0e3; border-radius: 4px; padding: 14px 6px 12px; display: flex; flex-direction: column; text-align: center; gap: 9px; min-width: 0; }
.reader-replica-label { font-size: 7px; letter-spacing: 1.2px; color: #6e7d5c; }
.reader-replica strong { font-family: Georgia, serif; font-weight: 400; font-size: 26px; color: #4a6140; }
.reader-replica > span:last-child { font-size: 8px; line-height: 1.4; color: #7d826c; }
.reader-network-wire { position: relative; border-top: 1px solid #9dac82; }
.reader-network-wire span { position: absolute; font-size: 6px; left: 50%; top: -15px; transform: translateX(-50%); color: #8b957b; letter-spacing: .1px; }
.is-partitioned .reader-network-wire { border-top-style: dashed; border-top-color: #b48963; }
.is-partitioned .reader-network-wire::after { content: '×'; position: absolute; left: 50%; top: -12px; transform: translateX(-50%); font-size: 18px; line-height: 20px; background: #faf6eb; color: #a17750; padding: 0 3px; }
.is-partitioned .reader-network-wire span { top: -26px; color: #96734d; }
.is-partitioned .reader-replica:last-child { border-color: #ccb494; background: #f4ebdc; }
.reader-lab-choices { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; margin-top: 19px; }
.reader-lab-choices button { background: none; color: #777b66; border: 1px solid #b7baa27a; border-radius: 3px; font-size: 9px !important; padding: 8px 5px; line-height: 1.4; }
.reader-lab-choices button[aria-pressed='true'] { color: #f3efde; background: #4a6344; border-color: #4a6344; }
.reader-lab-status { margin-top: 16px; padding: 13px 14px; background: #e9eddf; border-radius: 3px; border: 1px solid #afb99c70; }
.reader-lab-status strong { color: #405537; font-size: 11px; line-height: 1.6; font-weight: 600; display: block; }
.reader-lab-status p { margin-top: 6px !important; color: #6d785e; font-size: 10px; line-height: 1.7; }
.reader-lab-status.is-caution { background: #f1e8d7; border-color: #c3ac8560; }
.reader-lab-status.is-caution strong { color: #7d6240; }
.reader-lab-status.is-caution p { color: #867353; }
.reader-lock-steps { margin: 17px 0 0; list-style: none; padding: 0; display: grid; gap: 7px; }
.reader-lock-steps li { display: flex; gap: 9px; align-items: baseline; color: #969983; font-size: 10px; line-height: 1.5; padding: 9px 10px; border-left: 2px solid #d5d8c5; }
.reader-lock-steps li > span:first-child { font-size: 8px; flex-shrink: 0; }
.reader-lock-steps .is-active { background: #e7ecdb; border-color: #7c9464; color: #4d6541; }
.reader-lock-steps .is-done { color: #6f805e; border-color: #a9b496; }
.reader-lock-resource { padding: 12px; margin-top: 14px; display: flex; flex-direction: column; align-items: center; gap: 8px; border: 1px dashed #b0ba9c; border-radius: 3px; }
.reader-lock-resource strong { font-size: 10px; font-weight: 500; color: #687b53; }
.reader-lab-actions { display: flex; gap: 7px; margin-top: 13px; }
.reader-lab-advance, .reader-lab-reset { font-size: 10px !important; border-radius: 3px; padding: 8px 12px; }
.reader-lab-advance { flex: 1; background: #4b6442; border: 1px solid #4b6442; color: #f4efdf; }
.reader-lab-reset { background: none; border: 1px solid #aeb699; color: #70805c; }

@media (min-width: 1450px) {
  .reader-article { padding: 44px 46px; }
  .reader-columns { gap: 40px; }
  .reader-prose { font-size: calc(14px * var(--reader-text-scale)); }
  .reader-figure { padding: 25px; }
}
@media (max-width: 1100px) {
  .reader-sidebar { width: 225px; flex-basis: 225px; padding-left: 22px; padding-right: 22px; }
  .reader-book-title { font-size: 26px; }
  .reader-article { padding: 32px 27px; }
  .reader-toolbar { padding-left: 27px; padding-right: 20px; }
  .reader-columns { gap: 23px; }
  .reader-figure { padding: 20px 16px 17px; }
  .reader-duration { display: none; }
}
@media (max-width: 880px) {
  .book-reader { width: calc(100vw - 32px); height: calc(100dvh - 32px); }
  .reader-sidebar { width: 202px; flex-basis: 202px; padding: 18px; }
  .reader-contents button { font-size: 11px; }
  .reader-columns { grid-template-columns: minmax(0, 1fr); gap: 27px; }
  .reader-visual { display: grid; grid-template-columns: 1fr; gap: 20px; }
  .reader-pitfall { margin-top: 0; }
  .reader-book-title { font-size: 25px; }
  .reader-chapter-title { font-size: 35px; }
  .reader-figure { padding: 24px; }
  .reader-cap-network { grid-template-columns: 1fr 80px 1fr; }
  .reader-article { padding: 30px; }
}
@media (max-width: 640px) {
  .book-reader { width: 100%; height: 100dvh; margin: 0; border: 0; border-radius: 0; }
  .reader-shell { flex-direction: column; }
  .reader-sidebar { width: 100%; flex: 0 0 auto; padding: 16px 20px 13px; overflow: visible; display: block; }
  .reader-back, .reader-edition, .reader-book-subtitle, .reader-category, .reader-contents-label, .reader-sidebar-note { display: none; }
  .reader-identity { margin: 0; }
  .reader-book-title { margin: 0 !important; font-size: 21px; letter-spacing: -.3px; }
  .reader-contents { margin-top: 12px; }
  .reader-contents ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; margin: 0; }
  .reader-contents button { min-height: 52px; height: 100%; padding: 7px 8px; gap: 7px; font-size: 9px; line-height: 1.35; align-items: center; }
  .reader-toc-number { font-size: 8px; padding: 0; }
  .reader-paper { min-height: 0; }
  .reader-toolbar { min-height: 56px; padding: 0 20px; }
  .reader-position { gap: 8px; font-size: 8px; }
  .reader-tools { gap: 6px; }
  .reader-close { width: 44px; }
  .reader-text-size button { width: 44px; font-size: 13px; }
  .reader-article { padding: 27px 22px 30px; }
  .reader-chapter-title { font-size: 33px; letter-spacing: -.8px; margin-top: 12px !important; }
  .reader-lead { font-size: calc(17px * var(--reader-text-scale)); line-height: 1.55; margin-top: 15px !important; }
  .reader-columns { margin-top: 23px; padding-top: 23px; }
  .reader-prose { font-size: calc(14px * var(--reader-text-scale)); line-height: 1.8; }
  .reader-figure { padding: 23px 20px; }
  .reader-figure-title { font-size: 23px; }
  .reader-node strong { font-size: 13px; }
  .reader-node-body > span, .reader-figure figcaption { font-size: 11px; }
  .reader-pitfall p { font-size: calc(12px * var(--reader-text-scale)); }
  .reader-lab-intro { font-size: 12px; }
  .reader-lab-status p { font-size: 11px; }
  .reader-lab-status strong { font-size: 12px; }
  .reader-lab-choices button { font-size: 10px !important; }
  .reader-footer { min-height: 72px; padding: 12px 15px calc(12px + env(safe-area-inset-bottom)); gap: 8px; }
  .reader-previous, .reader-next { gap: 8px; font-size: 10px !important; }
  .reader-next { padding: 0 14px; }
  .reader-progress { gap: 4px; }
  .reader-progress span { width: 13px; }
  .reader-source { min-height: 44px; line-height: 1.6; }
  .reader-completion h3 { font-size: 24px; }
}
@media (max-width: 360px) {
  .reader-article { padding-left: 18px; padding-right: 18px; }
  .reader-sidebar { padding-left: 16px; padding-right: 16px; }
  .reader-contents button { gap: 5px; font-size: 8px; padding-left: 6px; padding-right: 6px; }
  .reader-progress { display: none; }
  .reader-cap-network { grid-template-columns: 1fr 45px 1fr; }
}
@media (prefers-reduced-motion: no-preference) {
  .book-reader[open] { animation: reader-arrive .28s ease-out both; }
  @keyframes reader-arrive { from { opacity: 0; transform: translateY(12px) scale(.99); } to { opacity: 1; transform: translateY(0) scale(1); } }
}
@media (forced-colors: active) {
  .reader-node, .reader-figure, .reader-lab-status, .reader-replica { border: 1px solid CanvasText; }
  .reader-contents button[aria-current], .reader-lab-choices button[aria-pressed='true'] { border: 2px solid Highlight; }
}