/* Shares the Piano Trainer's session card, statistics and progress styling. */
:root{--panel:var(--surface);--panel2:var(--surface-2);--muted:var(--ink-3)}
body .wrap{max-width:980px}header.page{background:var(--bg);border-bottom:0;padding-bottom:0}header.page .wrap{padding:0 2px}
.composition-progress{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px;margin:0 0 22px}
.cp-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.cp-heading h2{font-family:var(--font-display);font-size:1.2rem;margin:2px 0}.cp-heading p{margin:2px 0;color:var(--ink-2);font-size:.82rem}.cp-heading .cp-eyebrow{font-size:.65rem;font-weight:700;letter-spacing:.12em;color:var(--accent)}.cp-heading a{font-size:.8rem;color:var(--accent);font-weight:600}
.cp-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:20px 0}.cp-stats>div{background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:12px}.cp-stats strong{display:block;font-size:1.7rem;line-height:1.2;color:var(--accent);font-variant-numeric:tabular-nums}.cp-stats span{display:block;font-size:.68rem;color:var(--ink-2);margin-top:5px;text-transform:uppercase;letter-spacing:.04em}.cp-stats #cp-recorded,.cp-stats #cp-complete{color:var(--green)}
.cp-bar{height:10px;border-radius:8px;overflow:hidden;background:var(--surface-2)}.cp-bar>div{height:100%;width:0;background:linear-gradient(90deg,var(--accent),var(--green));transition:width .25s;border-radius:8px}.cp-caption{font-size:.8rem;color:var(--ink-2);margin:8px 0 16px}.cp-stages{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.cp-stages span{display:block;font-size:.7rem;color:var(--ink-2)}.cp-stages progress{display:block;width:100%;height:6px;accent-color:var(--green);margin-top:6px}.cp-footnote{font-size:.74rem;color:var(--ink-3);line-height:1.5;margin-bottom:0}
body .card{border-radius:var(--radius);border-left:4px solid var(--accent);padding:15px 16px;box-shadow:var(--shadow)}body .card.flagged{border-left-color:var(--gold)}body .lvl.active,body .lvbtn.active{background:var(--accent-fill);border-color:var(--accent-fill);color:var(--on-accent)}body .entry{border-radius:var(--radius)}body .logsec{border-top-color:var(--line)}body .pcount{white-space:normal}
@media(max-width:600px){.cp-stats{grid-template-columns:repeat(2,1fr)}.cp-stages{grid-template-columns:repeat(2,1fr)}.composition-progress{padding:15px}header.page{padding-inline:18px}}
@media(prefers-reduced-motion:reduce){.cp-bar>div{transition:none}}
@media print{.composition-progress{display:none}}