/* PV2: ukuran dan tata letak mengikuti contoh Pohon Portal yang disetujui. */
.pp-page{display:flex;flex-direction:column;gap:12px;min-width:0;font-variant-numeric:tabular-nums}
.pp-page :is(.table-wrap,.pp-map){scrollbar-width:thin;scrollbar-color:var(--ui-pohon-belum) var(--ui-panel)}
.pp-page ::-webkit-scrollbar{width:6px;height:6px}
.pp-page ::-webkit-scrollbar-thumb{background:var(--ui-pohon-belum);border-radius:6px}
.pp-page ::-webkit-scrollbar-thumb:hover{background:var(--ui-scroll-thumb-hover)}
.pp-page ::-webkit-scrollbar-track{background:var(--ui-panel)}
.pp-page ::-webkit-scrollbar-button{display:none}
.pp-page [hidden]{display:none!important}
.pp-head{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;justify-content:space-between}
.pp-page .pp-head h1{font-size:22px;font-weight:650;line-height:1.3;margin:0;letter-spacing:-.01em}
.pp-pills{display:flex;flex-wrap:wrap;gap:6px 8px;align-items:center}
.pp-wait-summary{display:inline-flex;flex-wrap:wrap;gap:6px 8px;align-items:center;max-width:100%}
.pp-wait-link{font-size:13px;font-weight:500;color:var(--ui-text);max-width:100%;overflow-wrap:anywhere}
.pp-page .pp-pill{display:inline-flex;align-items:center;min-height:24px;padding:0 9px;border-radius:99px;font-size:12px;font-weight:600;white-space:nowrap;border:1px solid var(--ui-line);background:var(--ui-panel)}
.pp-page .pp-pill-warn{background:var(--ui-warn-bg);color:var(--ui-warn);border-color:var(--ui-warn-line)}
.pp-page .pp-pill-danger{background:var(--ui-danger-bg);color:var(--ui-danger);border-color:var(--ui-danger-line)}
.pp-page .pp-pill-muted{background:var(--ui-hover);color:var(--ui-muted-text);border-color:var(--ui-line)}
.pp-tabs{display:flex;gap:4px;border-bottom:1px solid var(--ui-line)}
.pp-page .pp-tab{border:0;background:none;cursor:pointer;padding:0 14px;min-height:42px;font-size:14px;font-weight:500;color:var(--ui-muted-text);border-bottom:2px solid transparent;border-radius:0;margin-bottom:-1px}
.pp-page .pp-tab[aria-selected=true]{color:var(--ui-text);font-weight:600;border-bottom-color:var(--ui-text)}
.pp-tree,.pp-list{display:flex;flex-direction:column;gap:12px}
.pp-panel{background:var(--ui-panel);border:1px solid var(--ui-line);border-radius:10px;padding:14px 16px;min-width:0}
.pp-page .pp-panel h2{margin:0;font-size:15px;font-weight:700;line-height:1.45}
.pp-legend{display:flex;flex-wrap:wrap;gap:6px 16px;margin:12px 0 4px;font-size:12px;color:var(--ui-muted-text)}
.pp-legend>span{display:inline-flex;align-items:center;gap:6px}
.pp-swatch{width:12px;height:12px;border-radius:3px;display:inline-block;flex:none!important}
.pp-map{margin-top:10px;border:1px solid var(--ui-line);border-radius:10px;padding:6px 0}
.pp-page .pp-map-row{display:grid;grid-template-columns:270px 1fr 92px;gap:14px;align-items:center;padding:7px 14px;width:100%;background:none;border:0;border-radius:0;min-height:0;color:var(--ui-text);text-align:left}
.pp-page .pp-map-row:hover{background:var(--ui-table-head)}
.pp-map-row.pp-total{border-bottom:1px dashed var(--ui-line);margin-bottom:4px;padding-bottom:10px}
.pp-map-name{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.pp-map-name b{display:inline-block;min-width:36px;color:var(--ui-muted-text);font-weight:600}
.pp-completion{font-size:12px;color:var(--ui-muted-text);text-align:right;white-space:nowrap;font-weight:400}
.pp-completion b{color:var(--ui-text);font-size:13px;font-weight:700}
.pp-segments{display:flex;gap:2px;height:20px;min-width:0}
.pp-seg{flex:1 1 0;min-width:0;border-radius:3px}
.pp-total .pp-segments{height:12px;gap:0;border-radius:4px;overflow:hidden}
.pp-total .pp-seg{border-radius:0}
.pp-selesai{background:var(--ui-ok)}.pp-kerjakan{background:var(--ui-info)}.pp-rancang,.pp-bahas{background:var(--ui-pohon-rancang)}
.pp-belum{background:var(--ui-pohon-belum)}.pp-batal{background:var(--ui-pohon-batal)}.pp-tunggu{background:var(--ui-danger)}
.pp-controls{display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center}
.pp-filters{display:flex;gap:6px;flex-wrap:wrap}
.pp-page .pp-filter{border:1px solid var(--ui-input-line);background:var(--ui-panel);color:var(--ui-text);border-radius:6px;min-height:34px;padding:0 12px;font-size:13px;font-weight:500;white-space:nowrap}
.pp-page .pp-filter[aria-pressed=true]{background:var(--ui-primary);border-color:var(--ui-primary);color:var(--ui-panel);font-weight:600}
.pp-filter-count{margin-left:6px;opacity:.7}
.pp-page .pp-search{flex:1;min-width:200px;width:auto;height:44px;border:1px solid var(--ui-input-line);border-radius:6px;padding:9px 11px;font-size:13px;font-weight:600;background:var(--ui-panel)}
.pp-branch{padding:0;scroll-margin-top:70px}
.pp-page .pp-branch-head{display:flex;align-items:center;gap:12px;width:100%;border:0;background:none;color:var(--ui-text);border-radius:10px;min-height:52px;padding:0 16px;text-align:left}
.pp-branch-title{font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.pp-branch-title b{color:var(--ui-muted-text);font-weight:600;margin-right:6px}
.pp-mini{display:flex;gap:1px;width:160px;height:8px;flex:none;border-radius:3px;overflow:hidden;margin-left:auto}
.pp-mini .pp-seg{border-radius:0}
.pp-branch-count{font-size:12px;color:var(--ui-muted-text);white-space:nowrap;width:110px;text-align:right;font-weight:400}
.pp-chevron{font-size:10px;color:var(--ui-muted-text);width:12px}
.pp-branch-body{border-top:1px solid var(--ui-line);padding:12px 16px 16px}
.pp-page .table-wrap{border:1px solid var(--ui-line);border-radius:10px;overflow:auto;max-height:min(60dvh,620px)}
.pp-page .pp-table{table-layout:fixed;width:100%;border-collapse:collapse}
.pp-col-no{width:52px}.pp-col-number{width:84px}.pp-col-status{width:132px}.pp-col-role{width:120px}.pp-col-date{width:140px}
.pp-page .pp-table th{font-size:11.5px;font-weight:500;text-transform:none;letter-spacing:normal;background:var(--ui-table-head);color:var(--ui-table-head-text);padding:8px 14px;border-bottom:1px solid var(--ui-line)}
.pp-page .pp-table td{font-size:13px;padding:6px 14px;line-height:1.35;border-bottom:1px solid var(--ui-table-line);vertical-align:top;white-space:nowrap}
.pp-page .pp-table .ui-cell-wrap{white-space:nowrap;overflow-wrap:normal}
.pp-title{display:block;overflow:hidden;text-overflow:ellipsis}
.pp-cp{display:block;font-size:11px;color:var(--ui-muted-text);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.pp-status{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.pp-status:before{content:'';width:7px;height:7px;flex:none;border-radius:50%;background:currentColor}
.pp-status>span{color:var(--ui-text)}.pp-status-ok{color:var(--ui-ok)}.pp-status-info{color:var(--ui-info)}.pp-status-warn{color:var(--ui-warn)}.pp-status-muted{color:var(--ui-muted-text)}.pp-status-danger{color:var(--ui-danger)}
.pp-wait{display:block;width:fit-content;font-size:11px;padding:4px 7px;border-radius:4px;border:1px solid var(--ui-danger-line);color:var(--ui-danger);white-space:nowrap;margin-top:3px}
.pp-updated b{font-weight:600;display:block}.pp-updated small{font-size:11px;color:var(--ui-muted-text);display:block}.pp-updated small.pp-old{color:var(--ui-warn);font-weight:600}
.pp-page .pp-detail td{background:var(--ui-table-head);padding:10px 14px 14px;white-space:normal}
.pp-detail-grid{display:grid;grid-template-columns:150px 1fr;gap:6px 14px;font-size:13px;margin:0;white-space:normal}
.pp-detail-grid dt{color:var(--ui-muted-text)}.pp-detail-grid dd{margin:0;overflow-wrap:anywhere;white-space:pre-wrap}
.pp-history h2{margin-bottom:12px!important}.pp-history-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;font-size:13px}
.pp-pagination{display:flex;align-items:center;gap:10px}.pp-page .pp-pagination button{min-height:34px;width:34px;padding:0;border:1px solid var(--ui-line);background:var(--ui-panel);color:var(--ui-text)}
.pp-muted,.pp-empty{color:var(--ui-muted-text)}
.pp-notice{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 16px;border:1px solid var(--ui-warn-line);border-radius:6px;background:var(--ui-warn-bg);color:var(--ui-warn);font-size:13px}
/* PH2: semua penataan banyak akar dibatasi agar mode akar 1 tetap sama. */
.pp-multi .pp-group-title{font-size:13px;font-weight:600;color:var(--ui-muted-text);margin:4px 0 0;padding:0 14px}
.pp-multi .pp-map .pp-group-title{margin:10px 0 4px}
.pp-multi .pp-map-row{grid-template-columns:270px minmax(0,1fr) 120px}
.pp-multi .pp-branch-head{padding:10px 16px}
.pp-multi .pp-branch-title{flex:1;white-space:normal;overflow-wrap:anywhere}
.pp-multi .pp-branch-head>.pp-status{font-size:12px}
.pp-multi .pp-mini{width:120px}
.pp-multi .pp-branch-body{display:flex;flex-direction:column;gap:12px}
.pp-multi .pp-origin{display:block;font-size:11px;font-weight:400;color:var(--ui-muted-text);white-space:normal;overflow-wrap:anywhere}
@media(max-width:760px){
 .pp-page .pp-map-row{grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;padding:8px 12px}
 .pp-map-row .pp-segments{grid-column:1/-1;grid-row:2}
 .pp-page .pp-branch-head{flex-wrap:wrap;padding:10px 14px;gap:6px 10px}
 .pp-branch-title{flex:1 1 100%;white-space:normal}.pp-mini{margin-left:0;flex:1}
 .pp-page .table-wrap{border:0;max-height:none;overflow:visible}
 .pp-page .pp-table colgroup{display:none}.pp-page .pp-table{table-layout:auto}
 .pp-page .ui-kartu-urut{margin-bottom:8px}
 .ui-page-wide.pp-page .table-wrap .pp-table tbody tr.pp-node:not([hidden]):not(.hidden),.ui-page-wide.pp-page .table-wrap .pp-history-table tbody tr:not([hidden]):not(.hidden){display:block!important;width:100%;border:1px solid var(--ui-line)!important;border-radius:10px;padding:8px 52px 8px 12px!important;margin-bottom:8px;background:var(--ui-panel)}
 .ui-page-wide.pp-page .table-wrap .pp-table tbody td:not([hidden]):not(.hidden){padding:3px 0!important;width:100%!important;font-size:13px;color:var(--ui-text)}
 .ui-page-wide.pp-page .table-wrap .pp-table tbody td:first-child{display:none}
 .ui-page-wide.pp-page .table-wrap .pp-table tbody td:nth-child(2){font-size:13px}
 .pp-page .pp-table td[data-label]:not(.ui-open-cell):before{content:attr(data-label);display:inline-block;width:96px;color:var(--ui-muted-text);font-size:12px;font-weight:400}
 .pp-page .pp-table .ui-cell-wrap{white-space:normal}.pp-page .pp-title{display:inline;overflow:visible}.pp-cp{white-space:normal;overflow-wrap:anywhere}.pp-wait{white-space:normal}
 .pp-page .pp-updated{display:inline}.pp-page .pp-updated b,.pp-page .pp-updated small{display:inline;margin-right:6px}
 .ui-page-wide.pp-page .table-wrap .pp-table tbody tr.pp-detail:not([hidden]):not(.hidden){display:block!important;padding:0!important;border:1px solid var(--ui-line)!important;border-top:0!important;border-radius:0 0 10px 10px;margin:-8px 0 8px;background:var(--ui-table-head)}
 .ui-page-wide.pp-page .table-wrap .pp-table tbody tr.pp-detail td:not([hidden]):not(.hidden){display:block;padding:10px 14px 14px!important}
 .pp-page .pp-detail td:before{display:none!important}.pp-detail-grid{grid-template-columns:1fr}.pp-detail-grid dt{margin-top:6px}
 .ui-page-wide.pp-page .table-wrap .pp-table tbody td.ui-open-cell:not([hidden]):not(.hidden){width:34px!important;display:block;padding:0!important}
 .pp-page .pp-history-table tbody tr:not([hidden]):not(.hidden){padding-right:12px!important}
 .pp-history-footer{flex-wrap:wrap}
 .pp-multi .pp-map-row{grid-template-columns:minmax(0,1fr) auto}
 .pp-multi .pp-branch-head{display:grid;grid-template-columns:minmax(0,1fr) auto 12px;gap:8px;padding:10px 12px}
 .pp-multi .pp-branch-title{grid-column:1/-1}
 .pp-multi .pp-branch-head>.pp-status{grid-column:1;grid-row:2}
 .pp-multi .pp-branch-head>.pp-completion{grid-column:2;grid-row:2}
 .pp-multi .pp-chevron{grid-column:3;grid-row:2}
 .pp-multi .pp-mini{grid-column:1/-1;grid-row:3;width:100%;margin:0}
 .pp-multi .pp-branch-body{padding:8px}
}
