/* 週次 › レポート（2026-10-30 2段目・F3）。見本 mock-reports.html の部品。セレクタは #tab-reports の中に限る */
#tab-reports .rp { display: grid; grid-template-columns: 300px minmax(0, 1fr); min-height: calc(100vh - 140px); overflow: hidden; }
#tab-reports .rp-list { border-right: 1px solid var(--line); padding: 12px 0 24px; background: var(--card); min-width: 0; }
#tab-reports .rl-stale { margin: 0 16px 8px; padding: 6px 10px; font-size: 12px; color: var(--warn); background: var(--warn-bg); border-radius: var(--radius); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#tab-reports .rl-head { display: flex; align-items: center; gap: 8px; padding: 4px 16px 8px; }
#tab-reports .rl-sum { display: flex; gap: 12px; font-size: 12px; color: var(--muted); white-space: nowrap; }
#tab-reports .rl-sum span { display: inline-flex; align-items: center; gap: 5px; }
#tab-reports .dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; flex: 0 0 auto; background: var(--ok-dot); }
#tab-reports .d-ok { background: var(--ok-dot); }
#tab-reports .d-ng { background: var(--ng-dot); }
#tab-reports .rg { font-size: 11px; color: var(--muted); padding: 14px 16px 4px; }
#tab-reports .rtype { padding: 0 8px; }
#tab-reports .rt-row { width: 100%; display: flex; align-items: center; gap: 8px; height: 32px; padding: 0 8px; border: 0; background: none; border-radius: var(--radius); cursor: pointer; font: inherit; color: var(--text); text-align: left; }
#tab-reports .rt-row:hover { background: var(--sunken); }
#tab-reports .rt-name { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; flex: 1 1 auto; }
#tab-reports .rt-date { font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
#tab-reports .rt-late { display: none; font-size: 11px; font-weight: 600; color: var(--ng); background: var(--ng-bg); border-radius: var(--radius); padding: 0 6px; height: 18px; align-items: center; white-space: nowrap; }
#tab-reports .rt-sub { display: flex; gap: 10px; font-size: 12px; color: var(--muted); padding: 6px 8px 6px 24px; white-space: nowrap; }
#tab-reports .rt-sub .rt-due { color: var(--ng); }
#tab-reports .rt-none { font-size: 12px; color: var(--subtle); padding: 0 8px 10px 24px; }
#tab-reports .rtype.is-sel > .rt-row { background: var(--primary-glow); color: var(--primary); font-weight: 500; }
#tab-reports .rtype[data-state="stop"] .dot { background: var(--unk-dot); }
#tab-reports .rtype[data-state="stop"] .rt-name, #tab-reports .rtype[data-state="stop"] .rt-date { color: var(--subtle); }
#tab-reports .rtype[data-state="irr"] .dot { background: var(--card); box-shadow: inset 0 0 0 1.5px var(--unk-dot); }
#tab-reports .rtype[data-state="late"] .dot { background: var(--ng-dot); }
#tab-reports .rtype[data-state="late"] .rt-late { display: inline-flex; }
#tab-reports .rtype[data-state="late"] .rt-date { color: var(--ng); }
#tab-reports .dates { list-style: none; margin: 0 0 8px; padding: 0 0 0 24px; }
#tab-reports .dates a { display: flex; align-items: center; gap: 8px; height: 30px; padding: 0 8px; border-radius: var(--radius); font-size: 13px; color: var(--text); font-variant-numeric: tabular-nums; white-space: nowrap; text-decoration: none; }
#tab-reports .dates a span { font-size: 12px; color: var(--muted); }
#tab-reports .dates a:hover { background: var(--sunken); }
#tab-reports .dates a.is-cur { background: var(--sunken); font-weight: 600; }
#tab-reports .dates a.more { color: var(--primary); font-size: 12px; }

#tab-reports .rp-body { min-width: 0; display: flex; flex-direction: column; }
#tab-reports .rb-head { display: flex; align-items: center; gap: 16px; padding: var(--card-pad-y) var(--card-pad); border-bottom: 1px solid var(--line-soft); }
#tab-reports .rb-back { display: none; }
#tab-reports .rb-title { min-width: 0; }
#tab-reports .rb-kind { font-size: 12px; color: var(--muted); white-space: nowrap; }
#tab-reports .rb-title h2 { margin: 2px 0 0; font-size: 20px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
#tab-reports .rb-nav { margin-left: auto; display: flex; align-items: center; gap: 8px; white-space: nowrap; }
#tab-reports .pg { height: 28px; padding: 0 10px; font-size: 12px; border: 1px solid var(--line); background: var(--card); border-radius: var(--radius); color: var(--text); cursor: pointer; font-variant-numeric: tabular-nums; }
#tab-reports .pg[disabled] { color: var(--subtle); background: var(--sunken); cursor: default; }
#tab-reports .gh { font-size: 12px; margin-left: 8px; color: var(--primary); text-decoration: none; }
#tab-reports .gh:hover { text-decoration: underline; }
#tab-reports .rb-files { display: flex; align-items: center; gap: 6px; padding: 10px var(--card-pad); border-bottom: 1px solid var(--line-soft); overflow-x: auto; }
#tab-reports .rf-lbl { font-size: 12px; color: var(--muted); margin-right: 4px; white-space: nowrap; }
#tab-reports .chip { font-weight: 400; height: 26px; padding: 0 10px; font-size: 12px; border: 1px solid var(--line); background: var(--card); border-radius: var(--radius); color: var(--text); cursor: pointer; white-space: nowrap; flex: 0 0 auto; }
#tab-reports .chip.is-on { border-color: var(--primary); color: var(--primary); }
#tab-reports .rb-kpis { display: flex; align-items: center; gap: 28px; padding: 14px var(--card-pad); border-bottom: 1px solid var(--line-soft); }
#tab-reports .rb-kpis div { display: flex; flex-direction: column; }
#tab-reports .rb-kpis span { font-size: 11px; color: var(--muted); }
#tab-reports .rb-kpis b { font-size: 20px; font-variant-numeric: tabular-nums; }
#tab-reports .rb-kpis b.w { color: var(--warn); }
#tab-reports .rb-kpis b.n { color: var(--ng); }
#tab-reports .rb-kpis .btn-ai { margin-left: auto; }
#tab-reports .rb-msg, #tab-reports .rb-content > .empty-state { padding: var(--card-pad-y) var(--card-pad); }
#tab-reports .rb-msg .empty-state { align-items: flex-start; text-align: left; padding-left: 0; }
#tab-reports .rb-latest { margin: 0; font-size: 13px; }
#tab-reports .rb-latest a { color: var(--primary); }
#tab-reports .loading-line { padding: var(--card-pad-y) var(--card-pad); font-size: 13px; color: var(--muted); }
#tab-reports .rb-frame { padding: 16px var(--card-pad) var(--card-pad); }
#tab-reports .rb-frame iframe { display: block; width: 100%; height: 900px; border: 1px solid var(--line-soft); border-radius: var(--radius-lg); background: #fff; }

/* Markdown の本文 */
#tab-reports .rb-md { padding: 8px var(--card-pad) var(--card-pad); max-width: 1000px; }
#tab-reports .md-body { font-size: 13px; line-height: 1.75; max-width: 1000px; color: var(--text); }
#tab-reports .md-body .md-h1 { font-size: 20px; border-bottom: 0; padding-bottom: 0; }
#tab-reports .md-body .md-h2 { font-size: 15px; margin-top: 24px; }
#tab-reports .md-body .md-h3 { font-size: 14px; color: var(--text); }
#tab-reports .md-body .md-h4 { font-size: 13px; }
#tab-reports .md-body code { font-size: 12px; background: var(--sunken); color: var(--text); }
#tab-reports .md-body .md-code code { background: none; }
#tab-reports .md-body .md-hr { border-top: 1px solid var(--line-soft); }
#tab-reports .md-body .fm-key { background: var(--sunken); color: var(--muted); }
#tab-reports .md-body .md-table-wrap { border: 1px solid var(--line-soft); border-radius: var(--radius-lg); }
#tab-reports .md-body .md-table { font-size: 13px; }
#tab-reports .md-body .md-table th { font-size: 12px; background: var(--sunken); }
#tab-reports .md-body .md-table td, #tab-reports .md-body .md-table th { white-space: nowrap; max-width: 420px; overflow: hidden; text-overflow: ellipsis; }
#tab-reports .md-body .md-table tr:last-child td { border-bottom: 0; }

#tab-reports .md-table tr.info { display: none; }
#tab-reports .md-table.unfold tr.info { display: table-row; }
#tab-reports .md-table.unfold tr.fold-row { display: none; }
#tab-reports .fold { border: 0; background: none; color: var(--primary); font-size: 12px; cursor: pointer; padding: 0; }
#tab-reports .sv { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; }
#tab-reports .sv i { width: 6px; height: 6px; border-radius: 50%; }
#tab-reports .sv-ng { color: var(--ng); font-weight: 600; }
#tab-reports .sv-ng i { background: var(--ng-dot); }
#tab-reports .sv-warn { color: var(--warn); font-weight: 600; }
#tab-reports .sv-warn i { background: var(--warn-dot); }
#tab-reports .sv-unk { color: var(--muted); }
#tab-reports .sv-unk i { background: var(--unk-dot); }

/* 部長報告（JSON） */
#tab-reports .depts { padding: 8px 0 var(--card-pad); }
#tab-reports .dept { border-bottom: 1px solid var(--line-soft); }
#tab-reports .dept > summary { display: flex; align-items: center; gap: 16px; min-height: 46px; padding: 0 var(--card-pad); list-style: none; cursor: pointer; white-space: nowrap; }
#tab-reports .dept > summary::-webkit-details-marker { display: none; }
#tab-reports .dept > summary:hover { background: var(--sunken); }
#tab-reports .dn { font-size: 14px; font-weight: 600; min-width: 112px; }
#tab-reports .dc { font-size: 12px; color: var(--muted); }
#tab-reports .ds { margin-left: auto; display: flex; gap: 12px; font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; }
#tab-reports .ds b { color: var(--text); font-weight: 600; }
#tab-reports .dept-body { padding: 4px var(--card-pad) 16px; font-size: 13px; line-height: 1.75; }
#tab-reports .dept-body .dl { font-size: 11px; font-weight: 700; color: var(--muted); margin-top: 8px; }
#tab-reports .dept-body ul { margin: 2px 0 0 18px; padding: 0; }
#tab-reports .dept-body p { margin: 2px 0 0; }
#tab-reports .dept-body .none { color: var(--subtle); }

@media (max-width: 1100px) {
    #tab-reports .rp { grid-template-columns: 260px minmax(0, 1fr); }
    #tab-reports .rb-head { flex-wrap: wrap; row-gap: 8px; }
    #tab-reports .rb-title { min-width: auto; }
}
@media (max-width: 768px) {
    #tab-reports .rp { grid-template-columns: minmax(0, 1fr); min-height: 0; }
    #tab-reports .rp-list { border-right: 0; }
    #tab-reports .rp .rp-body { display: none; }
    #tab-reports .rp.show-body .rp-list { display: none; }
    #tab-reports .rp.show-body .rp-body { display: flex; }
    #tab-reports .rb-head { flex-wrap: wrap; gap: 8px 12px; }
    #tab-reports .rb-back { display: inline-flex; align-items: center; height: 28px; padding: 0; border: 0; background: none; color: var(--primary); font-size: 13px; width: 100%; cursor: pointer; }
    #tab-reports .rb-title { width: 100%; }
    #tab-reports .rb-nav { margin-left: 0; width: 100%; }
    #tab-reports .gh { margin-left: auto; }
    #tab-reports .rb-kpis { gap: 20px; }
    #tab-reports .ds { display: none; }
    #tab-reports .rb-frame { padding: 12px 0 0; }
    #tab-reports .rb-frame iframe { border-left: 0; border-right: 0; border-radius: 0; }
}