/* 센터 허브 공용 시큐리티 테마 — gMainClient login 팔레트(--lg-*) + ConceptSample gms_hub_v3 브랜딩.
   폰트는 자가호스팅(wwwroot/fonts/, OFL) — 외부 CDN 의존 0.
   한글은 시스템 글꼴 폴백: Noto Sans KR 은 구글이 248개 서브셋으로 배포해 전량 자가호스팅이
   비현실적(8MB+)이라, 설치돼 있으면 쓰고 없으면 맑은 고딕/Apple SD Gothic Neo 로 저하한다. */
@font-face { font-family:'Rajdhani'; font-weight:500; font-display:swap;
  src:url('/fonts/rajdhani-500.woff2') format('woff2'); }
@font-face { font-family:'Rajdhani'; font-weight:600; font-display:swap;
  src:url('/fonts/rajdhani-600.woff2') format('woff2'); }
@font-face { font-family:'Rajdhani'; font-weight:700 800; font-display:swap;
  src:url('/fonts/rajdhani-700.woff2') format('woff2'); }
@font-face { font-family:'IBM Plex Mono'; font-weight:400; font-display:swap;
  src:url('/fonts/ibmplexmono-400.woff2') format('woff2'); }
@font-face { font-family:'IBM Plex Mono'; font-weight:500 600; font-display:swap;
  src:url('/fonts/ibmplexmono-500.woff2') format('woff2'); }

:root{
  /* 브라우저 기본 폼 컨트롤(체크박스·드롭다운 목록·스크롤바)을 어두운 쪽으로 그리게 한다.
     이게 없으면 체크박스만 흰 사각형으로 튀고, select 목록도 흰 배경으로 열린다. */
  color-scheme:dark;
  --hub-bg:#030608; --hub-s1:#060d18; --hub-s2:#091422; --hub-s3:#0d1c30;
  --hub-b2:rgba(0,180,255,0.15); --hub-b3:rgba(0,180,255,0.3); --hub-b4:rgba(0,180,255,0.55);
  --hub-blue:#0090ff; --hub-blue2:#40b4ff; --hub-cyan:#00d8ff; --hub-teal:#00e8c0;
  --hub-red:#ff3344; --hub-green:#00ee88; --hub-amber:#ffaa00;
  /* candidate4 팔레트 별칭 — 밝은 변형 + 보라 채널 + 최약 보더 */
  --hub-cyan2:#60ecff; --hub-teal2:#40ffda;
  --hub-violet:#6040ff; --hub-violet2:#8866ff;
  --hub-amber2:#ffcc44; --hub-red2:#ff7080; --hub-green2:#44ffaa;
  --hub-b1:rgba(0,180,255,0.07);
  /* 가독성: ConceptSample 원본(--t1 #d0eeff / --t2 #4a90c0 / --t3 #1e4060)은 배경과 대비가 낮아
     라벨·부제가 잘 안 읽힌다. 한 단계씩 밝혀 본문 대비를 확보하고, --hub-t4 를 순수 장식용으로 분리. */
  --hub-t1:#e8f7ff; --hub-t2:#8fc4e8; --hub-t3:#5f92ba; --hub-t4:#2c5578;
  --hub-fn:'Rajdhani','Segoe UI','Malgun Gothic',sans-serif;
  /* 라틴/숫자는 IBM Plex Mono(HUD 느낌) 유지, 한글 글리프(플렉스모노에 없음)는 맑은 고딕으로
     글리프 단위 폴백 — 한글 라벨이 monospace 로 떨어져 가독성이 나빠지던 문제 해결(운영자 지적 2026-07-30). */
  --hub-fm:'IBM Plex Mono','Malgun Gothic','Apple SD Gothic Neo',ui-monospace,monospace;
  /* 본문 글꼴 = WebAlarmManager 와 같은 스택(app.css html,body). 운영자가 이미 매일 보는 화면과
     같은 글꼴이라 눈에 익고, Noto Sans KR 은 미설치 PC 에서 조용히 폴백돼 결과가 들쭉날쭉했다.
     한글은 이 스택에 없으므로 맑은 고딕/Apple SD Gothic Neo 를 뒤에 붙여 명시적으로 고정한다
     (브라우저 기본 sans-serif 에 맡기면 PC 마다 달라진다). */
  --hub-fk:'Segoe UI Variable Display','Bahnschrift','Trebuchet MS','Arial Nova',
           'Malgun Gothic','Apple SD Gothic Neo',sans-serif;
  /* 가독성 스케일 — 운영자 지적(2026-07-30): 컨셉 글자가 작음. 한 단계 키우고 토큰화.
     화면별 미세조정은 이 값들만 건드리면 일괄 반영된다. */
  --hub-fs-xs:12.5px;   /* 상태 뱃지·미세 라벨 */
  --hub-fs-sm:14px;     /* 부제·표 보조 */
  --hub-fs-base:16px;   /* 본문 기본(기존 15 → 16) */
  --hub-fs-md:18px;     /* 소제목·강조 라벨 */
  --hub-fs-lg:22px;     /* KPI 수치·패널 제목 */
  --hub-fs-xl:30px;     /* 대형 KPI */
}

*{box-sizing:border-box;}
body{
  margin:0; min-height:100vh; color:var(--hub-t1);
  font-family:var(--hub-fk);
  font-size:var(--hub-fs-base);            /* 시안 13px → --hub-fs-base(16px) */
  line-height:1.5;
  background:var(--hub-bg);
  background-image:
    radial-gradient(ellipse 1000px 700px at 25% 30%,rgba(0,90,255,0.07) 0%,transparent 55%),
    radial-gradient(ellipse 600px 600px at 80% 70%,rgba(0,200,255,0.05) 0%,transparent 50%);
}
/* 화려함: 배경 그리드 + 코너 데코 + 스캔선 (레이아웃에서 요소로 삽입) */
.hub-bg-grid{position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:linear-gradient(rgba(0,144,255,0.03) 1px,transparent 1px),
    linear-gradient(90deg,rgba(0,144,255,0.03) 1px,transparent 1px);background-size:52px 52px;}
.hub-bg-scan{position:fixed;left:0;right:0;height:2px;pointer-events:none;z-index:0;
  background:linear-gradient(90deg,transparent,rgba(0,200,255,0.10),transparent);
  animation:hubscan 11s linear infinite;}
@keyframes hubscan{0%{top:-2px;opacity:0}2%{opacity:1}98%{opacity:1}100%{top:100vh;opacity:0}}
.hub-corner{position:fixed;width:80px;height:80px;border-style:solid;opacity:.16;z-index:0;}
.hub-corner.tl{top:18px;left:18px;border-color:var(--hub-blue2);border-width:2px 0 0 2px;}
.hub-corner.tr{top:18px;right:18px;border-color:var(--hub-teal);border-width:2px 2px 0 0;}
.hub-corner.bl{bottom:18px;left:18px;border-color:var(--hub-teal);border-width:0 0 2px 2px;}
.hub-corner.br{bottom:18px;right:18px;border-color:var(--hub-blue2);border-width:0 2px 2px 0;}

/* 레이아웃 카드 */
main{position:relative;z-index:1;background:linear-gradient(180deg,var(--hub-s2),var(--hub-s1));
  border:1px solid var(--hub-b2);border-radius:14px;
  box-shadow:0 22px 60px rgba(0,0,0,.5),0 0 0 1px rgba(0,180,255,.05) inset;
  padding:2rem 2.5rem;margin:5vh auto;max-width:min(94vw,1080px);}
main.hub-narrow{max-width:420px;}

h1{font-family:var(--hub-fn);font-weight:700;letter-spacing:.04em;color:var(--hub-t1);
  text-shadow:0 0 18px rgba(0,180,255,.25);}

/* 내비 */
nav a{color:var(--hub-blue2);text-decoration:none;margin-right:.6rem;font-family:var(--hub-fn);}
nav a:hover{color:var(--hub-cyan);text-shadow:0 0 10px rgba(0,216,255,.4);}

/* hidden 속성은 어떤 레이아웃 규칙보다 우선한다.
   아래 input/select 의 display:block 이 브라우저 기본 숨김 규칙을 이겨서, 숨긴 줄 알았던
   예약 시각 입력이 그대로 보이는 버그가 실제로 났다(2026-07-29). 요소마다 클래스를 덧대는
   대신 여기서 한 번에 못 박는다. */
[hidden]{display:none !important;}

/* 입력/버튼 */
input,select{display:block;width:100%;box-sizing:border-box;margin:.5rem 0;padding:.62rem .8rem;
  border-radius:8px;border:1px solid var(--hub-b2);background:rgba(3,10,20,.75);color:var(--hub-t1);
  font-family:var(--hub-fk);}
input:focus,select:focus{outline:none;border-color:var(--hub-b4);
  box-shadow:0 0 0 3px rgba(0,180,255,.12);}
/* 체크박스·라디오는 위 텍스트 입력 규칙(display:block · width:100% · padding)의 대상이 아니다.
   그대로 두면 표 안의 체크박스가 기본 13px 로 쪼그라든 채 위아래 여백만 붙는다. */
/* OS 기본 체크박스는 어떤 색을 줘도 각지고 투박하다 — 직접 그린다.
   appearance:none 이면 체크 표시도 사라지므로 ::after 로 다시 그려야 한다. */
input[type=checkbox],input[type=radio]{
  appearance:none;-webkit-appearance:none;position:relative;
  display:inline-block;width:16px;height:16px;margin:0;padding:0;vertical-align:middle;flex:none;
  border:1px solid var(--hub-b4);border-radius:5px;background:rgba(3,12,24,.9);
  cursor:pointer;transition:border-color .12s,background .12s,box-shadow .12s;}
input[type=radio]{border-radius:50%;}
/* hover 는 "미체크" 상태에만 — :hover:not(:disabled) 는 특이도가 :checked 보다 높아,
   빼놓지 않으면 마우스가 올라가 있는 동안 체크 배경(그라데이션)이 흐린 hover 배경으로 덮여
   클릭 직후 체크 표시가 안 보인다(마우스를 치워야 나타나는 증상 — 2026-08-23 실사고). */
input[type=checkbox]:hover:not(:disabled):not(:checked),input[type=radio]:hover:not(:disabled):not(:checked){
  border-color:var(--hub-cyan);background:rgba(0,144,255,.12);}
input[type=checkbox]:checked,input[type=radio]:checked{
  border-color:var(--hub-cyan);
  background:linear-gradient(180deg,var(--hub-cyan),var(--hub-blue));
  box-shadow:0 0 8px rgba(0,216,255,.35);}
/* 체크된 상태의 hover 피드백 — 배경은 유지하고 글로우만 살짝 키운다. */
input[type=checkbox]:checked:hover:not(:disabled),input[type=radio]:checked:hover:not(:disabled){
  box-shadow:0 0 10px rgba(0,216,255,.55);}
input[type=checkbox]:checked::after{
  content:'';position:absolute;left:5px;top:1px;width:4px;height:9px;
  border:solid #041420;border-width:0 2px 2px 0;transform:rotate(42deg);}
input[type=radio]:checked::after{
  content:'';position:absolute;inset:3px;border-radius:50%;background:#041420;}
input[type=checkbox]:focus-visible,input[type=radio]:focus-visible{
  outline:none;box-shadow:0 0 0 3px rgba(0,180,255,.25);}
input[type=checkbox]:disabled,input[type=radio]:disabled{
  cursor:default;border-color:var(--hub-t4);background:rgba(3,12,24,.5);opacity:.55;}
/* 드롭다운: 닫힌 모양은 직접 그리고(기본 화살표는 OS 회색), 펼친 목록은 option 색으로 맞춘다.
   목록 팝업은 OS 가 그려서 CSS 로 완전히 통제할 수 없다 — 크롬(윈도우/리눅스)은 option 의
   background/color 를 존중하므로 여기까지가 네이티브 select 로 갈 수 있는 최선이다. */
select{
  appearance:none;-webkit-appearance:none;padding-right:2rem;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='7' viewBox='0 0 11 7'%3E%3Cpath d='M1 1l4.5 4.5L10 1' fill='none' stroke='%2340b4ff' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right .7rem center;}
select:hover{border-color:var(--hub-b3);}
select option{background:#071522;color:var(--hub-t1);}
select option:checked{background:#0d2b45;}

button,.hub-btn{padding:.6rem 1.3rem;border-radius:8px;border:1px solid var(--hub-b3);cursor:pointer;
  background:linear-gradient(180deg,var(--hub-blue),var(--hub-blue2));color:#02121f;font-weight:700;
  font-family:var(--hub-fn);letter-spacing:.04em;}
button:hover,.hub-btn:hover{filter:brightness(1.1);box-shadow:0 0 18px rgba(0,144,255,.4);}

/* 테이블 (Sites/Manage 공용) */
table{width:100%;border-collapse:collapse;}
th{font-family:var(--hub-fm);font-size:.82em;text-transform:uppercase;letter-spacing:.06em;
  color:var(--hub-t2);border-bottom:1px solid var(--hub-b2);padding:.55rem .5rem;text-align:left;}
td{padding:.55rem .5rem;border-bottom:1px solid rgba(0,180,255,.07);color:var(--hub-t1);}
tr:hover td{background:rgba(0,180,255,.04);}

/* 상태 배지 */
.hub-badge{display:inline-block;padding:.12rem .5rem;border-radius:6px;font-size:.78em;
  font-family:var(--hub-fm);}
.hub-badge.on{background:rgba(0,238,136,.15);color:var(--hub-green);}
.hub-badge.off{background:rgba(255,51,68,.15);color:var(--hub-red);}
.hub-badge.viewers{background:rgba(0,144,255,.18);color:var(--hub-blue2);}

.hub-error{color:var(--hub-red);font-family:var(--hub-fk);}

/* ── 현장 목록 지표(24h) 3열 ─────────────────────────────────────────
   의사요소(::before/::after)를 쓰지 않는다 — 이 표의 툴팁·상태점이 이미 쓰고 있어
   겹치면 서로를 조용히 가린다(과거 실사고). 전부 실제 요소로만 구성한다. */
.si{white-space:nowrap;}
.si-h{white-space:nowrap;}
.si-empty{color:var(--hub-t3);}

/* 시스템 열은 2단(CPU / 디스크)으로 쌓는다 — 한 줄에 늘어놓으면 폭이 두 배라
   현장 이름 열을 밀어내 이름이 두 줄로 접힌다. */
.si-line{display:block;line-height:1.5;}
.si-line .si-num{margin-right:0;}

/* 지표 칸은 내용이 아무리 짧아도 이 폭 아래로 눌리지 않는다 — 여기서 밀리면 남는 압력이
   현장 이름과 [접속] 버튼으로 옮겨가 글자가 세로로 접힌다(2026-08-19 실측). */
.si,.si-h{min-width:104px;}

/* 스파크라인 — 표 한 행 높이를 넘지 않게 고정. viewBox 는 100x24, 폭만 CSS 로 늘린다. */
.si-spark{width:46px;height:16px;vertical-align:middle;margin-right:4px;}
.si-spark polyline{fill:none;stroke-width:1.5;vector-effect:non-scaling-stroke;}
.si-spark.is-cpu polyline{stroke:var(--hub-blue2);}
.si-spark.is-inout polyline{stroke:var(--hub-cyan);}

/* 게이지 — 채움 폭으로 값을, 색으로 등급을 나타낸다. */
.si-gauge{display:inline-block;width:34px;height:6px;border-radius:3px;
  background:rgba(255,255,255,.12);vertical-align:middle;margin:0 4px 0 2px;overflow:hidden;}
.si-gauge-fill{display:block;height:100%;background:var(--hub-t3);}
.si-gauge.is-ok .si-gauge-fill{background:var(--hub-green);}
.si-gauge.is-warn .si-gauge-fill{background:var(--hub-amber);}
.si-gauge.is-bad .si-gauge-fill{background:var(--hub-red);}

.si-num{font-family:var(--hub-fk);font-size:11px;color:var(--hub-t2);margin-right:6px;}

.si-badge{display:inline-block;font-family:var(--hub-fk);font-size:10px;line-height:1.6;
  padding:0 5px;border-radius:8px;margin-right:4px;}
.si-badge.is-mute{background:rgba(255,255,255,.10);color:var(--hub-t2);}
.si-badge.is-warn{background:rgba(255,176,32,.16);color:var(--hub-amber);}
.si-badge.is-bad{background:rgba(255,51,68,.16);color:var(--hub-red);}

/* ── 현장 목록 페이저(서버 모드, Task 4) ─────────────────────────────
   .ha-panel-foot(hub-app.css) 톤에 맞춘다 — 같은 padding/border-top/배경/글꼴 스케일.
   의사요소(::before/::after)를 쓰지 않는다: 이 표의 툴팁(.ha-tip)·상태 점(.ha-status > i)이
   이미 의사요소를 쓰고 있어 겹치면 서로를 조용히 가린다(과거 실사고, hub-app.css 주석 참고).
   전부 실제 요소로만 구성한다. */
.ha-pager{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:12px 18px;border-top:1px solid rgba(0,180,255,.1);background:rgba(0,144,255,.02);
  font-family:var(--hub-fk);font-size:12px;color:var(--hub-t3);flex-wrap:wrap;}
.ha-pager b{color:var(--hub-t2);font-weight:700;}
.ha-pager-nav{display:flex;align-items:center;gap:8px;}
.ha-pager-btn{display:inline-flex;align-items:center;padding:5px 12px;border-radius:6px;
  font-family:var(--hub-fk);font-size:12px;font-weight:600;text-decoration:none;
  border:1px solid var(--hub-b3);color:var(--hub-blue2);background:rgba(0,144,255,.06);}
.ha-pager-btn:hover{background:rgba(0,144,255,.16);color:var(--hub-cyan);box-shadow:none;filter:none;}
.ha-pager-btn.is-disabled{color:var(--hub-t4);border-color:var(--hub-b1);background:transparent;cursor:default;}

/* 서버 모드에서 정렬 헤더·필터칩이 <a> 로 바뀔 때 기존 <span>/<div> 모양을 그대로 유지한다
   (밑줄만 지운다 — 색·배경은 기존 .ha-sort/.fc 규칙이 이미 정한다, hub-app.css). */
th.ha-sort a.ha-sort-link{color:inherit;text-decoration:none;}
a.fc{text-decoration:none;}

/* ── 현장 목록 보안 점검 배지(Task 6) ──────────────────────────────────
   기존 경보 배지(.ha-alert, hub-app.css)와 같은 자리(td[data-field="alert"])·같은 크기로 붙인다.
   새 열을 만들지 않는다 — 2026-08-19 지표 열이 현장 이름을 3줄로 접었던 실사고 재발 방지.
   의사요소(::before/::after)를 쓰지 않는다: 이 표의 툴팁(.ha-tip)·상태 점(.ha-status > i)이
   이미 의사요소를 쓰고 있어 겹치면 서로를 조용히 가린다(과거 실사고). 전부 실제 요소로만 구성한다. */
.ha-flags{display:flex;align-items:center;gap:4px;flex-wrap:wrap;}
.ha-sec{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:20px;
  padding:0 7px;border-radius:999px;font-family:var(--hub-fm);font-size:11px;font-weight:700;
  border:1px solid transparent;cursor:help;white-space:nowrap;}
/* 미흡 — 경보 배지(빨강/주황)와 다른 색(보라)을 써서, 같은 칸에 두 배지가 나란히 있어도
   "활성 경보"와 "보안 점검 미흡"을 혼동하지 않게 한다. */
.ha-sec.warn{color:var(--hub-violet2);background:rgba(96,64,255,.1);border-color:rgba(96,64,255,.35);}
/* 확인불가 — 통과(초록/청록)와 뚜렷이 다른 무채색 + 점선 테두리. "안전"이 아니라 "아직 모른다"는
   뜻이라 흐린 초록으로 두면 통과로 오독된다(이 기능의 핵심 원칙, task-6-brief). */
.ha-sec.na{color:var(--hub-t3);background:rgba(255,255,255,.03);border:1px dashed var(--hub-t4);}

/* ── 통과/미흡/확인불가 3상태 배지(Task 6, 현장 상세 페이지) ──────────────
   기존 .ha-status(hub-app.css) 는 on/off/warn/ok/bad 만 정의돼 있다 — 확인불가(na)를 그대로
   쓰면 스타일 없는 밋밋한 텍스트로 보인다. 통과(ok, 초록)·미흡(warn, 주황)과 뚜렷이 다른
   무채색 + 점선 테두리를 더한다(위 .ha-sec.na 와 같은 원칙). */
.ha-status.na{background:rgba(255,255,255,.03);border:1px dashed var(--hub-t4);color:var(--hub-t3);}
.ha-status.na > i{background:var(--hub-t4);}

/* ── 허브 자기 리소스 바 (하단 고정) ────────────────────────────────────
   gMainClient 하단 바와 같은 개념 — 모든 화면에 상시. 의사요소를 쓰지 않는다
   (이 프로젝트의 툴팁·상태점이 이미 ::before/::after 를 쓰고 있어 겹치면 서로를 가린다).
   position:fixed 라 표 폭에 영향을 주지 않는다 — 2026-08-19 에 열 추가로 현장 이름이
   세 줄로 접힌 전례가 있어, 이 바는 문서 흐름 밖에 둔다. */
.hub-resbar{position:fixed;left:0;right:0;bottom:0;z-index:30;
  display:flex;gap:18px;align-items:center;flex-wrap:wrap;
  padding:5px 14px;border-top:1px solid var(--hub-b2);
  background:rgba(6,13,24,.94);
  font-family:var(--hub-fk);font-size:var(--hub-fs-xs);color:var(--hub-t2);}
.hub-resbar b{font-weight:600;color:var(--hub-t3);margin-right:5px;letter-spacing:.02em;}
.hrb-item{white-space:nowrap;}
.hub-resbar .is-warn{color:var(--hub-amber);}
.hub-resbar .is-bad{color:var(--hub-red);}

/* 미니 게이지 — 지표 열의 .si-gauge 와 같은 방식(홈통 + 채움, 둘 다 실제 요소).
   숫자만으로는 한눈에 안 들어온다는 지적(2026-08-19)으로 추가. */
.hrb-gauge{display:inline-block;width:52px;height:5px;border-radius:3px;
  background:rgba(255,255,255,.10);vertical-align:middle;margin-left:6px;overflow:hidden;}
.hrb-fill{display:block;height:100%;width:0;border-radius:3px;
  background:linear-gradient(90deg,var(--hub-blue),var(--hub-cyan));
  box-shadow:0 0 6px rgba(0,216,255,.45);
  transition:width .45s ease-out,background .2s;}
.hrb-fill.is-warn{background:linear-gradient(90deg,var(--hub-amber),var(--hub-amber2));
  box-shadow:0 0 6px rgba(255,170,0,.45);}
.hrb-fill.is-bad{background:linear-gradient(90deg,var(--hub-red),var(--hub-red2));
  box-shadow:0 0 7px rgba(255,51,68,.55);}
/* 네트워크는 백분율이 아니라 속도라 게이지를 두지 않는다(무엇의 몇 % 인지 정의할 수 없다).
   대신 방향을 색으로 구분한다 — gMainClient 하단 바와 같은 취지. */
.hrb-net.rx{color:var(--hub-teal2);}
.hrb-net.tx{color:var(--hub-amber2);}

/* 디스크는 마운트 수만큼 칸이 생긴다(허브는 앱 / 와 PG 데이터 /data 로 나뉜다).
   개수가 박스마다 달라 고정 칸을 두지 않고 JS 가 만든다. */
.hrb-disks{display:inline-flex;gap:18px;align-items:center;}
.hrb-dval.is-warn{color:var(--hub-amber);}
.hrb-dval.is-bad{color:var(--hub-red);}
/* 바가 마지막 행을 가리지 않게 셸(.hub-app)이 그만큼 자리를 비운다 — hub-app.css 의 height 계산.
   본문(body)에 padding-bottom 을 주는 방식은 쓰지 않는다: 셸이 height:100vh 로 스스로를 뷰포트에
   고정하므로 body 패딩으로는 바를 피하지 못하고, box-sizing:border-box + min-height:100vh 와 겹쳐
   그 패딩만큼 문서 스크롤만 생긴다(2026-08-19 증상 — 바 높이만큼 스크롤 + 버튼 반쪽).
   높이는 창 폭에 따라 달라진다(칸이 많아 좁은 창에서는 두 줄로 접힌다) — hub-resbar.js 가 실제
   높이를 재서 갱신하고, 아래 값은 그 전 첫 페인트용 근사치다. */
:root{--hub-rb-h:30px;}