/* Plan extras on the problem bench: own numbers, "where did I go wrong?" and Exam+ (public/plus.js).
   Quiet by design: one row of small ghost buttons under the tools, panels that open in place, no badges or counters. */
.px-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.px-box{display:flex;flex-direction:column;gap:10px;margin-top:-4px}
.px-bar{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px}
.px-box .btn.sm,.px-ptools .btn.sm{padding:6px 10px;font-size:13.5px;gap:6px;border-radius:8px;font-weight:600}
.px-box .btn.ghost{color:var(--muted)}
.px-box .btn.ghost:hover,.px-box .btn.ghost[aria-expanded="true"]{color:var(--ink);background:var(--soft)}
.px-box .btn svg{width:15px;height:15px}
.px-tag{font-size:12px;font-weight:600;color:var(--acc-text);background:var(--acc-soft);border:1px solid var(--acc-line);border-radius:999px;padding:2px 9px;margin-inline-end:4px}
.px-msg .feedback{font-size:14px}

.px-panel{border:1px solid var(--line);border-radius:12px;background:var(--sunk);padding:16px;display:flex;flex-direction:column;gap:12px}
.px-ptitle{margin:0;font-size:15.5px;font-weight:700}
.px-pmuted{margin:0;color:var(--muted);font-size:14px;max-width:70ch}
.px-pq{margin:0;font-size:15px;max-width:64ch}
.px-pform,.px-psteps{display:flex;flex-direction:column;gap:12px;margin:0}
.px-pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px 14px}
.px-pfield{display:flex;flex-direction:column;gap:5px;min-width:0}
.px-pfield.wide{grid-column:1/-1}
.px-pfield>label{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px;font-size:13px;line-height:1.3}
.px-psym{font-family:var(--f-math);font-size-adjust:.5;font-size:15px;font-weight:600}
.px-psym sub,.lsym sub{font-size:.7em;vertical-align:-.35em;line-height:0;margin-left:1px}
.px-pdesc{color:var(--muted);font-size:12.5px}
.px-pfield .field,.px-pcheck .field{flex:none;width:100%;margin:0}
.px-pfield textarea,.px-pfield select{border:0;outline:0;background:transparent;font-family:var(--f-mono);font-size:15px;padding:9px 12px;width:100%;min-width:0;resize:vertical}
.px-pfield select{font-family:var(--f-body);appearance:auto}
.field.bad{border-color:var(--bad)}
.px-perr{margin:0;color:var(--bad);font-size:14px;font-weight:500}
.px-pbtns{display:flex;flex-wrap:wrap;gap:8px}
.px-ptypes{display:flex;flex-direction:column;gap:8px}
.px-ptype{text-align:start;border:1px solid var(--line);background:var(--surface);border-radius:9px;padding:10px 12px;font-size:14px;line-height:1.4}
.px-ptype:hover{border-color:var(--acc-line);background:var(--acc-soft)}
.px-panel .safety-line{margin:0}

/* checkpoints */
.px-pgroup{margin:4px 0 -4px;font-size:12.5px;font-weight:600;color:var(--muted)}
.px-pgroup sub{font-size:.75em}
.px-pcheck{display:flex;align-items:center;gap:10px}
.px-pcheck .field{max-width:440px}
.px-pcheck .field label{min-width:72px;justify-content:center}
.px-pmark{width:22px;height:22px;flex:none;display:inline-flex;align-items:center;justify-content:center}
.px-pmark svg{width:18px;height:18px}
.px-pcheck.good .field{border-color:var(--good)}
.px-pcheck.good .px-pmark{color:var(--good)}
.px-pcheck.bad .field{border-color:var(--bad)}
.px-pcheck.bad .px-pmark{color:var(--bad)}
.px-pcheck.first .field{box-shadow:0 0 0 3px var(--bad-soft)}
.px-pfeed{display:flex;flex-direction:column;gap:10px;max-width:72ch}
.px-pfeed .linkbtn{margin:0 0 0 4px}
.px-pstep{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:14px;border-top:1px solid var(--line)}

/* Exam+ */
.seg button.px-seg{color:var(--acc-text)}
.seg button.px-seg[aria-pressed="true"]{color:var(--ink)}
.px-start .px-note{align-items:center;text-align:center}
.px-note{display:flex;flex-direction:column;gap:6px}
.px-note p{margin:0;color:var(--muted);font-size:14px;max-width:62ch}
.px-note .px-cta{font-size:14px}
.px-cta span{color:var(--muted)}
.px-cta a{color:var(--acc-text);font-weight:600;text-underline-offset:2px}
#plusView .px-pscen{padding-bottom:4px}
.px-pparts{list-style:none;margin:0;padding:4px 20px 8px;display:flex;flex-direction:column;gap:14px}
.px-ppart{border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:16px;display:flex;flex-direction:column;gap:12px}
.px-ppart.done{border-color:color-mix(in srgb,var(--good) 35%,var(--line))}
.px-phead{display:flex;gap:10px;align-items:baseline}
.px-plab{font-weight:700;font-family:var(--f-mono);font-size:14px;color:var(--muted);flex:none}
.px-ppart.done .px-plab{color:var(--good)}
.px-pqtext{margin:0;font-size:16px;max-width:64ch}
.px-ptools{display:flex;flex-wrap:wrap;gap:8px}
.px-psol{display:flex;flex-direction:column;gap:16px;border-top:1px solid var(--line);padding-top:6px}
.px-psol .step:first-child{border-top:0;padding-top:8px}
.px-pend .tools{border-top:0;padding-top:0}
@media (max-width:560px){
  .px-panel{padding:12px;border-radius:10px}
  .px-pgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .px-pparts{padding:4px 12px 8px}
  .px-ppart{padding:12px;gap:10px}
  .px-pqtext{font-size:15.5px}
  .px-pcheck .field label{min-width:60px;padding:0 9px}
}
.px-pfb:empty,.px-ppart .hints:empty{display:none}