@import url('https://cdn.jsdelivr.net/gh/fonts-archive/Paperlogy/Paperlogy.css');

:root{
  color-scheme:light;
  --ink:#17202b;
  --muted:#7b8794;
  --blue:#1670ed;
  --line:#e9eef3;
  --green:#268a3d;
  --green-bg:#f0f8ee;
  --green-line:#dcebd8;
  --page:#ffffff;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--page);color:var(--ink)}
body{
  font-family:"Paperlogy",system-ui,-apple-system,"Noto Sans KR","Noto Sans JP",sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
button{font:inherit}
[hidden]{display:none!important}

.policy-nav{
  position:sticky;
  top:0;
  z-index:10;
  min-height:calc(58px + env(safe-area-inset-top,0px));
  padding-top:env(safe-area-inset-top,0px);
  display:flex;
  align-items:center;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(14px);
}
.policy-back{
  width:52px;
  height:52px;
  margin-left:5px;
  border:0;
  background:transparent;
  color:#101820;
  display:grid;
  place-items:center;
  border-radius:50%;
  cursor:pointer;
}
.policy-back:active{background:#f3f6f8}
.policy-back svg{
  width:25px;height:25px;fill:none;stroke:currentColor;
  stroke-width:2;stroke-linecap:round;stroke-linejoin:round;
}

.policy-main{
  width:min(100%,760px);
  margin:0 auto;
  padding:20px 22px calc(64px + env(safe-area-inset-bottom,0px));
}
.policy-hero{
  text-align:center;
  padding:12px 0 29px;
}
.policy-title{
  margin:0;
  font-size:clamp(25px,6.8vw,31px);
  line-height:1.34;
  letter-spacing:-.035em;
  font-weight:850;
  word-break:keep-all;
}
.policy-date{
  margin:8px 0 0;
  color:var(--muted);
  font-size:12.5px;
  line-height:1.5;
  font-weight:560;
}

.policy-body{
  font-size:15.5px;
  line-height:1.86;
  letter-spacing:-.012em;
  word-break:keep-all;
  overflow-wrap:break-word;
}
.policy-body p{margin:0 0 21px}
.policy-body strong{font-weight:800}
.policy-section{
  padding-top:2px;
  margin-top:26px;
}
.policy-section + .policy-section{
  border-top:1px solid var(--line);
  padding-top:27px;
}
.policy-section h2{
  margin:0 0 14px;
  color:var(--blue);
  font-size:17.5px;
  line-height:1.5;
  letter-spacing:-.025em;
  font-weight:850;
}
.policy-list{
  margin:3px 0 20px;
  padding-left:1.35em;
}
.policy-list li{
  margin:7px 0;
  padding-left:.15em;
}
.feedback-callout{
  display:flex;
  align-items:flex-start;
  gap:11px;
  margin:24px 0 23px;
  padding:15px 16px;
  border:1px solid var(--green-line);
  border-radius:13px;
  background:var(--green-bg);
  color:var(--green);
  font-size:14.5px;
  line-height:1.62;
  font-weight:760;
}
.feedback-callout svg{
  flex:0 0 22px;
  width:22px;height:22px;margin-top:1px;
  fill:none;stroke:currentColor;stroke-width:1.9;
  stroke-linecap:round;stroke-linejoin:round;
}
.policy-final{margin-bottom:0!important}

/* Japanese readability: slightly larger body and more vertical breathing room. */
html[lang="ja"] .policy-main{padding-left:22px;padding-right:22px}
html[lang="ja"] .policy-title{
  font-size:clamp(24px,6.4vw,30px);
  line-height:1.42;
  letter-spacing:-.025em;
}
html[lang="ja"] .policy-date{margin-top:9px}
html[lang="ja"] .policy-body{
  font-size:16px;
  line-height:1.94;
  letter-spacing:0;
  word-break:normal;
  line-break:strict;
}
html[lang="ja"] .policy-body p{margin-bottom:23px}
html[lang="ja"] .policy-section{margin-top:29px}
html[lang="ja"] .policy-section + .policy-section{padding-top:29px}
html[lang="ja"] .policy-section h2{
  margin-bottom:15px;
  font-size:17.5px;
  line-height:1.62;
}
html[lang="ja"] .policy-list li{margin:8px 0}
html[lang="ja"] .feedback-callout{
  font-size:15px;
  line-height:1.72;
  margin-top:25px;
  margin-bottom:25px;
}

@media(min-width:720px){
  .policy-main{padding-left:28px;padding-right:28px;padding-top:28px}
  .policy-hero{padding-top:18px;padding-bottom:36px}
  .policy-body{font-size:16px;line-height:1.9}
  html[lang="ja"] .policy-body{font-size:16.5px;line-height:1.96}
}