/* Parts and Settings instruments from the supplied Wonder menu handoff. */
.wonder-menu .wonder-memory-timeline {
  position:relative; display:grid; grid-template-columns:repeat(10,minmax(76px,1fr));
  min-width:0; overflow-x:auto; gap:0; margin:0 0 26px; padding:0; border:0;
}
.wonder-menu .wonder-memory-timeline::after {
  content:''; position:absolute; z-index:0; top:10px; left:5%; right:5%; height:1px;
  background:linear-gradient(to right,#bdc7ad var(--chapter-fill,0%),rgba(170,179,174,.25) var(--chapter-fill,0%));
  pointer-events:none;
}
.wonder-menu .wonder-memory-timeline::before {
  content:''; position:absolute; z-index:2; top:5px; left:var(--chapter-position,5%);
  width:11px; height:11px; margin-left:-5.5px; background:#e0a24b; transform:rotate(45deg);
  transition:left .55s cubic-bezier(.4,0,.2,1); pointer-events:none;
}
.wonder-menu .wonder-memory-timeline button {
  position:relative; z-index:1; display:grid; justify-items:center; align-content:start; gap:5px;
  padding:0 2px 4px; min-width:0; min-height:0; border:0; border-radius:0; background:transparent;
  color:#89928e; font:var(--menu-small)/1.4 ui-monospace,monospace; letter-spacing:.12em; text-transform:uppercase;
}
.wonder-menu .wonder-memory-timeline button:hover { opacity:.85; }
.wonder-menu .wonder-memory-tick { width:1px; height:21px; background:rgba(170,179,174,.3); }
.wonder-menu .wonder-memory-timeline button[data-recovered="true"] .wonder-memory-tick { background:#bdc7ad; }
.wonder-menu .wonder-memory-timeline button[data-recovered="true"] .wonder-memory-number { color:#aab3ae; }
.wonder-menu .wonder-memory-timeline button[aria-current="true"] { background:transparent; border:0; }
.wonder-menu .wonder-memory-timeline button[aria-current="true"] .wonder-memory-number { color:#e0a24b; }
.wonder-menu .wonder-memory-name { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#8d9893; }
.wonder-menu .wonder-memory-timeline button[aria-current="true"] .wonder-memory-name { color:#eef0e8; }
.wonder-menu .wonder-memory-count { font-size:var(--menu-tiny); color:#89928e; letter-spacing:.08em; }
.wonder-menu .memory-layout { display:grid; grid-template-columns:minmax(180px,1fr) minmax(0,2.2fr); align-items:start; gap:26px 56px; }
.wonder-menu .memory-list { display:grid; align-content:start; gap:0; max-height:none; overflow:visible; min-width:0; border:0; }
.wonder-menu .memory-list .wonder-memory-page {
  display:grid; grid-template-columns:2.5ch minmax(0,1fr) auto; gap:12px; align-items:start;
  max-width:none; min-height:0; padding:8px 10px 8px 12px; margin:0; border:0; border-left:2px solid transparent;
  border-bottom:1px solid rgba(170,179,174,.13); border-radius:0; background:transparent; text-align:left;
  color:#aab3ae; font:var(--menu-text)/1.4 ui-monospace,monospace; letter-spacing:.12em; text-transform:uppercase;
}
.wonder-menu .memory-list .wonder-memory-page[aria-current="true"] { border-left-color:#e0a24b; background:rgba(36,41,44,.72); color:#eef0e8; }
.wonder-menu .wonder-memory-page-number { color:#8d9893; }
.wonder-menu .wonder-memory-page[aria-current="true"] .wonder-memory-page-number,.wonder-menu .wonder-memory-new { color:#e0a24b; }
.wonder-menu .memory-list .wonder-memory-locked { color:#89928e; font-size:var(--menu-small); opacity:.65; }
.wonder-menu .memory-list .wonder-memory-note { grid-template-columns:minmax(0,1fr); }
.wonder-menu .memory-list > .memory-status { padding:14px 0 8px 14px; margin:0; font:var(--menu-small) ui-monospace,monospace; color:#8d9893; letter-spacing:.18em; text-transform:uppercase; }
.wonder-menu .memory-reading { display:grid; gap:16px; min-width:0; max-height:none; overflow:visible; padding:0; }
.wonder-menu .wonder-memory-header { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:16px; align-items:start; padding-bottom:16px; border-bottom:1px solid rgba(170,179,174,.13); }
.wonder-menu .wonder-memory-titles { display:grid; gap:10px; min-width:0; }
.wonder-menu .memory-chapter { margin:0; font:var(--menu-small)/1.5 ui-monospace,monospace; color:#e0a24b; letter-spacing:.18em; text-transform:uppercase; }
.wonder-menu #memory-title { margin:0; font:500 38px/1.05 'Avenir Next Condensed','Barlow Condensed',sans-serif; letter-spacing:-.03em; text-wrap:balance; }
.wonder-menu .memory-navigation { display:flex; justify-content:end; gap:6px; padding:0; margin:0; }
.wonder-menu .memory-navigation button { min-height:0; padding:9px 12px; border:1px solid #66705f; border-radius:2px; color:#eef0e8; background:rgba(36,41,44,.72); font:var(--menu-text) ui-monospace,monospace; letter-spacing:.12em; }
.wonder-menu .memory-navigation button:disabled { opacity:.35; }
.wonder-menu .wonder-memory-scroll { display:grid; align-content:start; gap:14px; max-height:none; min-width:0; overflow:visible; overscroll-behavior:contain; padding-right:10px; }
.wonder-menu #memory-body { max-width:none; font:500 var(--menu-reading)/1.6 'Avenir Next Condensed','Barlow Condensed',sans-serif; letter-spacing:.005em; color:#aab3ae; }
.wonder-menu #memory-body p { margin:0 0 14px; text-wrap:pretty; }
.wonder-menu .wonder-memory-scroll > .memory-status,.wonder-menu .memory-audio .memory-status {
  margin:0; color:#89928e; font:var(--menu-small)/1.5 ui-monospace,monospace; letter-spacing:.08em; text-transform:uppercase;
}
.wonder-menu .memory-audio { padding:10px 0; margin:0 0 14px; border-block:1px solid rgba(170,179,174,.13); }
.wonder-menu .memory-audio audio { display:block; width:100%; color-scheme:dark; border-radius:2px; background:#0d1418; margin:8px 0; }
.wonder-menu .memory-audio audio::-webkit-media-controls-panel { background:#0d1418; color:#eef0e8; }
.wonder-menu .memory-audio button { min-height:0; padding:8px 12px; border:1px solid #e0a24b; background:rgba(36,41,44,.72); font:var(--menu-text) ui-monospace,monospace; letter-spacing:.12em; text-transform:uppercase; }
.wonder-menu .pause-panel { max-width:560px; display:grid; gap:0; }
.wonder-menu .pause-row {
  display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:12px;
  width:100%; min-height:0; padding:13px 14px; margin:0; border:0; border-top:1px solid rgba(170,179,174,.13);
  border-radius:0; background:transparent; color:#eef0e8; font:var(--menu-text)/1.4 ui-monospace,monospace; letter-spacing:.12em; text-transform:uppercase; box-shadow:none;
}
.wonder-menu .pause-row:has(+ .pause-sub) { border-bottom:1px solid rgba(170,179,174,.13); }
.wonder-menu .pause-row:is(:hover,:focus-within) { background:rgba(36,41,44,.72); box-shadow:none; border-color:rgba(170,179,174,.13); }
.wonder-menu .pause-row:focus-visible { outline:2px solid #e0a24b; outline-offset:2px; }
.wonder-menu .pause-row-label,.wonder-menu .pause-row-value { font:var(--menu-text)/1.4 ui-monospace,monospace; letter-spacing:.12em; text-transform:uppercase; }
.wonder-menu .pause-row-value { color:#8d9893; }
.wonder-menu .pause-row[aria-pressed="true"] .pause-row-value { color:#8fc79d; }
.wonder-menu .pause-row[aria-pressed="false"] .pause-row-value { color:#7e8884; }
.wonder-menu .pause-slider { grid-template-columns:minmax(0,1fr) minmax(50px,160px) auto; }
.wonder-menu .pause-slider input { width:100%; min-width:0; accent-color:#e0a24b; }
.wonder-menu .wonder-volume-cells { display:flex; align-items:center; gap:3px; margin:0; }
.wonder-menu .wonder-volume-cells .wonder-volume-cell { flex:none; width:12px; height:16px; min-width:0; min-height:0; padding:0; border:1px solid rgba(170,179,174,.55); border-radius:0; background:transparent; cursor:pointer; }
.wonder-menu .wonder-volume-cells .wonder-volume-cell[data-filled="true"] { background:#e0a24b; border-color:#e0a24b; }
.wonder-menu .wonder-volume-cells .wonder-volume-readout { width:22px; min-width:22px; min-height:16px; padding:0; text-align:right; border:0; background:transparent; color:#aab3ae; cursor:pointer; }
.wonder-menu .pause-sub,.wonder-menu .pause-foot { margin:18px 0 0; color:#89928e; font:var(--menu-small)/1.6 ui-monospace,monospace; letter-spacing:.08em; text-transform:uppercase; }
.wonder-menu .pause-credits { color:#8d9893; font:var(--menu-small) ui-monospace,monospace; letter-spacing:.14em; text-decoration:none; }
.wonder-menu .pause-hints { display:none; }
/* The notebook is a reading surface inside Pack or Home, sharing its typography. */
.wonder-menu .notebook-panel.wonder-notebook-embedded {
  position:static;inset:auto;transform:none;display:grid;grid-template-columns:minmax(0,1fr) auto;
  gap:16px;width:100%;min-width:0;max-width:none;max-height:none;margin:0;padding:0;
  overflow:visible;border:0;border-radius:0;background:none;box-shadow:none;color:var(--menu-ink);
}
.wonder-menu .wonder-notebook-embedded [hidden],.wonder-menu .wonder-notebook-embedded[hidden] { display:none!important; }
.wonder-menu .wonder-notebook-embedded .notebook-title { margin:0;align-self:center;font:500 34px/1.1 'Avenir Next Condensed','Barlow Condensed',sans-serif;letter-spacing:-.02em; }
.wonder-menu .wonder-notebook-embedded button {
  min-height:44px;margin:0;padding:10px 12px;border:1px solid var(--menu-rule);border-radius:2px;
  color:var(--menu-ink);background:transparent;font:var(--menu-small)/1.4 ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase;
}
.wonder-menu .wonder-notebook-embedded .notebook-close { grid-column:2;grid-row:1;justify-self:end; }
.wonder-menu .wonder-notebook-embedded :is(.notebook-message,.notebook-body,.notebook-editor,.notebook-count,.notebook-recovery) { grid-column:1/-1;min-width:0;margin:0; }
.wonder-menu .wonder-notebook-embedded .notebook-pages { grid-column:1/-1;display:flex;gap:8px;overflow-x:auto;overscroll-behavior-inline:contain;min-width:0;padding:4px 2px 12px; }
.wonder-menu .wonder-notebook-embedded .notebook-pages button { flex:0 0 auto;min-width:80px; }
.wonder-menu .wonder-notebook-embedded .notebook-pages button[aria-current="true"] { border-color:var(--menu-amber);background:rgba(36,41,44,.72); }
.wonder-menu .wonder-notebook-embedded :is(.notebook-message,.notebook-count) { color:var(--menu-dim);font:var(--menu-small)/1.6 ui-monospace,monospace;letter-spacing:.06em; }
.wonder-menu .wonder-notebook-embedded :is(.notebook-body,.notebook-editor,.notebook-recovery) { font:var(--menu-reading)/1.65 'Avenir Next',sans-serif;letter-spacing:0;white-space:pre-wrap;overflow-wrap:anywhere; }
.wonder-menu .wonder-notebook-embedded :is(.notebook-message,.notebook-body):empty { display:none; }
.wonder-menu .wonder-notebook-embedded :is(.notebook-editor,.notebook-recovery) { box-sizing:border-box;width:100%;min-height:260px;padding:16px;border:1px solid var(--menu-rule);background:rgba(13,20,24,.68);color:var(--menu-ink);resize:vertical; }
.wonder-menu .wonder-notebook-embedded>.notebook-save { border-color:var(--menu-amber);justify-self:start; }
.wonder-menu .wonder-notebook-embedded>button:not(.notebook-close) { justify-self:start;max-width:100%; }
@media(max-width:680px) {
  .wonder-menu .memory-layout { display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:auto auto; gap:26px; }
  .wonder-menu .memory-list { width:100%; max-height:none; }
  .wonder-menu .memory-reading { width:100%; max-height:none; }
  .wonder-menu .wonder-memory-timeline { grid-template-columns:repeat(10,minmax(76px,1fr)); overflow-x:auto; }
  .wonder-menu .wonder-memory-name { font-size:var(--menu-tiny); letter-spacing:0; }
  .wonder-menu .wonder-memory-header { gap:10px; }
  .wonder-menu .wonder-memory-header { grid-template-columns:minmax(0,1fr); }
  .wonder-menu #memory-title { font-size:28px; }
  .wonder-menu .memory-navigation { gap:4px; }
  .wonder-menu .memory-navigation { justify-content:start; }
  .wonder-menu .memory-navigation button { padding:9px 6px; font-size:var(--menu-tiny); letter-spacing:.06em; }
  .wonder-menu .wonder-memory-scroll { max-height:none; }
  .wonder-menu .wonder-notebook-embedded { gap:12px; }
  .wonder-menu .wonder-notebook-embedded>button:not(.notebook-close) { grid-column:1/-1; }
}
@media(prefers-reduced-motion:reduce) {
  .wonder-menu .wonder-memory-timeline::before { transition:none; }
  .wonder-menu .memory-list,.wonder-menu .memory-reading { animation:none; }
}

/* Chapters and reading use the remaining viewport, with their own scroll. */
.wonder-menu .memory-sheet { display:flex;flex-direction:column;height:100%;min-height:0; }
.wonder-menu .wonder-memory-timeline { flex:none;margin:0 0 12px;padding:4px; }
.wonder-menu .memory-layout { flex:1;min-height:0;grid-template-columns:minmax(190px,1fr) minmax(0,2.2fr);grid-template-rows:minmax(0,1fr);align-items:stretch;gap:var(--menu-gap,20px); }
.wonder-menu .memory-list { min-height:0;max-height:100%;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding:3px; }
.wonder-menu .memory-list .wonder-memory-page { padding:7px 8px;gap:7px;font-size:var(--menu-small);line-height:1.4;letter-spacing:.04em; }
.wonder-menu .memory-reading { display:flex;flex-direction:column;min-height:0;max-height:100%;gap:10px; }
.wonder-menu .wonder-memory-header { flex:none;gap:10px;padding-bottom:10px; }
.wonder-menu .wonder-memory-titles { gap:5px; }
.wonder-menu #memory-title { font-size:32px; }
.wonder-menu .memory-navigation { flex-wrap:wrap; }
.wonder-menu .memory-navigation button { min-height:36px;padding:6px 8px;font-size:var(--menu-small);letter-spacing:.04em; }
.wonder-menu .wonder-memory-scroll { flex:1;min-height:0;max-height:100%;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding:3px 8px 3px 3px;gap:10px; }
.wonder-menu #memory-body { line-height:1.5; }
.wonder-menu .pause-menu.wonder-menu-embedded { min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding:4px; }
.wonder-menu .pause-panel { max-width:760px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:0 20px; }
.wonder-menu .pause-row { padding:10px;gap:10px;letter-spacing:.06em; }
.wonder-menu .pause-row-label,.wonder-menu .pause-row-value { letter-spacing:.06em; }
.wonder-menu .pause-panel>.pause-sub,.wonder-menu .pause-panel>.pause-foot { grid-column:1/-1;margin-top:12px; }
.wonder-menu .pause-panel>.pause-row[data-row="text-size"] { grid-column:1/-1;grid-template-columns:minmax(0,1fr) auto; }
.wonder-menu .notebook-panel.wonder-notebook-embedded { height:100%;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding:4px;align-content:start; }
@media(max-width:800px) {
 .wonder-menu .memory-layout { grid-template-columns:minmax(140px,.85fr) minmax(0,1.5fr); }
 .wonder-menu .wonder-memory-header { grid-template-columns:minmax(0,1fr); }
 .wonder-menu .memory-navigation { justify-content:start; }
 .wonder-menu #memory-title { font-size:28px; }
 .wonder-menu .pause-panel { grid-template-columns:minmax(0,1fr); }
 .wonder-menu .pause-panel>.pause-row[data-row="text-size"] { grid-template-columns:minmax(0,1fr); }
}
@media(max-width:600px) {
 .wonder-menu .memory-layout { grid-template-columns:minmax(104px,.7fr) minmax(0,1.3fr);grid-template-rows:minmax(0,1fr);gap:10px; }
 .wonder-menu .memory-list .wonder-memory-page { grid-template-columns:minmax(0,1fr);gap:3px;font-size:12px; }
 .wonder-menu .memory-list .wonder-memory-page-number { font-size:12px; }
 .wonder-menu .memory-navigation button { min-height:40px;padding:6px;font-size:12px; }
 .wonder-menu .wonder-memory-timeline { margin-bottom:8px; }
 .wonder-menu #memory-title { font-size:25px; }
}