/* v2.3 等級之路與花朵（public/js/flowers.js） */

/* 等級之路：左邊等級、右邊這一級開放的東西；手機 375px 也排得下 */
.road-row { align-items: flex-start; gap: 10px; }
.road-lv { flex: none; width: 52px; display: flex; flex-direction: column; align-items: center; gap: 2px; padding-top: 2px; }
.road-lv b { font-size: 13px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.road-check { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font-size: 13px; font-weight: 700; background: var(--paper-2); color: var(--ink-soft); }
.road-row.done .road-check { background: #8fcf72; color: #fff; }
.road-row.road-up .road-check { background: var(--sun); color: #7a5a10; }
.road-row.road-up { box-shadow: inset 0 0 0 2px var(--sun); }
.road-row.road-later { background: #fff; opacity: .82; }
.road-line { display: flex; align-items: flex-start; gap: 5px; overflow-wrap: anywhere; }
.road-line + .road-line { margin-top: 2px; }
.road-mark { flex: none; width: 18px; text-align: center; }
.road-line .tag { flex: none; line-height: 18px; padding: 0 6px; }
.road-secret { color: #8a6fb0; font-weight: 600; }

/* 升級視窗的下一級預告 */
.road-next { margin-top: 8px; padding: 8px 12px; background: var(--paper-2); border-radius: 14px; font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }

/* 獎勵 App 四個分頁：字小一點，不換行 */
.tabs:has(> :nth-child(4)) .tab { font-size: 13.5px; }

/* 手作：花束 */
.bouquet-pick { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 10px 12px; background: #fff; border-radius: 18px; box-shadow: 0 2px 0 var(--line); }
.bouquet-slot { width: 52px; height: 52px; border: 2px dashed var(--line); border-radius: 14px; background: var(--paper-2); display: grid; place-items: center; color: var(--ink-soft); font-size: 20px; padding: 0; }
.bouquet-slot.on { border-style: solid; border-color: var(--sun); background: #fff8df; }
.bouquet-slot .ic { width: 40px; height: 40px; }
.bouquet-pick .btn { margin-left: auto; }
button.dex-card { border: 0; font: inherit; color: inherit; cursor: pointer; }
button.dex-card:disabled { opacity: .5; cursor: default; }
.flower-card.rare { box-shadow: inset 0 0 0 2px #c9a4ef, 0 2px 0 var(--line); }
