/* 08 SETTINGS — 설정 및 하위 화면 고유 콘텐츠만. */

#help{
  --settings-text:var(--tone-6);
  --theme-card:var(--tone-2);
  --theme-primary:var(--tone-6);
  --theme-text:var(--settings-text);
  --navy:var(--settings-text);
  --muted:var(--settings-text);
  color:var(--settings-text);
  overflow-y:auto;
  gap:8px;
  overscroll-behavior-y:contain;
}

.help-head{
  height:50px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex:0 0 auto;
}

.help-card h3{
  margin:0 0 6px;
  font-size:15px;
}

.help-card p,
.help-card li{
  font-size:12px;
  color:var(--settings-text);
  line-height:1.55;
}

.help-card ul{
  padding-left:18px;
  margin:5px 0;
}

.help-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
}

.help-actions button{
  border:1px solid #dce8f5;
  background:#fff;
  border-radius:12px;
  padding:9px;
  font-weight:850;
  color:var(--settings-text);
}

.danger{
  color:#c83d52;
  background:#fff7f8;
  border-color:#ffd6dd;
}


.ghost{
  height:37px;
  border:1px solid #dce8f5;
  border-radius:14px;
  background:rgba(255,255,255,.88);
  color:var(--settings-text);
  font-weight:850;
  font-size:13px;
  min-height:44px;
}

.help-card{
  background:rgba(255,255,255,.93);
  border:1px solid #dce8f5;
  border-radius:18px;
  padding:13px;
  box-shadow:0 7px 18px rgba(42,90,140,.07);
  border-color:color-mix(in srgb,var(--theme-border) 72%,#fff);
}

.settings-screen{
  overflow-y:auto;
  padding-bottom:max(12px,env(safe-area-inset-bottom));
}

.settings-card{
  border-color:color-mix(in srgb,var(--theme-border) 72%,#fff);
  background:rgba(255,255,255,.92);
  border:1px solid var(--theme-border);
  border-radius:20px;
  padding:14px;
  margin-bottom:10px;
  box-shadow:0 6px 18px rgba(34,91,143,.07);
}

.settings-title-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.settings-title-row h3{
  margin:0 0 2px;
  font-size:16px;
  color:var(--settings-text);
}

.settings-title-row p{
  margin:0;
  font-size:11px;
  color:var(--settings-text);
}

#themeNameBadge{
  flex:0 0 auto;
  padding:5px 9px;
  border-radius:999px;
  background:var(--theme-soft);
  color:var(--settings-text);
  font-size:11px;
  font-weight:900;
}

.theme-options{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:7px;
  margin-top:12px;
}

.theme-choice{
  min-height:65px;
  border-radius:15px;
  border:1px solid #dce6ee;
  background:#fff;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  font-weight:900;
  font-size:11px;
  color:var(--settings-text);
}

.theme-choice i{
  width:26px;
  height:26px;
  border-radius:50%;
  background:var(--swatch);
  box-shadow:inset 0 2px 4px rgba(255,255,255,.55),0 3px 7px rgba(62,79,95,.12);
}

.theme-choice.selected{
  border:2px solid var(--theme-accent);
  background:var(--theme-soft);
  color:var(--settings-text);
  box-shadow:
    0 clamp(3px,.8vw,5px) clamp(8px,2vw,13px) color-mix(in srgb,var(--theme-accent) 18%,transparent),
    inset 0 1px 0 rgba(255,255,255,.62);
  transform:translateY(clamp(-2px,-.35vw,-1px));
}

.stats-summary{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:7px;
  margin-top:12px;
}

.stats-summary>div{
  min-height:62px;
  border-radius:14px;
  background:var(--theme-softer);
  border:1px solid var(--theme-border);
  padding:9px 10px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.stats-summary small{
  font-size:10px;
  color:var(--settings-text);
}

.stats-summary b{
  font-size:19px;
  color:var(--settings-text);
}

.access-summary{
  margin-top:8px;
  padding:9px 11px;
  border-radius:12px;
  background:#f8fafc;
  display:flex;
  justify-content:space-between;
  gap:8px;
  font-size:11px;
}

.access-summary span{
  color:var(--settings-text);
}

.access-summary b{
  color:var(--settings-text);
  text-align:right;
}

.stat-panel{
  margin-top:10px;
  padding:10px;
  border:1px solid #e4eaf0;
  border-radius:14px;
  background:#fff;
}

.stat-panel-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  margin-bottom:8px;
}

.stat-panel-head b{
  font-size:12px;
}

.stat-panel-head small{
  font-size:9px;
  color:var(--settings-text);
}

.mini-chart{
  display:flex;
  align-items:flex-end;
  gap:5px;
  height:112px;
  min-width:0;
}

.mini-chart .bar-col{
  min-width:0;
  flex:1;
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  align-items:center;
  gap:3px;
}

.mini-chart .bar{
  width:min(76%,26px);
  min-height:2px;
  border-radius:7px 7px 3px 3px;
  background:linear-gradient(180deg,var(--theme-accent-2),var(--theme-accent));
}

.mini-chart .bar-value{
  font-size:8px;
  color:var(--settings-text);
  line-height:1;
}

.mini-chart .bar-label{
  font-size:8px;
  color:var(--settings-text);
  white-space:nowrap;
  line-height:1;
}

.hourly-chart{
  gap:2px;
}

.hourly-chart .bar-label{
  font-size:6px;
}

.hourly-chart .bar{
  width:80%;
}

.stats-detail{
  margin-top:10px;
  font-size:10px;
  line-height:1.5;
  color:var(--settings-text);
}

@media (min-width:500px){
  .stats-summary{
    grid-template-columns:repeat(4,1fr);
  }
}

.settings-menu-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(10px,2.6vw,13px);
  margin-top:clamp(7px,1.8vw,9px);
}

.settings-menu-card{
  min-height:128px;
  border:1px solid var(--theme-border);
  border-radius:20px;
  background:rgba(255,255,255,.94);
  
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  color:var(--settings-text);
  padding:12px;
  text-align:center;
box-shadow:
    0 11px 0 -8px rgba(46,122,88,.18),
    0 14px 22px rgba(38,84,125,.12),
    0 4px 8px rgba(38,84,125,.08),
    inset 0 1px 0 rgba(255,255,255,.78),
    inset 0 -2px 0 rgba(71,104,134,.10);
  transform:translateY(-1px);
}


.settings-menu-icon{
  font-size:30px;
  line-height:1;
}

.settings-menu-card b{
  font-size:15px;
  color:var(--settings-text);
}

.settings-menu-card small{
  font-size:10px;
  color:var(--settings-text);
}

.settings-subpanel{
  display:none;
}

.settings-subpanel.open{
  display:block;
}

.settings-panel-back{
  border:0;
  background:transparent;
  color:var(--settings-text);
  font-weight:950;
  min-height:38px;
  padding:4px 2px;
  margin-bottom:clamp(8px,2.2vw,11px);
}

.display-mode-options{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:7px;
  margin-top:12px;
}

.display-mode-choice{
  min-height:62px;
  border:1px solid #dce6ee;
  border-radius:15px;
  background:#fff;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  color:var(--settings-text);
  font-weight:900;
  font-size:19px;
}

.display-mode-choice span{
  font-size:11px;
}

.display-mode-choice.selected{
  border:2px solid var(--theme-accent);
  background:var(--theme-soft);
  color:var(--settings-text);
  box-shadow:
    0 clamp(3px,.8vw,5px) clamp(8px,2vw,13px) color-mix(in srgb,var(--theme-accent) 18%,transparent),
    inset 0 1px 0 rgba(255,255,255,.62);
  transform:translateY(clamp(-2px,-.35vw,-1px));
}

#displayModeBadge{
  padding:5px 9px;
  border-radius:999px;
  background:var(--theme-soft);
  color:var(--settings-text);
  font-size:11px;
  font-weight:900;
}

#learningProfileBadge{
  padding:5px 9px;
  border-radius:999px;
  background:var(--theme-soft);
  color:var(--settings-text);
  font-size:11px;
  font-weight:900;
  white-space:nowrap;
}

.switch{
  position:relative;
  width:48px;
  height:28px;
  flex:0 0 48px;
}

.switch input{
  opacity:0;
  width:0;
  height:0;
}

.switch span{
  position:absolute;
  inset:0;
  background:#cbd5df;
  border-radius:999px;
  transition:.2s;
}

.switch span:before{
  content:"";
  position:absolute;
  width:22px;
  height:22px;
  left:3px;
  top:3px;
  background:#fff;
  border-radius:50%;
  box-shadow:0 2px 6px rgba(0,0,0,.18);
  transition:.2s;
}

.switch input:checked+span{
  background:var(--theme-accent);
}

.switch input:checked+span:before{
  transform:translateX(20px);
}

.reminder-settings{
  margin-top:12px;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.setting-field{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  font-size:12px;
  font-weight:850;
}

.setting-field input{
  height:38px;
  border:1px solid var(--theme-border);
  border-radius:11px;
  padding:0 10px;
  background:#fff;
  color:var(--settings-text);
  font-weight:850;
}

.weekday-picker{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:5px;
}

.weekday-picker button{
  height:34px;
  border:1px solid #dce6ee;
  background:#fff;
  border-radius:10px;
  font-size:10px;
  font-weight:900;
  color:var(--settings-text);
}

.weekday-picker button.selected{
  background:var(--theme-accent);
  border-color:var(--theme-accent);
  color:#fff;
}

.settings-note{
  font-size:10px;
  line-height:1.45;
  color:var(--settings-text);
  background:var(--theme-softer);
  border-radius:11px;
  padding:8px;
}

.important-notice{
  border:1.5px solid var(--theme-accent);
}

.important-notice p{
  margin:7px 0;
}

.app-info-card{
  text-align:center;
  padding:18px;
}

.app-info-card h3{
  margin:3px 0 14px;
  font-size:19px;
}

.app-info-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  border-top:1px solid #e5ebf0;
  padding:10px 3px;
  font-size:11px;
  text-align:left;
}

.app-info-row span{
  color:var(--settings-text);
}

.app-info-row b{
  text-align:right;
  color:var(--settings-text);
}


@media (max-width:520px){
  .settings-menu-card{
    min-height:116px;
    padding:10px;
  }

  .settings-menu-icon{
    font-size:27px;
  }
}

.settings-devlog-link{
  grid-column:1 / -1;
  justify-self:center;
  border:0;
  background:transparent;
  color:var(--settings-text);
  font:inherit;
  font-size:12px;
  font-weight:850;
  text-decoration:underline;
  text-underline-offset:3px;
  padding:8px 14px 2px;
  margin-top:2px;
  cursor:pointer;
}

.settings-devlog-link:active{
  opacity:.58;
}

.devlog-intro{
  margin:4px 0 12px;
  padding:14px 15px;
  border-radius:18px;
  background:var(--theme-softer);
  border:1px solid var(--theme-border);
}

.devlog-intro h3{
  margin:0 0 5px;
  font-size:16px;
  color:var(--settings-text);
}

.devlog-intro p{
  margin:0;
  font-size:11px;
  line-height:1.55;
  color:var(--settings-text);
}

.devlog-list{
  display:flex;
  flex-direction:column;
  gap:12px;
  padding-bottom:8px;
}

.devlog-day{
  border:1px solid var(--theme-border);
  background:var(--theme-card);
  border-radius:20px;
  padding:14px 15px;
  box-shadow:0 8px 20px rgba(31,77,122,.06);
}

.devlog-day-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:8px;
  margin-bottom:10px;
}

.devlog-day-head time{
  font-size:14px;
  font-weight:1000;
  color:var(--settings-text);
}

.devlog-day-head span{
  font-size:9px;
  font-weight:900;
  color:var(--settings-text);
  background:var(--theme-softer);
  padding:4px 7px;
  border-radius:999px;
  white-space:nowrap;
}

.devlog-entry{
  padding:10px 0;
  border-top:1px solid var(--theme-border);
}

.devlog-entry:first-of-type{
  border-top:0;
  padding-top:0;
}

.devlog-entry:last-child{
  padding-bottom:0;
}

.devlog-entry b{
  display:block;
  font-size:12px;
  line-height:1.4;
  color:var(--settings-text);
  margin-bottom:4px;
}

.devlog-entry p{
  margin:0;
  font-size:10.5px;
  line-height:1.55;
  color:var(--settings-text);
}

.devlog-entry .devlog-version{
  display:inline-block;
  margin-right:5px;
  font-size:9px;
  font-weight:1000;
  color:var(--settings-text);
  letter-spacing:.01em;
}

.settings-bottom-links{
  grid-column:1 / -1;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  flex-wrap:wrap;
  margin-top:2px;
}

.settings-bottom-links .settings-devlog-link{
  grid-column:auto;
  margin-top:0;
  padding:8px 6px 2px;
}












.settings-screen .settings-subpanel{
  padding-bottom:18px;
}

.stats-course-now{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:7px;
  margin:10px 0 9px;
}

.stats-course-now > div{
  min-width:0;
  padding:10px 7px;
  border:1px solid var(--border,rgba(110,130,150,.20));
  border-radius:14px;
  text-align:center;
  background:rgba(255,255,255,.62);
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:clamp(4px,1.1vw,6px);
}

.stats-course-now small{
  display:block;
  font-size:11px;
  opacity:.72;
  margin:0;
}

.stats-course-now b{
  display:block;
  font-size:14px;
  line-height:1.15;
  white-space:nowrap;
}

.stats-summary-extended{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
}

.stats-summary-extended > div{
  min-width:0;
  padding:10px 6px;
  gap:clamp(4px,1.1vw,6px);
}

.stats-summary-extended small{
  font-size:11px;
}

.stats-summary-extended b{
  font-size:16px;
}

.manual-hero-card{
  padding-top:14px;
}

.manual-steps{
  display:grid;
  gap:clamp(9px,2.4vw,12px);
  margin-top:clamp(10px,2.6vw,13px);
}

.manual-steps > div{
  display:grid;
  grid-template-columns:30px minmax(0,1fr);
  align-items:center;
  gap:9px;
  padding:clamp(10px,2.7vw,13px) 10px;
  border-radius:13px;
  background:rgba(110,170,220,.08);
}

.manual-steps b{
  width:30px;
  height:30px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--accent,#4fa8ff);
  color:#fff;
  font-size:14px;
}

.manual-steps span{
  font-size:14px;
  line-height:1.35;
  font-weight:700;
}

.app-info-desc{
  margin:2px auto 14px;
  max-width:310px;
  text-align:center;
  font-size:13px;
  line-height:1.45;
  opacity:.76;
}

.app-info-note{
  margin-top:clamp(16px,4vw,20px);
  padding:11px 12px;
  border-radius:13px;
  font-size:12px;
  line-height:1.45;
  background:rgba(95,150,195,.09);
  text-align:left;
}


#help.screen.active{
  display:flex;
  flex-direction:column;
  height:100dvh;
  max-height:100dvh;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
}




#help #settingsMenu{
  display:grid;
  visibility:visible;
  opacity:1;
  width:100%;
  flex:0 0 auto;
}

#help .settings-subpanel.open{
  visibility:visible;
  opacity:1;
  display:block;
  width:100%;
  flex:0 0 auto;
}

#help .display-mode-setting{
  display:block;
}

#help .display-mode-options{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin-top:10px;
}

#help .display-mode-choice{
  min-width:0;
  min-height:54px;
  border-radius:14px;
  padding:8px 6px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  font-size:18px;
  border:1px solid rgba(100,130,160,.20);
}

#help .display-mode-choice span{
  font-size:12px;
  font-weight:800;
}

#help .display-mode-choice.selected{
  border-color:var(--accent,#4fa8ff);
  box-shadow:0 0 0 2px color-mix(in srgb,var(--accent,#4fa8ff) 22%,transparent);
}


.review-forecast-card{
  margin-top:10px;
}

.review-summary-row{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:6px;
  margin:10px 0;
}

.review-summary-row > div{
  border:1px solid #dce8f5;
  border-radius:12px;
  padding:8px 5px;
  text-align:center;
  background:rgba(255,255,255,.72);
}

.review-summary-row small{
  display:block;
  font-size:8.5px;
  line-height:1.25;
  color:var(--settings-text);
}

.review-summary-row b{
  display:block;
  margin-top:3px;
  font-size:13px;
}

.review-calendar{
  margin-top:8px;
  padding:10px 8px 9px;
  border:1px solid #dce8f5;
  border-radius:16px;
  background:rgba(255,255,255,.78);
}

.review-calendar-head{
  display:grid;
  grid-template-columns:36px 1fr 36px;
  align-items:center;
  gap:6px;
  margin-bottom:8px;
}

.review-calendar-head b{
  text-align:center;
  font-size:15px;
  color:var(--settings-text);
}

.review-month-btn{
  width:34px;
  height:34px;
  padding:0;
  border:1px solid #dce8f5;
  border-radius:11px;
  background:#fff;
  color:var(--settings-text);
  font-size:22px;
  font-weight:900;
  line-height:1;
}

.review-calendar-grid{
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  gap:3px;
}

.review-weekdays{
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  gap:3px;
  margin-bottom:4px;
}

.review-weekdays span{
  text-align:center;
  font-size:9px;
  font-weight:900;
  color:var(--settings-text);
  padding:2px 0;
}

.review-weekdays .sun{
  color:#ef5f7d;
}

.review-weekdays .sat{
  color:#4b8de5;
}

.review-day{
  position:relative;
  min-width:0;
  height:46px;
  padding:3px 2px 2px;
  border:1px solid #e7eef5;
  border-radius:10px;
  background:rgba(255,255,255,.82);
  color:var(--settings-text);
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:2px;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.review-day.blank{
  border-color:transparent;
  background:transparent;
  cursor:default;
}

.review-day .day-num{
  font-size:10px;
  line-height:13px;
  font-weight:800;
}

.review-day.sun .day-num{
  color:#ef5f7d;
}

.review-day.sat .day-num{
  color:#4b8de5;
}

.review-day.today{
  box-shadow:inset 0 0 0 1.5px #4d90f6;
}

.review-day.selected{
  border-color:#2f7cf1;
  box-shadow:0 0 0 2px rgba(47,124,241,.16);
  background:#eef6ff;
}

.review-day.has-review{
  font-weight:900;
}

.review-day.empty-review{
  background:#e8f1f8;
  border-color:#a5bfd5;
}

.review-count{
  min-width:23px;
  height:19px;
  padding:0 6px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:9px;
  line-height:19px;
  font-weight:950;
  color:var(--settings-text);
  border:1px solid rgba(255,255,255,.48);
  box-shadow:0 1px 3px rgba(35,65,95,.08);
}

.review-count.c0{
  background:#afcadf;
  border-color:#7298b6;
  color:#25425c;
  box-shadow:0 1px 3px rgba(35,65,95,.14);
}

:root[data-display-mode="dark"] .review-day.empty-review{
  background:#334c6c;
  border-color:#6287a7;
  color:#f2f7ff;
}

:root[data-display-mode="dark"] .review-count.c0{
  background:#7298b7;
  border-color:#a5c5dc;
  color:#102c46;
}

.review-count.c1{
  background:#e7dcff;
  color:#5b45a8;
}

.review-count.c2{
  background:#d9efff;
  color:#326ea8;
}

.review-count.c3{
  background:#c8e3ff;
  color:#245f9d;
}

.review-count.c4{
  background:#cdf2d3;
  color:#287642;
}

.review-count.c5{
  background:#ffd7e6;
  color:#a53c65;
}

.review-count.c6{
  background:#ffe8a9;
  color:#8a6418;
}

.review-count.c7{
  background:#ffd29e;
  color:#8d4e16;
}

.review-count.c8{
  background:#ffb2ad;
  color:#8e3535;
}

.review-count.c9{
  background:#ff8fa7;
  color:#7d1739;
}

.review-count.c10{
  background:#ff6f86;
  color:#651229;
}

.review-selected-day{
  margin-top:9px;
  border:1px solid #dce8f5;
  border-radius:16px;
  background:rgba(255,255,255,.78);
  overflow:hidden;
}

.review-selected-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:10px 11px;
  border-bottom:1px solid #e7eef5;
}

.review-selected-head small{
  display:block;
  font-size:8px;
  color:var(--settings-text);
}

.review-selected-head b{
  display:block;
  margin-top:2px;
  font-size:13px;
  color:var(--settings-text);
}

.review-selected-head>span{
  flex:0 0 auto;
  padding:5px 8px;
  border-radius:999px;
  background:#edf5ff;
  color:#2c6fc7;
  font-size:9px;
  font-weight:900;
}

.review-sentence-list{
  display:grid;
  gap:0;
}

.review-sentence-item:last-child{
  border-bottom:0;
}

.review-sentence-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:7px;
  margin-bottom:4px;
}

.review-sentence-meta .due-badge{
  flex:0 0 auto;
  padding:3px 7px;
  border-radius:999px;
  background:#f2f7fd;
  color:var(--settings-text);
  font-size:8px;
  font-weight:900;
}

.review-sentence-jp{
  font-size:13px;
  line-height:1.35;
  color:var(--settings-text);
  font-weight:900;
  word-break:keep-all;
}

.review-sentence-ko{
  margin-top:2px;
  font-size:9.5px;
  line-height:1.35;
  color:var(--settings-text);
}

.review-empty{
  padding:16px 10px;
  text-align:center;
  font-size:10px;
  color:var(--settings-text);
}


@media (max-width:390px){
  .stats-course-now{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .stats-summary-extended{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .review-day{
    height:42px;
  }

  .review-count{
    height:18px;
    line-height:18px;
    min-width:21px;
    font-size:8px;
  }

  .review-calendar{
    padding-left:6px;
    padding-right:6px;
  }

  .review-summary-row small{
    font-size:8px;
  }

  .review-summary-row b{
    font-size:12px;
  }



  #help .settings-title-row,
  #help .account-settings-head,
  #help .access-summary{
    min-width:0;
  }

  #help .settings-title-row h3,
  #help .settings-title-row p,
  #help .access-summary span,
  #help .access-summary b{
    overflow-wrap:anywhere;
  }

  #help .theme-options{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  #help button,
  #help select,
  #help input[type="button"],
  #help input[type="submit"]{
    min-height:40px;
  }
}


.review-sentence-item{
  padding:9px 10px;
  width:100%;
  display:block;
  border:0;
  border-bottom:1px solid #edf2f7;
  background:transparent;
  text-align:left;
  font:inherit;
  color:inherit;
  cursor:pointer;
  -webkit-tap-highlight-color:rgba(47,124,241,.12);
}

.review-sentence-item:active{
  background:#eef6ff;
}

.review-sentence-item:focus-visible{
  outline:2px solid #4d90f6;
  outline-offset:-2px;
}





#help [id*="settingsBack"],
#help [class*="settings-back"]{
  background:transparent;
  border-color:transparent;
  box-shadow:none;
}

.brand-pair{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:2px;
  min-width:0;
}

#help .settings-head{
  position:sticky;
  top:0;
  z-index:100;
  flex:0 0 auto;
  grid-template-columns:44px minmax(0,1fr) auto;
  gap:4px;
  align-items:center;
  padding-left:0;
  padding-right:0;
}

#help .settings-head .brand-pair{
  min-width:0;
  width:max-content;
  max-width:100%;
  justify-self:start;
}

#help #settingsHeaderTitle{
  font-size:20px;
  line-height:1;
  font-weight:950;
  color:var(--settings-text);
  padding:8px 12px;
  background:transparent;
  border:none;
  box-shadow:none;
  outline:none;
  justify-self:end;
  margin-left:2px;
}

#help .app-info-sign{
  display:flex;
  justify-content:flex-start;
  align-items:center;
  width:100%;
  min-height:78px;
  margin:2px 0 8px;
  padding:8px 10px;
  border-radius:18px;
  background:rgba(255,255,255,.42);
  border:1px solid rgba(124,177,224,.24);
  box-shadow:0 7px 18px rgba(51,105,160,.10);
}

@media (max-width:430px){
  #help .settings-head{
    grid-template-columns:42px minmax(0,1fr) auto;
    gap:3px;
  }
}


#help [data-settings-panel="reset"] .reset-summary{
  display:grid;
  gap:10px;
}

#help [data-settings-panel="reset"] .reset-zone{
  padding:12px 13px;
  border-radius:16px;
  background:var(--practice-p3,var(--tone-3));
  border:1px solid var(--practice-p4,var(--tone-4));
}

#help [data-settings-panel="reset"] .reset-zone h3{
  margin:0 0 7px;
  font-size:15px;
}

#help [data-settings-panel="reset"] .reset-zone ul{
  margin:0;
  padding-left:19px;
  display:grid;
  gap:5px;
  font-size:12px;
  line-height:1.55;
}

#help [data-settings-panel="reset"] .reset-result{
  display:flex;
  align-items:center;
  gap:9px;
  padding:11px 13px;
  border-radius:16px;
  background:var(--practice-p2,var(--tone-2));
  border:1px solid var(--practice-p4,var(--tone-4));
  font-weight:900;
}

#help [data-settings-panel="reset"] .reset-result strong{
  color:var(--practice-p6,var(--tone-6));
}

#help [data-settings-panel="reset"] .reset-warning{
  font-size:12px;
  line-height:1.55;
  padding:10px 12px;
  border-radius:14px;
  background:rgba(255,238,238,.72);
  border:1px solid rgba(225,120,120,.28);
}

#help [data-settings-panel="reset"] .reset-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-top:4px;
}

#help [data-settings-panel="reset"] .reset-actions button{
  min-height:48px;
  border-radius:15px;
  font-weight:950;
}

#help #confirmFullLearningReset{
  background:#d9534f;
  color:#fff;
  border:0;
}

#help #cancelFullLearningReset{
  background:var(--practice-p3,var(--tone-3));
  color:var(--settings-text);
  border:1px solid var(--practice-p4,var(--tone-4));
}

.settings-note-spaced{
  margin-top:9px;
}

.theme-swatch-blue{
  --swatch:#4fa8ff;
}

.theme-swatch-pink{
  --swatch:#f58ab3;
}

.theme-swatch-green{
  --swatch:#79cfa0;
}

.theme-swatch-violet{
  --swatch:#a98be8;
}.settings-menu-card,
.theme-choice.selected,
.display-mode-choice.selected{
  transition:transform .12s ease,box-shadow .12s ease,filter .12s ease;
  filter:saturate(1.02);
}


.settings-menu-card:active{
  transform:translateY(1px) scale(.995);
  box-shadow:
    0 4px 8px rgba(38,84,125,.10),
    inset 0 1px 1px rgba(255,255,255,.58),
    inset 0 -2px 0 rgba(71,104,134,.08);
}.theme-choice.selected,
.display-mode-choice.selected{
  box-shadow:
    0 10px 0 -7px color-mix(in srgb,var(--theme-accent) 26%,transparent),
    0 11px 18px color-mix(in srgb,var(--theme-accent) 18%,transparent),
    0 3px 6px rgba(38,84,125,.10),
    inset 0 1px 0 rgba(255,255,255,.62),
    inset 0 -2px 0 color-mix(in srgb,var(--theme-accent) 16%,transparent);
  transform:translateY(-1px);
}

.speech-style-options{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
  margin-top:12px;
}
.speech-style-choice{
  min-height:72px;
  border:1px solid #dce6ee;
  border-radius:15px;
  background:#fff;
  color:var(--settings-text);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  padding:8px 5px;
  text-align:center;
  transition:transform .12s ease,box-shadow .12s ease;
}
.speech-style-choice strong{font-size:11px;line-height:1.25;}
.speech-style-choice small{font-size:8.5px;line-height:1.25;font-weight:800;}
.speech-style-choice.selected{
  border:2px solid var(--theme-accent);
  background:var(--theme-soft);
  box-shadow:0 10px 0 -7px color-mix(in srgb,var(--theme-accent) 26%,transparent),0 11px 18px color-mix(in srgb,var(--theme-accent) 18%,transparent),inset 0 1px 0 rgba(255,255,255,.62);
  transform:translateY(-1px);
}
#speechStyleBadge{
  flex:0 0 auto;
  padding:5px 9px;
  border-radius:999px;
  background:var(--theme-soft);
  color:var(--settings-text);
  font-size:11px;
  font-weight:900;
}
.version-history-head{padding:14px;margin-bottom:10px;border:1px solid var(--theme-border);border-radius:18px;background:var(--theme-softer);color:var(--settings-text);}
.version-history-head h3{margin:0 0 6px;font-size:16px;}
.version-history-head p{margin:0;font-size:10.5px;line-height:1.55;}
.version-history-list{display:grid;gap:9px;}
.version-history-list article{padding:12px 13px;border:1px solid var(--theme-border);border-radius:15px;background:var(--theme-softer);color:var(--settings-text);}
.version-history-list article>b{display:inline-block;margin-right:7px;font-size:11px;color:var(--theme-accent);}
.version-history-list article>strong{font-size:12px;}
.version-history-list article p{margin:6px 0 0;font-size:10px;line-height:1.5;}
.version-history-list article.current{border-width:2px;background:var(--theme-soft);}









/* COMMUNITY — 학습 인증·주간 랭킹 1차 시안 */
.community-shell{padding-bottom:4px;color:var(--settings-text)}
.community-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:14px 14px 12px;margin-bottom:10px;border:1px solid var(--theme-border);border-radius:20px;background:linear-gradient(145deg,var(--theme-softer),var(--theme-soft))}
.community-head h3{margin:3px 0 4px;font-size:19px;letter-spacing:-.5px}
.community-head p{margin:0;font-size:10.5px;line-height:1.5;opacity:.82}
.community-kicker{display:block;font-size:9px;font-weight:950;opacity:.7}
.community-online{flex:0 0 auto;padding:5px 8px;border-radius:999px;background:var(--theme-accent);color:#fff;font-size:8px;font-weight:1000;letter-spacing:.8px}
.community-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:4px;margin-bottom:10px;border:1px solid var(--theme-border);border-radius:16px;background:var(--theme-softer)}
.community-tabs button{min-height:38px;border:0;border-radius:12px;background:transparent;color:var(--settings-text);font-size:11px;font-weight:950;cursor:pointer}
.community-tabs button.active{background:var(--theme-soft);box-shadow:0 2px 8px rgba(0,0,0,.06)}
.community-content{display:block}
.community-me-card,.community-ranking-preview,.community-feed-section,.community-ranking-card{margin-bottom:10px;padding:13px;border:1px solid var(--theme-border);border-radius:20px;background:var(--theme-softer)}
.community-me-top{display:flex;align-items:center;gap:10px}
.community-avatar-wrap{width:54px;height:54px;flex:0 0 54px;border:2px solid var(--theme-border);border-radius:50%;overflow:hidden;background:var(--theme-soft)}
.community-avatar-wrap img{width:100%;height:100%;object-fit:cover}
.community-me-copy{min-width:0;flex:1}.community-me-copy p{margin:4px 0 0;font-size:10px;opacity:.75}
.community-profile-btn{flex:0 0 auto;min-height:34px;padding:0 10px;border:1px solid var(--theme-border);border-radius:11px;background:var(--theme-soft);color:var(--settings-text);font-size:9px;font-weight:950}

.community-preview-my-rank{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 9px;padding:10px 12px;margin-bottom:10px;border:1px solid var(--theme-border);border-radius:13px;background:var(--theme-soft);font-size:12px}
.community-preview-my-rank>span{font-weight:850;opacity:.85}.community-preview-my-rank>strong{font-size:17px;color:var(--theme-accent)}.community-preview-my-rank>small{flex:0 0 100%;font-size:11px;opacity:.75}
.community-me-stats>div{min-width:0;padding:9px 2px}
.community-me-stats b,.community-me-stats span{white-space:nowrap}
.community-ranking-preview .community-section-head button{min-height:32px}
.community-me-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin-top:0}.community-me-stats>div{padding:9px 4px;border-radius:13px;background:var(--theme-soft);text-align:center}.community-me-stats b{display:block;font-size:15px}.community-me-stats span{display:block;margin-top:2px;font-size:8px;font-weight:800;opacity:.7}
.community-profile-detail{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:8px}.community-profile-detail>div{padding:9px;border-radius:12px;background:var(--theme-soft)}.community-profile-detail span,.community-profile-detail b{display:block}.community-profile-detail span{font-size:8px;opacity:.65}.community-profile-detail b{margin-top:3px;font-size:9.5px}
.community-section-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:9px}.community-section-head>div{display:flex;align-items:center;gap:6px}.community-section-head b{font-size:12px}.community-section-head button{border:0;background:none;color:var(--settings-text);font-size:9px;font-weight:900;opacity:.75}.community-auto-label{font-size:8px;font-weight:900;opacity:.55}
.community-top3,.community-feed-list,.community-ranking-list{display:grid;gap:7px}
.community-podium-row,.community-rank-row{display:flex;align-items:center;gap:8px;min-height:48px;padding:7px 8px;border-radius:14px;background:var(--theme-soft)}.community-podium-row.mine,.community-rank-row.mine{outline:2px solid var(--theme-border);background:var(--theme-selected)}
.community-list-avatar{width:33px;height:33px;flex:0 0 33px;display:grid;place-items:center;border-radius:50%;overflow:hidden;background:var(--theme-softer);border:1px solid var(--theme-border)}.community-list-avatar-img{width:100%;height:100%;object-fit:cover}.community-list-avatar-emoji{font-size:17px}
.community-person{min-width:0;flex:1}.community-person b em,.community-feed-author b em{display:inline-block;margin-left:4px;padding:2px 5px;border-radius:999px;background:var(--theme-accent);color:#fff;font-size:7px;font-style:normal;vertical-align:1px}.community-person span{display:block;margin-top:2px;font-size:8px;opacity:.65;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.community-podium-row>strong,.community-rank-row>strong{font-size:13px;text-align:right}.community-podium-row>strong small,.community-rank-row>strong small{display:block;font-size:7px;opacity:.6}
.community-feed-card{padding:11px;border-radius:15px;background:var(--theme-soft)}.community-feed-card.mine{outline:2px solid var(--theme-border)}.community-feed-author{display:flex;align-items:center;gap:8px}.community-feed-author>div{min-width:0}.community-feed-author b{display:block;font-size:10px}.community-feed-author span{display:block;margin-top:2px;font-size:8px;opacity:.65}.community-feed-card p{margin:10px 0 4px;font-size:11.5px;font-weight:900;line-height:1.45}.community-feed-card>small{font-size:8px;opacity:.65}
.community-reactions{display:flex;gap:5px;margin-top:9px;overflow-x:auto;scrollbar-width:none}.community-reactions::-webkit-scrollbar{display:none}.community-reactions button{flex:0 0 auto;min-height:30px;padding:0 8px;border:1px solid var(--theme-border);border-radius:999px;background:var(--theme-softer);color:var(--settings-text);font-size:8px;font-weight:850}.community-reactions button span{margin-right:3px}
.community-ranking-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.community-ranking-title>div{display:flex;align-items:center;gap:8px}.community-ranking-title>div>span{font-size:24px}.community-ranking-title b{font-size:14px}.community-ranking-title p{margin:2px 0 0;font-size:8px;opacity:.65}.community-period{padding:4px 7px;border-radius:999px;background:var(--theme-soft);font-size:8px;font-weight:900}.community-ranking-note{margin-top:10px;padding:9px;border-radius:12px;background:var(--theme-soft);font-size:8.5px;line-height:1.55;opacity:.78}
@media (max-width:380px){
  .community-head{padding:12px}
  .community-me-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
  .community-me-stats b{font-size:14px}
  .community-profile-detail{grid-template-columns:1fr}
  .community-profile-btn{padding:0 8px;min-height:40px}
  .community-rank-row,.community-feed-card{min-width:0}
  .community-rank-row *,.community-feed-card *{min-width:0}
}


/* account settings */
.account-settings-card{display:grid;gap:14px}.account-settings-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.account-settings-head h3{margin:0 0 4px}.account-settings-head p{margin:0;font-size:10px;line-height:1.5;opacity:.68}.account-state-badge{flex:none;padding:5px 9px;border-radius:999px;background:var(--theme-soft);border:1px solid var(--theme-border);font-size:9px;font-weight:900}.account-current{padding:13px;border-radius:14px;background:var(--theme-soft)}.account-current strong,.account-current span{display:block}.account-current strong{font-size:13px}.account-current span{margin-top:4px;font-size:9px;opacity:.65}.account-connect-btn,.account-logout-btn{height:44px;border-radius:13px;font-weight:900}.account-connect-btn{border:0;background:var(--theme-accent);color:#fff}.account-logout-btn{border:1px solid var(--theme-border);background:var(--theme-soft);color:var(--text-main)}.account-settings-note{margin:0;font-size:9px;line-height:1.55;opacity:.6}

.account-sync-state{min-height:16px;margin-top:-5px;font-size:9px;font-weight:800;opacity:.72}.account-sync-state[data-state="ok"]{opacity:.9}.account-sync-state[data-state="warn"]{opacity:.65}


/* 하단 버전/저작권 밀착 */
#settingsBottomCopyright{
width:100%;
  text-align:center;
  padding:1px 6px calc(6px + env(safe-area-inset-bottom));
  margin:0;
  font-size:9px;
  line-height:1.2;
  color:var(--settings-text);
  font-weight:650;
  flex:0 0 auto;
}

.policy-card{line-height:1.65}
.policy-card h3{margin:0 0 4px}
.policy-card h4{margin:18px 0 6px}
.policy-card p,.policy-card li{font-size:13px}
.policy-card ul{margin:6px 0 0;padding-left:20px}
.policy-updated{opacity:.65;font-size:12px}
.policy-note{margin-top:18px;padding:12px;border-radius:12px;background:rgba(90,130,170,.08);font-size:12px;line-height:1.55}
.settings-policy-link{
  appearance:none;
  border:0;
  background:none;
  margin-top:0;
  padding:8px 6px 2px;
  font:inherit;
  color:inherit;
  text-decoration:none;
  cursor:pointer;
}

/* 하단 정책 링크도 개발일지와 동일한 텍스트 링크 스타일 */
.settings-bottom-links .settings-policy-link{
  color:var(--settings-text);
  font-size:12px;
  font-weight:850;
  text-decoration:underline;
  text-underline-offset:3px;
  min-height:34px;
}
.settings-bottom-links .settings-policy-link:active{opacity:.58;}



/* 커뮤니티 보석 계급 */
.community-me-name{
display:flex;
  align-items:center;
  gap:7px;
  min-width:0;
}
.community-me-identity{
  display:flex;
  flex-direction:column;
  min-width:0;
  gap:1px;
}
.community-me-identity > span{
  color:var(--theme-muted,#6b8092);
  font-size:9px;
  line-height:1.1;
  font-weight:900;
}
.community-gem-rank{
  position:relative;
  display:inline-grid;
  place-items:center;
  flex:0 0 auto;
  width:22px;
  height:22px;
  vertical-align:middle;
}
.community-gem-rank img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
  filter:drop-shadow(0 2px 3px rgba(28,61,88,.18));
}
.community-gem-rank > b{
  position:absolute;
  right:-3px;
  bottom:-2px;
  min-width:9px;
  height:9px;
  padding:0 2px;
  border-radius:999px;
  background:rgba(255,255,255,.94);
  color:#48657b;
  font-size:5.5px;
  line-height:9px;
  text-align:center;
  box-shadow:0 1px 2px rgba(20,45,70,.18);
}
.community-gem-rank-main{
  width:31px;
  height:31px;
}
.community-gem-rank-main > b{
  min-width:11px;
  height:11px;
  line-height:11px;
  font-size:6px;
}
.community-gem-rank.compact{
  width:17px;
  height:17px;
  margin-right:3px;
}
.community-gem-rank.compact > b{
  min-width:8px;
  height:8px;
  line-height:8px;
  font-size:5px;
}
.community-person b{
display:block;font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
display:flex;
  align-items:center;
  min-width:0;
}
/* 커뮤니티 사용자 프로필 팝업 */
.community-user-profile-trigger{
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.community-user-profile-trigger:active{
  transform:scale(.992);
}
/* 커뮤니티 공개 설정 */
.community-privacy-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:10px 0 12px;
  padding:12px 13px;
  border:1px solid color-mix(in srgb,var(--theme-accent,var(--tone-6)) 14%,transparent);
  border-radius:16px;
  background:rgba(255,255,255,.55);
}
.community-privacy-card > div{
  min-width:0;
}
.community-privacy-card b{
  display:block;
  color:var(--theme-text,var(--tone-text));
  font-size:12px;
  font-weight:1000;
  line-height:1.25;
}
.community-privacy-card span{
  display:block;
  margin-top:3px;
  color:var(--theme-muted,#6b8092);
  font-size:9px;
  line-height:1.4;
  font-weight:750;
}
.community-privacy-switch{
  position:relative;
  display:block;
  flex:0 0 auto;
  width:42px;
  height:24px;
}
.community-privacy-switch input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}
.community-privacy-switch > span{
  position:absolute;
  inset:0;
  margin:0;
  border-radius:999px;
  background:#c9d5df;
  transition:.18s ease;
  cursor:pointer;
}
.community-privacy-switch > span::after{
  content:"";
  position:absolute;
  width:18px;
  height:18px;
  left:3px;
  top:3px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 2px 5px rgba(30,60,80,.22);
  transition:.18s ease;
}
.community-privacy-switch input:checked + span{
  background:var(--theme-accent,var(--tone-6));
}
.community-privacy-switch input:checked + span::after{
  transform:translateX(18px);
}
.community-privacy-switch input:disabled + span{
  opacity:.45;
  cursor:default;
}
/* 실제 커뮤니티 데이터 상태 */
.community-live-empty{
  width:100%;
  padding:18px 14px;
  border:1px dashed color-mix(in srgb,var(--theme-accent,var(--tone-6)) 22%,transparent);
  border-radius:16px;
  background:rgba(255,255,255,.48);
  color:var(--theme-muted,#6b8092);
  font-size:10px;
  line-height:1.55;
  font-weight:800;
  text-align:center;
}
.community-live-empty-ranking{
  margin:5px 0;
}
/* 실시간 커뮤니티 반응 */
.community-reactions button:disabled{
  opacity:.58;
  pointer-events:none;
}
.community-reactions button.active{
  background:var(--theme-selected);
  border-width:2px;
  transform:translateY(-1px);
  box-shadow:0 3px 9px rgba(35,90,130,.12);
}


/* 커뮤니티 실제 캐릭터·프레임 */
.community-public-avatar-frame{
  width:100%;
  height:100%;
  min-width:0;
  display:block;
}
.community-public-avatar-frame .community-list-avatar-img{
  width:100%;
  height:100%;
  border-radius:50%;
  object-fit:cover;
}
/* 내 주간 순위 요약 */
.community-my-rank-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin:11px 0 10px;
  padding:13px 14px;
  border-radius:18px;
  border:1px solid color-mix(in srgb,var(--theme-accent,var(--tone-6)) 24%,transparent);
  background:linear-gradient(135deg,rgba(255,255,255,.82),rgba(234,246,255,.92));
  box-shadow:0 5px 16px rgba(39,96,138,.08);
}
.community-my-rank-card[hidden]{display:none;}
.community-my-rank-copy{
  min-width:0;
}
.community-my-rank-copy > span{
  display:block;
  color:var(--theme-muted,#6b8092);
  font-size:9px;
  font-weight:900;
}
.community-my-rank-copy > strong{
  display:block;
  margin-top:1px;
  color:var(--theme-text,var(--tone-text));
  font-size:17px;
  line-height:1.15;
  font-weight:1000;
}
.community-my-rank-copy > strong b{
  color:var(--theme-accent,var(--tone-6));
  font-size:23px;
}
.community-my-rank-copy > small{
  display:block;
  margin-top:4px;
  color:var(--theme-muted,#6b8092);
  font-size:8.5px;
  line-height:1.35;
  font-weight:750;
}
.community-my-rank-side{
  flex:0 0 auto;
  text-align:right;
}
.community-my-rank-side > b{
  display:block;
  color:var(--theme-text,var(--tone-text));
  font-size:13px;
  font-weight:1000;
}
.community-my-rank-side > b span{
  font-size:18px;
}
.community-my-rank-side button{
  margin-top:6px;
  padding:6px 9px;
  border:0;
  border-radius:10px;
  background:var(--theme-accent,var(--tone-6));
  color:#fff;
  font-size:8.5px;
  font-weight:1000;
}
.community-my-rank-side button:disabled{
  opacity:.45;
}
.community-rank-row.community-rank-focus{
  animation:community-rank-focus-pulse 1.25s ease;
}
@keyframes community-rank-focus-pulse{
  0%,100%{transform:scale(1);box-shadow:none}
  35%{transform:scale(1.012);box-shadow:0 0 0 3px color-mix(in srgb,var(--theme-accent,var(--tone-6)) 22%,transparent)}
}
/* 주간 랭킹 동점·상위 3위 표시 */
.community-place{
width:19px;text-align:center;font-size:11px;font-weight:1000
display:grid;
  place-items:center;
}
.community-place-medal{
  display:inline-grid;
  place-items:center;
  width:23px;
  height:23px;
  font-size:17px;
  line-height:1;
  filter:drop-shadow(0 2px 3px rgba(40,68,90,.14));
}
.community-place-number{
  display:inline-grid;
  place-items:center;
  min-width:21px;
  height:21px;
  padding:0 4px;
  border-radius:999px;
  background:rgba(255,255,255,.68);
  color:var(--theme-muted,#62798b);
  font-size:9px;
  font-weight:1000;
}
/* 커뮤니티 새로고침·동기화 상태 */
.community-head-actions{
  display:flex;
  align-items:center;
  gap:7px;
  flex:0 0 auto;
}
.community-refresh-btn{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border:1px solid color-mix(in srgb,var(--theme-accent,var(--tone-6)) 20%,transparent);
  border-radius:50%;
  background:rgba(255,255,255,.66);
  color:var(--theme-accent,var(--tone-6));
  font-size:18px;
  line-height:1;
  font-weight:900;
  box-shadow:0 3px 9px rgba(38,92,128,.08);
}
.community-refresh-btn:disabled{
  opacity:.45;
}
.community-refresh-btn.loading{
  animation:community-refresh-spin .8s linear infinite;
}
@keyframes community-refresh-spin{
  to{transform:rotate(360deg)}
}
.community-sync-status{
  margin:4px 0 8px;
  min-height:16px;
  color:var(--theme-muted,#6b8092);
  font-size:8.5px;
  line-height:1.45;
  font-weight:800;
  text-align:right;
}
.community-sync-status[data-state="ready"]{
  color:#3d7d62;
}
.community-sync-status[data-state="error"]{
  color:#9a6d49;
}
/* 커뮤니티 사용자 차단 */
.community-block-manage-btn{
  display:inline-flex;
  align-items:center;
  margin-top:6px;
  padding:5px 8px;
  border:0;
  border-radius:9px;
  background:rgba(112,136,154,.10);
  color:var(--theme-muted,#687d8e);
  font-size:8px;
  font-weight:900;
}
/* 계정 관리 / 회원 탈퇴 안전 흐름 */
.account-manage-entry{
  width:100%;min-height:54px;padding:11px 14px;border:1px solid var(--theme-border);
  border-radius:14px;background:var(--theme-soft);color:var(--text-main);
  display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:left;
}
.account-manage-entry span{display:grid;gap:2px}
.account-manage-entry b{font-size:13px}
.account-manage-entry small{font-size:9px;opacity:.62}
.account-manage-entry i{font-style:normal;font-size:24px;line-height:1;opacity:.48}
.account-management-card{display:grid;gap:16px}
.account-management-head{display:flex;align-items:center;gap:12px}
.account-management-icon{width:42px;height:42px;border-radius:15px;display:grid;place-items:center;background:var(--theme-soft);font-size:21px}
.account-management-head h3{margin:0 0 3px;font-size:18px}
.account-management-head p{margin:0;font-size:10px;opacity:.65}
.account-management-summary{padding:13px 14px;border-radius:15px;background:var(--theme-soft)}
.account-management-summary strong,.account-management-summary span{display:block}
.account-management-summary strong{font-size:13px}
.account-management-summary span{margin-top:3px;font-size:9px;opacity:.65}
.account-danger-zone{margin-top:8px;padding:15px;border:1px solid rgba(210,80,80,.22);border-radius:17px;background:rgba(255,244,244,.7)}
.account-danger-zone b{font-size:13px;color:#b64747}
.account-danger-zone p{margin:5px 0 12px;font-size:10px;line-height:1.55;opacity:.72}
.account-delete-btn{width:100%;height:43px;border:1px solid rgba(205,73,73,.32);border-radius:13px;background:#fff;color:#bd4848;font-weight:900}


#help.settings-screen{
position:fixed;
  inset:0;
  width:100%;
  height:100dvh;
  max-height:100dvh;
  z-index:9999;
  padding:max(8px,env(safe-area-inset-top)) 14px max(8px,env(safe-area-inset-bottom));
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  display:none;
  flex-direction:column;
  gap:10px;
  background:
    linear-gradient(180deg,rgba(247,251,255,.78) 0%,rgba(247,251,255,.72) 52%,rgba(247,251,255,.84) 100%),
    url("../assets/backgrounds/settings_tatami_garden.webp") center center/cover no-repeat fixed;
}
#help .settings-card,
#help .settings-menu-card,
#help .help-card{
  background:rgba(255,255,255,.82);
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
}


#help .settings-admin-tools{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:7px;
  margin:8px auto 2px;
}
#help .settings-admin-tools[hidden]{display:none;}

/* super_admin 전용 화면 새로고침 — 설정 페이지 하단 */
#help .settings-admin-refresh-btn{
  display:block;
  margin:0;
  padding:7px 12px;
  border:1px solid var(--line, #d9e6f2);
  border-radius:10px;
  background:rgba(255,255,255,.78);
  color:var(--text-sub, #5f6f7f);
  font:inherit;
  font-size:12px;
  line-height:1.2;
}
#help .settings-admin-refresh-btn[hidden]{display:none;}
#help .settings-admin-tools a.settings-admin-refresh-btn{text-decoration:none;font-weight:850;text-align:center;}

/* 설정화면 상단 전용 위치 */
#help .settings-head.app-header--settings{
  position:sticky;
  top:0;
  z-index:100;
  display:block;
  height:var(--device-header-height);
  min-height:var(--device-header-height);
  padding:2px 4px;
}
#help .settings-head.app-header--settings .app-profile-cluster{
  left:14.5px;
}
#help .settings-head.app-header--settings .app-main-title{
  left:50%;
  top:var(--device-header-control-top);
  transform:translate(-50%,-50%);
}
#help .settings-head.app-header--settings > .app-home-button{
  position:absolute;
  top:31px;
  left:0;
  margin-left:-15px;
  transform:translateY(-50%);
  z-index:74;
}
#help .settings-head.app-header--settings .app-rank-icon{
  top:41px;
  right:calc(100% - 21px);
  transform:none;
}
#help .settings-head.app-header--settings .app-nickname{
  position:absolute;
  left:21px;
  top:47px;
  margin:0;
}
#help #settingsHeaderTitle{
  position:absolute;
  right:8px;
  top:31px;
  transform:translateY(-50%);
  margin:0;
  padding:0;
  font-size:14px;
  line-height:1;
  font-weight:950;
  z-index:74;
}

.settings-bottom-links .settings-policy-link{
  grid-column:auto;
  margin-top:0;
  padding:8px 6px 2px;
}

/* 고객지원: 기존 설정 메뉴 디자인 유지, Galaxy S25 Ultra 안전영역 대응 */
.support-feedback-form{display:flex;flex-direction:column;gap:12px;padding-top:10px;max-width:100%}
.support-feedback-form label{font-weight:700;color:var(--text,#317eaa);font-size:16px}
.support-feedback-form input,.support-feedback-form select,.support-feedback-form textarea{display:block;width:100%;box-sizing:border-box;padding:13px;border:1px solid #a6cbe4;border-radius:14px;background:rgba(255,255,255,.94);color:#23475c;font:inherit;font-size:16px}
.support-feedback-form textarea{min-height:140px;resize:vertical}
.support-feedback-form .support-private-choice{display:flex;align-items:center;gap:8px;font-size:13px;line-height:1.45;word-break:keep-all}
.support-feedback-form .support-private-choice input[type="checkbox"]{display:inline-block;width:19px;height:19px;min-width:19px;margin:0;padding:0;accent-color:var(--theme-accent,#2799dc)}
.support-feedback-form button{border:0;border-radius:15px;background:#2799dc;color:#fff;font:inherit;font-weight:700;padding:14px;min-height:48px}
.support-feedback-form button:disabled{background:#aabdc9;color:#f8fbfd}
.support-note{color:#4d7490;font-size:13px;line-height:1.5;margin:0;word-break:keep-all;overflow-wrap:break-word}
#supportAvailability{font-size:11px;line-height:1.45}
#supportResult{min-height:1.5em;overflow-wrap:anywhere;color:#267f9d;font-size:11px;line-height:1.45}

/* Login server diagnostics only (boards belong to separate website). */
.account-diagnostics-button{display:block;margin:12px auto 4px;background:transparent;color:#2671b3;border:1px solid #b9d5ea;border-radius:10px;padding:9px 14px;font-weight:700;min-height:42px}
.account-diagnostics-status{font-size:12px;line-height:1.6;white-space:pre-line;overflow-wrap:anywhere;color:#466480;padding:0 6px}

/* 복습 달력의 외곽 표면은 설정 화면에서 단일 관리한다. */
.review-calendar{
  background:transparent;
  border:0;
  outline:0;
  box-shadow:none;
}

.support-ticket-section{margin-top:18px;padding-top:12px;border-top:1px solid var(--theme-border,#cfdfeb)}
.support-ticket-section h4{margin:0 0 12px;font-size:16px;color:var(--theme-text,#234968)}
.support-ticket-list{display:grid;gap:9px;color:var(--theme-text,#234968);font-size:13px}
.support-ticket-item{display:grid;gap:5px;text-align:left;width:100%;border:1px solid var(--theme-border,#c4dfef);border-radius:13px;padding:12px;background:var(--theme-softer,#f3faff);color:var(--theme-text,#254763);cursor:pointer}
.support-ticket-item strong{font-size:13px;overflow-wrap:break-word;word-break:keep-all}
.support-ticket-item small{font-size:11px;opacity:.8}
.support-ticket-message{margin:5px 0 0 10px;padding:9px 10px;border-left:2px solid var(--theme-border,#c4dfef);background:var(--theme-soft,#f6faff);border-radius:0 9px 9px 0}
.support-ticket-message.staff{background:var(--tone-3,#dceefc)}
.support-ticket-message b{font-size:11px}
.support-ticket-message p{margin:4px 0 0;font-size:12px;line-height:1.55;white-space:pre-wrap;word-break:keep-all;overflow-wrap:break-word}
.support-ticket-action{justify-self:end;min-height:34px;padding:6px 12px;border:1px solid var(--theme-border,#c4dfef);border-radius:9px;background:var(--theme-card,#fff);color:var(--theme-text,#254763);font-size:12px;cursor:pointer}
.support-thread{margin-top:12px;padding:12px;border:1px solid var(--theme-border,#c4dfef);background:var(--theme-soft,#f6faff);border-radius:14px}
.support-thread-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.support-thread-head strong{overflow-wrap:anywhere;font-size:15px}
.support-thread-head button,.support-admin-controls button{min-height:36px;border-radius:10px;padding:6px 11px;border:1px solid var(--theme-border);background:var(--theme-softer);color:var(--theme-text);font-weight:800}
.support-thread-messages{display:grid;gap:10px;padding:10px 0}
.support-message{border:1px solid var(--theme-border);border-radius:13px;padding:12px;background:var(--theme-softer);overflow-wrap:anywhere}
.support-message.staff{background:var(--tone-3,#dceefc)}
.support-message strong{display:inline-block;margin-right:8px;font-size:12px}
.support-message small{font-size:11px;opacity:.72}
.support-message p{font-size:13px;line-height:1.6;white-space:pre-wrap;margin:7px 0 0}
.support-admin-controls{display:grid;gap:8px;margin-top:10px}
.support-admin-controls select{padding:10px;border:1px solid var(--theme-border);border-radius:10px}
.support-ticket-section[hidden],.support-thread[hidden],.support-admin-controls[hidden]{display:none}

/* Server-authoritative real-time ranking bands */
.community-rank-bands{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:10px 0}
.community-rank-bands button{min-width:0;min-height:44px;padding:8px 2px;border:1px solid var(--theme-border);border-radius:10px;background:var(--theme-softer);color:var(--settings-text);font-size:11px;font-weight:850}
.community-rank-bands button.active{background:var(--theme-accent);color:#fff}
.community-rank-bands button[data-rank-band="nearby"]:not([hidden]){grid-column:1/-1}
.community-rank-bands button[hidden]{display:none}

/* 관리자센터: 개발 일지를 우선 표시하고 나머지 점검 도구는 간결하게 묶는다. */
#help .settings-admin-tools{
  display:block;
  width:min(100% - 24px, 560px);
  margin:12px auto 8px;
  padding:13px;
  border:1px solid var(--line,#d9e6f2);
  border-radius:15px;
  background:var(--theme-softer,rgba(235,245,255,.9));
}
#help .settings-admin-tools[hidden]{display:none}
#help .settings-admin-title{
  margin:0 0 11px;
  font-size:14px;
  font-weight:900;
  color:var(--settings-text);
}
#help .settings-admin-links{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
#help .settings-admin-links .settings-admin-refresh-btn{
  width:100%;
  min-height:40px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  white-space:normal;
}
#help .settings-admin-links .settings-admin-devlog{
  grid-column:1/-1;
  justify-content:space-between;
  padding:11px 14px;
  font-size:14px;
  font-weight:900;
  background:var(--theme-soft,#e3f0ff);
  color:var(--settings-text);
}
#help .settings-admin-links .settings-admin-devlog span{font-size:21px;line-height:1}
#help .settings-admin-tools .account-diagnostics-status{margin:7px 0 0}

/* 랭킹·커뮤니티 캐릭터링: 이전 원형 avatar의 overflow:hidden이
   character-frame-slot::after 테두리를 잘라낸 문제 해결. */
#communityRankingList .community-list-avatar,
#communityFeedList .community-list-avatar{
  overflow:visible;
  position:relative;
  background:transparent;
  border:0;
}
#communityRankingList .community-public-avatar-frame,
#communityFeedList .community-public-avatar-frame{
  width:100%;
  height:100%;
  border-radius:50%;
}
#communityFeedList .community-public-avatar-frame::after{
  inset:-3px;
  border-width:2px;
}

/* 순위 목록 캐릭터링: 프로필 캐릭터링과 동일한 색/효과를 확실히 표시 */
#communityRankingList .community-list-avatar{
  width:45px;
  height:45px;
  flex:0 0 45px;
  overflow:visible;
  margin:4px 6px 4px 4px;
}
#communityRankingList .community-public-avatar-frame.character-frame-slot{
  position:relative;
  display:grid;
  width:45px;
  height:45px;
  overflow:visible;
  border-radius:50%;
  isolation:isolate;
}
#communityRankingList .community-public-avatar-frame.character-frame-slot > .community-list-avatar-img{
  position:relative;
  z-index:1;
  display:block;
  width:100%;
  height:100%;
  border:2px solid #fff;
  border-radius:50%;
  object-fit:cover;
}
#communityRankingList .community-public-avatar-frame.character-frame-slot::after{
  content:"";
  position:absolute;
  z-index:2;
  inset:-5px;
  border:4px solid var(--character-frame-ring,var(--tone-5));
  border-radius:50%;
  pointer-events:none;
  box-shadow:0 0 0 2px rgba(255,255,255,.92),0 2px 9px rgba(39,111,178,.22);
}

/* 관리자 전용 고객지원 비공개·삭제 기능 */
.support-admin-moderation{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.support-admin-moderation button{flex:1 1 125px;min-height:40px;border-radius:10px;border:1px solid var(--theme-border);background:var(--theme-softer);color:var(--settings-text);font:inherit;font-size:12px;font-weight:850;cursor:pointer}
.support-admin-moderation .support-admin-danger{border-color:#df9999;background:#fff0f0;color:#a12d2d}
.support-admin-moderation button:disabled{opacity:.5;cursor:wait}
