/* Read the haul at a glance; full rules remain one tap away on the actual card. */
.pack-overlay-focus .exp-modal:is(.modal-reward,.modal-shopPack){display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin}
.pack-overlay .booster-modal{display:block;overscroll-behavior:contain;scrollbar-width:thin}
.pack-experience{min-width:0;gap:10px}
.pack-experience>*{flex-shrink:0;min-width:0;max-width:100%;box-sizing:border-box}
.pack-reveal-context{display:flex;flex-direction:column;align-items:center;gap:5px;max-width:420px}
.pack-reveal-context h2{margin:0!important;font-size:clamp(17px,3.6vw,23px);line-height:1.2;letter-spacing:-.02em;overflow-wrap:anywhere}
.pack-reveal-context small,.pack-heading .pack-summary-branding{font-size:10px;line-height:1.45;color:#a9c5ce;letter-spacing:.035em;overflow-wrap:anywhere}
.pack-progress{display:flex;align-items:center;justify-content:center;gap:12px;min-height:20px}
.pack-progress .pack-counter{font-size:10px;letter-spacing:.06em;line-height:1.4}
.pack-progress-pips{display:flex;align-items:center;gap:5px}
.pack-progress-pips i{display:block;width:16px;height:4px;border-radius:3px;background:#344853;box-shadow:inset 0 0 0 1px #afc4cc25}
.pack-progress-pips .is-revealed{background:#86bcae;box-shadow:none}.pack-progress-pips .is-current{height:6px;background:#b6eee0;box-shadow:0 0 0 2px #b6eee020}
.pack-single .pack-pull{width:clamp(180px,calc((100dvh - 400px)*.663),280px);gap:9px}
/* Boss prizes can precede the pack. Keep its next action reachable while the
   same modal scroller still lets players read every card and receipt. */
.pack-single>.pack-navigation{position:sticky;bottom:0;z-index:4;padding:9px 7px;background:#0c1721f5;border-top:1px solid #a7d9d12b;border-radius:12px 12px 0 0;box-shadow:0 -12px 22px #0b141d80}
.pack-pull-details{display:flex;flex-direction:column;align-items:center;gap:6px;width:100%;min-width:0}
.pack-card-name{margin:0;font-size:15px;line-height:1.3;color:#edf6f4;font-weight:750;overflow-wrap:anywhere}
.pack-experience .pack-pull-meta{font-size:11px;line-height:1.5;letter-spacing:0;margin:0;text-align:center;overflow-wrap:anywhere}
.pack-finish{font-weight:750;white-space:nowrap}
.pack-owned-total{font-size:10px;line-height:1.4;color:#a9c1c9;font-variant-numeric:tabular-nums}
.pack-experience .pack-pull-details .pack-use{width:100%;max-width:240px;min-height:44px;font-size:12px!important;line-height:1.35;padding:9px 10px;margin-top:3px;overflow-wrap:anywhere}
.pack-card-surface:disabled{opacity:1!important;cursor:default}
.pack-card-surface .card-face,.pack-card-surface .card-portrait{overflow:hidden}
.pack-card-surface .card-portrait :is(.art,.foil-art),.pack-card-surface .foil-art>.art{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:cover}
/* Keep the decoded image above the foil wrapper's opaque background on
   transformed cards and Ghost White thumbnails; foil effects remain at 1. */
.pack-card-surface .foil-art>.art,.ghost-white-art>.art{position:relative;z-index:0}
.pack-summary-grid{align-items:stretch;gap:14px;max-width:none}
.pack-summary-grid .pack-pull{max-width:none;justify-self:stretch;gap:10px}
.pack-summary-grid .pack-pull-details{flex:1}.pack-summary-grid .pack-use{margin-top:auto}
.pack-summary .pack-heading{padding-inline:20px;max-width:100%}.pack-summary .pack-heading>span{font-size:12px;line-height:1.45;letter-spacing:.025em}
.pack-summary .pack-haul-summary{max-width:100%;text-wrap:pretty}
.pack-experience .pack-source-label{margin-bottom:0!important}
@media(max-width:560px){
 .pack-summary-grid{grid-template-columns:minmax(0,1fr);gap:10px}
 .pack-summary-grid .pack-pull{display:grid;grid-template-columns:92px minmax(0,1fr);align-items:center;gap:12px;padding:12px;background:#17273180;border:1px solid #b6ced626;border-radius:14px}
 .pack-summary-grid .pack-stack{width:100%;max-width:100%}
 .pack-summary-grid .pack-pull-details{align-items:flex-start;text-align:left;gap:6px}
 .pack-summary-grid .pack-card-name{font-size:14px;line-height:1.3}
 .pack-summary-grid .pack-discovery-badge{align-self:flex-start;font-size:10px;padding:4px 7px}
 .pack-summary-grid .pack-pull-meta{text-align:left;font-size:11px;line-height:1.45}
 .pack-summary-grid .pack-use{max-width:none;margin-top:2px}
 .pack-summary .pack-heading{padding-inline:12px}.pack-summary .pack-heading h2{font-size:23px}
}
@media(max-width:360px){
 .pack-summary-grid .pack-pull{grid-template-columns:78px minmax(0,1fr);padding:10px;gap:10px}
 .pack-summary-grid .pack-card-name{font-size:13px}.pack-summary-grid .pack-pull-meta{font-size:10px}
}
@media(max-height:480px) and (min-width:600px){
 .pack-single{grid-template-columns:minmax(0,1fr) minmax(190px,.85fr);grid-template-rows:auto auto auto auto minmax(64px,1fr);gap:8px 22px;max-width:680px}
 .pack-single>.pack-source-label{grid-column:2;grid-row:1}
 .pack-single>.pack-reveal-context{grid-column:2;grid-row:2}.pack-single .pack-reveal-context h2{font-size:17px}
 .pack-single>.pack-progress{grid-column:2;grid-row:3}
 .pack-single>.pack-reveal-stage{grid-column:1;grid-row:1/6;justify-self:center}
 .pack-single>.pack-gesture-hint{grid-column:2;grid-row:4}
 .pack-single>.pack-navigation{grid-column:2;grid-row:1/6;align-self:end;justify-self:stretch;flex-direction:row;gap:6px}
 .pack-single>.pack-navigation .pack-primary{flex:1;min-width:0;width:auto;font-size:12px!important;padding-inline:8px}
 .pack-single>.pack-navigation .pack-skip{flex:none;max-width:76px;font-size:11px!important;padding-inline:7px}
 .pack-single .pack-pull{width:clamp(120px,calc((100dvh - 155px)*.663),170px)}
 .pack-single>.pack-summary-note{grid-column:2;grid-row:6}
 .pack-summary-grid{gap:12px}.pack-summary-grid .pack-stack{width:100%;max-width:105px;margin:auto}
 .pack-summary-grid .pack-card-name{font-size:13px}.pack-summary-grid .pack-pull-meta{font-size:10px}
 .pack-summary-grid .pack-discovery-badge{font-size:10px}
}

/* Full-size text accompanies the collectible face. Art mode can hide the
   printed copy without hiding rules or current combat values from the reader. */
.modal.card-inspection,.exp-modal.inspect{overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin}
.card-showcase{min-width:0}
.card-showcase .showcase-card{touch-action:pan-y}
.showcase-details{width:100%;min-width:0;box-sizing:border-box;padding:12px 14px;border:1px solid #bfd6dc24;border-radius:12px;background:#152731;text-align:left;overflow-wrap:anywhere}
.card-showcase .showcase-details h3{margin:0;font-size:20px;line-height:1.25;color:#f1f8f6}
.showcase-details>small{display:block;margin-top:5px;color:#a9c5ce;font-size:11px;line-height:1.5}
.card-showcase .showcase-details>p{margin:10px 0 0!important;font-size:14px!important;line-height:1.55!important;color:#dce8e7;text-wrap:pretty}
.showcase-live-stats{display:flex;flex-wrap:wrap;gap:8px 20px;margin:10px 0 0;font-variant-numeric:tabular-nums}
.showcase-live-stats>div{display:flex;align-items:baseline;gap:7px}
.showcase-live-stats dt{font-size:11px;line-height:1.5;color:#a9c5ce}.showcase-live-stats dd{margin:0;font-size:15px;font-weight:750;color:#f2cd8c}.showcase-live-stats>div+div dd{color:#f6a9bd}
.card-showcase .showcase-tools{flex-wrap:wrap;gap:8px}
.showcase-finish{font-weight:750;white-space:nowrap}
.card-showcase .showcase-tools button{min-width:104px;min-height:44px;touch-action:manipulation}
.card-showcase :is(button,summary):focus-visible{outline:3px solid #b6eee0;outline-offset:3px;border-radius:8px}
@media(max-height:480px) and (min-width:600px){
 /* Keep hero perks in the same document flow as ordinary inspections. The
    previous display:contents grid reserves no row for readable card rules. */
 .modal.card-inspection:has(>.hero-perk){display:block}
 .modal.card-inspection:has(>.hero-perk)>.card-showcase{display:grid;grid-template-columns:145px minmax(0,1fr);gap:10px 16px}
 .modal.card-inspection:has(>.hero-perk) .showcase-stage{grid-column:1;grid-row:1/20;width:145px;max-width:100%;align-self:start}
 .modal.card-inspection:has(>.hero-perk) :is(.showcase-tools,.showcase-caption){grid-column:2;grid-row:auto}
 .modal.card-inspection:has(>.hero-perk)>.hero-perk{margin:0 0 12px}
 .modal.card-inspection:has(>.hero-perk)>.end-turn{position:static;width:150px;min-height:44px;margin:16px 0 0 auto}
 .card-showcase .showcase-details h3{font-size:18px}
}

/* Reward review has one decision per view. Complete card receipts stay visible;
   the required relic choice uses the existing engine gate. */
.reward-step-navigation{display:flex;width:100%;gap:8px;justify-content:center}
.reward-step{flex:1;min-height:44px;border:1px solid #b6d4d338;border-radius:12px;background:#172732;color:#a9c5ce;font-size:12px;font-weight:750;padding:8px}
.reward-step[aria-pressed="true"]{border-color:#9ce2d8;background:#24483f;color:#d9fff0;box-shadow:inset 0 -3px #9ce2d8}
.reward-haul .pack-heading{gap:3px;padding:0 8px}.reward-haul .pack-heading h2{font-size:23px}
.reward-haul{gap:8px}.reward-haul>.pack-primary{position:sticky;bottom:0;z-index:4;box-shadow:0 -8px 14px #0c1721b0;min-height:44px}
.reward-view-relics .pack-heading>span,.reward-view-relics .pack-summary-branding,.reward-view-relics .pack-haul-summary{display:none}
.reward-view-relics .pack-relics{width:100%;margin:0}.reward-view-relics .pack-relics h3{display:none}
.reward-view-relics .pack-relics>.journey-choice-note{margin:0 0 8px}
.reward-view-relics .exp-relic-choice{min-height:64px;padding:12px;gap:4px 10px;transition:border-color .18s,background .18s,transform .18s}
.reward-view-relics .exp-relic-choice.selected{background:#204438;box-shadow:inset 3px 0 #9ce2d8}
.reward-view-relics .exp-relic-choice:active{transform:scale(.985)}
@media(max-width:560px){
 .reward-haul .pack-summary-grid{gap:6px}
 .reward-haul .pack-summary-grid .pack-pull{grid-template-columns:54px minmax(0,1fr);padding:7px 9px;gap:9px}
 .reward-haul .pack-summary-grid .pack-pull-details{gap:2px}
 .reward-haul .pack-summary-grid .pack-card-name{font-size:12px;line-height:1.2}
 .reward-haul .pack-summary-grid .pack-discovery-badge{font-size:9px;padding:2px 5px}
 .reward-haul .pack-summary-grid .pack-pull-meta{font-size:10px;line-height:1.25}
 /* The previous -> current copy total is already stated in the receipt above. */
 .reward-haul .pack-owned-total{display:none}
 .reward-haul .pack-summary-grid .pack-use{margin-top:2px;min-height:44px;padding:6px;font-size:11px!important}
 .reward-haul .pack-heading>span,.reward-haul .pack-summary-branding{font-size:9px;line-height:1.2}
 .reward-haul .pack-haul-summary{font-size:10px!important;margin:0!important;line-height:1.3!important}
 .reward-haul .journey-reward-currencies{gap:18px;margin:0}.reward-haul>.journey-choice-note{font-size:10px;line-height:1.35;margin:0}
 .reward-haul .pack-source-label{font-size:9px}
}
@media(max-height:480px) and (min-width:600px){
 .reward-haul{display:grid;grid-template-columns:170px minmax(0,1fr);grid-template-rows:auto auto auto 1fr auto;align-items:start;gap:5px 14px}
 .reward-haul>.pack-source-label{grid-column:1;grid-row:1}.reward-haul>.pack-heading{grid-column:1;grid-row:2}
 .reward-haul .pack-heading h2{font-size:19px}.reward-haul .pack-heading>span,.reward-haul .pack-summary-branding{font-size:9px;line-height:1.15}
 .reward-haul .pack-haul-summary{font-size:10px!important;line-height:1.2!important;margin:0!important}
 .reward-haul>.reward-step-navigation{grid-column:1;grid-row:3;gap:4px}.reward-haul .reward-step{font-size:11px;padding:5px}
 .reward-haul>.pack-summary-grid,.reward-haul>.pack-relics{grid-column:2;grid-row:1/6}
 .reward-haul>.journey-reward-currencies{grid-column:1;grid-row:4;gap:12px;align-self:center;margin:0}
 .reward-haul>.journey-choice-note{grid-column:1;grid-row:4;align-self:end;margin:0;font-size:9px;line-height:1.25}
 .reward-haul>.pack-primary{grid-column:1;grid-row:5;position:static;width:100%;font-size:12px!important;padding:8px}
 .reward-haul>.pack-summary-note{grid-column:1/-1;grid-row:6}
 .reward-haul .pack-summary-grid{gap:7px}.reward-haul .pack-summary-grid .pack-pull{gap:4px}
 .reward-haul .pack-summary-grid .pack-stack{max-width:66px}
 .reward-haul .pack-summary-grid .pack-pull-details{gap:3px}.reward-haul .pack-card-name{font-size:11px;line-height:1.2}
 .reward-haul .pack-pull-meta{font-size:9px;line-height:1.2}.reward-haul .pack-discovery-badge{font-size:9px;padding:2px 4px}
 .reward-haul .pack-owned-total{display:none}.reward-haul .pack-summary-grid .pack-use{font-size:10px!important;padding:5px;min-height:44px}
 .reward-view-relics .exp-relic-options{gap:6px}.reward-view-relics .exp-relic-choice{padding:8px;gap:2px 8px;min-height:55px}
 .reward-view-relics .exp-relic-choice strong{font-size:12px}.reward-view-relics .exp-relic-choice small{font-size:10px}
}

.reward-boss-receipt{display:flex;align-items:center;gap:8px;width:100%;min-height:44px;flex:none;border:1px solid #d6b4e866;border-radius:12px;padding:7px 10px;background:linear-gradient(120deg,#33233e,#15222d);color:#f5efff;text-align:left}
.reward-boss-receipt>span:first-child{color:#e5c7ff}.reward-boss-receipt>span:nth-child(2){display:grid;gap:2px;flex:1;min-width:0}.reward-boss-receipt small{font-size:9px;color:#d2bce2}.reward-boss-receipt strong{font-size:12px;overflow-wrap:anywhere}.reward-boss-receipt b{font-size:22px}
.reward-haul .journey-reward-currencies{padding:0;gap:16px}.reward-haul .journey-reward-currencies>span{display:flex;align-items:center;gap:5px}.reward-haul .journey-reward-currencies .exp-money{font-size:15px}.reward-haul .journey-reward-currencies small{font-size:9px}
.reward-haul>.journey-choice-note{font-size:10px!important;line-height:1.25!important;margin:0!important}
@media(max-height:480px) and (min-width:600px){
 .pack-overlay-focus .exp-modal:has(.reward-haul){position:relative;padding:14px 16px;gap:5px}
 .pack-overlay-focus .exp-modal:has(.reward-haul)>.reward-boss-receipt{max-width:170px;align-self:flex-start;padding:5px 7px}
 .reward-haul .journey-reward-currencies{flex-wrap:wrap;gap:2px}.reward-haul .journey-reward-currencies>span{gap:3px}
}

.reward-card-navigation{display:none}
@media(max-width:560px){
 .reward-carousel .reward-card-navigation{display:flex;width:100%;gap:5px}
 .reward-card-picker{display:flex;align-items:center;gap:5px;flex:1;min-width:0;min-height:44px;padding:5px;border:1px solid #b6d4d338;border-radius:10px;background:#172732;color:#c9dcdf;text-align:left}
 .reward-card-picker b{font-size:11px;color:#9ce2d8}.reward-card-picker span{font-size:10px;line-height:1.2;overflow-wrap:anywhere}
 .reward-card-picker[aria-pressed="true"]{border-color:#9ce2d8;background:#24483f;color:#edfff5}
 .reward-carousel .pack-summary-grid .pack-pull:not([data-haul-selected]){display:none}
 .reward-carousel .pack-summary-grid .pack-pull{grid-template-columns:90px minmax(0,1fr);padding:9px;gap:12px}
 .reward-carousel .pack-summary-grid .pack-card-name{font-size:14px;line-height:1.25}
 .reward-carousel .pack-summary-grid .pack-pull-details{gap:6px}.reward-carousel .pack-summary-grid .pack-pull-meta{font-size:11px;line-height:1.4}
 .reward-carousel .pack-summary-grid .pack-discovery-badge{font-size:10px;padding:3px 6px}
 .reward-carousel .pack-summary-grid .pack-use{font-size:12px!important}
}

/* Guaranteed boss receipts remain on Cards; Relic gives its full space to the choice. */
.exp-modal:has(.reward-view-relics)>.reward-boss-receipt{display:none}

@media(max-height:480px) and (min-width:600px){
 .reward-haul{grid-template-rows:auto auto 44px auto auto 44px;gap:3px 14px}
 .reward-haul>.pack-summary-grid,.reward-haul>.pack-relics{grid-row:1/7}
 .reward-haul>.journey-reward-currencies{grid-row:4;align-self:start}
 .reward-haul>.journey-choice-note{grid-row:5;align-self:start}
 .reward-haul>.pack-primary{grid-row:6}.reward-haul>.pack-summary-note{grid-row:7}
 .reward-haul .pack-heading h2{font-size:16px}.reward-haul .pack-summary-branding{display:none}
 .reward-haul .pack-haul-summary{font-size:9px!important;line-height:1.1!important}
 .reward-haul .journey-reward-currencies{flex-wrap:nowrap;gap:6px}.reward-haul .journey-reward-currencies>span{flex-direction:column;gap:1px}
 .reward-haul .journey-reward-currencies .exp-money{font-size:12px}.reward-haul .journey-reward-currencies small{font-size:8px}
 .reward-haul>.journey-choice-note{font-size:9px!important;line-height:1.15!important}
 .pack-overlay-focus .exp-modal:has(.reward-haul)>.reward-boss-receipt{min-height:44px;gap:5px;padding:3px 7px}
 .reward-boss-receipt strong{font-size:11px}.reward-boss-receipt small{font-size:8px}
}

@media(min-width:561px) and (min-height:481px){
 .reward-haul .pack-summary-grid .pack-stack{max-width:140px;margin:auto}
}
@keyframes rewardReceiptIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(max-width:560px) and (prefers-reduced-motion:no-preference){
 .reward-carousel [data-haul-selected]{animation:rewardReceiptIn .18s ease-out both}
}
.calm-motion .reward-carousel [data-haul-selected]{animation:none!important}
.calm-motion .reward-view-relics .exp-relic-choice{transition:none!important}
@media(prefers-reduced-motion:reduce){.reward-view-relics .exp-relic-choice{transition:none!important}}

.reward-card-picker small{display:block;font-size:9px;line-height:1.2;margin-top:2px;color:#a9d7cd}