/* RM7 한도 · MCP · 기기 정책 -- 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.
   LLM Gateway › 사용 한도 (lim-), MCP (msv-), 기기 정책 (epv-) and the tool-rule part 기기 정책 and AI Governance
   draw (ets-): what stands here is each screen's own layout only -- where its pieces sit, how a long value breaks,
   how a table's columns share the width. No colour of a state is set here (the parts carry it). */

/* ---- shared by the three screens: a table that scrolls inside its own frame, pieces that do not break ---------- */
.lim-apps,.lim-company,.lim-customers,.lim-history,.msv-table,.msv-history,.epv-scroll>table{width:100%}
.epv-scroll{max-width:100%;overflow-x:auto}
.epv-scroll:focus-visible{outline:2px solid var(--ds-focus);outline-offset:2px}
.epv-nb,.msv-nb{white-space:nowrap}
.lim-break,.msv-break{overflow-wrap:anywhere}
/* An empty state's sentence stands on its own line, its one action under it. */
:is(.lim-body,.msv-body,.epv-page) .lx-empty>span{display:block}

/* ---- 사용 한도 (budget-rules.js) -------------------------------------------------------------------------------- */
.lim-screen{min-width:0}
.lim-body{display:flex;flex-direction:column;gap:var(--ds-space-4);min-width:0}
.lim-tools .lx-find{flex:0 1 260px;min-width:160px}
/* A column head that orders the rows: the head's own text, with the mark of the order beside it. */
.lim-sort{display:inline-flex;align-items:center;gap:4px;padding:0;border:0;background:none;color:inherit;font:inherit;cursor:pointer}
.lim-sort:hover{background:none;color:var(--ds-text)}
.lim-sort:focus-visible{outline:2px solid var(--ds-focus);outline-offset:2px;border-radius:4px}
.lim-sort-mark{min-width:1em;color:var(--ds-text-3)}
/* A row's name opens its panel: it reads as the name, not as a button. */
.lim-open,.msv-open,.epv-open{padding:0;border:0;background:none;font:inherit;text-align:left;cursor:pointer}
/* (Named as buttons: the parts' reset of a button that is a name takes the page's weight, and a name is 600.) */
button.lim-open,button.msv-open,button.epv-open{color:var(--ds-text);font-weight:600}
.lim-open:hover,.msv-open:hover,.epv-open:hover{text-decoration:underline;text-underline-offset:3px}
.lim-apps{table-layout:fixed}
.lim-apps td,.lim-apps th{overflow-wrap:anywhere}
.lim-open{white-space:normal;overflow-wrap:anywhere;text-align:left}
.lim-open:focus-visible,.msv-open:focus-visible,.epv-open:focus-visible{outline:2px solid var(--ds-focus);outline-offset:2px;border-radius:4px}
/* The first line's figure that opens the refusals: the sentence's own size, underlined as a way in. */
.lim-figure,.epv-figure{padding:0;border:0;background:none;color:inherit;font:inherit;font-weight:750;text-decoration:underline;text-decoration-color:var(--ds-line-strong);text-underline-offset:3px;cursor:pointer}
.lim-figure:hover,.epv-figure:hover{background:none;color:var(--ds-accent-text);text-decoration-color:currentColor}
.lim-figure:focus-visible,.epv-figure:focus-visible{outline:2px solid var(--ds-focus);outline-offset:2px;border-radius:4px}
/* An amount's box with its unit before it. */
/* (Inside a field the shared rule for a field's label would stand it as a block: the box keeps its own line.) */
.lim-money,.lx-field>.lim-money{display:flex;align-items:center;gap:6px}
.lim-money>span{color:var(--ds-text-3);font-size:13px}
.lim-money>.lx-in{flex:1;min-width:0}
/* The word after an amount (오늘 · 추정) stays on the amount's line. */
.lim-inline{display:inline}
/* What the panel beside the list says: its facts, then a section a setting. */
.lx-aside [data-br-panel]{display:flex;flex-direction:column;gap:var(--ds-space-4);min-width:0}
.lx-aside [data-br-panel]>p{margin:0}
.lim-held ul{margin:4px 0 0;padding-left:18px}
.lim-held li+li{margin-top:2px}

/* ---- MCP (gw-mcp-registry.js) -------------------------------------------------------------------------------- */
.msv-first{min-width:0}
.msv-first>.lx-lede{margin:0}
.msv-body{display:flex;flex-direction:column;gap:var(--ds-space-4);min-width:0}
.msv-bar .lx-find{flex:0 1 260px;min-width:160px}
.msv-chips{gap:6px}
.msv-sort{display:inline-flex;align-items:center;gap:6px;color:var(--ds-text-3);font-size:13px;white-space:nowrap}
.msv-sort>.lx-in{width:auto;height:34px}
.msv-table td{vertical-align:top}
/* The columns share the room they are given, whatever a name or an address is long (PC's read: beside an open panel the
   table was 413px in 377px at 1440, in 290px at 1280): the name takes what the count, the state and 등록 leave, a long
   name breaks, an address is cut with an ellipsis (whole on hover and in the panel). */
.msv-table{table-layout:fixed}
.msv-table th:nth-child(2),.msv-table td:nth-child(2){width:72px}
.msv-table th:nth-child(3),.msv-table td:nth-child(3){width:96px}
.msv-table th:nth-child(4),.msv-table td:nth-child(4){width:26%}
.msv-table th:nth-child(5),.msv-table td:nth-child(5){width:30%}
.msv-table td{overflow-wrap:anywhere}
.lx-split:has(>.lx-aside):where(:not([data-lx-roomy])) .msv-table :is(th,td):nth-child(4){width:42%}
@media (max-width:1100px){.msv-table :is(th,td):nth-child(4){width:42%}}
/* 회사 MCP 전체 (the catalog, gw-mcp-registry.js catalog()) is a table of its own seven columns: the registry's widths
   above are not its own (B-S02: 전송 방식 at 72px laid Gateway 중계 over 발견). A tag is cut, never laid over. */
[data-mcp-catalog] .msv-table :is(th,td):nth-child(n){width:auto}
[data-mcp-catalog] .msv-table :is(th,td):nth-child(2){width:120px}
[data-mcp-catalog] .msv-table :is(th,td):nth-child(3){width:150px}
[data-mcp-catalog] .msv-table :is(th,td):nth-child(4),.lx-split:has(>.lx-aside) [data-mcp-catalog] .msv-table :is(th,td):nth-child(4){width:96px}
[data-mcp-catalog] .msv-table :is(th,td):nth-child(6){width:72px}
[data-mcp-catalog] .msv-table :is(th,td):nth-child(7){width:132px}
[data-mcp-catalog] .msv-table .lx-tag{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:top}
/* On a phone (390) the four columns left share 358px: a transport tag wraps inside its own narrow column, the cells
   keep 4px a side, and a name breaks between words only (B-S02, B's r31c measure). */
@media (max-width:600px){
  [data-mcp-catalog] .msv-table :is(th,td){padding-left:4px;padding-right:4px}
  [data-mcp-catalog] .msv-table :is(th,td):nth-child(2){width:68px}
  [data-mcp-catalog] .msv-table :is(th,td):nth-child(7){width:auto}
  [data-mcp-catalog] .msv-table .lx-tag{max-width:60px;height:auto;white-space:normal;text-overflow:clip}
  [data-mcp-catalog] .msv-table .lx-nm{word-break:keep-all}
}
.msv-open{white-space:normal;overflow-wrap:anywhere}
.msv-url{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.msv-why{white-space:normal}
.msv-foot{margin:var(--ds-space-2) 0 0}
/* The line of aliases a policy allows and the registry lacks is the shared note: the old sheet's own edge and margins
   on [data-mcp-unregistered] are taken off it. */
.lx-note.msv-loose{flex-wrap:wrap;align-items:center;margin:0;padding:10px 14px;border:0;border-radius:10px;background:var(--ds-caution-soft);color:var(--ds-caution-text)}
.msv-detail{display:flex;flex-direction:column;gap:var(--ds-space-4);min-width:0}
/* The form in the panel is one column (the old sheet lays [data-mcp-form] out as a two-column grid from 901px). */
.msv-form[data-mcp-form]{display:flex;flex-direction:column;align-items:stretch;gap:var(--ds-space-4);min-width:0}
.msv-form[data-mcp-form]>label.lx-ck{align-self:flex-start;padding:0}
.msv-form[data-mcp-form]>[data-mcp-stop-help]{margin-top:-8px}
.msv-defs{display:flex;flex-direction:column;gap:6px;margin:0;padding:0;list-style:none}
.msv-defs li{overflow-wrap:anywhere}
.msv-more>summary{color:var(--ds-text-3);font-size:13px;cursor:pointer}
.msv-more[open]>summary{margin-bottom:6px}
.msv-history{font-size:13px}
.msv-history td{vertical-align:top}
/* A reason breaks between its words (a cell that may break anywhere shrinks to a letter a line). */
.msv-history td.msv-break{min-width:96px;overflow-wrap:break-word;word-break:keep-all}
.msv-id{color:var(--ds-text-3);font-size:var(--ds-fs-xs)}
.msv-tools{display:flex;flex-direction:column;gap:8px}
/* A tool's line in the panel: its name, kind and 빼기 on one line, what it does under them. */
.msv-tool{display:grid;grid-template-columns:minmax(0,1fr) 148px auto;align-items:center;gap:8px}
.msv-tool>[data-mcp-tool-desc]{grid-column:1 / -1;grid-row:2}
.msv-tool+.msv-tool{padding-top:8px;border-top:1px solid var(--ds-line)}

/* ---- 기기 정책 (gw-endpoint-policy.js) ---------------------------------------------------------------------------- */
.epv-page{min-width:0}
/* The line said while a write is on its way takes no room while it says nothing. */
.epv-page>[data-ep-sending]:empty{display:none}
.epv-top>.lx-lede{flex:1 1 320px;min-width:0;margin:0}
.epv-status{gap:6px 14px}
.epv-status>.lx-sub{display:inline}
.epv-came a{white-space:nowrap}
.epv-chips{gap:6px}
.epv-devices{display:flex;flex-direction:column;gap:var(--ds-space-3);min-width:0}
.epv-devices td{vertical-align:top}
/* "사유 N개" under the one word of a cell. */
.epv-why-count{margin-top:2px}
/* The reasons of a device, in its panel: a line each, a long one breaking inside the panel. */
.epv-whys{display:flex;flex-direction:column;gap:8px;margin:0;padding:0;list-style:none}
.epv-why{color:var(--ds-text-2);font-size:13px;line-height:1.5;overflow-wrap:anywhere}
.epv-hooks{margin-top:4px}
.epv-hooks>summary{color:var(--ds-text-3);cursor:pointer}
.epv-hooks ul{margin:4px 0 0;padding-left:18px}
/* A names-and-values list whose pairs are wrapped (a mark on each pair): the pair's cells stand in the list's grid. */
.lx-kv>div[data-ep-line],.lx-kv>div[data-ep-fact],.lx-kv>div[data-ep-mcp-line]{display:contents}
.epv-line>dd,.lx-kv>div[data-ep-fact]>dd,.lx-kv>div[data-ep-mcp-line]>dd{min-width:0;margin:0;overflow-wrap:anywhere}
.epv-line>dd>b{font-weight:600}
/* 회사 계정이 아닌 로그인: what the company set and what was seen, side by side while there is room. */
.epv-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:var(--ds-space-5)}
/* MCP: the count line, the list (or its empty state) and the line under it keep a gap; a server a block. */
[data-ep-mcp-slot]{display:flex;flex-direction:column;gap:var(--ds-space-3);min-width:0}
[data-ep-mcp-slot]:empty{display:none}
.epv-mcp-list{display:flex;flex-direction:column;gap:var(--ds-space-3);margin:0;padding:0;list-style:none}
.epv-mcp-list>li{padding:12px 0;border-bottom:1px solid var(--ds-line)}
.epv-mcp-list>li:last-child{border-bottom:0}
.epv-mcp-name{margin:0 0 6px}
.epv-failed{text-align:left}
/* The policy: one form of folded sections. Closed, a section is its name and its value on one line. */
.epv-form{display:flex;flex-direction:column;min-width:0;padding-top:var(--ds-space-4);border-top:1px solid var(--ds-line)}
.epv-form>.lx-h2{margin:0}
.epv-form>.lx-lbl{margin:4px 0 var(--ds-space-3)}
.epv-form[inert]{opacity:.6}
.epv-fold{border-bottom:1px solid var(--ds-line)}
.epv-fold>summary{display:grid;grid-template-columns:minmax(160px,240px) minmax(0,1fr) auto 16px;align-items:center;gap:8px 16px;padding:14px 4px;cursor:pointer;list-style:none}
.epv-fold>summary::-webkit-details-marker{display:none}
.epv-fold>summary::after{content:"";width:7px;height:7px;margin-right:4px;border-right:1.5px solid var(--ds-text-3);border-bottom:1.5px solid var(--ds-text-3);transform:rotate(45deg);grid-column:4}
.epv-fold[open]>summary::after{transform:rotate(-135deg)}
.epv-fold>summary:hover{background:color-mix(in srgb,var(--ds-accent) 8%,transparent)}
.epv-fold>summary:focus-visible{outline:2px solid var(--ds-focus);outline-offset:-2px;border-radius:6px}
.epv-fold-name{font-weight:600}
.epv-fold-value{min-width:0;overflow:hidden;color:var(--ds-text-2);text-overflow:ellipsis;white-space:nowrap}
.epv-fold-body{display:flex;flex-direction:column;gap:10px;max-width:720px;padding:2px 4px 18px}
.epv-fold-body>.lx-lbl{margin:0}
.epv-fold-body textarea.lx-in{height:auto;min-height:84px;padding:8px 10px;font-family:var(--ds-font-mono);font-size:13px;line-height:1.5;resize:vertical}
.epv-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
/* 버전 기록 (the wide panel): a version a block. */
.epv-versions{display:flex;flex-direction:column;margin:0;padding:0;list-style:none}
.epv-versions>li{display:flex;flex-direction:column;gap:6px;padding:12px 0;border-bottom:1px solid var(--ds-line)}
.epv-versions>li:last-child{border-bottom:0}
.epv-versions p{margin:0}
.epv-reason{color:var(--ds-text-2);font-size:13px;overflow-wrap:anywhere}
.epv-quote{quotes:"“" "”"}
@media (max-width:900px){
  .epv-fold>summary{grid-template-columns:minmax(0,1fr) auto 16px}
  .epv-fold-value{grid-column:1 / -1;grid-row:2;white-space:normal}
  .epv-fold>summary::after{grid-column:3;grid-row:1}
  .epv-pair{grid-template-columns:minmax(0,1fr)}
}

/* ---- 조직 · 사람별 도구 규칙 (endpoint-tool-scopes.js) ---------------------------------------------------------------- */
/* 기기 정책's row under the folds: the same line as a fold's closed one, with the way to AI Governance at its end. */
.ets-summary{padding:14px 4px}
.ets-summary-name{flex:0 0 240px;font-weight:600}
.ets-summary-value{color:var(--ds-text-2)}
.ets-summary>.lx-lbl{margin:4px 0 0}
/* The rules' input (drawn in AI Governance › 정책): a rule a block, its facts a line each. */
.ets{display:flex;flex-direction:column;gap:var(--ds-space-4);min-width:0;margin:0;padding:0;border:0}
.ets>legend{padding:0;font-weight:650}
.ets-rule{padding:var(--ds-space-3) 0;border-top:1px solid var(--ds-line)}
.ets-name{margin:0}
.ets-facts{display:flex;flex-direction:column;gap:2px;margin:0;padding:0;color:var(--ds-text-3);font-size:13px;list-style:none}
.ets-rule .lx-field>span:first-child{color:var(--ds-text-2);font-size:13px;font-weight:600}
.ets-rule textarea.lx-in{height:auto;min-height:60px;padding:8px 10px;font-family:var(--ds-font-mono);font-size:13px;line-height:1.5;resize:vertical}
.ets-pick{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:12px}
@media (max-width:900px){
  .ets-summary-name{flex-basis:auto}
  .ets-pick{grid-template-columns:minmax(0,1fr)}
}