/* One original full-width Oracle hero, six compact contextual connections.
 * No separate scrolling link shelf or synthetic product images. */
#oracleCardDeck .shopphi-switchboard-heading{
 margin:11px 0 3px;font:800 11px/1.4 system-ui,sans-serif;letter-spacing:.09em;
 color:#6a3f25;text-transform:uppercase;
}
#oracleCardDeck .shopphi-switchboard-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;min-width:0}
#oracleCardDeck .shopphi-switchboard-grid[hidden],
#oracleCardDeck .shopphi-switchboard-heading[hidden],
#oracleCardDeck .shopphi-switchboard-receipt[hidden]{display:none!important}
#oracleCardDeck .shopphi-switchboard-grid>.oracle-card-deck-stage{grid-row:1;min-width:0;width:100%}
#oracleCardDeck .shopphi-flanks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;min-width:0}
#oracleCardDeck .shopphi-flanks-left{grid-row:2}
#oracleCardDeck .shopphi-flanks-right{grid-row:3}
#oracleCardDeck .shopphi-flank{
 display:flex;flex-direction:column;gap:5px;min-width:0;min-height:122px;
 padding:10px;border:1px solid #d9cbbb;border-radius:14px;
 background:linear-gradient(165deg,#fff,#fff8ef);color:#241d21;text-decoration:none;
 overflow:hidden;box-shadow:0 4px 13px #291b210d;
}
#oracleCardDeck .shopphi-flank:focus-visible{outline:3px solid #2468a5;outline-offset:2px}
#oracleCardDeck .shopphi-flank-tag{font:800 9px/1.3 system-ui,sans-serif;color:#884426;letter-spacing:.05em}
#oracleCardDeck .shopphi-flank-title{font:800 12px/1.3 system-ui,sans-serif;
 display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
#oracleCardDeck .shopphi-flank img{display:block;width:100%;height:78px;object-fit:contain;
 background:#fff;border-radius:9px;border:1px solid #eee4da}
#oracleCardDeck .shopphi-flank-reason{font:500 10px/1.35 system-ui,sans-serif;color:#625952;
 display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#oracleCardDeck .shopphi-flank-price{font:800 12px/1.25 system-ui,sans-serif;color:#6f2c16}
#oracleCardDeck .shopphi-flank-empty{background:#f8f5f1;color:#554f49;border-style:dashed;box-shadow:none}
#oracleCardDeck .shopphi-flank-empty-copy{font:500 11px/1.3 system-ui,sans-serif}
#oracleCardDeck .shopphi-switchboard-receipt{font:500 11px/1.4 system-ui,sans-serif;color:#61554c;
 margin:4px 0 12px}
@media(min-width:1100px){
 /* The QuantaPhi app is narrow even on desktop. Expand this one rail
  * into surrounding free viewport space instead of crushing the live hero. */
 #oracleCardDeck .shopphi-switchboard-grid{
  width:min(900px,calc(100vw - 48px));
  margin-left:50%;transform:translateX(-50%);
  grid-template-columns:175px minmax(0,1fr) 175px;gap:11px;
 }
 #oracleCardDeck .shopphi-flanks{grid-template-columns:minmax(0,1fr);align-content:start}
 #oracleCardDeck .shopphi-flanks-left{grid-column:1;grid-row:1}
 #oracleCardDeck .shopphi-flanks-right{grid-column:3;grid-row:1}
 #oracleCardDeck .shopphi-switchboard-grid>.oracle-card-deck-stage{grid-column:2;grid-row:1}
}
@media(max-width:480px){
 #oracleCardDeck .shopphi-flanks{gap:5px}
 #oracleCardDeck .shopphi-flank{padding:7px;min-height:102px;border-radius:11px}
 #oracleCardDeck .shopphi-flank img{height:61px}
 #oracleCardDeck .shopphi-flank-title{font-size:11px}
 #oracleCardDeck .shopphi-flank-tag{font-size:8px}
 #oracleCardDeck .shopphi-flank-reason{font-size:9px}
}

/* Readability repair: two image-led companions at a time on phones.
 * Keep all six eligible cards in the selector, but don't show six thumbnails. */
#oracleCardDeck .shopphi-switchboard-heading{font-size:12px;letter-spacing:.035em;margin:14px 0 8px}
#oracleCardDeck .shopphi-switchboard-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
#oracleCardDeck .shopphi-switchboard-grid>.oracle-card-deck-stage{grid-column:1/-1;grid-row:1}
#oracleCardDeck .shopphi-flanks{display:contents}
#oracleCardDeck .shopphi-flank{min-width:0;min-height:260px;padding:13px;border-radius:16px;
 gap:9px;border:1px solid #cdbbb0;background:#fff;box-shadow:0 7px 23px #291b2118}
#oracleCardDeck .shopphi-flank[hidden]{display:none!important}
#oracleCardDeck .shopphi-flank-tag{font-size:11px;letter-spacing:.06em}
#oracleCardDeck .shopphi-flank-title{font-size:16px;line-height:1.25;-webkit-line-clamp:3}
#oracleCardDeck .shopphi-flank-reason{font-size:12px;line-height:1.35;-webkit-line-clamp:2}
#oracleCardDeck .shopphi-flank-price{font-size:17px}
#oracleCardDeck .shopphi-flank-visual{display:grid;place-items:center;position:relative;
 height:165px;border-radius:13px;background:linear-gradient(135deg,#f6f0e8,#fff);
 border:1px solid #e8ddd1;overflow:hidden}
#oracleCardDeck .shopphi-flank-visual img{width:100%;height:100%;object-fit:contain;
 border:0;border-radius:0;background:#fff}
#oracleCardDeck .shopphi-flank-no-photo{text-align:center;padding:12px;
 background:linear-gradient(140deg,#e6edf1,#fdf7ed)}
#oracleCardDeck .shopphi-flank-brand{font:850 clamp(15px,4vw,21px)/1.2 system-ui,sans-serif;
 overflow-wrap:anywhere;color:#273d54}
#oracleCardDeck .shopphi-flank-visual-note{font:600 10px/1.3 system-ui,sans-serif;
 color:#585a5d;max-width:100%}
#oracleCardDeck .shopphi-flank-cta{margin-top:auto;display:block;min-height:44px;padding:12px 7px;
 border-radius:11px;background:#174d70;color:#fff;text-align:center;
 font:800 12px/1.3 system-ui,sans-serif}
#oracleCardDeck .shopphi-flank-navigation{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:10px 0}
#oracleCardDeck .shopphi-flank-navigation[hidden]{display:none!important}
#oracleCardDeck .shopphi-flank-navigation button{min-height:48px;padding:10px 13px;
 border:1px solid #b9aca1;border-radius:12px;background:#fff;color:#283d50;
 font:800 13px/1.3 system-ui,sans-serif;cursor:pointer}
#oracleCardDeck .shopphi-flank-navigation button:disabled{opacity:.48;cursor:not-allowed}
#oracleCardDeck .shopphi-flank-navigation button:focus-visible{outline:3px solid #174d70}
#oracleCardDeck .shopphi-flank-position{font:800 13px/1.3 system-ui,sans-serif;
 color:#453d38;text-align:center}
#oracleCardDeck .shopphi-switchboard-receipt{font-size:12px;color:#514c48;margin:7px 0 16px}
@media(min-width:950px){
 #oracleCardDeck .shopphi-switchboard-grid{
  width:min(1150px,calc(100vw - 32px));margin-left:50%;transform:translateX(-50%);
  grid-template-columns:minmax(205px,245px) minmax(0,1fr) minmax(205px,245px);gap:12px;
 }
 #oracleCardDeck .shopphi-flanks{display:grid;grid-template-columns:minmax(0,1fr);
  align-content:start;gap:12px}
 #oracleCardDeck .shopphi-flanks-left{grid-column:1;grid-row:1}
 #oracleCardDeck .shopphi-flanks-right{grid-column:3;grid-row:1}
 #oracleCardDeck .shopphi-switchboard-grid>.oracle-card-deck-stage{grid-column:2;grid-row:1}
 #oracleCardDeck .shopphi-flank{min-height:260px}
 #oracleCardDeck .shopphi-flank[hidden]{display:flex!important}
 #oracleCardDeck .shopphi-flank-visual{height:155px}
 #oracleCardDeck .shopphi-flank-navigation{display:none!important}
}
@media(max-width:480px){
 #oracleCardDeck .shopphi-switchboard-grid{gap:9px}
 #oracleCardDeck .shopphi-flank{min-height:245px;padding:10px;gap:8px}
 #oracleCardDeck .shopphi-flank-visual{height:clamp(120px,39vw,165px)}
 #oracleCardDeck .shopphi-flank-tag{font-size:10px}
 #oracleCardDeck .shopphi-flank-title{font-size:14px;line-height:1.25}
 #oracleCardDeck .shopphi-flank-reason{font-size:11px}
 #oracleCardDeck .shopphi-flank-brand{font-size:clamp(14px,4vw,18px)}
 #oracleCardDeck .shopphi-flank-cta{min-height:48px}
}
@media(max-width:340px){
 #oracleCardDeck .shopphi-switchboard-grid{grid-template-columns:1fr}
 #oracleCardDeck .shopphi-flank{min-height:0}
 #oracleCardDeck .shopphi-flank-visual{height:190px}
}

/* Compact context label; companion sources no longer dominate the actual card. */
#oracleCardDeck .shopphi-switchboard-heading{font:700 11px/1.35 system-ui,sans-serif;letter-spacing:.015em;text-transform:none;color:#556575;margin:12px 0 7px}
#oracleCardDeck .shopphi-flank-navigation{flex-wrap:wrap}
#oracleCardDeck .shopphi-flank-navigation button:last-child{flex:1 1 100%;min-height:42px;background:#f5f7f9;color:#344a59;border-color:#d4dde5}
@media(prefers-reduced-motion:reduce){#oracleCardDeck .shopphi-flank{scroll-behavior:auto;transition:none;animation:none}}

/* Image-led ad chapters: the two real, attributed offers appear before the
 * shopping hero on phones; other app cards keep their original composition. */
@media(max-width:949px){
 #oracleCardDeck .shopphi-switchboard-grid.shopphi-showcase-mode>.oracle-card-deck-stage{
  grid-row:2;grid-column:1/-1
 }
 #oracleCardDeck .shopphi-switchboard-grid.shopphi-showcase-mode .shopphi-flank:not([hidden]){
  min-height:0;padding:12px;box-shadow:0 5px 22px #172c4521
 }
 #oracleCardDeck .shopphi-switchboard-grid.shopphi-showcase-mode .shopphi-flank-visual{
  height:clamp(160px,46vw,245px);background:#fff
 }
 #oracleCardDeck .shopphi-showcase-mode .shopphi-flank-visual img{object-fit:contain}
}
#oracleCardDeck .shopphi-flank{
 transition:opacity .26s ease,transform .26s ease
}
#oracleCardDeck .shopphi-switchboard-grid.shopphi-is-fading .shopphi-flank:not([hidden]){
 opacity:0;transform:translateY(6px)
}
@keyframes shopphi-offer-arrive{
 from{opacity:0;transform:translateY(8px)}
 to{opacity:1;transform:translateY(0)}
}
#oracleCardDeck .shopphi-showcase-mode:not(.shopphi-is-fading) .shopphi-flank:not([hidden]){
 animation:shopphi-offer-arrive .38s ease both
}
#oracleCardDeck .oracle-card-deck-stage{transition:opacity .32s ease}
#oracleCardDeck .oracle-card-deck-stage.shopphi-hero-fading{opacity:0}
@media(prefers-reduced-motion:reduce){
 #oracleCardDeck .shopphi-flank,
 #oracleCardDeck .oracle-card-deck-stage{animation:none!important;transition:none!important;transform:none!important}
}

/* An automatic page change must always have an accessible Pause control. */
@media(min-width:950px){
 #oracleCardDeck .shopphi-flank-navigation:not([hidden]){display:flex!important;justify-content:flex-end}
 #oracleCardDeck .shopphi-flank-navigation .shopphi-flank-position,
 #oracleCardDeck .shopphi-flank-navigation button:not(.shopphi-rotation-toggle){display:none!important}
}
@media(max-width:340px){
 #oracleCardDeck .shopphi-switchboard-grid.shopphi-showcase-mode>.oracle-card-deck-stage{
  grid-row:3;grid-column:1
 }
}
