Tier list otomatis (RENCANA 5.2): content/tiers.js dibuat simulator (BAL_TIERS=1), menu Koleksi menampilkan 'Peringkat karakter (versi simulator)' dengan keterangan bukan kebenaran mutlak; berkas dimuat malas dari meta.js sehingga index.html tidak berubah

content/tiers.js

@@ -0,0 +1,9 @@
+/* Peringkat karakter versi simulator (RENCANA 5.2). DIBUAT OTOMATIS oleh tests/balance.mjs (BAL_TIERS=1): jangan diedit tangan, jalankan ulang simulatornya.
+   Angka dari simulasi bot melawan CPU (tingkat hard, 8 ronde per pasangan arah, kedua posisi), bukan kebenaran mutlak. Dipakai menu Koleksi (meta.js renderBook).
+   updated = tanggal jalan; order = urutan dari yang tertinggi; rate = persen menang; tier = S (>= 58), A (>= 52), B (>= 46), C. */
+window.TIERS = {
+  updated: '2026-10-05',
+  order: ['megachan', 'gufron', 'sonofsolo', 'anice', 'browo', 'ethanolman', 'soloman'],
+  rate: { megachan: 58.3, gufron: 56.3, sonofsolo: 53.1, anice: 49, browo: 44.8, ethanolman: 44.8, soloman: 43.8 },
+  tier: { megachan: 'S', gufron: 'A', sonofsolo: 'A', anice: 'B', browo: 'C', ethanolman: 'C', soloman: 'C' }
+};

meta.css

@@ -61,3 +61,15 @@
 @media(max-height:700px){.mv-row small.pas-desc{display:none}}
 @media(min-width:900px){#pause-panel{width:min(1160px,calc(100% - 24px))}.move-body{columns:200px;column-gap:20px}}
 @media(min-height:421px) and (max-height:640px){.mv-sec{margin-bottom:9px}.mv-row{padding:2px 0}#pause-panel[open]{padding-top:20px;padding-bottom:20px}}
+
+/* ---- Peringkat karakter versi simulator (RENCANA 5.2): menu Koleksi ---- */
+.tiers{display:grid;gap:6px}
+.tier-row{display:grid;grid-template-columns:96px 1fr;gap:10px;align-items:center;padding:6px 8px;background:#101c26;border:1px solid #ffffff1c;border-left:4px solid var(--tc,#e8b84a);border-radius:6px;min-width:0}
+.tier-row>b{display:grid;font-size:26px;line-height:1;color:var(--tc,#e8b84a);letter-spacing:.04em}
+.tier-row>b small{font-size:10px;letter-spacing:.08em;color:#9fb3c4;margin-top:3px}
+.tier-row>div{display:flex;flex-wrap:wrap;gap:6px;min-width:0}
+.tier-chip{display:inline-flex;align-items:center;gap:6px;padding:2px 10px 2px 2px;background:#0b1520;border:1px solid #ffffff22;border-radius:6px;font-size:14px;letter-spacing:.04em}
+.tier-chip img{width:28px;height:28px;border-radius:4px;object-fit:cover}
+.tier-chip em{font-style:normal;color:#8fa3b4;font-size:12px}
+.t-S{--tc:#ffd24a}.t-A{--tc:#8dffa8}.t-B{--tc:#9fe8ff}.t-C{--tc:#ff9d8f}
+@media(max-width:560px){.tier-row{grid-template-columns:1fr}}

meta.js

@@ -270,10 +270,26 @@
     const n = fnames(who), pas = window.Passives?.lockerHtml(who, styleOf(who)) || '';
     return `<div class="roster">${pick}</div><div class="locker"><div class="preview" style="filter:${SKINS[sk]?.filter || 'none'}"><img src="${portrait(who)}" alt=""></div><div class="info"><h3>${fname(who)}</h3>${pas}<h5>Skin</h5><div class="pills">${skins}</div><h5>Jurus toko (tombol K)</h5><div class="pills">${moves}</div><p class="meta-hint">${save.owned.move.length ? '' : 'Belum punya jurus toko. Beli di tab TOKO.'}</p>${altRows}<h5>Daftar gerakan</h5><ul class="moves">${n.length ? `<li><b>SPASI</b> ${esc(n[0] || '')}</li><li><b>I</b> ${esc(n[1] || '')}</li><li><b>O</b> ${esc(n[2] || '')}</li><li><b>P</b> ${esc(n[3] || '')}</li>` : ''}${COMMANDS.map(c => `<li><b>${c[0]}</b> ${c[1]} — ${c[2]}</li>`).join('')}</ul></div></div>`;
   }
+  // ---- Peringkat karakter versi simulator (RENCANA 5.2) ----
+  // Data content/tiers.js dibuat otomatis oleh simulator (tests/balance.mjs). Dimuat malas saat Koleksi pertama dibuka; bila tidak ada atau gagal, bagian ini tidak tampil.
+  const TIER_LABEL = { S: 'DEWA ARENA', A: 'JAGOAN KAMPUNG', B: 'LUMAYAN LAH', C: 'BUTUH SEMANGAT' };
+  let tiersLoad = 0;
+  function loadTiers() {
+    if (window.TIERS || tiersLoad) return; tiersLoad = 1;
+    const s = document.createElement('script'); s.src = 'content/tiers.js';
+    s.onload = s.onerror = () => { tiersLoad = 2; if (root && !root.hidden && tab === 'book') render(); };
+    document.head.append(s);
+  }
+  function tiersHtml() {
+    const T = window.TIERS; if (!T?.order?.length) { loadTiers(); return ''; }
+    const ids = T.order.filter(id => T.tier?.[id] && (window.FIGHTERS?.[id] || id === 'browo'));
+    const rows = ['S', 'A', 'B', 'C'].map(k => { const list = ids.filter(id => T.tier[id] === k); return list.length ? `<div class="tier-row t-${k}"><b>${k}<small>${TIER_LABEL[k]}</small></b><div>${list.map(id => `<span class="tier-chip"><img src="${portrait(id)}" alt="">${esc(fname(id))}<em>${String(T.rate?.[id] ?? '').replace('.', ',')}%</em></span>`).join('')}</div></div>` : ''; }).join('');
+    return rows ? `<h3>Peringkat karakter (versi simulator)</h3><div class="tiers">${rows}</div><p class="meta-hint">Angka dari simulasi CPU, bukan kebenaran mutlak.${T.updated ? ' Diperbarui ' + esc(T.updated) + '.' : ''}</p>` : '';
+  }
   function renderBook() {
     const got = Object.keys(ACH).filter(k => save.ach[k]).length, st = save.stats;
     const list = Object.entries(ACH).map(([k, [n, d]]) => { const ok = !!save.ach[k], hidden = !ok && ['konami', 'syududu', 'mbg', 'esemka', 'penasaran', 'penasaran_berat', 'logo', 'reuni'].includes(k); return `<li class="${ok ? 'ok' : ''}"><b>${ok ? '★' : '☆'} ${hidden ? '???' : n}</b><span>${hidden ? 'Pencapaian rahasia.' : d}</span></li>`; }).join('');
-    return `<h3>Statistik</h3><p class="stats">Menang <b>${st.wins}</b> · Kalah <b>${st.losses}</b> · Bersih <b>${st.perfects}</b> · Kombo terbaik <b>${st.bestCombo}</b> · Total koin <b>${save.earned}</b></p><h3>Pencapaian ${got}/${Object.keys(ACH).length}</h3><ul class="ach">${list}</ul><h3>Suara</h3><p><button class="pill ${save.voice ? 'on' : ''}" data-voice>TERIAKAN JURUS: ${save.voice ? 'AKTIF' : 'MATI'}</button> <small class="meta-hint">Memakai suara bawaan browser.</small></p><h3>Simpanan</h3><p><button class="pill" data-export>SALIN KODE SIMPANAN</button> <button class="pill" data-import>TEMPEL KODE</button> <button class="pill danger" data-reset>HAPUS SEMUA</button></p>`;
+    return `<h3>Statistik</h3><p class="stats">Menang <b>${st.wins}</b> · Kalah <b>${st.losses}</b> · Bersih <b>${st.perfects}</b> · Kombo terbaik <b>${st.bestCombo}</b> · Total koin <b>${save.earned}</b></p>${tiersHtml()}<h3>Pencapaian ${got}/${Object.keys(ACH).length}</h3><ul class="ach">${list}</ul><h3>Suara</h3><p><button class="pill ${save.voice ? 'on' : ''}" data-voice>TERIAKAN JURUS: ${save.voice ? 'AKTIF' : 'MATI'}</button> <small class="meta-hint">Memakai suara bawaan browser.</small></p><h3>Simpanan</h3><p><button class="pill" data-export>SALIN KODE SIMPANAN</button> <button class="pill" data-import>TEMPEL KODE</button> <button class="pill danger" data-reset>HAPUS SEMUA</button></p>`;
   }
   function onClick(e) {
     const b = e.target.closest('button'); if (!b) return;