/* 進み具合の見える化。style.css・flow.css・fm.css の上に重ねる（緑・黄・赤は報告の色） */
.pg-c-g { --pc: #15803d; --pcs: #f0fdf4; --pcl: #86efac; }
.pg-c-y { --pc: #b45309; --pcs: #fffbeb; --pcl: #fcd34d; }
.pg-c-r { --pc: #b91c1c; --pcs: #fef2f2; --pcl: #fca5a5; }
#pgPresets { margin-bottom: 10px; }
.pg-evm { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.6fr); gap: 10px; align-items: start; }
.pg-in { padding: 12px 14px; display: grid; gap: 8px; }
.pg-in h3 { margin: 0; font-size: 14px; }
.pg-f { display: grid; grid-template-columns: minmax(0, 1fr) 7em; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 700; color: var(--ink2); }
.pg-f input { font: 600 14px var(--latin); width: 100%; box-sizing: border-box; border: 1px solid var(--line); border-radius: 8px; padding: 5px 8px; text-align: right; background: var(--paper); color: var(--ink); }
.pg-err { margin: 0; font-size: 12.5px; font-weight: 700; color: #b91c1c; }
.pg-err:empty { display: none; }
.pg-outs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.pg-o { background: var(--paper); border: 1px solid var(--line); border-radius: 12px; padding: 9px 12px; display: flex; flex-direction: column; gap: 2px; }
.pg-o.ok { border-color: #bbf7d0; }
.pg-o.ng { border-color: #fecaca; background: #fffafa; }
.pg-k { font: 700 13px var(--latin); color: var(--ink); display: flex; align-items: baseline; gap: 6px; }
.pg-k small { font: 700 11px var(--sans); color: var(--muted); }
.pg-o b { font: 700 22px var(--latin); }
.pg-o.ok b { color: #15803d; }
.pg-o.ng b { color: #b91c1c; }
.pg-fml { font: 600 11px var(--latin); color: var(--muted); background: transparent !important; padding: 0 !important; }
.pg-txt { font-size: 12px; color: var(--ink2); }
.pg-chartbox { margin-top: 10px; padding: 10px 12px; }
.pg-chartbox svg, .pg-burn svg { width: 100%; height: auto; display: block; margin: 0 auto; }
.pg-chartbox svg { max-width: 760px; }
.pg-burn svg { max-width: 620px; }
.pg-grid { stroke: #eef1f6; stroke-width: 1; }
.pg-ax { font: 600 11px var(--latin); fill: var(--muted); }
.pg-now { stroke: #0f172a; stroke-width: 1; stroke-dasharray: 3 3; }
.pg-nowt { font: 700 11px var(--sans); fill: #0f172a; }
.pg-bac { stroke: #94a3b8; stroke-width: 1.5; stroke-dasharray: 6 4; }
.pg-lab { font: 700 11px var(--latin); fill: #475569; }
.pg-lab.fc { fill: #b91c1c; }
.pg-pv, .pg-ev, .pg-ac, .pg-fc, .pg-ideal, .pg-rem { fill: none; stroke-width: 2.5; }
.pg-pv { stroke: #94a3b8; }
.pg-ev { stroke: #1d4ed8; }
.pg-ac { stroke: #b91c1c; }
.pg-fc { stroke: #b91c1c; stroke-dasharray: 5 4; stroke-width: 2; }
.pg-evd { fill: #1d4ed8; }
.pg-acd { fill: #b91c1c; }
.pg-legend { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 6px 0 0; font-size: 11.5px; color: var(--muted); }
.pg-legend span::before { content: ""; display: inline-block; width: 16px; height: 0; border-top: 3px solid; margin-right: 5px; vertical-align: 3px; }
.pg-legend .k-pv::before { border-color: #94a3b8; }
.pg-legend .k-ev::before { border-color: #1d4ed8; }
.pg-legend .k-ac::before { border-color: #b91c1c; }
.pg-legend .k-fc::before { border-top: 3px dashed #b91c1c; }
.pg-legend .k-ideal::before { border-top: 3px dashed #94a3b8; }
.pg-legend .k-rem::before { border-color: #0f766e; }
.pg-terms { margin-top: 10px; }
.pg-terms th { white-space: nowrap; }
.pg-burn { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 10px; align-items: start; margin-top: 10px; }
.pg-burn .card { padding: 10px 12px; }
.pg-ideal { stroke: #94a3b8; stroke-dasharray: 6 5; stroke-width: 2; }
.pg-rem { stroke: #0f766e; }
.pg-remd { fill: #0f766e; }
.pg-burnnote h3 { margin: 0 0 4px; font-size: 15px; }
.pg-burnnote p { margin: 0 0 6px; font-size: 13px; color: var(--ink2); }
.pg-left b { font: 700 18px var(--latin); color: var(--ink); }
#pgColors .pill[aria-pressed="true"].pg-c-g { background: #15803d; border-color: #15803d; }
#pgColors .pill[aria-pressed="true"].pg-c-y { background: #b45309; border-color: #b45309; }
#pgColors .pill[aria-pressed="true"].pg-c-r { background: #b91c1c; border-color: #b91c1c; }
.pg-rep { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.4fr); gap: 10px; align-items: start; margin-top: 10px; }
.pg-when, .pg-sres { padding: 12px 14px; background: var(--pcs); border-color: var(--pcl); }
.pg-when h3, .pg-sres h3 { margin: 0 0 4px; font-size: 15px; color: var(--pc); display: flex; align-items: center; gap: 8px; }
.pg-dot { width: 12px; height: 12px; border-radius: 50%; background: var(--pc); flex: none; }
.pg-when p, .pg-sres p { margin: 0; font-size: 13px; color: var(--ink2); }
.pg-strong { margin-top: 6px !important; font-weight: 700; color: var(--pc) !important; }
.pg-bubble { padding: 12px 14px; }
.pg-bubble ol { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.pg-bubble li { font-size: 13.5px; color: var(--ink); background: var(--line2); border-radius: 4px 12px 12px 12px; padding: 8px 12px; }
.pg-bubble li small { display: block; font-size: 11px; font-weight: 700; color: var(--muted); }
.pg-signs { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 10px; align-items: start; }
.pg-slist { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.pg-slist label { display: flex; gap: 9px; align-items: flex-start; font-size: 13.5px; cursor: pointer; background: var(--paper); border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px; }
.pg-slist input { flex: none; width: 17px; height: 17px; margin: 1px 0 0; accent-color: #b45309; cursor: pointer; }
.pg-slist small { margin-left: 6px; font: 700 10.5px var(--latin); color: #1d4ed8; background: #eff6ff; border-radius: 5px; padding: 0 6px; }
.pg-sres { position: sticky; top: 12px; }
.pg-f input:focus-visible, .pg-slist input:focus-visible { outline: 3px solid #2563eb; outline-offset: 2px; }
@media (max-width: 1100px) {
  .pg-evm, .pg-burn, .pg-rep, .pg-signs { grid-template-columns: minmax(0, 1fr); }
  .pg-sres { position: static; }
}
@media (max-width: 760px) {
  .pg-outs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}