/* v16.41 Reports (mockups reports 01–05): catalogue, KPI strips, tables, bars, charts. Logical properties only. */
.rp { display: flex; flex-direction: column; gap: 14px; min-inline-size: 0; }
.rp [hidden] { display: none !important; }
.rp-bc a { color: inherit; }
.rp-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.rp-head h2 { margin: 0; font-size: 22px; }
.rp-head .sub { color: var(--color-text-muted); font-size: 13px; max-inline-size: 70ch; }
.rp-head .sp, .rp-bar2 .sp { flex: 1; }
.rp-search { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--color-border-control); border-radius: 10px; padding-inline: 10px; background: var(--color-surface); }
#rp .rp-search input { border: 0 !important; box-shadow: none !important; outline: 0; inline-size: 200px; min-block-size: 36px; block-size: 36px; padding-inline: 0; }
.rp-home { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 16px; align-items: start; }
.rp-cat { display: flex; flex-direction: column; gap: 18px; }
.rp-cat h3 { margin: 0 0 8px; font-size: 16px; display: flex; align-items: center; gap: 6px; }
.rp-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
.rp-card { position: relative; border: 1px solid var(--color-border); border-radius: 14px; background: var(--color-surface); padding: 14px; display: flex; flex-direction: column; gap: 6px; }
.rp-card a { color: var(--color-text); text-decoration: none; }
.rp-card a::after { content: ""; position: absolute; inset: 0; border-radius: 14px; }
.rp-card:hover { border-color: var(--color-brand); }
.rp-card:focus-within { outline: var(--focus-outline, 2px solid var(--color-focus)); }
.rp-card b { font-size: 15px; padding-inline-end: 26px; }
.rp-card p { margin: 0; font-size: 13px; color: var(--color-text-secondary); }
.rp-card .ft { margin-block-start: auto; min-block-size: 22px; }
.rp-card.next { border-style: dashed; background: transparent; color: var(--color-text-muted); }
.rp-card.next:hover { border-color: var(--color-border); }
.rp-star { all: unset; cursor: pointer; position: absolute; inset-block-start: 10px; inset-inline-end: 10px; z-index: 1; font-size: 18px; color: var(--color-text-muted); line-height: 1; }
.rp-star.on { color: #c77a12; }
.rp-star.big { position: static; font-size: 14px; padding: 6px 10px; border: 1px solid var(--color-border); border-radius: 999px; }
.rp-star:focus-visible { outline: var(--focus-outline, 2px solid var(--color-focus)); }
.rp-side { display: flex; flex-direction: column; gap: 12px; }
.rp-box { border: 1px solid var(--color-border); border-radius: 14px; background: var(--color-surface); padding: 12px 14px; display: flex; flex-direction: column; gap: 6px; }
.rp-box h4 { margin: 0 0 4px; font-size: 15px; display: flex; gap: 6px; align-items: center; }
.rp-box a { display: flex; justify-content: space-between; gap: 8px; padding-block: 6px; border-block-end: 1px solid var(--color-border); color: var(--color-text); text-decoration: none; font-weight: 600; font-size: 14px; }
.rp-dl { display: grid; grid-template-columns: auto 1fr; gap: 6px 10px; margin: 0; font-size: 13px; }
.rp-dl dt { font-weight: 600; } .rp-dl dd { margin: 0; color: var(--color-text-secondary); }
.rp-chip { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 600; padding: 3px 8px; border-radius: 999px; background: var(--color-surface-sunken); white-space: nowrap; }
.rp-chip.ok { background: var(--color-ok-bg); color: var(--color-ok-fg); }
.rp-chip.warn { background: var(--color-warn-bg); color: var(--color-warn-on); }
.rp-chip.bad { background: var(--color-bad-bg); color: var(--color-bad-fg); }
.rp-chip.v { background: var(--color-violet-bg); color: var(--color-violet-fg); }
.rp-bar2 { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 10px 14px; }
#rp .rp-bar2 input[type=date], #rp .rp-bar2 select, #modal .rp-bar2 input[type=date] { inline-size: auto; min-block-size: 36px; block-size: 36px; padding-block: 0; font-size: 14px; }
.rp-tog { display: inline-flex; align-items: center; gap: 6px; min-block-size: 36px; padding-inline: 10px; border: 1px solid var(--color-border-control); border-radius: 10px; background: var(--color-surface); color: var(--color-text); font: inherit; font-size: 14px; cursor: pointer; }
.rp-tog.on { border-color: var(--color-brand); background: var(--color-brand-soft, var(--color-blue-50)); color: var(--color-brand-text); font-weight: 600; }
.rp-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px; }
.rp-kpi { display: flex; flex-direction: column; gap: 3px; padding: 12px 14px; border: 1px solid var(--color-border); border-radius: 12px; background: var(--color-surface); min-inline-size: 0; text-align: start; font: inherit; color: var(--color-text); }
.rp-kpi .l { font-size: 13px; color: var(--color-text-secondary); display: flex; gap: 6px; align-items: center; }
.rp-kpi b { font-size: 24px; font-variant-numeric: tabular-nums; }
.rp-kpi .s { font-size: 12px; color: var(--color-text-muted); }
.rp-kpi.warn { border-color: var(--color-warn-fg); background: var(--color-warn-bg); }
.rp-kpi.bad { border-color: var(--color-bad-fg); background: var(--color-bad-bg); }
.rp-kpi.bad b { color: var(--color-bad-fg); }
.rp-kpi.hl { border-color: #c77a12; background: var(--color-warn-bg); }
.rp-kpi.okk b { color: var(--color-ok-fg); }
.rp-kpi.btn-k { cursor: pointer; }
.rp-kpi.btn-k.sel { outline: 2px solid var(--color-brand); }
.rp-d { font-weight: 600; } .rp-d.up { color: var(--color-ok-fg); } .rp-d.down { color: var(--color-bad-fg); }
.rp-card2 { border: 1px solid var(--color-border); border-radius: 14px; background: var(--color-surface); min-inline-size: 0; overflow: hidden; }
.rp-pad { padding: 10px 14px; }
.rp-tw { overflow-x: auto; }
.rp-t { inline-size: 100%; border-collapse: collapse; font-size: 14px; }
.rp-t th { text-align: start; font-size: 12.5px; font-weight: 600; color: var(--color-text-secondary); padding: 10px 12px; border-block-end: 1px solid var(--color-border); background: var(--color-surface-sunken); white-space: nowrap; }
.rp-t td { padding: 10px 12px; border-block-end: 1px solid var(--color-border); vertical-align: middle; }
.rp-t .n { text-align: end; font-variant-numeric: tabular-nums; }
.rp-t tfoot th { background: var(--color-surface-sunken); color: var(--color-text); font-size: 14px; }
.rp-t tr.warn > td { background: color-mix(in srgb, var(--color-warn-bg) 70%, transparent); }
.rp-t tr.bad > td { background: color-mix(in srgb, var(--color-bad-bg) 70%, transparent); }
.rp-t tr.off > td { opacity: .55; text-decoration: line-through; }
.rp-acts { display: flex; gap: 4px; flex-wrap: wrap; justify-content: flex-end; }
.rp-st { display: inline-flex; padding: 3px 9px; border-radius: 999px; font-size: 12.5px; font-weight: 600; background: var(--color-surface-sunken); white-space: nowrap; }
.rp-st.ok { background: var(--color-ok-bg); color: var(--color-ok-fg); } .rp-st.warn { background: var(--color-warn-bg); color: var(--color-warn-on); }
.rp-st.bad { background: var(--color-bad-bg); color: var(--color-bad-fg); } .rp-st.info { background: var(--color-info-bg, var(--color-blue-50)); color: var(--color-info-fg, var(--color-brand-text)); }
.rp-bad { color: var(--color-bad-fg); } .rp-warn { color: var(--color-warn-fg); } .rp-ok { color: var(--color-ok-fg); }
.rp-two { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-block-end: 10px; }
.rp-opt { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border: 1.5px solid var(--color-border); border-radius: 12px; margin-block-end: 8px; cursor: pointer; }
.rp-opt:has(input:checked) { border-color: var(--color-brand); background: var(--color-brand-soft, var(--color-blue-50)); }
.rp-opt > span { display: flex; flex-direction: column; }
.rp-row { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 12px; align-items: start; }
.rp-chart { inline-size: 100%; block-size: auto; color: var(--color-text); }
.rp-g4 { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; align-items: start; }
.rp-bar { margin-block-end: 9px; }
.rp-bar .t { display: flex; gap: 8px; font-size: 13.5px; margin-block-end: 3px; }
.rp-bar .t span:first-child { flex: 1; font-weight: 600; min-inline-size: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rp-bar .t .muted { inline-size: 40px; text-align: end; }
.rp-bar i { display: block; block-size: 7px; border-radius: 99px; background: var(--color-brand); }
.rp-h4 { margin: 14px 0 8px; font-size: 14px; }
.rp-stack { display: flex; block-size: 14px; border-radius: 99px; overflow: hidden; background: var(--color-surface-sunken); }
.rp-stack i.not_due { background: var(--color-gray-300, #cbd5e1); } .rp-stack i.b0_7 { background: var(--color-brand); } .rp-stack i.b8_30 { background: var(--color-warn-fg); } .rp-stack i.b30 { background: var(--color-bad-fg); }
.rp-wa { border: 1px solid var(--color-ok-fg); background: var(--color-ok-bg); border-radius: 12px; padding: 10px 12px; margin-block: 10px; }
.rp-wa p { margin: 4px 0 0; font-size: 14px; }
@media (max-width: 1100px) { .rp-home, .rp-row { grid-template-columns: 1fr; } }
.rp-mlist { display: none; }
@media (max-width: 640px) {
  .rp-card2:has(> .rp-tw > .rp-t.rp-cash) { display: none; }
  .rp-mlist { display: flex; flex-direction: column; gap: 10px; }
  .rp-mc { border: 1px solid var(--color-border); border-radius: 12px; background: var(--color-surface); padding: 12px; display: flex; flex-direction: column; gap: 6px; }
  .rp-mc.warn { border-color: var(--color-warn-fg); } .rp-mc.bad { border-color: var(--color-bad-fg); }
  .rp-mc .h { display: flex; justify-content: space-between; gap: 8px; align-items: center; }
  .rp-mc .big b { font-size: 20px; }
  .rp-mc .rp-acts { justify-content: flex-start; }
  .rp-kpis { grid-template-columns: 1fr 1fr; } .rp-kpi b { font-size: 19px; }
  .rp-two { grid-template-columns: 1fr; }
  #rp .rp-search input { inline-size: 140px; }
}
/* part 2 + 3 */
.rp-tabs { padding-inline: 0; margin: 0; }
.rp-coh td { font-size: 12.5px; padding: 6px 8px; }
.rp-mx th, .rp-mx td { text-align: center; padding: 6px 8px; font-size: 13px; }
.rp-mx th[scope=row] { text-align: start; background: var(--color-surface-sunken); }
.rp-mx td.diag { background: var(--color-surface-sunken); }
.rp-mx td.up { background: color-mix(in srgb, var(--color-ok-fg) calc(var(--a) * 45%), transparent); }
.rp-mx td.down { background: color-mix(in srgb, var(--color-bad-fg) calc(var(--a) * 45%), transparent); }
.rp-scroll { max-block-size: 520px; overflow: auto; }
.rp-ubar { block-size: 5px; border-radius: 99px; background: var(--color-surface-sunken); margin-block-start: 4px; overflow: hidden; }
.rp-ubar i { display: block; block-size: 100%; background: var(--color-bad-fg); }
.rp-what { margin-block-start: 12px; display: flex; flex-direction: column; gap: 6px; }
.rp-what input[type=range] { inline-size: 100%; accent-color: var(--color-brand); }
.rp-what > .small { display: flex; justify-content: space-between; }
.rp-say { padding: 8px 10px; border-radius: 10px; background: var(--color-info-bg, var(--color-blue-50)); font-size: 13px; }
.rp-vlist { display: flex; flex-direction: column; gap: 4px; }
.rp-v { display: flex; align-items: center; gap: 8px; border-block-end: 1px solid var(--color-border); }
.rp-v a { flex: 1; display: flex; flex-direction: column; padding-block: 6px; color: var(--color-text); text-decoration: none; }
.rp-sch { display: flex; gap: 8px; align-items: flex-start; justify-content: space-between; padding-block: 6px; border-block-end: 1px solid var(--color-border); }
.rp-sch > div:first-child { display: flex; flex-direction: column; gap: 3px; min-inline-size: 0; }
.rp .grow { min-inline-size: 0; }
@media print {
  .fn-sidebar, .fn-topbar, .fn-bottombar, .rp-noprint, .rp-star, #rpcsv, .rp-acts, .rp-bar2 button, .rp-search { display: none !important; }
  .rp-card2, .rp-kpi { break-inside: avoid; }
  .rp-row, .rp-home { grid-template-columns: 1fr !important; }
  body { background: #fff !important; }
}
#rp .rp-head select { inline-size: auto; min-block-size: 36px; block-size: 36px; padding-block: 0; font-size: 14px; }
