/*
 * Podsumowanie wyprawy (agent E2, Design v3.4): przycisk „Podsumowanie wyprawy” (bursztynowa poświata), baner i lista „Do odbioru”,
 * okno „Raport z wyprawy” (prefiks es-), okno potwierdzeń, animacje (wejście kolejno, błysk i burst dla rzadkiego łupu, wlot do magazynu).
 * Kolory rzadkości z gear.css (--gr-*). Wszystkie animacje wyłączone przy prefers-reduced-motion (sekcja na końcu pliku).
 */

/* ---------- przycisk „klimatyczny” ---------- */
.es-btn {
    --pulse: rgba(240, 180, 64, 0.55);
    position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: var(--touch); padding: 0 var(--s4);
    border: 1px solid rgba(255, 214, 128, 0.7); border-radius: var(--radius-pill); cursor: pointer; font: inherit; font-weight: 700; font-size: var(--fs-sm);
    color: var(--accent-ink); text-align: center;
    background: radial-gradient(120% 160% at 50% -40%, #ffe29a 0%, #f0b440 46%, #c97d1c 100%);
    box-shadow: 0 0 0 0 var(--pulse), 0 6px 18px -6px rgba(240, 160, 40, 0.7), inset 0 1px 0 rgba(255, 255, 255, 0.45);
    animation: es-pulse 2.6s ease-in-out infinite;
    transition: transform var(--t-fast) var(--ease-out), filter var(--t-fast);
}
.es-btn:hover:not(:disabled) { transform: translateY(-1px); filter: brightness(1.08); }
.es-btn:active:not(:disabled) { transform: scale(0.97); }
.es-btn:disabled { animation: none; filter: grayscale(0.6) brightness(0.8); cursor: not-allowed; }
.es-btn .ico { width: 1.35em; height: 1.35em; flex: none; }
.es-badge {
    display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: var(--radius-pill);
    background: #3a1d08; color: #ffd98a; font-size: 12px; font-weight: 800; border: 1px solid rgba(255, 214, 128, 0.7); line-height: 1;
}
@keyframes es-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(240, 180, 64, 0), 0 6px 18px -6px rgba(240, 160, 40, 0.7), inset 0 1px 0 rgba(255, 255, 255, 0.45); }
    50% { box-shadow: 0 0 0 7px rgba(240, 180, 64, 0.22), 0 8px 26px -4px rgba(240, 160, 40, 0.9), inset 0 1px 0 rgba(255, 255, 255, 0.45); }
}
.es-link { background: none; border: 0; padding: 4px 6px; min-height: 32px; color: var(--accent); font: inherit; font-size: var(--fs-sm); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; display: inline-flex; align-items: center; gap: 5px; }
.es-link:hover { color: #ffd98a; }
.es-link .ico { width: 1.15em; height: 1.15em; }

/* ---------- baner i lista „Do odbioru” ---------- */
.es-pending { border: 1px solid rgba(240, 180, 64, 0.55); background: linear-gradient(180deg, rgba(240, 180, 64, 0.1), var(--surface-2) 70%); box-shadow: 0 0 28px -14px var(--glow-accent); }
.es-pend-head { display: flex; align-items: center; gap: var(--s3); flex-wrap: wrap; }
.es-pend-ico { position: relative; flex: none; width: 46px; height: 46px; display: grid; place-items: center; border-radius: 14px; background: rgba(240, 180, 64, 0.14); border: 1px solid rgba(240, 180, 64, 0.5); }
.es-pend-ico .es-badge { position: absolute; top: -8px; right: -8px; }
.es-pend-text { flex: 1 1 200px; min-width: 0; }
.es-pend-text h3 { margin: 0; font-size: var(--fs-md); }
.es-pend-text p { margin: 2px 0 0; }
.es-rows { list-style: none; margin: var(--s3) 0 0; padding: 0; display: grid; gap: var(--s2); }
.es-row { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; gap: var(--s3); align-items: center; padding: var(--s2) var(--s3); background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-sm); }
.es-row.needs { border-color: rgba(240, 119, 90, 0.5); }
.es-row-thumb { width: 52px; border-radius: 10px; }
.es-row-main { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.es-row-main small { color: var(--text-muted); }
.es-need { color: var(--danger); display: flex; align-items: flex-start; gap: 5px; }
.es-need .ico { width: 14px; height: 14px; flex: none; margin-top: 1px; }
.es-loot { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 3px; }
.es-chip { display: inline-flex; align-items: center; gap: 4px; padding: 1px 8px; border-radius: var(--radius-pill); font-size: 12px; background: rgba(255, 233, 180, 0.07); border: 1px solid var(--border-strong); color: var(--text-soft); max-width: 100%; }
.es-chip .ico { width: 14px; height: 14px; flex: none; }
.es-chip.gr-chip { border-width: 1px; }
.es-chip-art { color: #e2c9ff; border-color: rgba(190, 130, 255, 0.55); background: rgba(190, 130, 255, 0.1); }
.es-chip-bad { color: #ffc4b4; border-color: rgba(240, 119, 90, 0.55); }

/* ---------- okno raportu ---------- */
dialog.es-dialog { width: min(96vw, 640px); max-height: 94dvh; border: 1px solid rgba(240, 180, 64, 0.45); box-shadow: var(--shadow-3), 0 0 60px -20px var(--glow-accent); }
.es-dialog > * { min-width: 0; }
.es-hero { position: relative; flex: none; overflow: hidden; background: var(--surface-3); border-bottom: 1px solid var(--border-strong); }
.es-hero .ac-media.es-hero-art { aspect-ratio: auto; height: 168px; border-radius: 0; width: 100%; }
.es-hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(15, 14, 11, 0.15) 0%, rgba(15, 14, 11, 0.55) 55%, rgba(15, 14, 11, 0.94) 100%); pointer-events: none; }
.es-hero-text { position: absolute; left: var(--s4); right: calc(var(--touch) + var(--s4)); bottom: var(--s3); z-index: 2; text-shadow: 0 2px 10px #000; }
.es-kicker { margin: 0 0 2px; font-size: 11.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--accent); display: flex; align-items: center; gap: 6px; font-weight: 700; }
.es-kicker .ico { width: 16px; height: 16px; }
.es-hero h2 { margin: 0; font-size: var(--fs-lg); line-height: 1.2; color: #fff6dc; font-family: var(--font-display); overflow-wrap: anywhere; }
.es-when { margin: 3px 0 0; font-size: var(--fs-sm); color: #e8dcba; }
.es-close { position: absolute; top: var(--s2); right: var(--s2); z-index: 3; margin: 0; background: rgba(15, 14, 11, 0.7); }
.es-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overflow-x: hidden; padding: var(--s3) var(--s4); display: flex; flex-direction: column; gap: var(--s3); }
.es-loading, .es-empty { color: var(--text-muted); text-align: center; padding: var(--s5) 0; margin: 0; }
.es-sec { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: var(--s3); }
.es-sec > h3 { margin: 0 0 var(--s2); font-size: var(--fs-sm); text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-muted); font-family: var(--font); font-weight: 650; display: flex; align-items: center; gap: 6px; }
.es-sec > h3 .ico { width: 18px; height: 18px; }
.es-sec-note { margin: 0 0 var(--s2); }
.es-done-note { margin: var(--s2) 0 0; color: var(--good); font-size: var(--fs-sm); display: flex; align-items: center; gap: 6px; }
.es-done-note .ico, .es-ok .ico, .es-no .ico { width: 15px; height: 15px; flex: none; }

/* surowce */
.es-resgrid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s2); }
.es-res { position: relative; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: var(--s3) var(--s2); text-align: center; background: var(--surface-2); border: 1px solid var(--border-strong); border-radius: var(--radius-sm); min-width: 0; }
.es-res.is-zero { opacity: 0.45; }
.es-res.has-waste { border-color: rgba(240, 119, 90, 0.65); }
.es-res-name { font-size: 12px; color: var(--text-muted); }
.es-res-val { font-size: var(--fs-lg); font-family: var(--font-display); color: var(--accent); font-variant-numeric: tabular-nums; }
.es-res.is-done .es-res-val { color: var(--good); }
.es-waste { display: flex; align-items: flex-start; gap: 4px; color: #ffb8a4; font-size: 11.5px; line-height: 1.25; }
.es-waste .ico { width: 13px; height: 13px; flex: none; margin-top: 1px; }
.es-pair { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: var(--s2); }
.es-pairitem { display: flex; align-items: center; gap: var(--s3); padding: var(--s2) var(--s3); background: var(--surface-2); border: 1px solid var(--border-strong); border-radius: var(--radius-sm); }
.es-pairitem b { color: var(--accent); font-size: var(--fs-md); margin-right: 4px; }
.es-pairitem small { display: block; color: var(--text-muted); }

/* przedmioty */
.es-items { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s3); }
.es-item {
    --edge: var(--gr-common); --glow: transparent; position: relative; display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: var(--s3); padding: var(--s3);
    background: var(--surface-2); border: 2px solid var(--edge); border-radius: var(--radius); box-shadow: 0 0 22px -10px var(--glow);
}
.es-item.gr-fine { --edge: var(--gr-fine); }
.es-item.gr-rare { --edge: var(--gr-rare); --glow: rgba(93, 166, 204, 0.7); }
.es-item.gr-unique { --edge: var(--gr-unique); --glow: rgba(240, 160, 60, 0.85); }
.es-item.blocked { border-style: dashed; }
.es-item-art .ac-media { border-radius: 12px; width: 100%; }
.es-item-art .ac-badge { font-size: 11px; padding: 1px 6px; }
.es-item-main { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.es-item-name { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; overflow-wrap: anywhere; }
.es-item-meta { color: var(--text-muted); font-size: var(--fs-sm); }
.es-item-fx { margin: 0; padding-left: 1.1em; font-size: 12.5px; color: var(--text-soft); display: grid; gap: 1px; }
.es-ok, .es-no { margin: 2px 0 0; display: flex; align-items: flex-start; gap: 6px; font-size: var(--fs-sm); }
.es-ok { color: var(--good); }
.es-no { color: #ffb8a4; }
.es-item-acts { display: flex; flex-wrap: wrap; gap: var(--s2); margin-top: var(--s2); }
.es-item-acts button { min-height: 40px; white-space: normal; text-align: center; }
.es-drop { color: #ffb8a4; }
.es-room { grid-column: 1 / -1; margin-top: var(--s1); padding: var(--s3); border: 1px dashed var(--border-strong); border-radius: var(--radius-sm); background: var(--surface); }
.es-room p { margin: 0 0 var(--s2); font-size: var(--fs-sm); }
.es-room-list { list-style: none; margin: 0 0 var(--s2); padding: 0; display: grid; gap: var(--s2); }
.es-room-list > li { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: var(--s2); align-items: center; padding: 6px var(--s2); background: var(--surface-2); border: 1px solid var(--border); border-left: 3px solid var(--gr-common); border-radius: 10px; }
.es-room-list > li.gr-fine { border-left-color: var(--gr-fine); }
.es-room-list > li.gr-rare { border-left-color: var(--gr-rare); }
.es-room-list > li.gr-unique { border-left-color: var(--gr-unique); }
.es-room-list .gd-thumb { width: 40px; }
.es-room-main { min-width: 0; font-size: var(--fs-sm); overflow-wrap: anywhere; }
.es-room-main small { display: block; color: var(--text-muted); }

/* artefakt */
.es-artifact { display: grid; grid-template-columns: 124px minmax(0, 1fr); gap: var(--s3); position: relative; padding: var(--s2); border-radius: var(--radius-sm); }
.es-art-tile .artifact-tile { margin: 0; }
.es-art-text { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.es-art-text p { margin: 0; }
.es-art-kind { color: var(--text-muted); font-size: var(--fs-sm); }
.es-art-effect { color: var(--text); }

/* zdarzenia i zużycie */
.es-events, .es-wear { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s2); }
.es-ev { display: flex; align-items: flex-start; gap: 8px; font-size: var(--fs-sm); }
.es-ev .ico { width: 18px; height: 18px; flex: none; }
.es-ev-storm, .es-ev-incident, .es-ev-injured, .es-ev-artifact_lost, .es-ev-gear_hit { color: #ffd2c4; }
.es-wear > li { display: grid; gap: 3px; }
.es-wear-name small { color: var(--text-muted); margin-left: 4px; }
.es-wear-bar { display: flex; align-items: center; gap: var(--s2); }
.es-wear-bar .dur-bar { position: relative; flex: 1 1 auto; }
.es-wear-bar .dur-bar > i { position: absolute; left: 0; top: 0; bottom: 0; height: 100%; }
.es-wear-before { background: rgba(255, 233, 180, 0.26) !important; }
.es-wear-after { z-index: 1; }
.es-wear-txt { font-size: 12px; color: var(--text-muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
.es-wear-txt em { color: var(--danger); font-style: normal; }
.es-hit { margin-top: var(--s2); }
.es-warns { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; font-size: var(--fs-sm); color: #ffd2c4; }
.es-warns li { display: flex; gap: 6px; align-items: flex-start; }
.es-warns .ico { width: 15px; height: 15px; flex: none; margin-top: 1px; }

/* komunikaty po akcji */
.es-notice { display: flex; gap: var(--s2); align-items: flex-start; padding: var(--s3); border-radius: var(--radius-sm); border: 1px solid var(--border-strong); background: var(--surface-2); font-size: var(--fs-sm); }
.es-notice > .ico { width: 20px; height: 20px; flex: none; margin-top: 1px; }
.es-notice.good { border-color: rgba(169, 207, 106, 0.6); background: rgba(127, 174, 69, 0.1); }
.es-notice.warn { border-color: rgba(240, 119, 90, 0.6); background: rgba(184, 64, 42, 0.14); }
.es-notice ul { margin: 4px 0 0; padding-left: 1.1em; display: grid; gap: 2px; }
.es-notice .es-got { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: var(--s2); margin-top: var(--s2); }
.es-waiting { margin: var(--s2) 0 0; }
.es-got-card { position: relative; display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: var(--radius-pill); background: var(--surface); border: 1px solid var(--gr-common); animation: es-in 0.4s var(--ease-out) both; animation-delay: calc(var(--i, 0) * 80ms); overflow: hidden; }
.es-got-card.gr-fine { border-color: var(--gr-fine); }
.es-got-card.gr-rare { border-color: var(--gr-rare); box-shadow: 0 0 16px -4px rgba(93, 166, 204, 0.8); }
.es-got-card.gr-unique { border-color: var(--gr-unique); box-shadow: 0 0 18px -3px rgba(240, 160, 60, 0.9); }
.es-got-card .ico { width: 15px; height: 15px; }
.es-sheen { position: absolute; inset: 0; pointer-events: none; opacity: 0; }
.es-got-card.is-rare .es-sheen { opacity: 1; background: linear-gradient(105deg, transparent 30%, rgba(255, 255, 255, 0.38) 50%, transparent 70%); transform: translateX(-120%); animation: es-sheen 1.2s 0.4s ease-out 1 forwards; }

/* stopka i główne CTA */
.es-foot { flex: none; display: flex; flex-direction: column; gap: var(--s2); padding: var(--s3) var(--s4) calc(var(--s3) + var(--safe-bottom)); border-top: 1px solid var(--border-strong); background: var(--surface-3); }
.es-store { display: flex; align-items: center; gap: 6px; font-size: var(--fs-sm); color: var(--text-soft); flex-wrap: wrap; }
.es-store .ico { width: 16px; height: 16px; }
.es-store.is-full b { color: var(--danger); }
.es-cta {
    display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 54px; border-radius: var(--radius-pill); cursor: pointer;
    font: inherit; font-size: var(--fs-md); font-weight: 800; letter-spacing: 0.03em; color: var(--accent-ink); border: 1px solid rgba(255, 214, 128, 0.8);
    background: radial-gradient(120% 180% at 50% -50%, #ffe9b0 0%, #f0b440 48%, #c97d1c 100%);
    box-shadow: 0 0 0 0 rgba(240, 180, 64, 0.5), 0 8px 26px -8px rgba(240, 160, 40, 0.9), inset 0 1px 0 rgba(255, 255, 255, 0.5);
    animation: es-pulse 2.4s ease-in-out infinite;
}
.es-cta .ico { width: 24px; height: 24px; }
.es-cta:hover:not(:disabled) { filter: brightness(1.08); }
.es-cta:active:not(:disabled) { transform: scale(0.98); }
.es-cta:disabled { animation: none; filter: grayscale(0.7) brightness(0.75); cursor: not-allowed; box-shadow: none; }
.es-foot > .tip-wrap, .es-foot > .tip-wrap > .es-cta { width: 100%; }

/* ---------- okno potwierdzeń ---------- */
dialog.es-confirm { width: min(92vw, 420px); padding: var(--s5); border: 1px solid rgba(240, 119, 90, 0.5); }
.es-confirm h2 { margin: 0 0 var(--s2); }
.es-confirm p { margin: 0; color: var(--text-soft); line-height: 1.45; }
.es-confirm-acts { display: flex; justify-content: flex-end; gap: var(--s2); margin-top: var(--s4); flex-wrap: wrap; }
.es-confirm-acts button { min-height: var(--touch); }

/* toast z akcją */
#toast .toast-act { pointer-events: auto; margin-left: 4px; min-height: 34px; padding: 0 14px; border-radius: var(--radius-pill); border: 1px solid rgba(255, 214, 128, 0.8); background: linear-gradient(180deg, #ffe29a, #f0b440); color: var(--accent-ink); font: inherit; font-weight: 700; cursor: pointer; flex: none; }

/* ---------- animacje ---------- */
.es-sec, .es-res, .es-item, .es-row, .es-pairitem {
    animation: es-in 0.42s var(--ease-out) both; animation-delay: calc(var(--i, 0) * 80ms);
}
@keyframes es-in { from { opacity: 0; transform: translateY(12px) scale(0.985); } to { opacity: 1; transform: none; } }
@keyframes es-sheen { to { transform: translateX(120%); } }

/* odebrane: błysk w kolorze rzadkości, potem wlot do magazynu (w dół i zanik) */
.es-item.is-landing { animation: es-land 1.25s ease-in-out both; animation-delay: 0s; --flash: var(--gr-common); }
.es-item.is-landing.gr-fine { --flash: rgba(127, 174, 69, 0.55); }
.es-item.is-landing.gr-rare { --flash: rgba(93, 166, 204, 0.9); }
.es-item.is-landing.gr-unique { --flash: rgba(240, 160, 60, 1); }
.es-item.is-landing.is-accent { animation-name: es-land-accent; }
@keyframes es-land {
    0% { transform: none; opacity: 1; }
    35% { box-shadow: 0 0 22px -2px var(--flash); }
    62% { transform: none; opacity: 1; box-shadow: 0 0 22px -2px var(--flash); }
    100% { transform: translateY(46px) scale(0.9); opacity: 0; }
}
@keyframes es-land-accent {
    0% { transform: scale(1); opacity: 1; filter: brightness(1); }
    16% { transform: scale(1.04); filter: brightness(1.7); box-shadow: 0 0 46px 6px var(--flash); }
    38% { transform: scale(1.02); filter: brightness(1.2); box-shadow: 0 0 34px 2px var(--flash); }
    66% { transform: scale(1); opacity: 1; filter: brightness(1); box-shadow: 0 0 26px 0 var(--flash); }
    100% { transform: translateY(46px) scale(0.9); opacity: 0; filter: brightness(1); }
}
.es-artifact.is-landing { animation: es-land-accent 1.25s ease-in-out both; --flash: rgba(190, 130, 255, 0.95); }
.es-artifact.gr-rare.is-landing { --flash: rgba(93, 166, 204, 0.95); }
.es-artifact.gr-unique.is-landing { --flash: rgba(240, 160, 60, 1); }
.es-res.is-collect, .es-pairitem.is-collect { animation: es-collect 0.6s ease-out both; }
@keyframes es-collect { 0% { transform: none; } 40% { transform: scale(1.06); box-shadow: 0 0 22px -2px var(--glow-accent); } 100% { transform: none; } }
.es-item.is-leaving { animation: es-leave 0.38s ease-in both; }
@keyframes es-leave { to { opacity: 0; transform: translateX(-24px) scale(0.96); } }

.es-burst { position: absolute; left: 50%; top: 40%; width: 0; height: 0; pointer-events: none; z-index: 5; }
.es-burst i { position: absolute; left: -3px; top: -3px; width: 6px; height: 6px; border-radius: 50%; background: var(--flash, var(--accent)); box-shadow: 0 0 8px 2px var(--flash, var(--accent)); opacity: 0; animation: es-spark 0.95s ease-out forwards; animation-delay: var(--d, 0ms); }
@keyframes es-spark { 0% { opacity: 1; transform: translate(0, 0) scale(1); } 100% { opacity: 0; transform: translate(var(--dx), var(--dy)) scale(0.2); } }

/* ---------- telefon: arkusz od dołu ---------- */
@media (max-width: 640px) {
    dialog.es-dialog { width: 100vw; max-width: 100vw; max-height: 96dvh; margin: auto 0 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
    .es-hero .ac-media.es-hero-art { height: 140px; }
    .es-body { padding: var(--s3); }
    .es-resgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .es-item { grid-template-columns: 84px minmax(0, 1fr); padding: var(--s2); gap: var(--s2); }
    .es-item-acts { flex-direction: column; }
    .es-item-acts button { width: 100%; }
    .es-artifact { grid-template-columns: 104px minmax(0, 1fr); }
    .es-row { grid-template-columns: 44px minmax(0, 1fr); }
    .es-row-thumb { width: 44px; }
    .es-row > .es-btn { grid-column: 1 / -1; width: 100%; }
    .es-pend-head .es-btn-all { width: 100%; }
    .es-room-list > li { grid-template-columns: 36px minmax(0, 1fr); }
    .es-room-list > li > button { grid-column: 1 / -1; width: 100%; }
    dialog.es-confirm { width: 100vw; max-width: 100vw; margin: auto 0 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
    .es-confirm-acts button { flex: 1 1 0; }
    .es-wear-bar { flex-wrap: wrap; }
}
@media (max-width: 400px) {
    .es-item { grid-template-columns: 72px minmax(0, 1fr); }
    .es-artifact { grid-template-columns: 92px minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
    .es-btn, .es-cta { animation: none; }
    .es-sec, .es-res, .es-item, .es-row, .es-pairitem, .es-got-card { animation: none !important; }
    .es-item.is-landing, .es-artifact.is-landing, .es-res.is-collect, .es-pairitem.is-collect, .es-item.is-leaving { animation: none; }
    .es-sheen, .es-burst { display: none; }
}
.es-art-text .gr-chip { align-self: flex-start; }
#toast { width: max-content; }

/* ---------- zbiorcze podsumowanie „Odbierz wszystko” ---------- */
.es-blist { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s3); }
.es-bcard { display: flex; flex-direction: column; gap: var(--s2); padding: var(--s3); background: var(--surface-2); border: 1px solid var(--border-strong); border-radius: var(--radius-sm); animation: es-in 0.4s var(--ease-out) both; animation-delay: calc(var(--i, 0) * 80ms); }
.es-bcard-head { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; gap: var(--s3); align-items: center; }
.es-bcard-head .es-row-thumb { width: 48px; border-radius: 10px; }
.es-bcard-title { min-width: 0; display: flex; flex-direction: column; }
.es-bcard-title small { color: var(--text-muted); }
.es-bgot { margin-top: 2px; }
.es-bnote { margin: 0; display: flex; align-items: flex-start; gap: 6px; font-size: var(--fs-sm); color: var(--text-soft); }
.es-bnote .ico { width: 15px; height: 15px; flex: none; margin-top: 1px; }
.es-bnote-art { color: #e2c9ff; }
.es-bnote-bad { color: #ffb8a4; }
.es-bevents { margin-top: 2px; }
.es-sec-need { border-color: rgba(240, 119, 90, 0.6); }
.es-bneeds { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s2); }
.es-bneed { display: flex; align-items: center; justify-content: space-between; gap: var(--s3); flex-wrap: wrap; font-size: var(--fs-sm); }
.es-bneed > span { display: flex; align-items: flex-start; gap: 6px; min-width: 0; flex: 1 1 220px; }
.es-bneed .ico { width: 16px; height: 16px; flex: none; margin-top: 1px; }
.es-bgot { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: var(--s2); margin: 0; }
@media (max-width: 640px) {
    .es-bcard-head { grid-template-columns: 40px minmax(0, 1fr); }
    .es-bcard-head .es-row-thumb { width: 40px; }
    .es-bcard-head > .es-link { grid-column: 1 / -1; justify-self: start; }
    .es-bneed > .es-btn { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .es-bcard { animation: none !important; } }