/* RA2 AI 자산 목록 -- this track's one stylesheet of the redesign (GOAL-redesign-wave 4절 CSS). Its parts are
   redesign-rf1.css's (prefix lx-); index.html links it after them. Only this track writes here.
   at-  AI 자산's 에이전트 · 도구 · 모델 tabs (inventory-tabs.js)
   asset-panel-  the asset panel's own head where it stands in the shared panel (inventory-detail.js)
   asset-violation  a node of 연결 관계 a reason of the managed verdict names (inventory-detail.js)
   ao-compare-open  개요's 기존 목록과 대조 at the first line's right (inventory-overview.js)
   inv-  설치 기록's rows of one height and its list beside the open panel (inventory.js) */

/* ---------- 에이전트 · 도구 · 모델: the head ---------- */
/* The tab stands in the frame's main (the one lx-page): no page padding of its own (PC: 28px twice). */
.at-page{display:flex;flex-direction:column;gap:16px;min-width:0}
.at-head{gap:12px}
.at-head .lx-lede{min-width:0}
.at-under{gap:16px;font-size:13px}
.at-apart{color:var(--ds-text-3);text-decoration:underline;text-underline-offset:3px}
.at-apart:hover{background:color-mix(in srgb,var(--ds-accent) 8%,transparent)}
.at-unknown{color:var(--ds-unknown-text)}

/* ---------- the filter row ---------- */
.at-page{container-type:inline-size}
.at-filters{display:flex;flex-wrap:wrap;align-items:flex-start;gap:8px 12px;min-width:0}
.at-narrow{flex:1 1 0;min-width:280px;gap:8px}
.at-tools{flex:none;flex-wrap:nowrap;gap:8px;margin-left:auto}
@container (max-width:760px){.at-narrow{order:3;flex-basis:100%;min-width:0}}
/* A narrow list that is no phone (beside the panel; PC eye 10-13 Assets): one flow as in the design -- 찾기, the chips
   and conditions after it on the same lines, then 거르기, the view and 열 after the last chip, not pushed to the edge
   with the chips on a line of their own. The order is the markup's, so is the keyboard's. */
@media (min-width:641px){@container (max-width:760px){
  .at-filters{align-items:center;column-gap:8px}
  .at-narrow{display:contents}
  .at-tools{margin-left:0}
}}
.at-find{flex:0 1 220px}
.at-find input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--ds-text);font:400 14px var(--ds-font)}
.at-menu{position:relative;display:inline-flex}
.at-pop{position:absolute;z-index:30;top:calc(100% + 6px);right:0;display:flex;flex-direction:column;gap:12px;min-width:240px;max-height:min(60vh,480px);overflow:auto;padding:14px;border:1px solid var(--ds-line);border-radius:10px;background:var(--ds-surface);box-shadow:var(--ds-shadow-pop)}
.at-pop[hidden]{display:none}
.at-filter{display:flex;flex-direction:column;gap:4px}
.at-filter .lx-sel{width:100%}
/* 정렬 in words is the phone's, where the heads stand as a line of words; on a wide list a head is pressed. */
.at-order{display:none}
.at-order .lx-sel{max-width:200px}
.at-applied{display:contents}

/* ---------- the list ---------- */
.at-list{min-width:0;overflow-x:auto}
/* Every row one height, the design's two-line row: 21 + 19.5 of words, 9 + 9 of padding and the line under it = 59.5px
   (a one-line row is as tall); no date or mark breaks its line. */
table.at-table td{height:58.5px;vertical-align:middle;white-space:nowrap}
/* 도구 이름: 280px at 1440, then it takes the same half of what a wider page adds as 소유자, up to 440px (X232). */
.at-table td:first-child .lx-cell{max-width:clamp(280px,calc(280px + (100cqw - 1140px) / 2),440px)}
/* 소유자: 220px while the page is no wider than in a 1440px window (1138px of its own, read as 1140 and under), and
   half of what a wider page adds, up to 320px: the page's added width goes to the cell that is cut first (명세 5절;
   PC3 10-13: its grey line stood cut at 220 of 228px with 711px of the table unused). The page's width is its own
   px (cqw of .at-page), not the window's: a window made larger by the frame's scale counts the same. */
.at-table td[data-at-cell="person"] .lx-cell{max-width:clamp(220px,calc(220px + (100cqw - 1140px) / 2),320px)}
.at-table .at-name{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.at-table .at-name wbr{display:none}
/* 할 일: an open item's title asks the table for no width it must have -- it may break anywhere, so the columns before
   it come first and the list never scrolls for it (rmpc 1280, 10-13: a long title stood the table 997px in its 978px
   list) -- and stands as one line cut with an ellipsis where the column is narrower; its whole sentence is the link's
   title, and 외 N건 stays whole beside it (inventory-tabs.js todoCell). */
.at-todo{display:flex;align-items:baseline;gap:4px;min-width:0}
.at-todo>.at-todo-t{display:-webkit-box;min-width:0;overflow:hidden;white-space:normal;overflow-wrap:anywhere;-webkit-box-orient:vertical;-webkit-line-clamp:1}
.at-todo>.lx-muted{flex:none;white-space:nowrap}
.at-sort{display:inline-flex;align-items:center;gap:4px;padding:0;border:0;background:transparent;color:inherit;font:inherit;cursor:pointer;white-space:nowrap}
.at-sort:hover{background:color-mix(in srgb,var(--ds-accent) 8%,transparent)}
.at-sort-mark{min-width:10px;color:var(--ds-accent-text)}
/* No row: the shared empty box across the list's width (명세 6.8 .empty; PC pc3 empty-where: 318.78px at the list's
   left in a 1138px list), 조건 지우기 under its middle. */
.at-empty{display:flex;flex-direction:column;align-items:center;gap:12px}
.at-empty>:is(.ui-frame,.lx-empty){align-self:stretch}

/* Beside a panel only windows up to 1440px use the short list. A large window keeps every
   column even when the scaled panel leaves less than portalUi's roomy threshold (명세 5). */
/* What a narrow row leaves out stands on the name's second line, after its kind (a row stays two lines high). */
@media (max-width:1440px){.lx-split:has(>.lx-aside):where(:not([data-lx-roomy])) .at-table .lx-sub>.lx-dropsum{display:inline}}
@media (max-width:1100px){.at-table .lx-sub>.lx-dropsum{display:inline}}
/* Beside the panel (or under 1100px) the columns left share the list's width: a long owner line is cut, not scrolled. */
@media (max-width:1440px){.lx-split:has(>.lx-aside):where(:not([data-lx-roomy])) .at-table{table-layout:fixed}}
@media (max-width:1440px){.lx-split:has(>.lx-aside):where(:not([data-lx-roomy])) .at-table :is(th,td){overflow:hidden;text-overflow:ellipsis}}
@media (max-width:1440px){.lx-split:has(>.lx-aside):where(:not([data-lx-roomy])) .at-table th:is([data-at-col="state"],[data-at-col="policy"],[data-at-col="people"],[data-at-col="allowed"],[data-at-col="agents"]){width:96px}}
@media (max-width:1440px){.lx-split:has(>.lx-aside):where(:not([data-lx-roomy])) .at-table th[data-at-col="deep_scan"]{width:104px}}
@media (max-width:1440px){.lx-split:has(>.lx-aside):where(:not([data-lx-roomy])) .at-table th[data-at-col="why"]{width:24%}}
/* A scaled wide window keeps every column beside its panel (명세 5). The old 920px container
   fallback hid three tools columns at 1920px even though this was a large window. */
@media (min-width:1441px){
  .lx-split:has(>.lx-aside) .at-table{table-layout:fixed}
  .lx-split:has(>.lx-aside) .at-table :is(th,td){white-space:normal;overflow-wrap:anywhere}
  .lx-split:has(>.lx-aside) .at-table .at-sort{white-space:normal}
}
/* The page's width beside a panel goes first to the cells that are cut first (PC3 10-15, X71: seven equal 124px columns at
   1920 and 167px at 2560 cut an 163px name and left the short state and count columns as wide): the short columns keep
   their own measure, the todo and reason columns a share, and the name, owner and device columns divide what is left. */
@media (min-width:1441px){
  .lx-split:has(>.lx-aside) .at-table th:is([data-at-col="state"],[data-at-col="policy"],[data-at-col="people"],[data-at-col="allowed"],[data-at-col="agents"],[data-at-col="account"],[data-at-col="location"]){width:96px}
  .lx-split:has(>.lx-aside) .at-table th:is([data-at-col="gateway"],[data-at-col="deep_scan"],[data-at-col="family"]){width:104px}
  .lx-split:has(>.lx-aside) .at-table th:is([data-at-col="last_seen_at"],[data-at-col="first_seen_at"],[data-at-col="provider"]){width:128px}
  .lx-split:has(>.lx-aside) .at-table th[data-at-col="why"]{width:16%}
  .lx-split:has(>.lx-aside) .at-table th[data-at-col="todo"]{width:12%}
}
@media (max-width:1100px){
  .at-table{table-layout:fixed}
  .at-table :is(th,td){overflow:hidden;text-overflow:ellipsis}
  .at-table th:is([data-at-col="state"],[data-at-col="policy"],[data-at-col="people"],[data-at-col="allowed"],[data-at-col="agents"]){width:96px}
}

/* A phone: a row stands as a block and each value says its column (data-label). */
@media (max-width:640px){
  .at-filters{flex-direction:column;align-items:stretch}
  .at-tools{flex-wrap:wrap}
  .at-find{flex:none}
  .at-order{display:inline-flex;align-items:center;gap:8px}
  table.at-table thead{display:none}
  table.at-table tr{display:block;padding:10px 0;border-bottom:1px solid var(--ds-line)}
  table.at-table td{display:flex;justify-content:space-between;gap:12px;height:auto;padding:4px 0;border:0;white-space:normal}
  table.at-table td>*{min-width:0}
  table.at-table td .lx-cell{max-width:100%;text-align:right}
  .at-table td::before{content:attr(data-label);color:var(--ds-text-3);font-size:13px}
}

/* A phone: 거르기's and 열's box stands under its button and inside the window's 16px margins wherever the button is
   (fixed with no top keeps its own place under the button; RF1's way for a narrow window). */
@media (max-width:600px){.at-pop{position:fixed;top:auto;left:16px;right:16px;width:auto;min-width:0;max-width:none;margin-top:36px}}

/* ---------- 자산 패널 in the shared panel ---------- */
/* 연결 관계: a node a reason of the managed verdict names, in the danger tone (UR17-4). */
.asset-violation{display:inline-block;padding:0 6px;border:1px solid var(--ds-danger);border-radius:6px;background:var(--ds-danger-soft)}
/* Its head is the shared panel's (portalUi.panel.head: the small line, the title, 닫기; T19-8): no line under it and no
   column of its own. A long name (an MCP's or a model's id) still breaks inside the panel. */
[data-asset-panel-head] .lx-aside-t{overflow-wrap:anywhere}
.lx-aside .asset-head{display:flex;flex-direction:column;gap:12px;padding:12px 0}
.lx-aside .asset-actions{display:flex;gap:8px;flex-wrap:wrap}
.lx-aside .asset-actions{flex-wrap:nowrap;align-items:stretch}
.lx-aside .asset-todo{flex:1 1 auto;display:flex}
.lx-aside .asset-todo>.lx-btn{flex:1}
.lx-aside .detail-status{flex-direction:column;align-items:flex-start;margin:0}
/* the facts as the design's two columns: the shared part's rows give their name and value to lx-kv's grid */
.lx-aside .lx-kv>.detail-fact{display:contents}
.lx-aside .lx-kv>.detail-fact>dt{font-weight:400}
.lx-aside .lx-kv>.detail-fact>dd{font-size:14px}
.lx-aside .lx-kv .lx-lk{text-align:left}
.lx-aside .tabs{display:flex;flex-wrap:wrap;gap:4px 14px;margin:4px 0 0;border-bottom:1px solid var(--ds-line)}
.lx-aside .tabs .tab{padding:8px 0}
.lx-aside [data-asset-panel]{display:flex;flex-direction:column;gap:16px;padding-top:16px}
/* The panel's older rows, headings and grey lines keep their names (the QA readers') and take the parts' measures:
   a row is lx-kv's two columns read from the left, a heading lx-sect-h's, a grey line lx-sub's. */
.lx-aside[data-panel="asset"] .kv{display:grid;grid-template-columns:112px minmax(0,1fr);gap:8px 16px;align-items:start;padding:4px 0;border:0;font-size:14px}
.lx-aside[data-panel="asset"] .kv>span:first-child{flex:none;color:var(--ds-text-3);font-size:13px}
.lx-aside[data-panel="asset"] .kv>span:last-child{min-width:0;text-align:left;overflow-wrap:anywhere}
.lx-aside[data-panel="asset"] .drawer-sub{margin:0;color:var(--ds-text-3);font-size:13px;font-weight:600}
.lx-aside[data-panel="asset"] .drawer-sub small{font-weight:400}
.lx-aside[data-panel="asset"] .inventory-note,#inventory-root .inventory-note,.ao-page .inventory-note{color:var(--ds-text-3);font-size:13px}
.lx-aside[data-panel="asset"] .inventory-note{margin:0}

/* ---------- 설치 기록 ---------- */
/* 확인 근거 as one joined control (the old four cards): the name, its count and its share on one line. */
.inv-band.lx-seg{margin:0 0 16px}
.inv-band.lx-seg>button{gap:6px}
.inv-band.lx-seg strong{font-weight:650;font-size:13px}
.inv-band.lx-seg small{color:var(--ds-text-3);font-size:12.5px}
.inv-band.lx-seg small:empty{display:none}
.inv-band.lx-seg .lx-unit{font-style:normal}
/* The search box is the parts' input beside its button; the filters are a rail, not a card: a line on its right, under it once
   the list stacks below it (v24 .rail; T19-1 A.tsv 31). */
.inv-toolbar .lx-in{flex:1 1 240px;width:auto;height:34px}
.inv-layout>.inv-facets{padding:4px 16px 16px 0;border:0;border-right:1px solid var(--ds-line);border-radius:0;background:transparent;box-shadow:none}@media(max-width:1180px){.inv-layout>.inv-facets{padding:0 0 12px;border-right:0;border-bottom:1px solid var(--ds-line)}}
.inv-facets label{font-size:13px}
.inv-facets input[type="checkbox"],.inv-facets input[type="radio"]{accent-color:var(--ds-accent)}
/* A row is one line high whatever its 정밀 검사 says; beside the open panel the list takes the rail's place. */
.inv-main .inv-table td[data-testid="inventory-deep-scan-cell"]{white-space:nowrap}
.inv-table th[data-inv-col="deep-scan"]{min-width:0;width:11%}
.inv-main .inv-table .inv-name{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lx-split:has(>.lx-aside) .inv-layout{grid-template-columns:minmax(0,1fr)}
.lx-split:has(>.lx-aside) .inv-layout>.inv-facets{display:none}
/* Beside its filters the list is narrower than its eight columns under ~1680px: the dates and the evidence count leave
   the row for the name's grey line (명세 6.6, RF1's lx-drop / lx-dropsum); 확인 근거, 정밀 검사 and 승인 always stay. */
@media (max-width:1679px){
  .inv-layout .inv-table .lx-t .lx-drop{display:none}
  .inv-layout .inv-table .lx-t .lx-dropsum{display:block}
}
/* More than two notes fold under one line (inventory.js sourceNotes). */
.inv-notes{margin:0 0 12px}
.inv-notes>summary{display:list-item;cursor:pointer}
.inv-notes-body{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.inv-notes-body>.lx-note{margin:0}
/* Narrower still -- beside the open panel, or a window under 1400px with the filters beside the list -- its kind and
   where it was collected (and a scope list's Gateway 설정) go to the head of that grey line. */
.inv-table .inv-sum2{display:none}
/* (the list's old floor of 760px was for all its columns; with the ones left the list fits its place) */
.inv-layout>.inv-main .table-wrap table.lx-t{min-width:0}
.lx-split:has(>.lx-aside) .inv-table .inv-drop2{display:none}
.lx-split:has(>.lx-aside) .inv-table .inv-sum2{display:inline}
/* (a page wide enough to be roomy still has only what the panel leaves: the dates go to the name's grey line there too) */
.lx-split:has(>.lx-aside) .inv-layout .inv-table .lx-t .lx-drop{display:none}
.lx-split:has(>.lx-aside) .inv-layout .inv-table .lx-t .lx-dropsum{display:block}
@media (max-width:1399px){
  .inv-table .inv-drop2{display:none}
  .inv-table .inv-sum2{display:inline}
}
/* With the columns left the name takes what the marks leave and is cut, never scrolled: beside the panel, and under
   1400px. (The old sheet let the name's cell grow to 360px, which a long grey line then filled.) */
.lx-split:has(>.lx-aside) .inv-table table.lx-t{table-layout:fixed}
.lx-split:has(>.lx-aside) .inv-layout>.inv-main .inv-table table.lx-t th:not(:first-child){width:112px;min-width:0}
.lx-split:has(>.lx-aside) .inv-layout>.inv-main .inv-table table.lx-t :is(th,td):first-child{width:auto;min-width:0;max-width:none;overflow:hidden}
@media (max-width:1399px){
  .inv-table table.lx-t{table-layout:fixed}
  .inv-layout>.inv-main .inv-table table.lx-t th:not(:first-child){width:112px;min-width:0}
  .inv-layout>.inv-main .inv-table table.lx-t :is(th,td):first-child{width:auto;min-width:0;max-width:none;overflow:hidden}
}
/* The company list's columns are its heads' alone at every width, as v24's list rows are fixed tracks: in auto layout
   the rows that came shared the room out again by what they held, so a failed read and 다시 시도's rows stood apart
   (1440: 확인 근거 3px, browser_assets_company steady_list 10-22; a Needs review pill is 104px over its 84px head, and
   Observed rows alone moved the name 3px). 정밀 검사 holds its widest verdict, Clean with Partial (120px). */
.inv-layout[data-inv-company]>.inv-main .inv-table table.lx-t{table-layout:fixed}
.inv-layout[data-inv-company]>.inv-main .inv-table table.lx-t th:not(:first-child){width:112px;min-width:0}
.inv-layout[data-inv-company]>.inv-main .inv-table table.lx-t th[data-inv-col="deep-scan"]{width:136px}
.inv-layout[data-inv-company]>.inv-main .inv-table table.lx-t :is(th,td):first-child{width:auto;min-width:0;max-width:none;overflow:hidden}
/* A verdict's same file N곳 is its own line under it, cut where the column is narrower, as a presence's reason is. */
.inv-table [data-deep-scan-same-file]{display:block;max-width:100%;margin:0;overflow:hidden;font-size:var(--ds-fs-xs);line-height:18px;text-overflow:ellipsis;white-space:nowrap}
.inv-table table.lx-t .name-cell{max-width:100%}
/* What stands under a name (its note, SDK mark, tool rule and the grey line of what the row leaves out) shares ONE line
   under it, each cut with an ellipsis where the cell is narrow, so a row with a rule mark and the grey line was not a third
   line taller (PC3 10-15, X78: 59.50 and 79.25px at 1440). flex-basis 0 with a max of its own words: a short mark keeps its
   words and the long line takes the rest, and none can wrap to a line of its own. The phone's block row is not this. */
@media (min-width:641px){
  .inv-table table.lx-t .name-cell>div{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:8px}
  .inv-table table.lx-t .name-cell>div>.inv-name{flex:0 0 100%}
  .inv-table table.lx-t .name-cell>div>small{flex:1 1 0;min-width:0;max-width:max-content;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
/* A presence's reason under its mark stays in its cell: 12px on one line, cut with an ellipsis where the column is
   narrower still (beside the panel at 1920 '최근 수집에 안 보임' stood 1px past its 112px cell -- qa-assets
   UC:inventory:long-name-contained-and-reachable); its whole sentence is the mark's title and the detail's. */
.inv-table [data-inv-presence-reason]{display:block;max-width:100%;overflow:hidden;font-size:var(--ds-fs-xs);line-height:18px;text-overflow:ellipsis;white-space:nowrap}
/* The row is the design's two lines (21 + 19.5, 59.5px with its padding and line): the old 2px over the grey line goes. */
.inv-table table.lx-t .name-cell small{margin-top:0}
/* A 0 beside a filter value is the quiet grey (.lx-na, X487): over the filters' own figure colour (style.css
   .inv-facets label small, --muted), which drew it as dark as a count (a-admin 1920: rgb(68,79,102), not #5E6A82). */
.inv-facets label small.lx-na{color:var(--ds-text-3)}
/* The row is those two lines at every width (X231, X487): where the dates have their own columns (from 1680px) the grey
   line is drawn only for a note, an SDK or a tool rule, so a row with none keeps that line's room and a rule no longer
   makes its row taller (a-admin 1920: 55.7 against 69.5px, 2560: 62.9 against 78.5px). */
@media (min-width:1680px){
  .inv-table table.lx-t .name-cell>div:not(:has(>small:not(.lx-dropsum)))::after{content:"\200b";flex:0 0 100%;font-size:var(--ds-fs-xs)}
  .lx-split:has(>.lx-aside) .inv-table table.lx-t .name-cell>div::after{content:none}
}
@media (min-width:1700px){
  .inv-table table.lx-t .name-cell>div:not(:has(>small:not(.lx-dropsum)))::after{font-size:var(--ds-fs-sm)}
}
/* A roomy page beside the panel (portal-ui.js data-lx-roomy, 857px and over) keeps the columns it has room for (결정
   U934, X267): 종류 and 수집 대상 at once (the list beside the panel at 1920 is 998px, as wide as 1440's whole list with
   its filters), and the dates too (결정 U934 "열 숨김 있으면 F", X267: 1920's 998px keeps the date columns as 2560 does). */
.lx-split[data-lx-roomy]:has(>.lx-aside) .inv-table .inv-drop2{display:table-cell}
.lx-split[data-lx-roomy]:has(>.lx-aside) .inv-table .inv-sum2{display:none}
.lx-split[data-lx-roomy]:has(>.lx-aside) .inv-layout .inv-table .lx-t .lx-drop{display:table-cell}
.lx-split[data-lx-roomy]:has(>.lx-aside) .inv-layout .inv-table .lx-t .lx-dropsum{display:none}
.lx-split[data-lx-roomy]:has(>.lx-aside) .inv-table table.lx-t .name-cell>div:not(:has(>small:not(.lx-dropsum)))::after{content:"\200b"}
/* A phone: a row is the name's line and its marks under it; no sideways scroll at 390px. */
@media (max-width:640px){
  .inv-table table.lx-t thead{display:none}
  .inv-table table.lx-t tr{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;padding:10px 0;border-bottom:1px solid var(--ds-line)}
  .inv-table table.lx-t td{height:auto;padding:0;border:0}
  .inv-table table.lx-t td:first-child{flex:1 1 100%}
}

/* ---------- 개요 ---------- */
/* 개요's tables are the parts' list (table.lx-t's measures): no grey ground under a head or a row's name, the head
   13px/500 in the third grey, a row's name the body's 14px, a row 46px at the least (명세 6.6) and no line under the
   last row. (0,3,1) and more: the older sheet's grey head (.table-wrap th,th,.mc-head, (0,1,1)) stays under them.
   On a phone a table stays a table across its wrap (the older sheet's table{display:block} drew 종류별's rows and
   lines a third of the width); the wrap scrolls what does not fit. */
.ao-page .table-wrap table.ao-table{display:table}
.ao-page .table-wrap .ao-table :is(th,td){padding:9px 6px;border-bottom:1px solid var(--ds-line);background:transparent;font-size:14px;vertical-align:middle}
.ao-page .table-wrap .ao-table thead th{color:var(--ds-text-3);font-size:13px;font-weight:500}
.ao-page .table-wrap .ao-table tbody th{color:var(--ds-text);font-weight:400}
.ao-page .table-wrap .ao-table tbody td{height:46px}
.ao-page .table-wrap .ao-table tbody tr:last-child :is(th,td){border-bottom:0}
.ao-top .ao-compare-open{margin-left:auto}
/* The shorter of 종류별 and 부서 상위 다섯 keeps its table under its heading (a stretched block spread its rows). */
.ao-two{align-items:start}
/* 관리 상태 (UR26): the big band under the share, then the four states in one row -- a dot, the word and the count as a
   press to the agents tab under that state -- and the 미관리 사유 table; two by two on a phone. */
.ao-card .ao-spec{margin:var(--ds-space-1) 0 0}
.ao-states{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--ds-space-2) var(--ds-space-4);margin:0;padding:0;list-style:none}
.ao-state{display:flex;align-items:center;gap:6px;min-width:0;font-size:14px;color:var(--ds-text-2)}
.ao-state .lx-dot{flex:none}
.ao-state-word{white-space:nowrap}
.ao-state{flex-wrap:wrap}
.ao-state-sub{flex-basis:100%;padding-left:14px;font-size:12px;color:var(--ds-text-3)}
.ao-state .ao-figure,.ao-state .lx-na{margin-left:auto;font-variant-numeric:tabular-nums}
.ao-page .ao-table[data-ao-managed-reasons] td:nth-child(3){text-align:right;white-space:nowrap}
.ao-card .ao-rate-name{align-self:center;color:var(--ds-text-2);font-size:14px;font-weight:600}
@media(max-width:599.98px){.ao-states{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* 확인할 것 (F16 u16, v24's counts two by two as 현황's 내 할 일): the name over the figure, both opening the list; the
   next action under them; the targets not judged the one small Needs review badge beside the figure. */
.ao-page .ao-checks{gap:4px}
.ao-page .ao-check{gap:4px}
.ao-page .ao-check .ao-check-name{min-height:0;padding:0;border:0;background:transparent;font:inherit;color:inherit;text-align:left;text-decoration:none;cursor:pointer}
.ao-page .ao-check .ao-check-name:is(:hover,:focus-visible){text-decoration:underline}
.ao-page .ao-check .lx-fig-s{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;font-variant-numeric:tabular-nums}
.ao-page .ao-check .lx-fig-s :is(.quiet-unknown,.lx-muted){font-size:13px;font-weight:500}
.ao-page .ao-check-act{margin-top:4px}
.ao-page .ao-unjudged{white-space:nowrap}
/* 정밀 검사 tab as a report (UR31-5b): the verdict's head, each scan's .lx-kv, its findings as one list of a reason line
   over its place in the files, then 1차 검사; v24's parts, the folds as they were. */
.ds-report{display:flex;flex-direction:column;gap:16px;min-width:0}
.ds-report h3{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0}
.ds-scan{display:flex;flex-direction:column;gap:12px;min-width:0}
.ds-scan+.ds-scan{padding-top:12px;border-top:1px solid var(--ds-line)}
.ds-scan-head{margin:0}
.ds-list{display:flex;flex-direction:column;margin:0;padding:0;list-style:none}
.ds-finding{display:flex;flex-direction:column;gap:4px;min-width:0;padding:10px 0;border-bottom:1px solid var(--ds-line)}
.ds-finding:first-child{padding-top:0}
.ds-finding:last-child{border-bottom:0}
.ds-reason{margin:0;color:var(--ds-text);font-weight:600}
.ds-place{margin:0;color:var(--ds-text-2);overflow-wrap:anywhere}
.ds-place .lx-lbl{margin-right:6px}
.ds-flow{margin:0;padding-left:18px;color:var(--ds-text-2);overflow-wrap:anywhere}