.shared-spread-layout { display:contents; }
.shared-reading-panel[hidden] { display:none!important; }
.has-shared-reading .shared-reading-old-summaries { display:none!important; }
.shared-spread-layout.shared-spread-active { display:grid; grid-template-columns:minmax(0,1fr) 290px; gap:28px; align-items:start; min-width:0; width:100%; }
.shared-reading-panel { min-width:0; padding:22px; border:1px solid var(--line,#343832); border-radius:12px; background:var(--panel,#191c18); color:var(--ink,#eee9dd); position:sticky; top:20px; text-align:left; max-height:calc(100dvh - 40px); overflow:auto; }
.shared-reading-copy h2 { margin:8px 0 18px; font:400 28px/1.2 Georgia,serif; color:var(--ink,#eee9dd); }
.shared-reading-copy .shared-reading-position { margin:0; font:600 10px/1.5 system-ui,sans-serif; letter-spacing:.09em; text-transform:uppercase; color:var(--accent,var(--gold,#c8aa6a)); }
.shared-reading-copy p.shared-reading-text { white-space:pre-line; overflow-wrap:anywhere; font:400 14px/1.7 system-ui,sans-serif; color:var(--muted,#aaa99e); margin:12px 0; }
.shared-reading-copy h3.shared-reading-text { font:600 11px/1.5 system-ui,sans-serif; text-transform:uppercase; letter-spacing:.08em; color:var(--accent,var(--gold,#c8aa6a)); margin:22px 0 8px; }
.shared-reading-navigation { display:flex; gap:8px; margin-top:24px; }
.shared-reading-panel button { width:auto; flex:1; min-width:0; min-height:44px; padding:8px 10px; border:1px solid var(--line,#343832); border-radius:6px; background:transparent; color:var(--ink,#eee9dd); font:400 12px/1.4 system-ui,sans-serif; box-shadow:none; cursor:pointer; }
.shared-reading-actions { display:grid; gap:10px; margin-top:12px; }
.shared-reading-panel button:hover,.shared-reading-panel button:focus-visible { border-color:var(--accent,var(--gold,#c8aa6a)); }
.shared-card-selected { outline:2px solid var(--accent,var(--gold,#c8aa6a)); outline-offset:4px; border-radius:8px; }
.shared-spread-active > :is(#spread,#cards-grid,#runeOutput) { min-width:0; width:100%; margin:0; align-self:start; }
.has-shared-reading .shared-spread-active :is(.card img,.card-art-wrap,.rune-symbol) { max-width:160px; height:auto; margin-inline:auto; }
.has-shared-reading .shared-spread-active .card img { width:100%; }
.has-shared-reading .shared-spread-active :is(.spread,.cards-grid,.rune-spread) { gap:24px 18px; }
.wyrd-page .shared-spread-active { padding:24px 28px 40px; }
.wyrd-page .shared-spread-active #runeOutput { min-height:0; padding:0; }
@media(max-width:1100px) {
  .shared-spread-layout.shared-spread-active { grid-template-columns:minmax(0,1fr); }
  .shared-reading-panel { position:static; max-height:none; width:100%; }
}
@media(max-width:600px) {
  .shared-spread-layout.shared-spread-active { gap:26px; }
  .wyrd-page .shared-spread-active { padding:16px 12px 28px; }
  .shared-reading-panel { padding:20px; }
  .has-shared-reading .shared-spread-active :is(.spread,.cards-grid,.rune-spread) { gap:18px 10px; }
  .has-shared-reading .shared-spread-active .rune-spread { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
/* Match artwork bounds rather than the full grid-cell width. */
.has-shared-reading .shared-spread-active #runeOutput .rune-symbol,
.has-shared-reading .shared-spread-active #spread .card { width:100%; max-width:160px; margin-inline:auto; }