.story-body{display:flex;height:80vh;min-height:500px}.narrative-panel{width:380px;min-width:320px;background:#fff;border-right:1px solid #ccc;display:flex;flex-direction:column;overflow:hidden}@media(max-width:768px){.story-body{flex-direction:column;height:auto}.narrative-panel{width:100%;min-width:auto;max-height:40vh}}.narrative-content{flex:1;padding:1.25rem .875rem;overflow-y:auto}.narrative-content h2{font-size:1.25rem;margin:0 0 .75rem;color:#004f91}.narrative-content p{font-size:.875rem;line-height:1.7;color:#333}.step-dots{display:flex;justify-content:center;gap:.375rem;padding:.625rem 0}.step-dot{width:10px;height:10px;border-radius:50%;background:#ccc;transition:background .2s,transform .2s}.step-dot--active{background:#004f91;transform:scale(1.3)}.narrative-nav{display:flex;align-items:center;justify-content:space-between;padding:.625rem .875rem;border-top:1px solid #e0e0e0;background:#fafafa}.narrative-nav .step-count{font-size:.8rem;color:#666;font-family:Roboto Condensed,monospace}.narrative-nav .mg-button.disabled{opacity:.4;pointer-events:none}