@charset "utf-8";
/* RA9 설정 › 기기 · 등록 · 설치 (명세 8.13, 9.4). The parts are redesign-rf1.css's (lx-); this sheet only places them on
   the two pages (#devices-root): the list beside its panel, and 등록 · 설치 at a form's width (9.2: 720px 안팎). */

#devices-root .dv-page{display:flex;flex-direction:column;gap:16px;min-width:0}
#devices-root .dv-head{flex-wrap:nowrap;align-items:flex-start}
#devices-root .dv-head .lx-lede{min-width:0}

/* The band and its chips, with the 기준 시각 and 목록 맞추기 at the end of their row. */
#devices-root .dv-band{display:flex;flex-direction:column;gap:8px;min-width:0;margin:0}
#devices-root .dv-chips{gap:6px 18px}
#devices-root .dv-leg{cursor:pointer}
#devices-root .dv-leg[aria-pressed="true"]{font-weight:700;box-shadow:0 2px 0 var(--ds-accent)}
#devices-root .dv-leg:focus-visible{outline:2px solid var(--ds-focus);outline-offset:3px}
#devices-root .dv-basis{gap:8px 12px;flex-wrap:wrap;justify-content:flex-end}

/* The find row: the box takes what is left; the order, 정밀 검사 and the count keep their width. */
/* The old sheets' margins (label, .dv-bar, .dv-order) do not reach this row. */
#devices-root .dv-bar{gap:8px;margin:0;flex-wrap:wrap}
#devices-root .dv-bar label{margin:0}
#devices-root .dv-bar .lx-find{flex:1 1 220px;min-width:180px}
/* Beside an open panel the row (578px at 1440) holds the order (171px) and the group (242px) with 149px left: the
   box gives way to that, so 찾기 · 정렬 · 정밀 검사 · 새로 고침 stay one line (명세 8.13의 3; PC3 18453 b155: the
   box's 220px sent the group to a second line). A group with more to say (원격 정리) still goes on whole at the end. */
@media (min-width:1101px){
  .lx-split:has(>.lx-aside):where(:not([data-lx-roomy])) #devices-root .dv-bar .lx-find{flex-basis:120px;min-width:120px}
}
#devices-root .dv-bar .lx-find input{text-overflow:ellipsis}
#devices-root .dv-order{display:inline-flex;align-items:center;gap:6px}
#devices-root .dv-order select{width:auto;height:34px;min-height:0}
/* 정밀 검사, the count and 새로 고침 are one group at the row's end (PC eye③): a row too narrow for all of it (the
   list beside its panel) puts the group on its second line under the order, at the end, never apart on the left. */
#devices-root .dv-tools{flex:0 1 auto;gap:6px 8px;flex-wrap:wrap;justify-content:flex-end;min-width:0;margin-left:auto}
#devices-root .dv-deep{flex:0 1 auto;min-width:0}
/* The OS chips and 정밀 검사 are one line under the find row (PC2 P26); a narrow page wraps the group whole at its end. */
#devices-root .dv-filters{gap:6px 12px;flex-wrap:wrap;margin:0;min-width:0}
#devices-root .dv-filters .dv-os{gap:6px;flex-wrap:wrap}
#devices-root .dv-deep-row>.lx-lbl{flex:none;white-space:nowrap}
#devices-root .dv-range{flex:0 1 auto}
#devices-root .dv-deep-row{gap:6px 8px;flex-wrap:wrap}
#devices-root .dv-deep-switch{gap:8px;margin:0;color:var(--ds-text);font-size:14px;font-weight:500;cursor:pointer}
/* The stage (T09-21) is a select of 정밀 검사's name, as the order's is (.dv-order select). */
#devices-root .dv-deep-stage{gap:8px;margin:0;color:var(--ds-text);font-size:14px;font-weight:500}
#devices-root .dv-deep-select{width:auto;height:34px;min-height:0}
/* 정밀 검사 is a checkbox with the switch's look (redesign-rf1.css .lx-sw, by its aria-checked): a press saves at once. */
#devices-root input.dv-sw{appearance:none;-webkit-appearance:none;margin:0}
#devices-root input.dv-sw:disabled{opacity:.55;cursor:not-allowed}
#devices-root input.dv-sw:focus-visible{outline:2px solid var(--ds-focus);outline-offset:2px}

/* A list being read: the find row's two boxes above the shared table skeleton. */
#devices-root .dv-wait-bar{display:flex;gap:8px;margin:0}
#devices-root .dv-wait-bar span{height:34px;border-radius:8px;background:var(--ds-surface-2)}
#devices-root .dv-wait-bar span:first-child{flex:0 1 320px}
#devices-root .dv-wait-bar span:last-child{flex:0 0 180px}
/* A note with its one button: the words and the button keep a gap. */
#devices-root .lx-note.lx-row{display:flex;align-items:center;gap:8px 12px}

/* Keep overflow inside the list, including beside a panel. The region is keyboard scrollable. */
#devices-root [data-dv-rows]{min-width:0}
#devices-root .dv-table-scroll{width:100%;min-width:0;max-width:100%;overflow-x:auto;contain:inline-size;overscroll-behavior-x:contain}
#devices-root .dv-table-scroll:focus-visible{outline:2px solid var(--ds-focus);outline-offset:-2px}
/* Fixed layout must reserve the identity column as well as the optional status columns. When their widths exceed
   the available space the table grows inside its scroll region, instead of leaving the name a zero-width remainder. */
#devices-root .dv-t{table-layout:fixed}
#devices-root .dv-t th:first-child{width:240px;min-width:240px}
#devices-root .dv-t td:first-child .lx-nm{white-space:normal;overflow:visible;overflow-wrap:anywhere;text-overflow:clip}
/* 수집 and 기기 정책 keep their words whole beside an open panel too. */
#devices-root .dv-t td[data-dv-label="기기 정책"],#devices-root .dv-t th.dv-fold-s{width:128px}
#devices-root .dv-t td[data-dv-label="인증"],#devices-root .dv-t th.lx-drop:not(.lx-r){width:112px}
/* 수집 keeps the whole last collection time (2026. 10. 12. 오후 12:28) beside an open panel. */
#devices-root .dv-t th:nth-child(2),#devices-root .dv-t td[data-dv-label="수집"]{width:168px}
#devices-root .dv-t td[data-dv-label="수집기"],#devices-root .dv-t th.lx-r:last-child{width:64px}
/* A head keeps one line inside its own column: a narrow one ends in … and never runs over the next. */
#devices-root .dv-t th{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
#devices-root .dv-t tr.dv-row:focus-visible{outline:2px solid var(--ds-focus);outline-offset:-2px}
/* The row whose panel is open (시안 .tr.is-sel: r8, no line under it): the fill is redesign-rf1.css's, a table row's
   corners are its end cells'. */
#devices-root .dv-t tr.dv-row[aria-selected="true"] td{border-bottom-color:transparent}
#devices-root .dv-t tr.dv-row[aria-selected="true"] td:first-child{border-radius:8px 0 0 8px}
#devices-root .dv-t tr.dv-row[aria-selected="true"] td:last-child{border-radius:0 8px 8px 0}
/* Beside a panel and under 1100px the end cells are folded (.lx-drop): the corner is the last cell still shown. */
.lx-split:has(>.lx-aside):where(:not([data-lx-roomy])) #devices-root .dv-t tr.dv-row[aria-selected="true"] td:nth-last-child(1 of :not(.lx-drop)){border-radius:0 8px 8px 0}
@media (max-width:1100px){
  #devices-root .dv-t tr.dv-row[aria-selected="true"] td:nth-last-child(1 of :not(.lx-drop)){border-radius:0 8px 8px 0}
}
#devices-root .dv-foldsum-s{display:none}
/* Beside an open panel what 인증 and 수집기 said (.lx-dropsum) goes on in the name's one grey line (명세 6.6: 이름 + 회색
   보조 한 줄), after a middle dot and whole up to 176px; the OS · ID words before it end in … (the ID whole is the
   name's title and the panel's). Under 1100px the 기기 column is too narrow for both (178px): the two lines stay. */
@media (min-width:1101px){
  .lx-split:has(>.lx-aside):where(:not([data-lx-roomy])) #devices-root .dv-t td[data-dv-label="기기"]>.lx-cell{display:grid;grid-template-columns:minmax(0,auto) auto;justify-content:start}
  .lx-split:has(>.lx-aside):where(:not([data-lx-roomy])) #devices-root .dv-t td[data-dv-label="기기"]>.lx-cell>:not(.lx-sub:not(.dv-foldsum-s)){grid-column:1/-1;width:0;min-width:100%}
  .lx-split:has(>.lx-aside):where(:not([data-lx-roomy])) #devices-root .dv-t td[data-dv-label="기기"]>.lx-cell>.lx-dropsum{max-width:176px;overflow:clip}
  .lx-split:has(>.lx-aside):where(:not([data-lx-roomy])) #devices-root .dv-t td[data-dv-label="기기"]>.lx-cell>.lx-dropsum::before{content:"·";margin:0 .3em}
}
#devices-root .dv-t tr.dv-revoked .lx-nm{color:var(--ds-text-3)}
#devices-root .dv-sort{display:inline-flex;align-items:center;gap:4px;color:inherit;font:inherit;cursor:pointer}
#devices-root .dv-sort-mark{min-width:.8em;color:var(--ds-text-2)}

/* 등록 · 설치: one column at a form's width. */
#devices-root .dv-enroll{max-width:760px}
#devices-root .dv-step{display:flex;flex-direction:column;gap:12px;min-width:0}
#devices-root .dv-form{gap:0}
#devices-root .dv-form .lx-setrow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,280px);gap:6px 20px;align-items:center;padding:12px 0;border-bottom:1px solid var(--ds-line)}
#devices-root .dv-form .lx-row{padding-top:12px}
#devices-root .dv-input{min-width:0}
#devices-root .dv-unit{flex-wrap:nowrap;gap:8px}
#devices-root .dv-unit .lx-in{width:110px}
/* The token shown once is the shared warning note: the old sheets' box (style.css .dv-issued) does not reach it. */
#devices-root .dv-issued{margin:0;border:0;background:var(--ds-caution-soft)}
#devices-root .dv-issued .lx-stack{gap:6px;min-width:0}
#devices-root .dv-secret{display:block;padding:8px 10px;border-radius:8px;background:var(--ds-surface);color:var(--ds-text);overflow-wrap:anywhere;user-select:all}
#devices-root .dv-steps{display:flex;flex-direction:column;gap:14px;margin:0;padding:0 0 0 20px}
#devices-root .dv-steps>li{display:flex;flex-direction:column;gap:6px;min-width:0}
#devices-root .dv-cmd{display:flex;align-items:flex-start;gap:8px;min-width:0;margin:0;padding:0;border:0;border-radius:0;background:none}
#devices-root .dv-cmd pre{flex:1;min-width:0;margin:0;padding:10px 12px;border-radius:8px;background:var(--ds-surface-2);font:13px/1.55 var(--ds-font-mono);white-space:pre-wrap;overflow-wrap:anywhere}
#devices-root .dv-notice{grid-template-columns:112px minmax(0,1fr)}
/* 설치 현황 (T05-11): the counts as one line of figures, each install's nine steps as chips that wrap in their cell. */
#devices-root .dv-counts{gap:24px;flex-wrap:wrap}
#devices-root .dv-count{gap:2px}
#devices-root .dv-count>b{font-size:20px;font-variant-numeric:tabular-nums}
#devices-root .dv-installs td:first-child{width:220px}
/* Sensor 자동 업데이트 (T21-26): the head's state and target in one line, a ring a tile, the policy's numbers narrow. */
#devices-root .dv-update-head{gap:12px}
#devices-root .dv-update-head .lx-h3{margin:0}
#devices-root .dv-ring{gap:6px;background:var(--ds-surface-2)}
#devices-root .dv-ring-n{gap:12px;font-variant-numeric:tabular-nums}
#devices-root .dv-update-n{width:88px}
#devices-root .dv-update [data-dv-update-part="policy"]{max-width:760px}
#devices-root .dv-update-chips{margin:0 0 8px}
#devices-root .dv-update-history>summary{cursor:pointer;list-style:none}
#devices-root .dv-stages{display:flex;flex-wrap:wrap;gap:6px 10px;margin:0 0 4px;padding:0;list-style:none}
#devices-root .dv-stages>li{display:flex;flex-direction:column;gap:2px;min-width:0}
#devices-root .dv-files>li{align-items:center;gap:12px;padding:6px 0;border-bottom:1px solid var(--ds-border)}
#devices-root .dv-fold>summary{cursor:pointer;color:var(--ds-text-2);font-size:14px;font-weight:600;padding:6px 0}
#devices-root .dv-fold[open]>summary{margin-bottom:8px}
#devices-root .dv-lines{display:flex;flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;font-size:13px;color:var(--ds-text-2)}
#devices-root .dv-tokens td:last-child,#devices-root .dv-tokens th:last-child{width:48px}

/* The ⋯ of a row or a token: a native fold in the menu's look (redesign-rf1.css .lx-more-menu). */
.dv-acts{position:relative}
.dv-acts>summary{list-style:none}
.dv-acts>summary::-webkit-details-marker{display:none}
.dv-acts:not([open])>.lx-more-menu{display:none}

/* The panel (portalUi.panel) beside the list. */
.dv-panel{gap:16px}
.dv-panel .dv-state{display:flex;flex-direction:column;flex-wrap:nowrap;align-items:flex-start;gap:8px}
.dv-panel .dv-state .lx-bdg{align-self:flex-start}
.dv-panel .dv-why{margin:0;color:var(--ds-text-2)}
.dv-panel .dv-kv{grid-template-columns:92px minmax(0,1fr)}
.dv-panel .dv-kv dd{overflow-wrap:anywhere}
.dv-panel .dv-whole{font-size:var(--ds-fs-xs);overflow-wrap:anywhere}
.dv-panel .dv-fold>summary{cursor:pointer;color:var(--ds-text-2);font-size:13px;font-weight:600}
.dv-panel .dv-lines{display:flex;flex-direction:column;gap:6px;margin:8px 0 0;padding:0;list-style:none;font-size:13px;color:var(--ds-text-2)}
.dv-panel .dv-agents{gap:4px}
.dv-panel .dv-agent{display:flex;width:100%;min-width:0;padding:6px 0;border-bottom:1px solid var(--ds-line)}
[data-dv-panel="awaiting"] .dv-li{padding:6px 0;border-bottom:1px solid var(--ds-line)}

@media (max-width:900px){
  #devices-root .dv-head{flex-wrap:wrap}
  #devices-root .dv-basis{justify-content:flex-start;margin-left:0}
  #devices-root .dv-form .lx-setrow{grid-template-columns:minmax(0,1fr)}
  /* The old sheet's narrow rows (screens-operations.css: each cell a labelled grid line) do not reach this table. */
  #devices-root .dv-t tr.dv-row>td[data-dv-label]{display:table-cell}
  #devices-root .dv-t tr.dv-row>td[data-dv-label]::before{content:none}
  #devices-root .dv-t tr.dv-row>td[data-dv-label]>*{grid-column:auto}
  #devices-root .dv-t tr.dv-row>td.lx-drop{display:none}
}
@media (max-width:600px){
  #devices-root .dv-t tr.dv-row>td.dv-fold-s,#devices-root :is(.dv-t,.dv-tokens) :is(th,td).dv-fold-s{display:none}
  #devices-root .dv-foldsum-s{display:block}
  #devices-root .dv-tokens{table-layout:fixed}
  #devices-root .dv-tokens th:nth-child(4),#devices-root .dv-tokens td:nth-child(4){width:124px}
  #devices-root .dv-t tr.dv-row[aria-selected="true"] td:nth-last-child(1 of :not(.lx-drop,.dv-fold-s)){border-radius:0 8px 8px 0}
  #devices-root .dv-t th:nth-child(2),#devices-root .dv-t td[data-dv-label="수집"]{width:150px}
}