/* kickreel 共通フッター */

#app-footer {
  /* `width:100%` + 左右 padding が content-box だとビューポートを 32px 超えて
     横スクロールが出る。グローバルな box-sizing リセットを持たないページ
     （asset-unavailable / moderation-hold 等）でも単体で成立させる。 */
  box-sizing: border-box;
  width: 100%;
  margin-top: 40px;
  padding: 20px 16px 28px;
  border-top: 1px solid var(--kr-hair);
  color: var(--kr-ink-dim);
  font-family: var(--kr-font-sans);
  font-size: 0.78rem;
}

.app-footer__inner {
  max-width: 840px;
  margin: 0 auto;
}

.app-footer__links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px 14px;
  margin-bottom: 6px;
}

.app-footer__links a {
  color: var(--kr-ink-dim);
  text-decoration: none;
}

.app-footer__links a:hover {
  color: var(--kr-accent);
  text-decoration: underline;
}

.app-footer__copy {
  margin: 0;
  text-align: center;
}

.app-footer__source {
  margin: 6px 0 0;
  text-align: center;
}

.app-footer__github {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--kr-ink-dimmer);
  text-decoration: none;
}

.app-footer__github:hover {
  color: var(--kr-accent);
  text-decoration: underline;
}

.app-footer__github-mark {
  flex: 0 0 auto;
}

body.app-theme-light #app-footer {
  border-top-color: var(--kr-hair);
  color: var(--kr-ink-dim);
}