/* ===== 第7版: バッジ・四角いゲージ・アイテム・パーティー・小さなメニュー ===== */

/* メニューをさらに小さく（みんなで・ひとりで・ホストが全部見える） */
.menus { gap: 12px; padding-top: 16px; }
.home { gap: 14px; padding-top: 16px; }
.menu-card { padding: 7px 10px; gap: 10px; border-width: 3px; border-radius: 16px; box-shadow: 0 4px 0 var(--ink); }
.menu-card .ico { width: 42px; height: 42px; border-radius: 12px; }
.mc-txt b { font-size: 17px; } .mc-txt small { font-size: 11px; }
.menu-card .chev { font-size: 24px; }
.menu-card.big { padding: 10px 12px; box-shadow: 0 5px 0 var(--ink); }
.menu-card.big .ico.xl { width: 60px; height: 60px; border-radius: 16px; }
.menu-card.big .mc-txt b { font-size: 24px; }
.menu-card.tour { box-shadow: 0 4px 0 var(--orange); }
.reco { top: -11px; right: 12px; font-size: 10px; padding: 0 9px; }
.ico.lg { width: 44px; height: 44px; border-radius: 13px; }

/* 点数ゲージ: 角丸ではなく、長方形 */
.track.tick, .track.tick > i, .srow.c .track.tick { border-radius: 0; }
.track.tick { background: #fff; border-width: 2.5px; }
.track.tick > i { transition: none; animation: none; }

/* 称号とバッジ: 3列。バッジと称号名だけ */
.ach-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.achb { position: relative; display: grid; justify-items: center; align-content: start; gap: 4px; padding: 8px 4px 8px; border: 3px solid var(--ink); border-radius: 14px; background: #fff; min-width: 0; opacity: .8; }
.achb.on { opacity: 1; } .achb.eq { background: var(--yellow); }
.achb b { font-size: 11px; font-weight: 800; line-height: 1.35; text-align: center; overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.7em; }
.achb .seal { position: absolute; top: -9px; right: -4px; margin: 0; background: #fff; font-size: 10px; }
.bsvg { display: block; width: 64px; height: 64px; } .bsvg svg { display: block; width: 100%; height: 100%; }
.bsvg.big { width: 104px; height: 104px; }
.ach-hero { display: grid; justify-items: center; gap: 4px; margin: 4px 0 14px; text-align: center; }
.ach-hero b { font-size: 20px; font-weight: 800; } .ach-hero small { font-size: 12px; font-weight: 800; color: var(--ink-soft); }
.how { padding: 10px 12px; border: 3px solid var(--ink); border-radius: 12px; background: #fff; font-size: 14px; font-weight: 800; line-height: 1.6; }
.tiers { display: grid; gap: 4px; list-style: none; }
.tiers li { display: flex; align-items: center; gap: 8px; padding: 4px 8px; border: 2px solid var(--paper-line); border-radius: 10px; background: #fff; opacity: .6; }
.tiers li.got { opacity: 1; border-color: var(--ink); }
.tmini { flex: none; width: 30px; height: 30px; } .tmini svg { width: 100%; height: 100%; display: block; }
.tiers b { flex: 1; min-width: 0; font-size: 13px; font-weight: 800; } .tiers em { font-size: 12px; font-weight: 800; color: var(--ink-soft); }

/* アイテムカード・パーティーの詳細 */
.seg.wrap { grid-auto-flow: row; grid-template-columns: 1fr 1fr; }
.pblock { margin-top: 12px; padding: 10px; border: 3px dashed var(--ink); border-radius: 14px; background: #fffdf3; display: grid; gap: 8px; }
.pblock h4 { font-size: 13px; font-weight: 800; letter-spacing: .08em; }
.mine { display: grid; gap: 6px; }
.prule .ico { flex: none; }
.ts-card { flex: none; display: grid; justify-items: center; gap: 0; padding: 4px 6px; border: 3px solid var(--ink); border-radius: 12px; background: #fff; line-height: 1.15; cursor: pointer; animation: cardpop 1.4s ease-in-out infinite; }
.ts-card b { font-size: 11px; font-weight: 800; } .ts-card em { font-size: 10px; font-weight: 800; color: var(--red); }
.ts-card.auto { animation: none; opacity: .85; } .ts-card.auto em { color: var(--ink-soft); }
@keyframes cardpop { 0%, 100% { transform: scale(1) } 50% { transform: scale(1.07) } }
.rcard { display: inline-flex; margin-left: 6px; vertical-align: middle; }
.rcard .ico { width: 20px; height: 20px; border-width: 2px; border-radius: 6px; }
.s-name .seal { margin-left: 4px; }
.th.rest { background: #eee; color: var(--ink-soft); border-style: dashed; font-size: 10px; }