// 기본 Reset 규칙을 theme.init 레이어에 정의
@layer theme.init {
  :root {
    -webkit-tap-highlight-color: transparent;
    text-size-adjust: none;
    overflow-wrap: break-word;
    word-break: break-word;
  }

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

  * {
    letter-spacing: -0.05em;
    flex-shrink: 0;
    overscroll-behavior-y: none;
    font-family: var(
      --font-family-sans,
      "Pretendard JP Variable",
      "Pretendard JP",
      "Pretendard Variable",
      "Pretendard",
      "Inter",
      sans-serif
    ); // Pretendard/Inter 스택을 전역 기본값으로 유지한다.
  }

  *:focus,
  *:focus-within,
  *:focus-visible {
    outline: none;
  }

  html {
    width: 100%;
    font-size: 10px;
    font-family: var(--font-family-sans);
    background-color: #fff;
    touch-action: manipulation;
  }

  body {
    width: 100%;
    position: relative;
    background: none;
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    margin: 0;
    padding: 0;
    font-weight: 500;
    line-height: 1em;
  }

  strong,
  b {
    font-weight: 700;
    line-height: 1em;
  }

  p,
  span,
  i,
  sup,
  sub,
  del,
  ins,
  s {
    margin: 0;
    padding: 0;
    line-height: 1em;
    word-break: keep-all;
  }

  i,
  address,
  cite,
  em,
  q {
    font-weight: 400;
    font-style: normal;
  }

  blockquote,
  abbr,
  dfn {
    font-weight: 400;
  }

  pre,
  code,
  samp,
  kbd,
  var {
    font-family:
      "Consolas", "Monaco", "Menlo", "DejaVu Sans Mono", SFMono-Regular,
      "Liberation Mono", "Courier New", monospace;
  }

  blockquote,
  q {
    quotes: none;
  }

  blockquote::before,
  blockquote::after,
  q::before,
  q::after {
    content: "";
  }

  img,
  svg {
    max-width: 100%;
    object-fit: contain;
    perspective: 1;
  }

  li,
  dt,
  dd {
    list-style: none;
  }

  table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    table-layout: fixed;
  }

  label {
    display: block;
  }

  legend,
  caption {
    display: none;
  }

  article,
  aside,
  footer,
  header,
  main,
  nav,
  section,
  time,
  audio,
  canvas,
  figure,
  figcaption,
  video,
  meter,
  progress,
  details,
  summary {
    display: block;
  }

  figure {
    position: relative;
    width: fit-content;
    height: fit-content;
    font-size: 0;
  }

  a {
    display: block;
    color: #333;
    text-decoration: none;
    cursor: pointer;
  }

  input,
  select,
  button,
  textarea {
    display: block;
    max-width: 100%;
    background: transparent;
    border-radius: 0;
    box-shadow: none;
    outline: none;
    caret-color: transparent;
    appearance: none;
  }

  button {
    cursor: pointer;
    font-family: inherit;
    user-select: none;
  }

  textarea {
    resize: none;
  }

  select {
    user-select: none;
  }

  select::-ms-expand {
    opacity: 0;
  }

  input::placeholder,
  textarea::placeholder {
    opacity: 1;
    color: #959595;
  }

  input:focus::placeholder,
  textarea:focus::placeholder {
    color: transparent;
  }

  [type="button"],
  [type="reset"],
  [type="submit"] {
    appearance: button;
  }

  [type="search"] {
    appearance: textfield;
    outline-offset: -2px;
  }

  :-webkit-inner-spin-button,
  ::-webkit-outer-spin-button {
    height: auto;
  }

  ::-webkit-search-decoration,
  ::-webkit-search-cancel-button {
    appearance: none;
  }

  ::-webkit-file-upload-button {
    appearance: button;
  }

  input[type="date"],
  input[type="number"] {
    appearance: none;
  }

  input[type="date"]::-webkit-inner-spin-button,
  input[type="number"]::-webkit-inner-spin-button {
    display: none;
  }

  input[type="date"]::-webkit-calendar-picker-indicator,
  input[type="number"]::-webkit-calendar-picker-indicator {
    opacity: 0;
  }

  input[type="date"]::-webkit-clear-button,
  input[type="number"]::-webkit-clear-button {
    display: none;
  }

  input[type="date"]::-ms-clear,
  input[type="number"]::-ms-clear {
    display: none;
  }

  input[type="range"]::-webkit-slider-thumb {
    appearance: none;
  }

  input[type="checkbox"] {
    appearance: checkbox;
  }

  button:disabled {
    cursor: default;
  }

  progress {
    appearance: none;
    border: 1px solid #e1e1e1;
  }

  progress::-webkit-progress-bar {
    background-color: #fff;
  }

  progress::-webkit-progress-value {
    background-color: grey;
  }

  @media (orientation: landscape) {
    html.mobile-device {
      font-size: 1vw;
    }
  }

  @media (orientation: portrait) {
    html.mobile-device {
      font-size: 1vw;
    }
  }
}
