#info-panel {
  position: fixed; top: 0; right: -440px; width: 420px; max-width: 92vw; height: 100vh;
  background: linear-gradient(180deg,#2a1f14,#1a1410); color: #f0e2c4; z-index: 500;
  border-left: 2px solid var(--gold); box-shadow: -8px 0 40px rgba(0,0,0,.5);
  transition: right .4s var(--ease-soft); overflow-y: auto;
}
#info-panel.open { right: 0; }
.panel-close { position: absolute; top: 14px; right: 14px; z-index: 2; width: 32px; height: 32px;
  border-radius: 50%; background: rgba(26,20,16,.7); border: 1px solid rgba(184,134,11,.4);
  color: var(--gold-light); cursor: pointer; font-size: 15px; }
.panel-close:hover { background: rgba(184,134,11,.2); }
#panel-hero { width: 100%; height: 200px; object-fit: cover; display: none; }
.panel-fb { height: 120px; display: none; align-items: center; justify-content: center; font-size: 40px; }
.panel-head { padding: 18px 20px 14px; border-bottom: 1px solid rgba(184,134,11,.3); }
.panel-head h2 { font-family: var(--font-display); font-size: 22px; color: var(--gold-light); }
#panel-dates { font-style: italic; color: #b8a88a; font-size: 14px; margin-top: 4px; }
.panel-body { padding: 18px 20px; font-size: 15px; line-height: 1.6; }
.panel-body p { margin-bottom: 12px; }
.panel-body .muted { color: #b8a88a; font-size: 13px; }
.panel-body .strong { font-weight: 600; margin-top: 16px; }
.panel-body .ev { font-size: 13px; padding-left: 8px; border-left: 2px solid var(--gold); margin: 4px 0; }
.panel-body .ev strong { color: var(--gold-light); }
.tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
.tag { padding: 3px 10px; border: 1px solid rgba(184,134,11,.3); border-radius: 12px; font-size: 11px;
  color: var(--gold-light); text-transform: uppercase; letter-spacing: .5px; }
.tag.link { cursor: pointer; } .tag.link:hover { background: rgba(184,134,11,.15); }