.viza-redesign .story-panel-backdrop { position: fixed; inset: 0; z-index: 1080; background: rgba(2,4,10,.4); }
.viza-redesign .story-info { position: fixed; top: var(--header-height-desktop); right: 0; bottom: 0; z-index: 1090; width: min(380px,100%); border-left: 1px solid var(--vz-line-strong); background: var(--vz-bg-raised); box-shadow: var(--vz-shadow-lg); padding: 28px 24px 32px; overflow-y: auto; overscroll-behavior: contain; }
.viza-redesign .story-panel-close { position: absolute; top: 12px; right: 12px; }
.viza-redesign .story-info h2 { padding-right: 28px; margin: 8px 0; font-size: 26px; overflow-wrap: anywhere; }
.viza-redesign .story-info h3 { font-size: 16px; margin-top: 28px; }
.viza-redesign .story-info p { color: var(--vz-text-2); line-height: 1.6; white-space: pre-line; overflow-wrap: anywhere; }
.viza-redesign .story-info-preview { position: relative; margin-top: 20px; display: block; width: 100%; padding: 0; overflow: hidden; border: 1px solid var(--vz-violet); border-radius: 12px; background: var(--vz-surface); }
.viza-redesign .story-cast { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px 12px; }
.viza-redesign .story-cast > div { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; min-width: 0; }
.viza-redesign .story-cast img, .viza-redesign .story-cast-placeholder { display: grid; place-items: center; width: 84px; height: 84px; object-fit: cover; border-radius: 50%; border: 1px solid var(--vz-violet); background: var(--vz-surface); }
.viza-redesign .story-cast strong { font-size: 14px; overflow-wrap: anywhere; }
.viza-redesign .story-cast span { color: var(--vz-text-3); font-size: 12px; }
.viza-redesign .story-info-actions { display: flex; flex-direction: column; gap: 10px; margin-top: 28px; }
.viza-redesign .story-character-role { width: 100%; padding: 0; border: 0; background: transparent; text-align: center; font: inherit; cursor: pointer; }
.viza-redesign .story-character-role:disabled { opacity: 1; cursor: default; }
.viza-redesign .story-character-role-text { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; line-height: 1.5; overflow-wrap: anywhere; }
.viza-redesign .story-character-role[aria-expanded="true"] .story-character-role-text { display: block; -webkit-line-clamp: unset; }
.viza-redesign .story-character-role:focus-visible, .viza-redesign .story-cast > div:focus-visible { outline: 2px solid var(--vz-violet); outline-offset: 4px; border-radius: 4px; }
.viza-redesign :is(.story-info,.story-panel-backdrop)[hidden] { display: none !important; }
.viza-redesign .story-info { box-sizing: border-box; font: inherit; }
.viza-redesign .story-info button { cursor: pointer; font: inherit; }
.viza-redesign .story-info :is(button,a,[tabindex]):focus-visible { outline: 2px solid var(--vz-violet); outline-offset: 3px; }
.viza-redesign .story-info .story-eyebrow { display: block; color: var(--vz-text-2); font-size: 13px; margin-bottom: 8px; }
.viza-redesign .story-info .story-node-creator { font-size: 12px; color: var(--vz-text-2); }
.viza-redesign .story-info .story-node-play { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: rgba(7,10,18,.65); color: white; z-index: 3; }
.viza-redesign .story-info :is(.story-primary,.story-secondary) { display: inline-flex; justify-content: center; align-items: center; gap: 9px; min-height: 44px; padding: 10px 18px; border-radius: 10px; color: var(--vz-text); border: 1px solid var(--vz-line-strong); font-size: 14px; text-decoration: none; background: var(--vz-surface-2); }
.viza-redesign .story-info .story-primary { background: var(--vz-gradient); border-color: transparent; font-weight: 650; }
@media (max-width: 959px) { .viza-redesign .story-info { top: auto; bottom: 0; left: 0; width: 100%; max-height: 86svh; border: 1px solid var(--vz-line-strong); border-radius: 20px 20px 0 0; padding: 28px 22px calc(28px + env(safe-area-inset-bottom)); } .viza-redesign .story-info::before { content: ""; position: absolute; width: 40px; height: 4px; border-radius: 4px; background: var(--vz-line-strong); top: 9px; left: calc(50% - 20px); } }

.story-info > .bottom-sheet-grabber { display: none; }
@media (max-width: 959px) { .viza-redesign .story-info::before { content: none; } }
