.partner-panel {
  inset: 0;
  margin: 0 0 0 auto;
  width: min(48rem, 72vw);
  max-width: 100%;
  height: 100dvh;
  max-height: 100dvh;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 1rem 0 0 1rem;
  background: var(--surface);
  color: var(--ink);
  box-shadow: -16px 0 48px rgb(30 36 66 / .14);
}
.partner-panel[open] { display: flex; flex-direction: column; animation: partner-panel-enter 280ms cubic-bezier(.16, 1, .3, 1) both; }
.partner-panel::backdrop { background: rgb(30 36 66 / .12); animation: partner-backdrop-enter 280ms ease-out both; }
.partner-panel[open].is-closing { animation: partner-panel-exit 180ms ease-in both; }
.partner-panel.is-closing::backdrop { animation: partner-backdrop-exit 180ms ease-in both; }
.partner-panel-bar { flex: none; display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1rem 1.25rem; border-bottom: 1px solid var(--line); }
.partner-panel-bar h2 { font-size: 1.375rem; }
.partner-panel > [role="status"] { padding: 1rem 1.25rem; color: var(--muted); }
.partner-panel iframe { display: block; width: 100%; flex: 1; border: 0; min-height: 0; }
.partner-panel-page { padding: 1.25rem; }
@keyframes partner-panel-enter { from { transform: translateX(100%); } to { transform: translateX(0); } }
@keyframes partner-panel-exit { from { transform: translateX(0); } to { transform: translateX(100%); } }
@keyframes partner-backdrop-enter { from { opacity: 0; } to { opacity: 1; } }
@keyframes partner-backdrop-exit { from { opacity: 1; } to { opacity: 0; } }
@media (max-width: 760px) { .partner-panel { width: calc(100vw - 1rem); } }
@media (max-width: 600px) {
  .partner-panel { width: 100%; border-radius: 0; }
  .partner-panel-bar, .partner-panel-page { padding: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  .partner-panel[open], .partner-panel::backdrop { animation: partner-backdrop-enter 100ms linear both; }
  .partner-panel[open].is-closing, .partner-panel.is-closing::backdrop { animation: partner-backdrop-exit 100ms linear both; }
}