/* Illustrated inventory and shop cards share the approved light item backdrop. */
.catalog-search { display:grid; gap:8px; padding:14px; font:13px/1.4 system-ui,sans-serif; }
.catalog-search input { box-sizing:border-box; width:100%; min-width:0; min-height:44px; padding:10px; border:1px solid var(--line); background:var(--panel); color:var(--ink); font:16px system-ui,sans-serif; }
.catalog-search-field { display:flex; align-items:center; gap:8px; min-width:0; }
.catalog-search-field input { flex:1; }
.catalog-search-field .btn { flex:none; min-height:44px; }
.catalog-search-field [hidden] { display:none; }
.inventory-sortbar { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; align-items:end; padding:14px 14px 0; font:13px/1.4 system-ui,sans-serif; }
.inventory-sortbar label { display:grid; gap:6px; min-width:0; }
.inventory-sortbar select { box-sizing:border-box; width:100%; min-width:0; min-height:44px; padding:8px; border:1px solid var(--line); background:var(--panel); color:var(--ink); font:16px system-ui,sans-serif; }
.inventory-sortbar .btn { min-height:44px; white-space:normal; }
.item-new { position:absolute; top:8px; left:8px; padding:3px 7px; border:1px solid #687b4d; background:#e6eddb; color:#364d26; font:500 12px/1.4 system-ui,sans-serif; box-shadow:0 1px 3px #0002; }
@media(max-width:420px) { .inventory-sortbar { grid-template-columns:minmax(0,1fr); gap:8px; } }
.shop-tabs { position:sticky; top:max(var(--safe-top,0px),env(safe-area-inset-top,0px)); z-index:2; background:#e7e1cd; }
.panel[data-list-context] { min-width:0; }
.trade-copy { padding:16px; display:grid; gap:12px; min-width:0; }
.trade-copy h2 { font:22px/1.3 Georgia,serif; overflow-wrap:anywhere; }
.trade-copy p { margin:0; }
.trade-stepper { display:grid; grid-template-columns:44px minmax(0,1fr) 44px; gap:8px; }
.trade-stepper .btn,.trade-stepper input { min-height:44px; min-width:0; }
.trade-stepper input { box-sizing:border-box; width:100%; padding:8px; font:16px system-ui,sans-serif; text-align:center; background:var(--panel); color:var(--ink); border:1px solid var(--line); }
.trade-presets { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.trade-presets .btn { min-width:0; min-height:44px; padding:8px 4px; }
.trade-presets [aria-pressed="true"] { outline:2px solid var(--olive); outline-offset:-2px; }
.trade-error { color:#963f33; font:13px/1.4 system-ui,sans-serif; }
.trade-summary { margin:0; font:14px/1.5 system-ui,sans-serif; }
.trade-summary>div { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; padding:7px 0; border-bottom:1px solid var(--line); }
.trade-summary dd { margin:0; text-align:right; font-variant-numeric:tabular-nums; }
.trade-quantity .catalog-footer,.repair-all .catalog-footer { position:sticky; bottom:0; }
.trade-quantity .catalog-footer .btn,.repair-all .catalog-footer .btn { min-height:48px; white-space:normal; }
.repair-set-summary { display:grid; gap:10px; padding:16px; border-bottom:1px solid var(--line); }
.repair-set-summary p { margin:0; }
.repair-set-summary .btn { min-height:48px; white-space:normal; }
.repair-set-items { list-style:none; padding:0; margin:0; font:14px/1.5 system-ui,sans-serif; }
.repair-set-items li { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; padding:10px 0; border-bottom:1px solid var(--line); }
.repair-set-items b { display:block; overflow-wrap:anywhere; }
.repair-set-items span { display:block; color:var(--muted); font-size:12px; }
.repair-all [hidden] { display:none; }
.fish-collection { grid-template-columns:repeat(3,minmax(0,1fr)); }
.fish-type { min-width:0; overflow-wrap:anywhere; }
.fish-type .item-art { display:block; width:100%; aspect-ratio:1; height:auto; object-fit:contain; }
.item-icon > .item-art,
.gear-slot > .item-art { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; pointer-events:none; }
.gear-slot { overflow:hidden; }
.gear-slot .broken { z-index:1; background:#f5f1e6; padding:1px 3px; }

.catalog-card { display:flex; flex-direction:column; background:var(--panel); }
.item-picture { display:grid; place-items:center; position:relative; width:100%; aspect-ratio:1; min-width:0; padding:0; border:0; border-bottom:1px solid var(--line); background:#dcd8c5; color:#68684f; }
.item-picture .item-art { display:block; position:absolute; inset:0; width:100%; height:100%; object-fit:contain; }
.item-picture > .icon { width:36%; height:36%; max-width:84px; max-height:84px; stroke-width:1.2; }
.item-picture:focus-visible { outline-offset:-4px; z-index:1; }
.item-picture:hover { box-shadow:inset 0 0 0 2px #a99563; }
.item-equipped, .item-count { position:absolute; bottom:8px; padding:3px 6px; font:11px/1.4 system-ui,sans-serif; background:#f4f0e3f5; border:1px solid #c0b99e; color:#45563a; }
.item-equipped { left:8px; }
.item-count { right:8px; color:#4d503d; }
.catalog-info { padding:12px 12px 8px; }
.catalog-info h3 { font:16px/1.3 Georgia,"Times New Roman",serif; min-height:2.6em; margin:0 0 8px; overflow-wrap:anywhere; }
.catalog-stat { font:13px/1.5 system-ui,sans-serif; color:#465338; margin:0 0 5px; overflow-wrap:anywhere; }
.catalog-requirements { font:12px/1.5 system-ui,sans-serif; color:#62634f; margin:0; overflow-wrap:anywhere; }
.catalog-footer { margin-top:auto; padding:10px 12px 12px; border-top:1px solid var(--line); background:#ebe5d5; display:grid; gap:8px; }
.catalog-price { font:14px/1.4 Georgia,serif; color:#745b2a; }
.catalog-actions { display:flex; flex-wrap:wrap; gap:6px; }
.catalog-actions .btn { flex:1 1 auto; min-width:0; max-width:100%; min-height:44px; padding:9px 8px; font-size:13px; white-space:normal; overflow-wrap:anywhere; }

.item-detail { --item-safe-top:max(var(--safe-top,0px),env(safe-area-inset-top,0px)); --item-safe-bottom:max(var(--safe-bottom,0px),env(safe-area-inset-bottom,0px)); position:fixed; inset:calc(var(--item-safe-top) + 12px) 0 calc(var(--item-safe-bottom) + 12px); width:min(420px,calc(100% - 24px)); max-height:calc(100dvh - var(--item-safe-top) - var(--item-safe-bottom) - 24px); margin:auto; padding:0; background:var(--panel); border:1px solid #a69b7d; color:var(--ink); box-shadow:0 12px 50px #0005; overflow:auto; overscroll-behavior:contain; }
.item-detail::backdrop { background:#252b24b8; }
.item-detail-heading { position:sticky; top:0; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:4px 6px 4px 16px; margin:0; background:#e9e3d2; border-bottom:1px solid var(--line); }
.item-detail-close { width:44px; height:44px; padding:0; font:26px/1 system-ui,sans-serif; border:0; background:none; }
.item-detail-art { display:grid; place-items:center; position:relative; background:#dcd8c5; width:100%; aspect-ratio:1; max-height:42dvh; color:#68684f; }
.item-detail-art .item-art { display:block; width:100%; height:100%; position:absolute; inset:0; object-fit:contain; }
.item-detail-art .item-art-full { opacity:0; }
.item-detail-art .item-art-full.is-ready { opacity:1; }
.item-detail-art .icon { width:96px; height:96px; stroke-width:1.2; }
.item-detail-copy { padding:16px; }
.item-detail-copy h2 { font:23px/1.3 Georgia,serif; margin:0 0 10px; overflow-wrap:anywhere; }
.item-detail-copy > p:not([class]) { font:14px/1.6 system-ui,sans-serif; color:#62634f; margin:10px 0; }
.item-detail .catalog-footer { padding:12px 16px 16px; }

@media(max-width:640px) {
  .item-grid:has(> .catalog-card) { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; padding:10px; }
  .catalog-info { padding:10px 10px 8px; }
  .catalog-info h3 { font-size:15px; }
  .catalog-stat, .catalog-requirements { font-size:12px; }
  .catalog-footer { padding:9px 10px 10px; }
}
@media(max-width:340px) {
  .item-grid:has(> .catalog-card) { gap:8px; padding:8px; }
  .catalog-info, .catalog-footer { padding-left:8px; padding-right:8px; }
  .catalog-actions .btn { font-size:12px; padding:8px 5px; }
}

.equipment-comparison { margin:16px 0; padding:12px; background:#e9e5d6; border:1px solid #c7bea5; }
.equipment-comparison h3 { font-size:16px; margin-bottom:10px; }
.equipment-comparison p, .combat-stat-note { font:12px/1.6 system-ui,sans-serif; margin:10px 0; }
.combat-stat-note { padding:0 13px; }
.equipment-comparison dl, .battle-summary { margin:12px 0; font:13px/1.6 system-ui,sans-serif; text-align:left; }
.equipment-comparison dl > div, .battle-summary > div { display:grid; grid-template-columns:minmax(85px,1fr) minmax(0,2fr); gap:10px; padding:6px 0; border-bottom:1px solid #c7bea5; }
.equipment-comparison dd, .battle-summary dd { margin:0; overflow-wrap:anywhere; }
.equipment-comparison dl > div { grid-template-columns:minmax(0,1fr) minmax(0,1.4fr); }
.equipment-comparison dt { overflow-wrap:anywhere; }
.battle-summary dt { font-weight:600; }