/* 리셋 — 모든 레이어 중 가장 약해야 한다. 무엇이든 덮을 수 있도록 base.reset에 둔다. */
@layer base.reset {
  /* ── 기본 리셋 ── */

  /* 짧은 목록에서 긴 상세로 이동해 세로 스크롤바가 생겨도 중앙 정렬 기준선이
     움직이지 않도록 스크롤바 자리를 항상 예약한다. */
  html {
    scrollbar-gutter: stable;
  }

  * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }

  body {
    font-family: var(--font-family);
    font-size: var(--font-size-md);
    line-height: var(--line-height-normal);
    color: var(--color-text);
    background: var(--color-bg);
    /* 가로 넘침을 스크롤바 대신 잘라낸다. 증상을 가리는 처치라 넘침 자체를 없애는 것이
       먼저다 — 잘린 콘텐츠는 스크롤로도 닿을 수 없어 스크롤바보다 나쁘다.
       scripts/capture_viewports.py --overflow 가 넘침을 기계적으로 검출한다(EN-049). */
    overflow-x: hidden;
  }

  /* 문장 안 강조를 문서 기본으로 둔다. 부품마다 굵기를 다시 적으면 그것이 조판 예외가
     되므로 여기 한 번 둔다 — M3 타입 역할은 블록 단위 조판을 전제해 인라인 강조에
     대응이 없다(EN-060 5-2).

     UA 기본값 bolder에 맡기지 않는 이유는 그것이 **상대값**이라서다. 상속 굵기에 따라
     결과가 갈린다 — 400·500에서는 700이 되지만 700에서는 900을 요구한다. 그런데 Inter를
     400..800 가변으로 받으므로 900은 800으로 잘리고, 그 잘림이 조용하다. 우리 역할
     어휘가 400·500·700이라 900은 체계 밖 값이기도 하다. 절대값으로 못 박는다. */
  strong, b {
    font-weight: 700;
  }

  /* fieldset은 UA 스타일이 min-inline-size: min-content라 명시적으로 풀지 않으면
     좁은 화면에서 절대 줄지 않는다. 체크아웃 배송지 fieldset이 375px에서 화면을
     넘기던 원인이었다 — 대부분의 리셋이 갖는 한 줄이다. */
  fieldset {
    min-width: 0;
  }

  /* hidden 속성은 display를 주는 어떤 클래스보다 세야 한다. UA의 [hidden]{display:none}은
     명시도 0-0-0이라 `.cart-summary { display: flex }` 한 줄에 조용히 깨진다 — JS가
     `el.hidden = true`를 세워도 화면에는 그대로 남는다(EN-068에서 국내 배송비 행이
     안 사라지던 원인, 프로퍼티만 검사한 테스트로는 잡히지 않았다).
     레이어 승격으로는 못 이긴다(리셋이 가장 약한 층이다) — !important로 못 박는다.
     until-found는 브라우저가 검색으로 펼쳐야 하므로 예외로 둔다. */
  [hidden]:not([hidden="until-found"]) {
    display: none !important;
  }
}