/* Data-family tools (P2). Loaded after webtools-popular.css. */
.p2d-err { margin: 0.75rem 0 0; color: var(--bad, #b42318); font-weight: 600; }
.p2d-empty { margin: 0.5rem 0; color: var(--text-2); }
.p2d-hint { font-weight: 400; color: var(--text-3); }
.p2d-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0.75rem; align-items: start; }
.p2d-split > * { min-width: 0; }
.tool textarea { min-height: 9rem; }
.p2d-table-wrap { max-width: 100%; max-height: 28rem; overflow: auto; border: 1px solid var(--border); border-radius: var(--radius-sm); }
.p2d-table { width: max-content; min-width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.p2d-table th, .p2d-table td { border-bottom: 1px solid var(--border); padding: 0; text-align: left; vertical-align: middle; }
.p2d-table th { position: sticky; top: 0; background: var(--bg-2, var(--bg)); z-index: 1; }
.p2d-table th button { display: block; width: 100%; min-height: 44px; padding: 0.4rem 0.55rem; border: 0; background: transparent; color: inherit; font: inherit; font-weight: 600; text-align: left; cursor: pointer; }
.p2d-table input[type=text] { width: 9rem; max-width: 16rem; min-height: 44px; margin: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.p2d-table td .btn { margin: 0.25rem; min-height: 36px; }
.p2d-page { display: flex; flex-wrap: wrap; gap: 0.4rem; align-items: center; margin: 0.5rem 0 0; color: var(--text-2); font-size: 0.85rem; }
.p2d-files { list-style: none; margin: 0.75rem 0 0; padding: 0; }
.p2d-files li { display: flex; flex-wrap: wrap; gap: 0.35rem 0.75rem; align-items: center; padding: 0.45rem 0; border-bottom: 1px solid var(--border); }
.p2d-files li span:first-child { flex: 1 1 12rem; min-width: 0; overflow-wrap: anywhere; }
.p2d-size { color: var(--text-2); font-variant-numeric: tabular-nums; }
.p2d-md { min-height: 9rem; padding: 0.7rem 0.8rem; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--bg); overflow: auto; }
.p2d-md > :first-child { margin-top: 0; }
.p2d-md > :last-child { margin-bottom: 0; }
.p2d-md pre { overflow: auto; padding: 0.6rem; background: var(--bg-2, var(--bg)); border-radius: var(--radius-sm); }
.p2d-md code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.85em; }
.p2d-md img, .p2d-md svg, .p2d-md table { max-width: 100%; }
.p2d-md table { border-collapse: collapse; }
.p2d-md th, .p2d-md td { border: 1px solid var(--border); padding: 0.3rem 0.5rem; }
.p2d-label { margin: 0 0 0.35rem; font-weight: 600; }
.p2d-bc { max-width: 100%; overflow: auto; background: #fff; border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 0.5rem; }
.p2d-bc svg { display: block; width: 100%; height: auto; max-height: 12rem; }
.p2d-meter { height: 12px; margin: 0.75rem 0; border: 1px solid var(--border); border-radius: var(--radius-pill, 99px); background: var(--bg); overflow: hidden; }
.p2d-meter > span { display: block; height: 100%; width: 0; background: var(--text-3); }
.p2d-meter[data-score="0"] > span { width: 15%; background: var(--bad, #b42318); }
.p2d-meter[data-score="1"] > span { width: 35%; background: var(--bad, #b42318); }
.p2d-meter[data-score="2"] > span { width: 55%; background: var(--star, #b54708); }
.p2d-meter[data-score="3"] > span { width: 78%; background: var(--ok, #067647); }
.p2d-meter[data-score="4"] > span { width: 100%; background: var(--ok, #067647); }
.p2d-tips { margin: 0.5rem 0 0; padding-left: 1.1rem; }
.p2d-map { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 0.6rem; }
@media (max-width: 720px) {
  .p2d-split { grid-template-columns: minmax(0, 1fr); }
  .p2d-table input[type=text] { width: 7.5rem; }
}