/* People Markets 1.4. Requires the approved People Markets palette tokens.
   Selection mark CSS expects the native-input + decorative-sibling markup
   documented in the HTML; native inputs remain usable without enhancement. */
/* 1.3 — native scrolling, a 4px visible line in a 6px lane. */
:root{--scroll-lane:6px;--scroll-thumb:#858A95;--scroll-thumb-hover:#60646F;--selection-size:16px;--selection-radius:3px;--selection-gap:10px;--icon-sm:16px;--icon-md:20px;--icon-lg:24px;--icon-stroke:2}
[data-theme=dark]{--scroll-thumb:#7E8999;--scroll-thumb-hover:#ABB5C4}
html{scrollbar-gutter:stable}
*{scrollbar-width:thin;scrollbar-color:var(--scroll-thumb) transparent}
/* A non-auto standards value overrides WebKit parts in current Blink. Reset it
   only where those parts are supported, so arrow buttons can be removed. */
@supports selector(::-webkit-scrollbar){
 *{scrollbar-width:auto;scrollbar-color:auto}
 ::-webkit-scrollbar{width:var(--scroll-lane);height:var(--scroll-lane);background:transparent}
 ::-webkit-scrollbar-track,::-webkit-scrollbar-track-piece,::-webkit-scrollbar-corner{background:transparent;border:0}
 ::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border:1px solid transparent;background-clip:padding-box;border-radius:999px;min-height:32px;min-width:32px}
 ::-webkit-scrollbar-thumb:hover{background-color:var(--scroll-thumb-hover)}
 ::-webkit-scrollbar-button,::-webkit-scrollbar-button:single-button,::-webkit-scrollbar-button:double-button,::-webkit-scrollbar-button:start:decrement,::-webkit-scrollbar-button:end:increment{display:none;width:0;height:0;min-width:0;min-height:0;border:0;background:none}
}
:root[data-scrollbars=system] *,:root[data-scrollbars=system]{scrollbar-width:auto!important;scrollbar-color:auto!important}
:root[data-scrollbars=system] ::-webkit-scrollbar,:root[data-scrollbars=system] ::-webkit-scrollbar-track,:root[data-scrollbars=system] ::-webkit-scrollbar-track-piece,:root[data-scrollbars=system] ::-webkit-scrollbar-corner,:root[data-scrollbars=system] ::-webkit-scrollbar-thumb,:root[data-scrollbars=system] ::-webkit-scrollbar-thumb:hover,:root[data-scrollbars=system] ::-webkit-scrollbar-button{all:revert!important}
@media(forced-colors:active){
 *,html{scrollbar-width:auto!important;scrollbar-color:auto!important}
 ::-webkit-scrollbar,::-webkit-scrollbar-track,::-webkit-scrollbar-track-piece,::-webkit-scrollbar-corner,::-webkit-scrollbar-thumb,::-webkit-scrollbar-thumb:hover,::-webkit-scrollbar-button{all:revert!important}
}
/* A native input owns the value. The small adjacent SVG owns its appearance.
   The input's label supplies a 44px target without enlarging the visual mark. */
input[type=checkbox]:not(.pm-switch),input[type=radio]{appearance:auto;-webkit-appearance:auto;width:16px!important;height:16px!important;min-height:16px!important;flex:0 0 16px;margin:0;padding:0!important;accent-color:var(--action)}
input[type=checkbox]:not(.pm-switch)::before,input[type=radio]::before{content:none!important;display:none!important}
.pm-selection{position:relative;display:inline-flex;flex:0 0 var(--selection-size);width:var(--selection-size);height:var(--selection-size);align-items:center;justify-content:center;vertical-align:middle;isolation:isolate}
.pm-selection input[type=checkbox],.pm-selection input[type=radio]{position:absolute;inset:0;width:100%!important;height:100%!important;min-height:0!important;padding:0!important;margin:0!important;opacity:0;z-index:2;cursor:pointer}
.pm-selection-mark{width:100%;height:100%;border:1.5px solid var(--control);border-radius:var(--selection-radius);background:var(--surface);display:grid;place-items:center;color:var(--on-action);pointer-events:none}
.pm-selection .pm-tick{width:14px;height:14px;max-width:none;stroke-width:2.5;display:none}
.pm-selection .pm-mixed{display:none;width:8px;height:1.5px;border-radius:1px;background:currentColor}
.pm-selection input:checked+.pm-selection-mark,.pm-selection input:indeterminate+.pm-selection-mark{background:var(--action);border-color:var(--action)}
.pm-selection input:checked:not(:indeterminate)+.pm-selection-mark .pm-tick{display:block}
.pm-selection input:indeterminate+.pm-selection-mark .pm-mixed{display:block}
.pm-selection input[type=radio]+.pm-selection-mark{border-radius:50%;background:var(--surface)}
.pm-selection input[type=radio]:checked+.pm-selection-mark{border-color:var(--action)}
.pm-selection input[type=radio]:checked+.pm-selection-mark::after{content:'';display:block;width:6px;height:6px;background:var(--action);border-radius:50%}
.pm-selection input:focus-visible+.pm-selection-mark{outline:2px solid var(--action);outline-offset:3px}
.pm-selection input[aria-invalid=true]+.pm-selection-mark{border-color:var(--loss)}
.pm-selection input:disabled{cursor:not-allowed}
.pm-selection input:disabled+.pm-selection-mark{background:var(--surface-alt);border-color:var(--control);color:var(--muted);opacity:.6}
.pm-selection input[type=radio]:checked:disabled+.pm-selection-mark::after{background:var(--muted)}
.pm-choice{gap:var(--selection-gap);font-size:14px;min-height:44px;padding:8px 0}
.pm-choice-card{padding:12px 14px;gap:10px}
.pm-choice-card .pm-selection{margin-top:3px}
.pm-choice-card input{margin:0}
.pm-choice-card strong{font-size:14px}
.pm-choice-card small{font-size:13px;margin-top:3px;line-height:1.55}
.pm-choice-card:has(:focus-visible) .pm-selection-mark{outline:none}
.check-label{gap:10px;min-height:44px}
.pm-choice-grid{gap:10px}
/* Selection is a tick. Expansion is a chevron. They never share a path. */
.pm-option[data-committed]::after{content:none!important;display:none!important}
.pm-option .pm-option-check{position:absolute;right:10px;top:50%;margin-top:-8px;width:16px;height:16px;display:none}
.pm-option[data-committed] .pm-option-check{display:block}
.pm-option[data-active]{border-color:transparent;background:var(--action-soft);color:var(--ink);box-shadow:none}
.pm-option[data-committed] .pm-option-check{color:var(--action)}
.pm-option[aria-disabled=true] .pm-option-check{display:none}
input.pm-switch{width:34px!important;height:20px!important;min-height:20px!important;flex:0 0 34px;border-radius:999px;appearance:none;background:var(--surface-alt);position:relative;padding:0!important;margin:0}
input.pm-switch::before,input.pm-switch:checked::before{content:'';width:12px;height:12px;left:3px;top:2.5px;border:0;position:absolute;border-radius:50%;background:var(--muted);transform:none}
input.pm-switch:checked{background:var(--action);border-color:var(--action)}
input.pm-switch:checked::before{left:17px;background:var(--on-action)}
@media(forced-colors:active){
 .pm-selection input[type=checkbox],.pm-selection input[type=radio]{opacity:1;appearance:auto;-webkit-appearance:auto}
 .pm-selection-mark{visibility:hidden}
 .pm-selection input:focus-visible{outline:2px solid Highlight;outline-offset:3px}
 input.pm-switch{appearance:auto!important;-webkit-appearance:auto!important;width:16px!important;height:16px!important;flex-basis:16px}
 input.pm-switch::before{display:none!important}
 .pm-option[data-committed] .pm-option-check{color:CanvasText}
 .pm-option[data-active]{outline:2px solid Highlight;box-shadow:none}
}

/* 1.4 — card-first records at tablet widths and below (<= 1024 CSS px).
   Keep table semantics and every value; do not conceal page overflow.
   .pm-cell-label is real, decorative text duplicating a semantic column header.
   The optional responsive helper creates these wrappers for simple tables. */
.pm-cell-label{display:none}
.pm-cell-value{display:contents}
.pm-only-small{display:none}
@media screen and (max-width:1024px){
 .pm-only-small{display:inline}
 .pm-only-large{display:none}
 .table-wrap:has(>.pm-data-table){overflow:visible;border:0;border-radius:0;background:transparent}
 .pm-scroll-box:has(>.pm-data-table){overflow:auto;background:transparent}
 .pm-data-table{display:block;width:100%;min-width:0!important;max-width:100%;border-collapse:separate;background:transparent}
 .pm-data-table caption{display:block;text-align:left;padding:0 0 12px;white-space:normal;overflow-wrap:anywhere}
 .pm-scroll-box>.pm-data-table caption{padding:12px}
 .pm-data-table thead{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
 .pm-data-table thead:has(button){position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto;white-space:normal;display:block;padding:0 0 12px}
 .pm-data-table thead:has(button) tr{display:flex;flex-wrap:wrap;gap:8px 16px}
 .pm-data-table thead:has(button) th{width:auto!important;max-width:100%;padding:0;border:0;background:transparent;text-align:left;position:static;box-shadow:none}
 .pm-data-table thead:has(button) th:not(:has(button)){position:absolute;width:1px!important;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
 .pm-data-table thead button{white-space:normal;min-height:44px}
 .pm-data-table tbody{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:12px}
 .pm-scroll-box>.pm-data-table tbody{padding:0 8px 8px}
 .pm-data-table tbody tr{display:block;min-width:0;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
 .pm-data-table tbody tr>td,.pm-data-table tbody tr>th{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);align-items:start;gap:12px;min-width:0;width:auto!important;padding:12px 14px;border:0;border-bottom:1px solid var(--line);text-align:left;position:static;box-shadow:none;background:transparent;white-space:normal}
 .pm-data-table tbody tr>:last-child{border-bottom:0}
 .pm-data-table .pm-cell-label{display:block;min-width:0;font:500 12px/1.5 var(--font-ui);letter-spacing:normal;color:var(--muted);text-align:left;white-space:normal;overflow-wrap:anywhere}
 .pm-data-table .pm-cell-value{display:block;min-width:0;max-width:100%;overflow-wrap:anywhere;white-space:normal}
 .pm-data-table code{white-space:normal;overflow-wrap:anywhere}
 .pm-data-table.app-table th:first-child,.pm-data-table.app-table td:first-child{position:static;left:auto;box-shadow:none;background:transparent}
 .pm-data-table.app-table .person-link{min-width:0;align-items:flex-start;gap:10px}
 .pm-data-table.app-table tbody tr>td:first-child{grid-template-columns:1fr}
 .pm-data-table.app-table td:first-child .pm-cell-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
 .pm-data-table.app-table .avatar{flex:0 0 40px}
}
