/*
 * Dstory — Base layer (전역 유틸리티)
 * ============================================================================
 * design-tokens.css(값) 바로 다음, 컴포넌트 CSS 보다 먼저 실린다.
 * 여기에는 **어느 화면에서나 동일하게 참인 것**만 둔다.
 *
 *   · [hidden] 정규화 — 컴포넌트마다 반복하던 규칙을 한 곳으로.
 *   · .dp-sr-only  — 화면에는 안 보이고 스크린리더만 읽는 라벨.
 *
 * 여기에 리셋(box-sizing 등)을 추가하지 않는다 — 기존 레이아웃이 UA 기본값을
 * 전제로 짜여 있어, 지금 바꾸면 전 화면이 미세하게 어긋난다. 새 제품에 이
 * 시스템을 이식할 때는 리셋을 여기에 얹어 시작하면 된다.
 * ============================================================================
 */

/* hidden 속성이 붙으면 무조건 사라진다.
 * 이게 없으면 컴포넌트의 display:flex/grid 가 UA 의 [hidden] 기본값을 이겨서
 * "숨겼는데 보이는" 사고가 난다 — 예전엔 패널·탭·모달마다 같은 규칙을 따로
 * 써 두고 있었다(8곳). 유틸리티이므로 !important 가 정당하다. */
[hidden] {
	display: none !important;
}

/* 스크린리더 전용 텍스트 — 아이콘 버튼의 이름표 등. */
.dp-sr-only {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}