.parent-reading {
  --pr-ink: #e8edf2;
  --pr-muted: #a9b6c4;
  --pr-line: #2a3442;
  --pr-paper: #101720;
  --pr-card: #141d27;
  --pr-teal: #5fe6f2;
  --pr-teal-soft: rgba(95, 230, 242, .1);
  --pr-amber: #f2b233;
  --pr-amber-soft: rgba(242, 178, 51, .1);
  width: 100%;
  color: var(--pr-ink);
  font-family: var(--read, 'Andika', 'Atkinson Hyperlegible', system-ui, sans-serif);
  line-height: 1.5;
}
.parent-reading *, .parent-reading *::before, .parent-reading *::after { box-sizing: border-box; }
.parent-reading h2, .parent-reading h3, .parent-reading h4, .parent-reading p { margin: 0; }
.parent-reading h2, .parent-reading h3, .parent-reading h4 { color: var(--pr-ink); font-family: var(--display, 'Oxanium', system-ui, sans-serif); letter-spacing: .015em; }
.parent-reading button, .parent-reading summary { font: inherit; }
.parent-reading :focus-visible { outline: 3px solid var(--pr-amber); outline-offset: 3px; }
.pr-kicker, .pr-label { display: block; color: var(--pr-muted); font: 700 10px/1.4 var(--display, system-ui); letter-spacing: .14em; text-transform: uppercase; }
.pr-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; padding: 14px 16px; border: 1px solid var(--pr-line); border-radius: 14px 5px 14px 5px; background: #111b25; }
.pr-toolbar-copy { display: flex; flex-direction: column; gap: 2px; color: var(--pr-muted); font-size: 13px; }
.pr-toolbar-copy .pr-kicker { color: var(--pr-teal); }
.pr-filter { display: inline-flex; padding: 3px; border: 1px solid #344454; border-radius: 9px; background: #0b1118; }
.pr-filter-btn { min-height: 38px; padding: 6px 13px; border: 0; border-radius: 6px; color: #b8c4cf; background: transparent; font: 700 12px var(--display, system-ui) !important; cursor: pointer; transition: color .16s ease, background-color .16s ease, transform .16s ease; }
.pr-filter-btn:hover { color: var(--pr-ink); background: #1a2733; }
.pr-filter-btn[aria-pressed="true"] { color: #081115; background: var(--pr-teal); box-shadow: 0 1px 2px #0008; }
.pr-filter-btn:active { transform: translateY(1px); }
.pr-dashboard { margin-top: 15px; }
.pr-content { display: flex; flex-direction: column; gap: 18px; animation: pr-enter .24s ease-out both; }
@keyframes pr-enter { from { opacity: .65; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
.pr-intro { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; padding: 3px 2px 1px; }
.pr-intro h2 { margin-top: 4px; font-size: clamp(22px, 3vw, 30px); line-height: 1.15; }
.pr-intro p { max-width: 62ch; margin-top: 6px; color: var(--pr-muted); font-size: 14px; }
.pr-window-note, .pr-session-count, .pr-season { padding: 6px 10px; border: 1px solid #32606b; border-radius: 999px; background: var(--pr-teal-soft); color: #a0f5fa; font-size: 11px; white-space: nowrap; }
.pr-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.pr-metric { display: flex; min-height: 112px; flex-direction: column; justify-content: space-between; gap: 6px; padding: 14px 15px; border: 1px solid var(--pr-line); border-radius: 11px 4px 11px 4px; background: var(--pr-card); box-shadow: 0 2px 7px #0006; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.pr-metric:hover { transform: translateY(-2px); border-color: #4b7681; box-shadow: 0 5px 14px #0008; }
.pr-metric strong { color: var(--pr-teal); font: 700 clamp(23px, 3vw, 30px)/1.1 var(--display, system-ui); font-variant-numeric: tabular-nums; }
.pr-metric strong small { margin-left: 5px; color: var(--pr-muted); font: 600 12px var(--read, system-ui); }
.pr-metric-detail { color: var(--pr-muted); font-size: 11px; line-height: 1.35; }
.pr-goals, .pr-trends, .pr-history, .pr-support { padding: 16px; border: 1px solid var(--pr-line); border-radius: 13px 4px 13px 4px; background: var(--pr-paper); }
.pr-section-title { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; margin-bottom: 13px; }
.pr-section-title h3, .pr-support h3 { margin-top: 3px; font-size: 19px; line-height: 1.2; }
.pr-season { background: rgba(242, 178, 51, .1); border-color: #75572a; color: #f2c66f; }
.pr-goal-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.pr-goal { min-height: 138px; padding: 14px; border: 1px solid; border-radius: 9px 3px 9px 3px; }
.pr-goal--length { border-color: #3b4859; background: #141d27; }
.pr-goal--length strong { color: var(--pr-ink); }
.pr-goal--reference { border-color: #32606b; background: rgba(95, 230, 242, .07); }
.pr-goal--stretch { border-color: #75572a; background: rgba(242, 178, 51, .08); }
.pr-goal strong { display: block; margin-top: 5px; font: 700 23px/1.15 var(--display, system-ui); font-variant-numeric: tabular-nums; }
.pr-goal--reference strong { color: var(--pr-teal); }
.pr-goal--stretch strong { color: #f2c66f; }
.pr-goal > span:not(.pr-label) { color: var(--pr-muted); font-size: 12px; }
.pr-goal p { margin-top: 8px; color: #c0cbd5; font-size: 12px; }
.pr-goal-note { margin-top: 10px !important; color: var(--pr-muted); font-size: 11px; }
.pr-unit-note { color: var(--pr-muted); font-size: 11px; text-align: right; }
.pr-chart-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.pr-chart { min-width: 0; padding: 12px; border: 1px solid #2a3442; border-radius: 10px 3px 10px 3px; background: #141d27; }
.pr-chart-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.pr-chart-head h3 { font-size: 15px; }
.pr-chart-head span { color: var(--pr-muted); font-size: 10px; text-align: right; }
.pr-svg-scroll { overflow-x: auto; }
.pr-chart svg { display: block; width: 100%; min-width: 320px; margin-top: 6px; overflow: visible; }
.pr-gridline { stroke: #2a3442; stroke-width: 1; }
.pr-axis { fill: #a9b6c4; font: 10px var(--read, system-ui); }
.pr-line { fill: none; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.pr-line--teal { stroke: #5fe6f2; }
.pr-line--amber { stroke: #f2b233; }
.pr-point { stroke: #0b1118; stroke-width: 1.5; }
.pr-point--teal { fill: #5fe6f2; }
.pr-point--amber { fill: #f2b233; }
.pr-legend { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 2px; color: var(--pr-muted); font-size: 11px; }
.pr-legend span { display: inline-flex; align-items: center; gap: 5px; }
.pr-legend-dot { width: 8px; height: 8px; border-radius: 50%; }
.pr-legend-dot--teal { background: var(--pr-teal); }
.pr-legend-dot--amber { background: var(--pr-amber); }
.pr-data { margin-top: 6px; color: var(--pr-muted); font-size: 11px; }
.pr-data summary { width: fit-content; min-height: 30px; display: flex; align-items: center; cursor: pointer; }
.pr-data summary:hover { color: var(--pr-teal); }
.pr-data table, .pr-sessions { width: 100%; border-collapse: collapse; text-align: left; }
.pr-data caption, .pr-sessions caption { padding: 6px 0; color: var(--pr-muted); text-align: left; font-size: 11px; }
.pr-data th, .pr-data td, .pr-sessions th, .pr-sessions td { padding: 8px 9px; border-bottom: 1px solid #2a3442; vertical-align: top; }
.pr-data th, .pr-sessions thead th { color: #a9b6c4; font: 700 10px var(--display, system-ui); letter-spacing: .08em; text-transform: uppercase; }
.pr-speed-note { margin-top: 9px !important; color: var(--pr-muted); font-size: 11px; }
.pr-table-scroll { max-width: 100%; overflow-x: auto; }
.pr-sessions { min-width: 780px; font-size: 12px; }
.pr-sessions thead { background: #111b25; }
.pr-sessions tbody tr:hover { background: #1a2631; }
.pr-sessions tbody th { color: #e8edf2; font-weight: 700; text-align: left; }
.pr-story { display: block; min-width: 110px; max-width: 190px; }
.pr-badges { display: flex; flex-wrap: wrap; gap: 4px; min-width: 110px; }
.pr-badge { display: inline-flex; align-items: center; padding: 2px 6px; border: 1px solid #3a4653; border-radius: 99px; color: #c5cfd8; background: #18212b; font-size: 10px; white-space: nowrap; }
.pr-badge--first { border-color: #32606b; background: rgba(95, 230, 242, .1); color: #a0f5fa; }
.pr-badge--repeat { border-color: #75572a; background: rgba(242, 178, 51, .1); color: #f2c66f; }
.pr-badge--assisted { border-color: #69592f; background: rgba(242, 178, 51, .08); color: #e8d28f; }
.pr-badge--unreliable, .pr-badge--not-measured { border-color: #784d3d; background: rgba(255, 122, 69, .1); color: #ffb08f; }
.pr-badge--legacy { border-color: #454b5a; background: #1a1d27; color: #c0c6d2; }
.pr-muted { color: #9aa8b8; font-size: 10px; }
.pr-support-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 10px; }
.pr-support { background: #141d27; }
.pr-support > ul { display: grid; gap: 7px; margin: 12px 0 0; padding-left: 20px; color: #c3ced9; font-size: 13px; }
.pr-support > p { margin-top: 10px; color: #b1bdc9; font-size: 13px; }
.pr-recommendations { margin-top: 15px; padding-top: 11px; border-top: 1px solid var(--pr-line); }
.pr-recommendations h4 { margin-bottom: 7px; font-size: 13px; }
.pr-recommendation { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; padding: 7px 0; border-top: 1px solid #2a3442; font-size: 12px; }
.pr-recommendation span { color: var(--pr-muted); text-align: right; font-size: 11px; }
.pr-word-list { display: flex !important; flex-wrap: wrap; gap: 7px !important; padding: 0 !important; list-style: none; }
.pr-word-list li { padding: 5px 9px; border: 1px solid #344454; border-radius: 6px; background: #111b25; color: #c2dce1; }
.pr-caveat { display: flex; align-items: flex-start; gap: 10px; padding: 12px 14px; border: 1px solid #70552b; border-left: 3px solid var(--pr-amber); border-radius: 8px; background: rgba(242, 178, 51, .08); color: #e3d4b3; }
.pr-caveat p { font-size: 12px; line-height: 1.55; }
.pr-caveat strong { display: block; margin-bottom: 2px; color: #f2c66f; }
.pr-caveat-mark { flex: none; display: grid; width: 22px; height: 22px; place-items: center; border-radius: 50%; background: rgba(242, 178, 51, .18); color: #f2c66f; font: 700 13px var(--display, system-ui); }
.pr-chart-empty, .pr-empty { padding: 18px 14px; border: 1px dashed #3a4b59; border-radius: 9px; background: #141d27; color: var(--pr-muted); font-size: 12px; }
.pr-chart-empty { min-height: 80px; display: flex; align-items: center; margin-top: 9px; }
.pr-empty { display: flex; flex-direction: column; gap: 3px; padding: 20px; }
.pr-empty strong { color: #e8edf2; }
.pr-empty--compact { margin-top: 6px; }
.pr-error { display: flex; flex-direction: column; gap: 4px; padding: 16px; border: 1px solid #784d3d; border-radius: 10px; background: rgba(255, 122, 69, .1); color: #ffc1a7; font-size: 13px; }
@media (max-width: 680px) {
  .pr-intro { align-items: flex-start; flex-direction: column; }
  .pr-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pr-chart-grid, .pr-goal-columns, .pr-support-grid { grid-template-columns: 1fr; }
  .pr-goal { min-height: 0; }
  .pr-section-title { align-items: flex-start; }
}
@media (max-width: 420px) {
  .pr-toolbar { padding: 11px; }
  .pr-filter { width: 100%; }
  .pr-filter-btn { flex: 1; padding-inline: 7px; }
  .pr-metric { min-height: 104px; padding: 11px; }
  .pr-metric strong { font-size: 23px; }
  .pr-goals, .pr-trends, .pr-history, .pr-support { padding: 12px; }
  .pr-section-title { flex-direction: column; gap: 7px; }
  .pr-unit-note { text-align: left; }
}
@media (prefers-reduced-motion: reduce) {
  .parent-reading *, .parent-reading *::before, .parent-reading *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
}