/* Navigasi bertingkat dan profil game, mengikuti warna tema aplikasi. */
.menu-grup { margin: 8px 0; }
.menu-grup > summary { cursor:pointer; padding:10px 12px; color:#a8b6ca; font-size:11px; font-weight:700; letter-spacing:.05em; }
.menu-grup[open] > summary { color:#e0d2b0; }
.menu-grup > summary:focus-visible { outline:2px solid #93c5fd; border-radius:8px; }
.menu-mobile-grup { margin-bottom:18px; }
.menu-mobile-grup h4 { font-size:12px; font-weight:800; margin:0 0 8px; color:#64748b; }
.menu-mobile-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.v12k-nav { display:block; padding:14px; }
.v12k-nav-utama { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:8px; }
.v12k-nav-utama button { padding:12px 6px; border:1px solid #dbe3ec; border-radius:12px; color:#475569; font-size:12px; font-weight:700; cursor:pointer; }
.v12k-nav-utama button[aria-current="true"] { background:#1e3a5f; color:#fff; border-color:#1e3a5f; }
.v12k-nav-bagian { margin-top:12px; padding-top:12px; border-top:1px solid #dbe3ec; }
.v12k-nav-bagian p { font-size:12px; color:#64748b; margin-bottom:8px; }
.gs-nav-kelompok { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:16px 0; }
.gs-nav-kelompok section { border:1px solid #dbe3ec; border-radius:12px; padding:12px; }
.gs-nav-kelompok h2 { font-size:11px; font-weight:800; color:#64748b; margin-bottom:8px; }
.gs-nav-kelompok .gs-tab { display:flex; flex-wrap:wrap; overflow:visible; padding:0; margin:0; border:0; }
.kelas-form { display:grid; grid-template-columns:1fr 2fr; gap:16px; margin:20px 0; }
.kelas-form label { display:flex; flex-direction:column; gap:6px; font-size:13px; font-weight:700; }
.kelas-form input,.kelas-form textarea { background:transparent; border:1px solid #94a3b8; border-radius:10px; padding:10px; font:inherit; width:100%; }
.kelas-form small { font-size:11px; font-weight:400; color:#64748b; }
.kelas-grid,.sg-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:12px; margin:16px 0; }
.sg-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.kelas-kartu,.sg-card { border:1px solid #dbe3ec; padding:16px; border-radius:14px; min-width:0; }
.kelas-kartu h3,.sg-card h3 { font-size:15px; font-weight:800; margin:0 0 6px; }
.kelas-kartu p,.sg-card p { font-size:12px; color:#64748b; line-height:1.7; }
.kelas-tags { display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
.kelas-tags span { background:rgba(43,108,181,.1); border-radius:6px; padding:4px 8px; font-size:12px; }
.sg-card dl { display:grid; grid-template-columns:1fr auto; gap:8px; font-size:12px; margin-top:12px; }
.sg-card dd { font-weight:800; margin:0; text-align:right; }
.sg-card progress { width:100%; accent-color:#2b6cb5; height:10px; margin-top:12px; }
.sg-panel { color:inherit; }
.sg-panel h2 { font-size:16px; font-weight:800; margin:12px 0; }
.sg-panel summary { cursor:pointer; font-size:13px; font-weight:700; padding:10px 0; }
.sg-aktivitas { list-style:none; padding:0; }
.sg-aktivitas li { display:flex; justify-content:space-between; gap:12px; border-bottom:1px solid #dbe3ec; padding:10px 0; font-size:12px; }
.sg-aktivitas small { display:block; opacity:.7; margin-top:4px; }
.sg-note { font-size:12px; opacity:.75; line-height:1.7; }
.dark .kelas-kartu,.dark .sg-card,.dark .gs-nav-kelompok section,.dark .v12k-nav-utama button,.dark .v12k-nav-bagian { border-color:#334155; }
.dark .v12k-nav-utama button { color:#cbd5e1; }
.dark .v12k-nav-utama button[aria-current="true"] { background:#e0d2b0; color:#1e293b; }
.dark .sg-card p,.dark .kelas-kartu p,.dark .kelas-form small,.dark .menu-mobile-grup h4 { color:#94a3b8; }
.gm .sg-panel,.gm-app .sg-panel { margin-top:16px; }
.gm-lembar .sg-card { background:rgba(148,163,184,.05); border-color:#334155; }
.gm-lembar .sg-card p,.gm-lembar .sg-note { color:#a8b6ca; opacity:1; }
.gm-menu-kelompok { margin:18px 0; }
.gm-menu-kelompok h2 { font-size:12px; font-weight:700; color:#b9c6db; margin:0 0 8px; }
.gm-menu-kelompok .gm-menu[data-jumlah="3"] { grid-template-columns:repeat(3,minmax(0,1fr)); }
.gm-menu-kelompok .gm-menu[data-jumlah="4"] { grid-template-columns:repeat(4,minmax(0,1fr)); }
@media(max-width:640px) {
  .v12k-nav-utama { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .gs-nav-kelompok { grid-template-columns:1fr; }
  .kelas-form { grid-template-columns:1fr; }
  .sg-grid { grid-template-columns:1fr; }
  .gm-menu-kelompok .gm-menu[data-jumlah="4"] { grid-template-columns:repeat(2,minmax(0,1fr)); }
}