@layer design {
/* Page shell only. The original beta component owns fields, card and feedback. */
.page-apply {
  --an-font: 'Animesis Story Barlow', 'Animesis Story Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;
  margin: 0;
  min-height: 100svh;
  background: var(--an-platinum);
  color: var(--an-charcoal);
  font: 400 1rem/1.75 var(--an-font);
}
.page-apply[data-lang="zh-Hant"] { --an-font: 'Animesis Story Barlow', 'PingFang TC', 'Microsoft JhengHei', sans-serif; }
.page-apply[data-lang="ja"] { --an-font: 'Animesis Story Barlow', 'Hiragino Sans', 'Yu Gothic', 'Meiryo', sans-serif; }
.page-apply[data-lang="ko"] { --an-font: 'Animesis Story Barlow', 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif; }
.page-apply *, .page-apply *::before, .page-apply *::after { box-sizing: border-box; }
.apply-header {
  min-height: 84px;
  max-width: 624px;
  margin: 0 auto;
  padding: 20px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.apply-header img { display: block; width: 164px; height: auto; }
.apply-main {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: calc(100svh - 84px);
  padding: 16px 24px 40px;
}
@media (max-width: 600px) {
  .page-apply { background: #fff; }
  .apply-header { padding-inline: max(20px,env(safe-area-inset-left)) max(20px,env(safe-area-inset-right)); }
  .apply-header img { width: 130px; }
  .apply-main { padding: 12px max(20px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left)); }
  .apply-main .an-beta-panel { max-width: none; margin-top: 0; box-shadow: none; }
  .apply-main .an-beta-content { padding: 0; }
  .apply-main .an-beta-close { top: 0; right: 0; }
  .apply-main .an-beta-content :is(h1,h2) { font-size: 1.5rem; padding-right: 48px; }
}

}
