* { box-sizing: border-box; }
body {
  background: #fbfcff;
  color: #172239;
  margin: 0;
  font: 1rem/1.7 system-ui, sans-serif;
}
header, main {
  max-width: 47rem;
  margin: 0 auto;
  padding-inline: max(1.25rem, env(safe-area-inset-left)) max(1.25rem, env(safe-area-inset-right));
}
header {
  padding-top: max(.65rem, env(safe-area-inset-top));
  padding-bottom: .65rem;
  border-bottom: 1px solid #d9dfeb;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: .5rem 1rem;
}
header a { display: inline-flex; align-items: center; min-height: 44px; }
.brand {
  font-size: 1.7rem;
  font-weight: 750;
  letter-spacing: -.045em;
  color: #172239;
  gap: .4rem;
  text-decoration: none;
}
main { padding-block: clamp(2rem, 6vw, 4rem) max(3rem, env(safe-area-inset-bottom)); }
h1, h2 { text-wrap: balance; line-height: 1.25; }
h1 { font-size: clamp(2rem, 5vw, 3rem); margin: 0 0 1rem; }
h2 { font-size: clamp(1.3rem, 3vw, 1.7rem); margin: 2.4rem 0 .8rem; }
html:lang(ko) main { word-break: keep-all; overflow-wrap: anywhere; }
p, ol, dl { margin: .8rem 0; }
ol { padding-inline-start: 1.4rem; }
li { padding-inline-start: .25rem; margin-bottom: .75rem; }
dt { font-weight: 700; margin-top: 1rem; }
dd { margin: .25rem 0 .8rem; }
a { color: #214bc1; text-underline-offset: .18em; }
a:focus-visible { outline: 3px solid #2859d4; outline-offset: 3px; }
.action {
  display: inline-block;
  min-height: 44px;
  margin-top: 1rem;
  background: #224cc5;
  color: white;
  border-radius: .6rem;
  padding: .6rem 1rem;
  text-decoration: none;
  font-weight: 650;
}
#profile-search { margin: 1.5rem 0 .75rem; }
#profile-search label { display: block; font-weight: 650; margin-bottom: .35rem; }
.search-row { display: flex; flex-wrap: wrap; gap: .5rem; }
.search-row input {
  flex: 1 1 12rem;
  min-width: 0;
  padding: .65rem .85rem;
  border: 1px solid #8291a8;
  border-radius: .6rem;
  font: inherit;
}
.search-row button { border: 0; margin: 0; font: inherit; font-weight: 650; cursor: pointer; }
.search-row :focus-visible { outline: 3px solid #2859d4; outline-offset: 2px; }
#profile-error { color: #a32b20; margin: .4rem 0 0; }
.guide-footer {
  max-width: 47rem;
  margin: 0 auto;
  border-top: 1px solid #d9dfeb;
  padding: .6rem max(1.25rem, env(safe-area-inset-right)) max(1rem, env(safe-area-inset-bottom)) max(1.25rem, env(safe-area-inset-left));
}
.guide-footer nav { display: flex; flex-wrap: wrap; gap: 0 1.2rem; }
.guide-footer a { display: inline-flex; align-items: center; min-height: 44px; font-size: .92rem; }
.ad-preference { margin-block: 1.2rem; padding: .8rem 1rem; background: #f0f4ff; border-radius: .65rem; }
.ad-preference label { display: flex; align-items: center; gap: .6rem; min-height: 44px; font-weight: 650; cursor: pointer; }
.ad-preference input { width: 1.2rem; height: 1.2rem; flex: none; accent-color: #224cc5; }
.ad-preference p { font-size: .94rem; margin: .25rem 0; }
.ad-preference p:empty { display: none; }
.report-form { margin-block: 1.4rem; padding: 1rem; border: 1px solid #d9dfeb; border-radius: .65rem; }
.report-form label, .report-form small { display: block; }
.report-form label { margin-top: .85rem; font-weight: 650; }
.report-form label:first-child { margin-top: 0; }
.report-form input, .report-form textarea {
  width: 100%; border: 1px solid #8291a8; border-radius: .4rem; padding: .6rem; font: inherit; background: white;
}
.report-form [name="reason"] { resize: vertical; }
.report-form small, .report-form p { font-size: .92rem; }
.report-form .action { border: 0; font: inherit; font-weight: 650; cursor: pointer; }
.report-form .action:disabled { opacity: .65; }
.report-trap { position: absolute; width: 1px; height: 1px; clip-path: inset(50%); overflow: hidden; }
[data-report-result] { overflow-wrap: anywhere; }