/* ─────────────────────────────────────────────
   トップバー: 学習サマリーカード
   ───────────────────────────────────────────── */
.learning-topbar {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .65rem;
  margin-bottom: 1rem;
}

.learning-stat-card {
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: .85rem 1rem;
  background: #fff;
  border: 1px solid #eceef5;
  border-radius: 14px;
  box-shadow: 0 2px 8px rgba(40,53,147,.06);
  position: relative;
  overflow: hidden;
}
/* 左端のアクセントバー */
.learning-stat-card::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 4px;
}
.learning-stat-card--total::before  { background: linear-gradient(180deg,#3949ab,#1a237e); }
.learning-stat-card--streak::before { background: linear-gradient(180deg,#ff9800,#f4511e); }
.learning-stat-card--today::before  { background: linear-gradient(180deg,#43a047,#2e7d32); }

.learning-stat-card__icon {
  flex-shrink: 0;
  width: 44px; height: 44px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.4rem;
  border-radius: 12px;
}
.learning-stat-card--total  .learning-stat-card__icon { background: #eef1ff; }
.learning-stat-card--streak .learning-stat-card__icon { background: #fff3e0; }
.learning-stat-card--today  .learning-stat-card__icon { background: #e8f5e9; }

.learning-stat-card__body {
  display: flex;
  flex-direction: column;
  gap: .1rem;
  min-width: 0;
  flex: 1;
}
.learning-stat-card__label {
  font-size: .76rem;
  font-weight: 600;
  color: #888;
  display: flex;
  align-items: center;
  gap: .4rem;
  white-space: nowrap;
}
.learning-stat-card__value {
  font-size: 1.7rem;
  font-weight: 900;
  color: #1a1a2e;
  line-height: 1.05;
  letter-spacing: -.02em;
}
.learning-stat-card__unit {
  font-size: .82rem;
  font-weight: 700;
  color: #aaa;
  margin-left: 2px;
}
.learning-stat-card__sep {
  color: #ccc;
  margin: 0 1px;
  font-weight: 700;
}

/* 「変更」ボタン */
.learning-stat-card__edit {
  background: #f0f0f5;
  border: none;
  color: #5c6bc0;
  cursor: pointer;
  font-size: .68rem;
  font-weight: 700;
  padding: .12rem .45rem;
  border-radius: 5px;
  transition: background .12s;
}
.learning-stat-card__edit:hover { background: #e0e3f5; }

/* 今日のタスク進捗バー */
.learning-stat-card__bar {
  margin-top: .3rem;
  height: 5px;
  background: #eceef5;
  border-radius: 999px;
  overflow: hidden;
}
.learning-stat-card__bar-fill {
  display: block;
  height: 100%;
  background: linear-gradient(90deg,#43a047,#66bb6a);
  border-radius: 999px;
  transition: width .4s ease;
}

/* スマホ: PCと同じ3カード横並びを維持しつつコンパクトに */
@media (max-width: 700px) {
  .learning-topbar {
    grid-template-columns: repeat(3, 1fr); /* 横並び維持 */
    gap: .4rem;
  }
  .learning-stat-card         { padding: .55rem .5rem; gap: .4rem; }
  .learning-stat-card__icon   { width: 30px; height: 30px; font-size: 1.05rem; border-radius: 8px; }
  .learning-stat-card__value  { font-size: 1.15rem; }
  .learning-stat-card__label  { font-size: .6rem; white-space: nowrap; }
  .learning-stat-card__unit   { font-size: .68rem; }
}

/* ── 旧スタイル非表示 ── */
.learning-stats-bar__logins,
.learning-stats-bar,
.learning-topbar__sep { display: none; }


/* ─────────────────────────────────────────────
   学習カレンダー
   ───────────────────────────────────────────── */
.learning-calendar {
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: 16px;
  padding: 1.5rem;
  margin-top: 3rem;
  /* カレンダー全体を明朝体に */
  font-family: "游明朝", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "ヒラギノ明朝 ProN", "MS Mincho", serif;
}
.learning-calendar__title { font-size: 1.5rem; margin: 0 0 1.5rem; font-weight: 700; }
.learning-calendar__month { margin-bottom: 2rem; }
.learning-calendar__month:last-child { margin-bottom: 0; }
.learning-calendar__month-title {
  font-size: 1.125rem;
  margin: 0 0 0.75rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 700;
}
.learning-calendar__month-tag {
  font-size: 0.6875rem;
  background: var(--color-bg);
  color: var(--color-muted);
  padding: 0.125rem 0.5rem;
  border-radius: 999px;
  font-family: sans-serif;
}

.learning-calendar__grid {
  width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 4px;
}
.learning-calendar__grid th {
  font-size: 0.75rem;
  color: var(--color-muted);
  font-weight: 600;
  padding-bottom: 0.5rem;
}
.learning-calendar__grid th.is-sun { color: #c45c5c; }
.learning-calendar__grid th.is-sat { color: #5c7bc4; }

.learning-calendar__grid td {
  aspect-ratio: 1;
  background: var(--color-bg);
  border-radius: 6px;
  text-align: center;
  vertical-align: middle;
  font-size: 0.9rem;
  color: var(--color-ink);
  position: relative;
  padding: 4px 2px;
}
.learning-calendar__grid td.is-empty { background: transparent; }
.learning-calendar__grid td.is-learned {
  background: var(--color-accent);
  color: #fff;
  font-weight: 600;
}

/* ── 受講ステータス凡例 ─────────────────── */
.learning-calendar__legend {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 16px;
  padding: 12px 14px;
  background: #fafafa;
  border-radius: 8px;
  margin-top: 1rem;
  font-family: sans-serif;
}
.learning-calendar__legend-title {
  font-weight: 700;
  font-size: 0.85rem;
  color: #555;
  width: 100%;
  margin-bottom: 4px;
}
.learning-calendar__legend-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.8rem;
  color: #555;
}
.learning-calendar__legend-swatch {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 4px;
  font-size: 0.7rem;
  font-weight: 700;
}
.learning-calendar__legend-swatch--learned {
  background: var(--color-accent);
  color: #fff;
}
.learning-calendar__legend-swatch--gold   { background: #fff8e1; color: #f57f17; }
.learning-calendar__legend-swatch--silver { background: #f3f4f6; color: #455a64; }
.learning-calendar__legend-swatch--bronze { background: #fff3e0; color: #ef6c00; }
.learning-calendar__legend-swatch--poor   { background: #fee2e2; color: #c62828; }
.learning-calendar__legend-swatch--today  {
  background: var(--color-bg);
  color: var(--color-ink);
  outline: 2px solid var(--color-ink);
  outline-offset: -2px;
}

/* ─────────────────────────────────────────────
   Modal
   ───────────────────────────────────────────── */
.learning-modal {
  position: fixed; inset: 0;
  display: flex; align-items: center; justify-content: center;
  z-index: 50;
  padding: 1rem;
}
.learning-modal[hidden] { display: none; }
.learning-modal__backdrop {
  position: absolute; inset: 0;
  background: rgba(26, 29, 41, 0.5);
  backdrop-filter: blur(4px);
}
.learning-modal__panel {
  position: relative;
  background: #fff;
  border-radius: 16px;
  padding: 2rem;
  max-width: 480px;
  width: 100%;
  text-align: center;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}
.learning-modal__title { font-family: var(--font-serif); font-size: 1.5rem; margin: 0 0 0.5rem; }
.learning-modal__lead { color: var(--color-muted); margin: 0 0 1.5rem; }

.learning-modal__options {
  display: flex;
  gap: 0.75rem;
  justify-content: center;
}
.learning-modal__option {
  flex: 1;
  background: var(--color-bg);
  border: 2px solid var(--color-border);
  border-radius: 12px;
  padding: 1.25rem 0.5rem;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
  position: relative;
}
.learning-modal__option:hover { border-color: var(--color-accent); }
.learning-modal__option.is-current { border-color: var(--color-accent); background: rgba(196, 77, 44, 0.05); }
.learning-modal__option-num {
  display: block;
  font-family: var(--font-serif);
  font-size: 2rem;
  font-weight: 700;
}
.learning-modal__option-label {
  display: block;
  font-size: 0.75rem;
  color: var(--color-muted);
  margin-top: 0.25rem;
}
.learning-modal__option-tag {
  position: absolute;
  top: -8px; right: 8px;
  background: var(--color-accent);
  color: #fff;
  font-size: 0.625rem;
  padding: 0.125rem 0.5rem;
  border-radius: 999px;
}

/* ─────────────────────────────────────────────
   Stage Up モーダル
   ───────────────────────────────────────────── */
.learning-modal--stage-up .learning-modal__panel { padding: 3rem 2rem; }
.learning-stage-up__confetti {
  font-size: 3rem;
  margin-bottom: 0.5rem;
  animation: learning-pop 0.5s ease;
}
.learning-stage-up__label {
  font-size: 0.75rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--color-accent);
  margin: 0 0 0.5rem;
}
.learning-stage-up__name {
  font-family: var(--font-serif);
  font-size: 2rem;
  margin: 0 0 2rem;
}
.learning-stage-up__emoji { font-size: 2rem; vertical-align: middle; }

@keyframes learning-pop {
  0%   { transform: scale(0.5); opacity: 0; }
  50%  { transform: scale(1.2); }
  100% { transform: scale(1); opacity: 1; }
}

/* ─────────────────────────────────────────────
   Point Toast
   ───────────────────────────────────────────── */
.learning-toast {
  position: fixed;
  top: 5rem;
  left: 50%;
  transform: translateX(-50%) translateY(-20px);
  background: var(--color-ink);
  color: var(--color-bg);
  padding: 0.75rem 1.5rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 700;
  opacity: 0;
  transition: transform 0.3s ease, opacity 0.3s ease;
  z-index: 100;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}
.learning-toast.is-show {
  transform: translateX(-50%) translateY(0);
  opacity: 1;
}
.learning-toast__icon { font-size: 1.125rem; }
.learning-toast--point { background: var(--color-accent); }

/* ── カレンダー: 評価バッジ ─────────────────────── */
.learning-calendar__grid td.has-grade {
  position: relative;
  background-image: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.02) 100%);
}
.learning-calendar__grade {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  margin-top: 2px;
  font-size: 0.65rem;
  font-weight: 700;
  line-height: 1;
}
.learning-calendar__grade-emoji { font-size: 0.85rem; }
.learning-calendar__grade-rate  { font-variant-numeric: tabular-nums; }

.learning-calendar__grid td.is-grade-gold   { background: #fff8e1; }
.learning-calendar__grid td.is-grade-gold   .learning-calendar__grade { color: #f57f17; }
.learning-calendar__grid td.is-grade-silver { background: #f3f4f6; }
.learning-calendar__grid td.is-grade-silver .learning-calendar__grade { color: #455a64; }
.learning-calendar__grid td.is-grade-bronze { background: #fff3e0; }
.learning-calendar__grid td.is-grade-bronze .learning-calendar__grade { color: #ef6c00; }
.learning-calendar__grid td.is-grade-poor   { background: #fee2e2; }
.learning-calendar__grid td.is-grade-poor   .learning-calendar__grade { color: #c62828; }

/* ── ステータスバー: ログイン日数カード（旧 — topbar に統合済み） ── */
.learning-stats-bar__logins,
.learning-stats-bar__login-item,
.learning-stats-bar__login-item::before,
.learning-stats-bar__login-emoji,
.learning-stats-bar__login-label,
.learning-stats-bar__login-value,
.learning-stats-bar__login-value::after { display: none; }

/* ── スタンプ・バッジコレクション ─────────────── */
.learning-collection {
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 12px;
  padding: 1.25rem 1.5rem;
  margin: 1.5rem 0;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.learning-collection__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
  flex-wrap: wrap;
  gap: 10px;
}
.learning-collection__title {
  font-size: 1.05rem;
  margin: 0;
  font-weight: 700;
}
.learning-collection__exchange-btn {
  background: linear-gradient(180deg, #fbbf24, #f59e0b);
  color: #fff;
  border: 2px solid #d97706;
  border-radius: 999px;
  padding: 8px 18px;
  font-weight: 700;
  font-size: 0.9rem;
  cursor: pointer;
  box-shadow: 0 3px 0 #b45309;
  transition: all 0.1s;
}
.learning-collection__exchange-btn:hover:not(:disabled) {
  transform: translateY(-1px);
}
.learning-collection__exchange-btn:active:not(:disabled) {
  transform: translateY(2px);
  box-shadow: none;
}
.learning-collection__exchange-btn:disabled {
  background: #ccc;
  border-color: #999;
  color: #666;
  cursor: not-allowed;
  box-shadow: none;
}

/* バッジ（最大 10 個） */
.learning-badges {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}
.learning-badges__item {
  flex: 1 1 90px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 10px 6px;
  border: 2px solid #e0e0e0;
  border-radius: 10px;
  background: #fafafa;
  transition: all 0.2s;
  min-width: 0;
}
.learning-badges__item.is-earned {
  background: linear-gradient(145deg, #fffde7, #fff8e1);
  border-color: #ffa000;
  box-shadow: 0 2px 8px rgba(255, 160, 0, 0.25);
}
.learning-badges__item.is-locked .learning-badges__emoji {
  opacity: 0.35;
}
.learning-badges__emoji {
  font-size: 1.7rem;
  line-height: 1;
}
.learning-badges__name {
  font-weight: 700;
  font-size: 0.88rem;
  margin-top: 4px;
  color: #333;
}
.learning-badges__thresh {
  font-size: 0.72rem;
  color: #888;
  margin-top: 2px;
}

/* スタンプ 50 個 */
.learning-stamps__progress {
  text-align: center;
  font-size: 0.95rem;
  color: #555;
  margin-bottom: 0.5rem;
}
.learning-stamps__progress strong {
  color: #f59e0b;
  font-size: 1.3rem;
  font-variant-numeric: tabular-nums;
}
.learning-stamps__grid {
  display: grid;
  grid-template-columns: repeat(10, 1fr);
  gap: 4px;
  padding: 10px;
  background: #f5f5f5;
  border-radius: 8px;
}
.learning-stamps__cell {
  aspect-ratio: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px dashed #ccc;
  border-radius: 50%;
  background: #fff;
  font-size: 0.85rem;
  font-weight: 700;
  color: #ccc;
}
.learning-stamps__cell.is-collected {
  background: #fbbf24;
  border: 2px solid #d97706;
  border-style: solid;
  color: #fff;
}
.learning-stamps__cell.is-milestone {
  position: relative;
}
.learning-stamps__cell.is-milestone::after {
  content: '🏅';
  position: absolute;
  top: -10px;
  right: -6px;
  font-size: 0.7rem;
  background: #fff;
  border-radius: 50%;
  padding: 1px;
}

.learning-collection__note {
  margin: 0.75rem 0 0;
  font-size: 0.82rem;
  color: #888;
  text-align: center;
}

@media (max-width: 768px) {
  .learning-stamps__grid {
    grid-template-columns: repeat(5, 1fr);  /* 5列縦長に */
    gap: 10px;
    padding: 14px;
    max-width: 380px;
    margin: 0 auto;
  }
  .learning-stamps__cell {
    /* 2倍の大きさ（aspect-ratio: 1 なので幅が2倍になれば高さも2倍） */
    border-width: 3px;
    font-size: 1.7rem;
  }
  .learning-stamps__cell .learning-stamps__check {
    font-size: 2rem;
  }
  .learning-stamps__cell.is-milestone::after {
    font-size: 1.1rem;
    top: -12px;
    right: -8px;
    padding: 2px;
  }
}

/* ── スタンプ・バッジ: テーマ内画像対応 ──────────── */

/* スタンプ画像がある場合 */
.learning-stamps__cell.is-collected .learning-stamps__img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 50%;
  display: block;
}
/* 画像なしの ✓ チェックマーク */
.learning-stamps__cell .learning-stamps__check {
  font-size: 0.9rem;
  font-weight: 900;
  color: #fff;
}
/* グリッド下の説明 */
.learning-stamps__grid-label {
  text-align: center;
  font-size: 0.78rem;
  color: #999;
  margin: 0.4rem 0 0;
}

/* バッジ画像がある場合 */
.learning-badges__img {
  width: 80px;
  height: 80px;
  object-fit: contain;
  border-radius: 8px;
  display: block;
  margin: 0 auto 4px;
}
.learning-badges__img.is-locked-img {
  opacity: 0.25;
  filter: grayscale(100%);
}
/* 画像ありのとき絵文字は隠す */
.learning-badges__item:has(.learning-badges__img) .learning-badges__emoji {
  display: none;
}
/* ロックアイコンを画像上に重ねる */
.learning-badges__lock-icon {
  position: absolute;
  top: 8px;
  right: 8px;
  font-size: 1rem;
  line-height: 1;
  text-shadow: 0 1px 3px rgba(0,0,0,0.4);
}
/* バッジアイテムに relative を追加（ロックアイコン用） */
.learning-badges__item {
  position: relative;
}

/* ── 学習カレンダー: 明朝体 + 凡例 ─────────────── */
.learning-calendar {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", "MS Mincho", serif;
}
.learning-calendar__title {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", "MS Mincho", serif;
  font-weight: 600;
  letter-spacing: 0.04em;
}
.learning-calendar__month-title {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", "MS Mincho", serif;
  font-weight: 600;
}
.learning-calendar__grid th,
.learning-calendar__grid td,
.learning-calendar__day,
.learning-calendar__grade,
.learning-calendar__legend-item {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", "MS Mincho", serif;
}

/* 凡例ボックス */
.learning-calendar__legend {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  align-items: center;
  padding: 12px 16px;
  margin: 0 0 1rem;
  background: #fafafa;
  border-radius: 8px;
  border: 1px solid #eee;
  font-size: 0.82rem;
}
.learning-calendar__legend-label {
  font-weight: 700;
  color: #555;
  margin-right: 4px;
}
.learning-calendar__legend-item {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: 4px;
  white-space: nowrap;
}
.learning-calendar__legend-item.is-grade-gold   { background: #fff8e1; color: #f57f17; }
.learning-calendar__legend-item.is-grade-silver { background: #f3f4f6; color: #455a64; }
.learning-calendar__legend-item.is-grade-bronze { background: #fff3e0; color: #ef6c00; }
.learning-calendar__legend-item.is-grade-poor   { background: #fee2e2; color: #c62828; }
.learning-calendar__legend-item.is-learned      { background: #e3f2fd; color: #1565c0; }
.learning-calendar__legend-emoji {
  font-weight: 700;
  font-size: 0.95rem;
}

@media (max-width: 600px) {
  .learning-calendar__legend {
    font-size: 0.75rem;
    gap: 4px 8px;
    padding: 10px;
  }
}

/* ── カレンダー: 前後2週間レイアウト ──────────── */
.learning-calendar__grid {
  width: 100%;
  border-collapse: separate;
  border-spacing: 2px;
  background: transparent;
  table-layout: fixed;
  margin-top: 1rem;
}
.learning-calendar__weekday {
  padding: 6px 0;
  font-weight: 700;
  color: #555;
  font-size: 0.85rem;
  background: #f5f0e6;
  border-radius: 4px;
}
.learning-calendar__weekday.is-sunday   { color: #c62828; }
.learning-calendar__weekday.is-saturday { color: #1565c0; }
.learning-calendar__cell {
  height: 70px;
  vertical-align: top;
  padding: 6px;
  background: #fff;
  border-radius: 6px;
  border: 1px solid #e9e2d4;
  position: relative;
  color: #222 !important;   /* 日付文字色は黒（白を強制上書き） */
}
.learning-calendar__cell.is-empty {
  background: transparent;
  border: none;
}
.learning-calendar__cell.is-past {
  background: #f9f6ef;
}
.learning-calendar__cell.is-today {
  background: linear-gradient(135deg, #e3f2fd 0%, #bbdefb 100%);
  border: 3px solid #1976d2;
  font-weight: 800;
  position: relative;
}
.learning-calendar__cell.is-today::before {
  content: '今日';
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  background: #1976d2;
  color: #fff;
  font-size: 0.65rem;
  font-weight: 800;
  padding: 1px 8px;
  border-radius: 999px;
  letter-spacing: 0.05em;
  white-space: nowrap;
  line-height: 1.5;
  z-index: 2;
}
.learning-calendar__cell.is-today .learning-calendar__day {
  color: #0d47a1 !important;
}
.learning-calendar__cell.is-future {
  opacity: 0.65;
}
.learning-calendar__day {
  display: block;
  font-size: 0.95rem;
  color: #222 !important;        /* 必ず黒 */
  font-weight: 600;
}
.learning-calendar__day small {
  font-size: 0.7rem;
  color: #888;
  font-weight: 500;
}
.learning-calendar__cell.is-sunday .learning-calendar__day   { color: #c62828 !important; }
.learning-calendar__cell.is-saturday .learning-calendar__day { color: #1565c0 !important; }
.learning-calendar__cell.is-today .learning-calendar__day    { color: #0d47a1 !important; }

/* 評価バッジ */
.learning-calendar__grade {
  display: block;
  margin-top: 4px;
  font-size: 1.3rem;
  text-align: center;
  line-height: 1;
}
.learning-calendar__learned-dot {
  display: block;
  margin-top: 4px;
  font-size: 1rem;
  text-align: center;
  color: #1565c0;
}

/* セル背景（評価別） */
.learning-calendar__cell.is-grade-gold   { background: linear-gradient(135deg, #fff8e1, #ffecb3); border-color: #ffa000; }
.learning-calendar__cell.is-grade-silver { background: linear-gradient(135deg, #f5f5f5, #eceff1); border-color: #607d8b; }
.learning-calendar__cell.is-grade-bronze { background: linear-gradient(135deg, #fff3e0, #ffe0b2); border-color: #ef6c00; }
.learning-calendar__cell.is-grade-poor   { background: linear-gradient(135deg, #ffebee, #ffcdd2); border-color: #c62828; }

@media (max-width: 600px) {
  .learning-calendar__cell { height: 55px; padding: 4px; }
  .learning-calendar__day { font-size: 0.8rem; }
  .learning-calendar__grade { font-size: 1rem; }
}

/* ── カレンダー: 月替わり表示 ──────────── */
.learning-calendar__month-header {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
  margin: 0.75rem 0 1rem;
  padding: 10px 14px;
  background: linear-gradient(135deg, #e3f2fd 0%, #bbdefb 100%);
  border-radius: 8px;
  border-left: 4px solid #1976d2;
}
.learning-calendar__month-label {
  font-weight: 700;
  color: #0d47a1;
  font-size: 1rem;
  letter-spacing: 0.04em;
}

/* 月開始日 (1日) を強調 */
.learning-calendar__cell.is-month-start {
  background: linear-gradient(135deg, #fff3e0, #ffe0b2) !important;
  border: 2px solid #ef6c00 !important;
  box-shadow: 0 2px 6px rgba(239, 108, 0, 0.18);
}
.learning-calendar__month-tag {
  position: absolute;
  top: 2px;
  right: 4px;
  background: #ef6c00;
  color: #fff;
  font-size: 0.65rem;
  font-weight: 800;
  padding: 1px 6px;
  border-radius: 8px;
  letter-spacing: 0.05em;
  line-height: 1.4;
  z-index: 1;
}
.learning-calendar__cell.is-month-start .learning-calendar__day {
  font-weight: 900 !important;
  color: #d84315 !important;
}

/* ── カレンダー: 月ヘッダ行 ──────────── */
.learning-calendar__month-row td {
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
}
.learning-calendar__month-header-cell {
  text-align: left;
  padding: 14px 12px 8px !important;
}
.learning-calendar__month-row .learning-calendar__month-tag {
  position: static;
  display: inline-block;
  background: linear-gradient(135deg, #1976d2, #1565c0);
  color: #fff;
  font-size: 0.95rem;
  font-weight: 800;
  padding: 6px 16px;
  border-radius: 6px;
  letter-spacing: 0.05em;
  line-height: 1.5;
  box-shadow: 0 2px 6px rgba(25, 118, 210, 0.30);
}

/* 上部の月リスト（古いの）を非表示 */
.learning-calendar__month-header { display: none !important; }

/* ═══════════════════════════════════════════════════
   スタンプ選択モーダル（100種類から好きな1枚を選ぶ）
   ═══════════════════════════════════════════════════ */
.learning-stamps__total-note {
  font-size: 0.85em;
  color: var(--color-muted, #888);
  margin-left: 0.4em;
  font-weight: normal;
}

.learning-stamp-picker {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
.learning-stamp-picker[hidden] { display: none; }

.learning-stamp-picker__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}

.learning-stamp-picker__panel {
  position: relative;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.35);
  width: 100%;
  max-width: 720px;
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  animation: stampPickerIn 0.25s ease-out;
}
@keyframes stampPickerIn {
  from { opacity: 0; transform: translateY(20px) scale(0.95); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

.learning-stamp-picker__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  background: linear-gradient(135deg, #fef9e7, #fdf4d3);
}

.learning-stamp-picker__title {
  margin: 0;
  font-size: 1.15rem;
  font-weight: 700;
}

.learning-stamp-picker__close {
  background: transparent;
  border: none;
  font-size: 1.8rem;
  line-height: 1;
  cursor: pointer;
  color: #555;
  padding: 0 0.4rem;
  border-radius: 6px;
}
.learning-stamp-picker__close:hover { background: rgba(0, 0, 0, 0.06); color: #000; }

.learning-stamp-picker__desc {
  margin: 0;
  padding: 0.75rem 1.25rem;
  font-size: 0.9rem;
  color: #555;
  background: #fafafa;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.learning-stamp-picker__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
  gap: 0.6rem;
  padding: 1rem 1.25rem;
  overflow-y: auto;
  flex: 1;
}

.learning-stamp-picker__item {
  background: #fff;
  border: 2px solid rgba(0, 0, 0, 0.08);
  border-radius: 10px;
  padding: 0.5rem 0.3rem;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
  transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
  position: relative;
}
.learning-stamp-picker__item:hover:not(:disabled) {
  border-color: var(--color-primary, #43a047);
  transform: translateY(-3px);
  box-shadow: 0 6px 16px rgba(67, 160, 71, 0.25);
}
.learning-stamp-picker__item:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.learning-stamp-picker__item img {
  width: 56px;
  height: 56px;
  object-fit: contain;
}
.learning-stamp-picker__placeholder {
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.8rem;
  background: #f0f0f0;
  border-radius: 50%;
  color: #aaa;
}
.learning-stamp-picker__no {
  font-size: 0.7rem;
  color: #777;
  font-weight: 600;
}
.learning-stamp-picker__empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 2rem 1rem;
  color: #888;
  margin: 0;
}

@media (max-width: 480px) {
  .learning-stamp-picker__grid {
    grid-template-columns: repeat(auto-fill, minmax(72px, 1fr));
    gap: 0.5rem;
    padding: 0.75rem;
  }
  .learning-stamp-picker__item img,
  .learning-stamp-picker__placeholder {
    width: 48px;
    height: 48px;
  }
}

/* ── スマホでも1日のタスク量を変更しやすく ── */
@media (max-width: 700px) {
  /* ラベル行の折り返しを許可し、「変更」を独立した行のタップしやすいボタンに */
  .learning-stat-card--today .learning-stat-card__label {
    white-space: normal;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .3rem;
  }
  .learning-stat-card--today .learning-stat-card__edit {
    font-size: .72rem;
    padding: .28rem .6rem;
    min-height: 28px;
    border-radius: 8px;
    background: #e8ebfa;
  }
  /* カード全体をタップ可能に見せる */
  .learning-stat-card--today { cursor: pointer; }
}