/* ================================================================
   遊ぶワク吉 共通成長システム 専用CSS(v1.3)
   wkg- プレフィックスで名前空間化。10問クイズ・60秒・ナンプレの
   すべてのページから共通で読み込む想定(wk-quiz.css / wk-nanpre.cssとは別ファイル)。

   このファイルは各ゲームのCSS(wk-quiz.css / wk-nanpre.css)より後に、
   ただしエンジンJSより前に読み込んでください。
   ================================================================ */

/* ---- 常設コンパクト勲章棚(ゲーム画面の下に常時表示) ---- */
.wkg-shelf{
  background:#fff; border-radius:14px; padding:10px 12px; margin:12px 0;
  font-family:"M PLUS Rounded 1c","Hiragino Maru Gothic ProN",sans-serif;
  box-shadow:0 3px 0 #E9F1F6;
}
.wkg-shelf-row{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-bottom:6px; min-height:28px; }
.wkg-profile-summary{font-size:13px;line-height:1.7;color:#3A4A63;font-weight:700;margin-bottom:8px;overflow-wrap:anywhere;}
.wkg-shelf-chip{ font-size:22px; line-height:1; }
.wkg-shelf-empty{ font-size:13px; color:#8993A6; font-weight:700; }
.wkg-shelf-next{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:8px; }
.wkg-shelf-nextitem{ font-size:12px; font-weight:700; color:#3A4A63; background:#F6F9FB; border-radius:999px; padding:4px 10px; }
.wkg-shelf-viewbtn{
  display:block; width:100%; padding:8px 0; border:2px solid #E9F1F6; border-radius:999px;
  background:transparent; font-size:13px; font-weight:800; color:#F2577E; cursor:pointer;
}

/* ---- 詳細版勲章エリア(結果画面下・3段構成) ---- */
.wkg-badgearea{ margin-top:16px; text-align:left; font-family:"M PLUS Rounded 1c","Hiragino Maru Gothic ProN",sans-serif; }
.wkg-badgesection{ margin-bottom:14px; }
.wkg-badgesection-title{ font-size:18px; font-weight:900; color:#22304A; margin-bottom:8px; }

.wkg-badgerow{ display:flex; flex-wrap:wrap; gap:8px; }
.wkg-badgechip{
  display:flex; align-items:center; gap:6px; background:#F3E6CC;
  border-radius:999px; padding:8px 14px; font-size:14px; font-weight:800; color:#8a6415;
}
.wkg-badgechip-new{ box-shadow:0 0 0 2px #B8863B; }
.wkg-badgechip-icon{ font-size:1.3em; }

.wkg-badgeprogress-line{
  display:flex; align-items:center; gap:8px; background:#F6F9FB; border-radius:10px;
  padding:8px 12px; margin-bottom:6px; font-size:14px; font-weight:700; color:#22304A;
}

.wkg-badgegrid{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.wkg-badgecard{
  background:#F6F9FB; border-radius:12px; padding:12px 8px; text-align:center;
  opacity:.55; filter:grayscale(1);
}
.wkg-badgecard-unlocked{ opacity:1; filter:none; background:#F3E6CC; }
.wkg-badgecard-icon{ font-size:28px; margin-bottom:4px; }
.wkg-badgecard-name{ font-size:14px; font-weight:800; color:#22304A; line-height:1.3; margin-bottom:4px; }
.wkg-badgecard-progress{ font-size:13px; font-weight:700; color:#3A4A63; }