/* 코츠코츠 일본어 — 공용 셸(버전뱃지 · 도움말 · 피드백 · 홈 네비게이션) 스타일
   각 페이지의 :root 팔레트(--ink,--sub,--line,--bg,--card,--accent,--accent-soft)를 그대로 사용합니다. */

.shell-footer{
  margin-top:32px;padding-top:16px;border-top:1px solid var(--line);
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 14px;
  font-size:12.5px;color:var(--sub);
}
.shell-footer a{color:var(--sub);text-decoration:none}
.shell-footer a:hover{color:var(--accent);text-decoration:underline}
.shell-version{display:inline-flex;align-items:center;gap:4px}

.info-i{
  display:inline-flex;align-items:center;justify-content:center;
  width:17px;height:17px;border-radius:50%;border:1.3px solid var(--sub);
  color:var(--sub);font-size:11px;font-weight:700;font-style:italic;font-family:Georgia,'Times New Roman',serif;
  background:none;cursor:pointer;flex-shrink:0;line-height:1;padding:0;
  -webkit-tap-highlight-color:transparent;
}
.info-i:hover{border-color:var(--accent);color:var(--accent)}

.shell-overlay{
  position:fixed;inset:0;background:rgba(20,25,30,.55);display:none;
  align-items:center;justify-content:center;padding:20px;z-index:100;
}
.shell-overlay.show{display:flex}
.shell-modal{background:var(--card);border-radius:14px;padding:26px 22px;max-width:440px;width:100%;text-align:left;max-height:82vh;overflow-y:auto}
.shell-modal h3{margin:0 0 14px;font-size:17px;color:var(--ink)}
.shell-modal .close-row{margin-top:20px;text-align:right}
.shell-modal button{padding:10px 18px;border-radius:9px;border:1.5px solid var(--line);background:var(--card);font-size:13.5px;font-weight:700;cursor:pointer;color:var(--ink)}

.changelog-entry{margin-bottom:16px}
.changelog-entry:last-child{margin-bottom:0}
.changelog-entry .cv{font-weight:700;font-size:14px;color:var(--ink)}
.changelog-entry .cd{font-size:11.5px;color:var(--sub);margin-left:6px}
.changelog-entry ul{margin:6px 0 0;padding-left:18px}
.changelog-entry li{font-size:13px;color:var(--sub);line-height:1.6}

.about-body{font-size:13.5px;color:var(--sub);line-height:1.75;white-space:pre-line}

/* 홈 화면 네비게이션 카드 */
.home-cards{display:flex;flex-direction:column;gap:14px;margin-top:8px}
.home-card{
  display:block;background:var(--card);border:1.5px solid var(--line);border-radius:16px;
  padding:22px 20px;text-decoration:none;color:var(--ink);
  transition:border-color .15s ease, transform .15s ease;
}
@media (hover:hover) and (pointer:fine){
  .home-card:hover{border-color:var(--accent);transform:translateY(-2px)}
}
.home-card .hc-emoji{font-size:30px;line-height:1}
.home-card .hc-title{font-size:17px;font-weight:700;margin-top:10px}
.home-card .hc-desc{font-size:13px;color:var(--sub);margin-top:5px;line-height:1.5}

.home-hero{text-align:center;margin:8px 0 28px}
.home-hero .hh-emoji{font-size:44px;line-height:1}
.home-hero h1{font-size:22px;margin:10px 0 0;font-weight:800;color:var(--ink)}
.home-hero .hh-sub{font-size:12.5px;margin-top:5px;color:var(--sub)}