/* lab.css — LP Lab·ETN 페이지 공용 정돈 레이어.
   각 페이지의 인라인 <style> 뒤에 로드되어 표 겹침/깨짐·스크롤바를 대시보드 톤으로 통일한다.
   (styles.css의 KB 옐로우 hover-only 스크롤바 패턴을 그대로 차용) */

/* ── 페이지/영역 스크롤바: 평소 투명, 호버 시 노랑 thin ── */
html{scrollbar-width:thin;scrollbar-color:rgba(255,207,0,.28) transparent}
html::-webkit-scrollbar{width:9px;height:9px}
html::-webkit-scrollbar-track{background:transparent}
html::-webkit-scrollbar-thumb{background:rgba(255,207,0,.22);border-radius:999px}
html::-webkit-scrollbar-thumb:hover{background:rgba(255,207,0,.5)}

.table-wrap,.uni-wrap,.scroll-y{
  overflow:auto;
  scrollbar-width:none;
  scrollbar-color:transparent transparent;
  scrollbar-gutter:stable;
}
.table-wrap:hover,.table-wrap:focus-within,
.uni-wrap:hover,.uni-wrap:focus-within,
.scroll-y:hover,.scroll-y:focus-within{
  scrollbar-width:thin;
  scrollbar-color:rgba(255,207,0,.45) transparent;
}
.table-wrap::-webkit-scrollbar,.uni-wrap::-webkit-scrollbar,.scroll-y::-webkit-scrollbar{width:0;height:0}
.table-wrap:hover::-webkit-scrollbar,.table-wrap:focus-within::-webkit-scrollbar,
.uni-wrap:hover::-webkit-scrollbar,.uni-wrap:focus-within::-webkit-scrollbar,
.scroll-y:hover::-webkit-scrollbar,.scroll-y:focus-within::-webkit-scrollbar{width:7px;height:7px}
.table-wrap::-webkit-scrollbar-thumb,.uni-wrap::-webkit-scrollbar-thumb,.scroll-y::-webkit-scrollbar-thumb{background:transparent;border-radius:999px}
.table-wrap:hover::-webkit-scrollbar-thumb,.uni-wrap:hover::-webkit-scrollbar-thumb,.scroll-y:hover::-webkit-scrollbar-thumb{background:rgba(255,207,0,.42)}

/* ── 표 기본기: 헤더 고정·줄맞춤·긴 텍스트 말줄임 ── */
.lab-page table{border-collapse:separate;border-spacing:0 3px}
.lab-page thead th{
  position:sticky;top:0;z-index:3;
  background:linear-gradient(180deg,#0b1a30 0%,#0a1729 100%);
  box-shadow:0 1px 0 rgba(147,170,205,.25);
  padding:7px 8px;font-weight:700;color:#93a8c6;white-space:nowrap;
}
.lab-page td{vertical-align:middle}
.lab-page .name-cell,.lab-page td.name,.lab-page .uni-underlying{
  max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
/* 가로로 넘치는 표는 컨테이너 안에서만 스크롤 — 셀 겹침·페이지 가로 스크롤 방지 */
.lab-page .card{min-width:0}
.lab-page .table-wrap,.lab-page .uni-wrap{overflow-x:auto;overflow-y:auto;border-radius:12px}
.lab-page .table-wrap table,.lab-page .uni-wrap table{min-width:max-content;width:100%}

/* ── 카드·헤더 리듬 통일 ── */
.lab-page .card{box-sizing:border-box}
.lab-page .hero{margin:14px 0 12px}
.lab-page .hero h1{letter-spacing:-.5px}
.lab-page .hero p{max-width:960px}
.lab-page h2{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;letter-spacing:-.3px}
.lab-page h2 .muted{font-weight:500}

/* 입력·버튼 포커스 톤 통일 */
.lab-page input:focus,.lab-page select:focus{outline:none;border-color:#facc15;box-shadow:0 0 0 2px rgba(250,204,21,.18)}
.lab-page .btn,.lab-page .save{transition:filter .12s ease}
.lab-page .btn:hover,.lab-page .save:hover{filter:brightness(1.18)}

/* 상태 필 줄맞춤 */
.lab-page .pill{line-height:1.2;margin:2px 3px 2px 0}

/* 모바일/좁은 폭에서 카드 그리드 무너짐 방지 */
@media(max-width:900px){
  .lab-page .grid{grid-template-columns:1fr!important}
  .lab-page .name-cell,.lab-page td.name,.lab-page .uni-underlying{max-width:150px}
}

/* The shared page frame owns horizontal sizing. Keep wide data tables inside
   their scroll container instead of allowing a table min-width to widen the
   whole document (notably the C/R calculator result table). */
.lab-page table{min-width:0;max-width:100%}
.lab-page .table-wrap,.lab-page .uni-wrap{max-width:100%}
.lab-page .table-wrap table,.lab-page .uni-wrap table{min-width:max-content}