/* 보고서 › 보고서 (and its 고정한 보고서): a frozen report's body as proof-common.js draws it (.proof-report, .proof-section, .pr-*,
   a framework report's .pf-*) and the lists of fixed-reports.js. Reads the --ds-* tokens of style.css and writes only
   its own prefixes, and at the end the framework templates' form of proof-reports.js (.ft-*); the shared components
   (.ov-metric, .tag, .table-wrap, .inventory-note ...) and the cards the other Report screens share (.rp-card,
   .rp-table -- screens-operations.css) are not redrawn here. */

/* The report: its name the largest line in it, then whose it is, its period and its instant as named values. */
.proof-report h4{display:flex;flex-wrap:wrap;align-items:center;gap:var(--ds-space-2);margin:0;font-size:var(--ds-fs-xl);font-weight:700;letter-spacing:-.015em;overflow-wrap:anywhere}
.proof-report h4 small{color:var(--ds-text-2);font-size:var(--ds-fs-sm);font-weight:500;letter-spacing:0}
/* Laid as every detail page lays its facts (style.css .detail-facts, 8e339c2e): label over value under a hairline,
   columns where there is room and one on a phone. */
.pr-terms{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));column-gap:var(--ds-space-6);margin:0 0 var(--ds-space-3)}
.pr-terms>div{display:flex;flex-direction:column;gap:2px;min-width:0;padding:var(--ds-space-2) 0;border-top:1px solid var(--ds-line)}
.pr-terms dt{color:var(--ds-text-2);font-size:var(--ds-fs-sm);font-weight:500}
.pr-terms dd{min-width:0;margin:0;font-size:var(--ds-fs-md);overflow-wrap:anywhere}
.pr-terms dd :is(span,time){white-space:nowrap}
/* What the report says of itself as a whole stands at its end, under the last section's line: named as a chapter is,
   a step smaller, its words at reading width. */
.pr-basis{margin-top:var(--ds-space-5);padding-top:var(--ds-space-4);border-top:1px solid var(--ds-line)}
.pr-basis h5{margin:0 0 var(--ds-space-2);font-size:var(--ds-fs-md);font-weight:700}
.pr-statement{max-width:120ch;margin:0}
/* A section is a chapter: a line over it, its name at heading size, the way to its screen at the line's end. */
.proof-report .proof-section{margin-top:var(--ds-space-5);padding-top:var(--ds-space-4);border-top:1px solid var(--ds-line)}
/* The type floor of the 10-06 review (P2-12): a report's body text 14px (--ds-fs-md), what stands under or beside it
   13px (--ds-fs-sm), never 12px on screen; a printed sheet keeps its own sizes (@media print). */
/* ⓘ: what a line leaves out, on hover, focus or a press (the shared bubble of app.js, .help-trigger's circle). */
.pr-info{width:20px;height:20px;min-width:20px;margin-left:var(--ds-space-1);font-family:var(--ds-font);font-size:var(--ds-fs-sm);font-style:normal;font-weight:700;vertical-align:-3px}
/* 현황: whether every employee of the list was put in one of the states, a line under the tiles. */
.pr-facts.pr-classified{grid-template-columns:minmax(0,1fr)}
.pr-classified[data-proof-classified="some"] b{color:var(--ds-unknown-text)}
/* The rest: a name and its value a line; names that open alike share the line, each with its own value. */
.pr-facts{display:grid;grid-template-columns:minmax(0,1fr);column-gap:var(--ds-space-6);margin:0 0 var(--ds-space-3);border-top:1px solid var(--ds-line)}
.pr-facts>div{display:grid;grid-template-columns:minmax(0,280px) minmax(0,1fr);align-items:baseline;gap:var(--ds-space-1) var(--ds-space-4);padding:7px 0;border-bottom:1px solid var(--ds-line)}
/* Where the row is wide, single values stand two to a line; a line of several values keeps the whole width. */
@media(min-width:1200px){.pr-facts{grid-template-columns:repeat(2,minmax(0,1fr))}.pr-facts>.pr-group{grid-column:1 / -1}}
.pr-facts dt{color:var(--ds-text-2);font-size:var(--ds-fs-sm);overflow-wrap:anywhere}
.pr-facts dd{margin:0;font-size:var(--ds-fs-md);overflow-wrap:anywhere}
.pr-facts b{font-weight:600;font-variant-numeric:tabular-nums}
.pr-facts b[data-zero]{color:var(--ds-text-3);font-weight:400}
.pr-facts b[data-unknown]{color:var(--ds-unknown-text)}
.pr-items{display:flex;flex-wrap:wrap;gap:var(--ds-space-1) var(--ds-space-5)}
.pr-item>span:first-child{color:var(--ds-text-2);font-size:var(--ds-fs-sm)}
.pr-sums{margin:var(--ds-space-4) 0 var(--ds-space-2)}
/* A table of the section: its name and count, the way to its screen at the line's end; numbers at the right. */
.pr-rows{margin:0 0 var(--ds-space-2)}
/* A table is as wide as what it holds: a few columns of numbers are not spread over the whole card. */
.pr-rows table{width:auto;min-width:min(100%,520px)}
.pr-rows :is(th,td).num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.pr-rows .pr-n{font-weight:600}
.pr-rows .pr-n[data-zero]{color:var(--ds-text-3);font-weight:400}
.pr-rows td.pr-long,.pr-rows td:last-child:not(.num){white-space:normal}
/* Long text (a gap, a record in words) takes a readable line, not the shared cell's 360px. */
.pr-rows td.pr-long{min-width:280px;max-width:88ch}
/* An issue's key is one word (ISS-3 was cut after its hyphen in a table of many columns). */
.pr-rows td.pr-key{white-space:nowrap}
/* A column's name may break at its spaces (종료 · 해결됨, 미해결 이슈): the shared head is one nowrap line, and fourteen of them
   (the issue trend: a day, five kinds, seven endings, the open count) stood wider than the page. A word stays whole. */
.pr-rows table.lx-t th{white-space:normal;overflow-wrap:normal;word-break:keep-all}
/* What the section says about its numbers stands a step under them. */
.pr-notes{margin-top:var(--ds-space-3)}
.pr-notes .inventory-note{margin:0 0 var(--ds-space-1)}
/* What a check needs and a reader does not (the stored line with its watermark) is folded at the section's end. */
.pr-verify{margin:var(--ds-space-2) 0 0;color:var(--ds-text-2);font-size:var(--ds-fs-sm)}
.pr-verify summary{cursor:pointer;width:fit-content}
.pr-verify small{display:block;margin-top:var(--ds-space-1);overflow-wrap:anywhere}
/* The score: the two counts it is of at a figure's size, the ratio and what it is a ratio of under them. */
.pf-score b[data-unknown],.pf :is(.pr-n,.pf-counts b,.pf-unit b)[data-unknown]{color:var(--ds-unknown-text);font-weight:600}
/* A framework tile that counts items is a button: pressed, only the items it counts are drawn (a printed sheet keeps all). */
.pf-counts b,.pf-unit b,.pf-reason b{font-weight:600;font-variant-numeric:tabular-nums}
.pf-counts b[data-zero],.pf-unit b[data-zero],.pf-reason b[data-zero]{color:var(--ds-text-3);font-weight:400}
.pf-unit{display:inline-block;padding:1px 7px;border:1px solid var(--ds-line);border-radius:var(--ds-radius-xs);background:var(--ds-surface)}
/* A condition's targets: how many there are and how many rows the report holds on the line that opens the list. */
.pf-list{margin:var(--ds-space-2) 0 0}
.pf-list>summary{width:fit-content;cursor:pointer;font-size:var(--ds-fs-md)}
.pf-list>summary b{font-weight:600}
.pf-list>summary small{margin-left:var(--ds-space-1);color:var(--ds-text-2);font-size:var(--ds-fs-sm)}
/* Targets said by name alone stand side by side, as many to a row as the width holds. */
.pf-names{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:var(--ds-space-1) var(--ds-space-4);margin:var(--ds-space-2) 0 0;padding:0;list-style:none;font-size:var(--ds-fs-sm)}
.pf-names li{min-width:0}
.pf-list .link-button{padding:0;font-size:inherit;text-align:left;overflow-wrap:anywhere}
.pf-list>.inventory-note{margin:var(--ds-space-1) 0 0}
@media(max-width:600px){
  .pr-facts>div{grid-template-columns:minmax(0,1fr)}
  
  
  
  
  
  
  
  
}
/* 인쇄 · PDF 저장: the report alone on the sheet. proof-common.js stands a copy of it as the page's only printed child
   (html.pr-printing); the shell and every other card are not printed, and nothing here touches the screen. */
.pr-print-sheet{display:none}
@media print{
  html.pr-printing,html.pr-printing body{height:auto!important;min-height:0!important;overflow:visible!important;background:#fff!important}
  html.pr-printing body>:not(.pr-print-sheet){display:none!important}
  html.pr-printing .pr-print-sheet{display:block}
  .pr-print-sheet .proof-report{margin:0;padding:0;border:0;border-radius:0;box-shadow:none;background:none}
  .pr-print-sheet :is(button,summary,[data-proof-screen]){display:none}
  /* Wide tables take the sheet's width and wrap, their head repeated on each sheet; a row, a tile row and a
     section's name are not cut across two sheets. */
  .pr-print-sheet .table-wrap{overflow:visible;max-height:none;border:0}
  .pr-print-sheet .pr-rows table{width:100%;min-width:0}
  /* A cell keeps its words whole (a column of two words was cut to a letter's width beside a long one); long text and
     a long run with no space in it may be cut anywhere, so no table is wider than the sheet. */
  .pr-print-sheet :is(th,td){white-space:normal!important;overflow-wrap:break-word;word-break:keep-all}
  .pr-print-sheet td:is(.pr-long,.pr-token){overflow-wrap:anywhere;word-break:normal}
  /* A number and a key are one word each: never cut letter by letter in a narrow column. */
  .pr-print-sheet :is(th,td):is(.num,.pr-key){white-space:nowrap!important;overflow-wrap:normal}
  
  /* A table of many columns (an issue's eighteen) cannot stand as columns on a sheet, where each was a letter wide:
     a row is a record there, every value under its column's name (the cell's data-label). */
  .pr-print-sheet [data-proof-wide] thead{display:none}
  .pr-print-sheet [data-proof-wide] :is(table,tbody){display:block;width:100%}
  .pr-print-sheet [data-proof-wide] tr{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--ds-space-1) var(--ds-space-3);padding:var(--ds-space-2) 0;border-top:1px solid var(--ds-line-strong)}
  .pr-print-sheet [data-proof-wide] td{display:block;min-width:0;max-width:none;padding:0;border:0;text-align:left;font-size:var(--ds-fs-sm)}
  .pr-print-sheet [data-proof-wide] td::before{content:attr(data-label);display:block;color:var(--ds-text-2);font-size:10px;font-weight:400}
  .pr-print-sheet [data-proof-wide] td.pr-long{grid-column:span 2}
  .pr-print-sheet thead{display:table-header-group}
  .pr-print-sheet :is(tr,.pr-lead,.pr-section-head,.pr-table-head,.pr-facts>div,.pr-basis){break-inside:avoid}
  .pr-print-sheet :is(.pr-section-head,.pr-table-head){break-after:avoid}
  .pr-print-sheet .pr-verify small{display:block}
  /* A state said by colour on the screen is said by its frame and words on paper (backgrounds are not printed). */
  .pr-print-sheet :is(.tag,.ov-metric,.pf-state,.pf-reason,.pf-statement,.pf-cond){-webkit-print-color-adjust:exact;print-color-adjust:exact}
  /* A framework report on paper: a target's name is plain text (the sheet has no button), a list's opening line
     stays as its heading, an item's head and a condition's name stay with what follows, and a long list of
     targets runs over sheets under its repeated head. */
  .pr-print-sheet button[data-proof-target]{display:inline;padding:0;border:0;background:none;color:inherit;font:inherit;font-weight:500;text-align:left}
  .pr-print-sheet .pf-list>summary{display:block;list-style:none;cursor:auto}
  .pr-print-sheet .pf-list>summary::-webkit-details-marker{display:none}
  .pr-print-sheet :is(.pf-item-head,.pf-cond-head,.pf-counts,.pf-list>summary,.pf-score,.pf-statement,.pf-names li){break-inside:avoid}
  .pr-print-sheet :is(.pf-item-head,.pf-cond-head,.pf-list>summary,.pf-desc,.pf-group){break-after:avoid}
  
  
  /* People on paper: a report that is not export-safe prints no person row (proof-common.js takes them out of the
     copy; this holds the same for a page printed any other way) and says so. */
  [data-proof-people-export]:not([data-proof-people-export="safe"]) [data-proof-person]{display:none!important}
  
}
.pr-print-sheet{page:proof-report}
@page proof-report{margin:14mm 12mm}
/* A condition's head: its target, its name taking the room, 검색에서 열기 at the line's end, and the marks after the
   name (사람 단위 · 조회 목적 필요, 끔) under the name -- beside a long mark the button stood on a line of its own while
   the other conditions' stood beside their names (OWASP Agentic ASI01 at 1440). */
.ft-cond-name{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:var(--ds-space-1) var(--ds-space-2)}
.ft-cond-name>b{grid-column:2;grid-row:1;overflow-wrap:anywhere}
.ft-cond-name>b~.tag{grid-column:2;justify-self:start}
.ft-cond-name b{font-weight:600}
/* What a condition's text does not say right stands under it when the field is left. Its line is kept while there
   is none, so the rows below do not move under a press made as the field is left (a checkbox two rows down took no
   press when the line appeared between the pointer going down and coming up). */
.ft-problem{display:block;min-height:1.5em;color:var(--ds-danger-text);font-size:var(--ds-fs-md);line-height:1.5}
/* A kind of confirmed report the company has none of is not drawn (UR28 C28 이전 형식): .lx-chip sets its own display. */
.pr-chips .lx-chip[hidden]{display:none}
/* 보고서: the link under the framework table stands apart from its last row. */
#proof-framework-panel>.lx-row:last-child{margin-top:var(--sp-3)}
/* 통제 범위: the empty state's two ways on stand centred on one row under its line. */
[data-proof-items="empty"] .pc-none-ways{justify-content:center;gap:var(--sp-2);margin-top:var(--sp-3)}