/* Fishing Fleet Tycoon: shop panel under the harbour scene (shared HUD: /fishing-games/_shared/fish2d.css) */
.fl-panel { margin-top: 10px; }
.fl-tabs { display: flex; gap: 6px; margin-bottom: 8px; }
.fl-tabs button { flex: 1; padding: 9px 6px; border-radius: 10px; border: 1px solid var(--color-border, #333); background: var(--color-bg-alt, #1c1f27); color: var(--color-text, #fff); font: 800 14px system-ui, sans-serif; cursor: pointer; }
.fl-tabs button.is-on { background: #0369a1; border-color: #38bdf8; color: #fff; }
.fl-list { display: flex; flex-direction: column; gap: 6px; }
.fl-row { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 12px; background: var(--color-bg-alt, #1c1f27); border: 1px solid var(--color-border, #333); }
.fl-row--lock { justify-content: center; opacity: .7; font-size: 13px; }
.fl-row--here { border-color: #38bdf8; }
.fl-ic { font-size: 28px; width: 36px; text-align: center; flex: 0 0 auto; }
.fl-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.fl-info b { font-size: 15px; } .fl-info em { font-style: normal; color: #38bdf8; font-weight: 800; }
.fl-info small { font-size: 12px; opacity: .75; }
.fl-bar { height: 5px; border-radius: 3px; background: rgba(255, 255, 255, .12); overflow: hidden; margin-top: 3px; }
.fl-bar i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, #22c55e, #38bdf8); }
.fl-btns { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; flex: 0 0 auto; }
.fl-btns .btn { padding: 7px 10px; font-size: 13px; white-space: nowrap; }
.fl-cap { font-weight: 800; font-size: 13px; color: #86efac; padding: 6px 8px; }
.fl-note { font-size: 13px; opacity: .8; margin: 6px 2px; }
@media (max-width: 560px) {
  .fl-row { flex-wrap: wrap; }
  .fl-info { flex-basis: calc(100% - 50px); }
  .fl-btns { flex-basis: 100%; justify-content: stretch; }
  .fl-btns .btn { flex: 1; }
}