/* BLKMAT Guided Practice — player styles. Layered on /styles.css tokens;
   gold accent matches the pose-videos shelf convention (#c9a24b). */
.pr-wrap{--gold:#c9a24b}
.pr-wrap [hidden]{display:none!important}
.pr-wrap a:focus-visible,.pr-wrap button:focus-visible,.pr-wrap input:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.pr-lede{max-width:44em}
.pr-how{display:grid;gap:12px;margin:18px 0;padding:0;list-style:none}
@media(min-width:720px){.pr-how{grid-template-columns:repeat(3,1fr)}}
.pr-how li{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px}
.pr-how b{display:block;margin-bottom:4px}
.pr-how span{color:var(--mute);font-size:14px}
.pr-safe{border:1px solid var(--gold);border-radius:var(--r);background:rgba(201,162,75,.07);padding:14px 18px;margin:22px 0}
.pr-safe b{color:var(--gold)}

/* settings */
.pr-settings{border:1px solid var(--line);border-radius:var(--r);background:var(--panel);padding:16px 18px;margin:22px 0}
.pr-settings h2{font-size:18px;margin:0 0 10px}
.pr-setrow{display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center}
.pr-set{display:flex;align-items:center;gap:10px;font-size:15px}
.pr-set label{color:var(--mute)}
.pr-set input[type=range]{width:150px;accent-color:var(--gold);min-height:32px}
.pr-set output{font-variant-numeric:tabular-nums;min-width:3.2em}
.pr-switch{display:inline-flex;align-items:center;gap:10px;cursor:pointer;min-height:44px}
.pr-switch input{width:22px;height:22px;accent-color:var(--gold)}
.pr-note{color:var(--mute);font-size:13px;margin:10px 0 0}

/* flow library */
.pr-grid{display:grid;gap:16px;margin-top:16px}
@media(min-width:760px){.pr-grid{grid-template-columns:repeat(3,1fr)}}
.pr-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:18px;display:flex;flex-direction:column;gap:8px}
.pr-card h3{margin:0;font-size:20px}
.pr-card p{margin:0;color:var(--mute);font-size:15px}
.pr-chips{display:flex;flex-wrap:wrap;gap:6px;margin:2px 0}
.pr-chip{border:1px solid var(--line);border-radius:999px;padding:2px 10px;font-size:12.5px;color:var(--mute)}
.pr-chip.gold{border-color:var(--gold);color:var(--gold)}
.pr-card .btn{margin-top:auto}

/* preview */
.pr-meta{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 16px}
.pr-poselist{margin:0;padding-left:1.2em;max-width:44em}
.pr-poselist li{margin:.45em 0}
.pr-poselist .dur{color:var(--mute);font-size:13px}
.pr-poselist .side{color:var(--gold);font-size:13px}
.pr-actions{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0}
.btn.gold{background:var(--gold);border-color:var(--gold);color:#171204}
.btn.big{min-height:56px;padding:0 28px;font-size:17px}

/* player stage */
.pr-player{border:1px solid var(--line);border-radius:var(--r);background:var(--panel);padding:18px;margin:22px 0}
.pr-ptop{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.pr-ptop h2{margin:0;font-size:20px}
.pr-count{color:var(--mute);font-size:14px;font-variant-numeric:tabular-nums}
.pr-bar{height:8px;background:#232327;border-radius:99px;overflow:hidden;margin:12px 0 4px}
.pr-bar>i{display:block;height:100%;width:0;background:var(--gold);border-radius:99px;transition:width .3s linear}
.pr-stage{display:grid;gap:18px;margin-top:14px}
@media(min-width:820px){.pr-stage{grid-template-columns:300px 1fr;align-items:start}}
.pr-stage figure{margin:0}
.pr-stage figure img{border-radius:12px;width:100%;height:auto;background:#1a1a1c}
.pr-stage figcaption{font-size:12px;color:var(--mute);padding-top:6px}
.pr-posename{font-size:clamp(28px,6vw,42px);line-height:1.1;margin:0}
.pr-sanskrit{color:var(--mute);font-style:italic;margin:2px 0 0}
.pr-side{display:inline-block;margin-top:8px;border:1px solid var(--gold);color:var(--gold);border-radius:999px;padding:1px 10px;font-size:13px}
.pr-timer{font-size:clamp(44px,10vw,64px);font-weight:800;font-variant-numeric:tabular-nums;line-height:1;margin:14px 0 4px}
.pr-timelab{color:var(--mute);font-size:13px;margin:0}
.pr-align{color:var(--mute);font-size:15px;max-width:36em}
.pr-mod{border-left:3px solid var(--gold);padding:6px 12px;color:var(--ink);background:rgba(201,162,75,.06);font-size:15px;max-width:36em}
.pr-mod b{color:var(--gold)}
.pr-next{color:var(--mute);font-size:14px;margin-top:10px}
.pr-caption{margin-top:16px;border:1px solid var(--line);border-radius:var(--r);background:#101012;padding:18px;min-height:96px;display:flex;align-items:center}
.pr-caption p{margin:0;font-size:clamp(18px,3.4vw,23px);line-height:1.45}
.pr-controls{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
@media(min-width:640px){.pr-controls{grid-template-columns:repeat(5,1fr)}}
.pr-ctl{min-height:60px;border-radius:14px;border:1px solid var(--line);background:#1d1d20;color:var(--ink);font:inherit;font-weight:700;font-size:16px;cursor:pointer;padding:8px}
.pr-ctl:hover{border-color:var(--gold)}
.pr-ctl.primary{background:var(--gold);border-color:var(--gold);color:#171204}
.pr-ctl[disabled]{opacity:.45;cursor:not-allowed}
.pr-paused{color:var(--gold);font-weight:700}

/* recap */
.pr-recap{border:1px solid var(--gold);border-radius:var(--r);background:rgba(201,162,75,.06);padding:20px;margin:22px 0}
.pr-fb{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0}
.pr-fb button{min-height:52px;padding:0 18px;border-radius:999px;border:1px solid var(--line);background:var(--panel);color:var(--ink);font:inherit;font-weight:600;cursor:pointer}
.pr-fb button:hover{border-color:var(--gold)}
.pr-fb button[aria-pressed=true]{background:var(--gold);border-color:var(--gold);color:#171204}
.pr-fineprint{color:var(--mute);font-size:12.5px;margin-top:26px}
@media(prefers-reduced-motion:reduce){.pr-bar>i{transition:none}}

.pr-set select{font:inherit;min-height:36px;background:#1d1d20;color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:4px 8px}
