/* from v7 04-mid.css:125 */
/* ===================== v4 STORY PANELS ===================== */
dialog.panel{position:fixed;inset:0 0 0 auto;margin:0;width:min(880px,100vw);max-width:100vw;height:100%;max-height:100%;padding:0;border:0;border-left:1px solid var(--line);background:var(--ink-2);color:var(--paper);overflow:auto;overscroll-behavior:contain}
dialog.panel::backdrop{background:var(--scrim);backdrop-filter:blur(6px) saturate(.8);-webkit-backdrop-filter:blur(6px)}
dialog.panel[open]{animation:slidein .7s var(--ease)}
dialog.panel[open]::backdrop{animation:fadein .5s ease}
dialog.panel.closing{animation:slideout .45s var(--slow) forwards}
@keyframes slidein{from{clip-path:inset(0 0 0 100%)}to{clip-path:inset(0 0 0 0)}}
@keyframes slideout{to{transform:translateX(24px);opacity:0}}
@keyframes fadein{from{opacity:0}}
.panel-in{position:relative;padding:clamp(22px,3vw,40px) clamp(22px,3.4vw,52px) 70px}
.panel-top{display:flex;justify-content:space-between;align-items:center;gap:16px;color:var(--mute);padding-bottom:18px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--ink-2);z-index:3;padding-top:4px}
.panel-tr{display:flex;align-items:center;gap:12px}
.panel-esc{padding:3px 6px;border:1px solid var(--line);font-size:var(--fs-micro);color:var(--mute)}
@media (hover:none){.panel-esc{display:none}}
.panel-prog{position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:var(--blue);transform:scaleX(var(--sp,0));transform-origin:left}
.panel-x{padding:8px 12px;border:1px solid var(--line);color:var(--paper)}
.panel-ghost{position:absolute;right:clamp(14px,3vw,40px);top:clamp(60px,6vw,86px);font-size:var(--fd-ghost);line-height:.8;color:transparent;-webkit-text-stroke:1px var(--line);pointer-events:none;z-index:0}
.panel-h{position:relative;z-index:1;font-size:var(--fd-m);line-height:.88;margin:clamp(40px,5vw,80px) 0 clamp(30px,3.4vw,50px);max-width:14ch}
.blk{position:relative;z-index:1;border-top:1px solid var(--line);padding:22px 0 26px}
.blk .k{color:var(--blue-text);margin-bottom:12px}
.blk .tx,.blk .p0{font-size:var(--fs-m);line-height:1.55;max-width:60ch}
.blk .p0{margin-bottom:12px}
.blk .li{position:relative;padding:10px 0 10px 26px;border-top:1px solid var(--faint);color:var(--text-2);font-size:var(--fs-s)}
.blk .li::before{content:"";position:absolute;left:2px;top:19px;width:5px;height:5px;border-radius:50%;background:var(--blue)}
.blk.val{border-top:2px solid var(--paper)}
.metric{font-size:var(--fd-xl);line-height:.8;color:var(--blue);margin:6px 0 20px}
.panel-nav{display:flex;justify-content:flex-end;border-top:1px solid var(--line);padding-top:8px;margin-top:10px}
dialog.panel[open] .panel-h,dialog.panel[open] .blk,dialog.panel[open] .panel-nav{animation:pin .7s var(--ease) both}
dialog.panel[open] .panel-h{animation-delay:.12s}
dialog.panel[open] .blk:nth-of-type(2){animation-delay:.2s}
dialog.panel[open] .blk:nth-of-type(3){animation-delay:.28s}
dialog.panel[open] .blk:nth-of-type(4){animation-delay:.36s}
dialog.panel[open] .panel-nav{animation-delay:.44s}
dialog.panel[open] .panel-ghost{animation:ghost .9s var(--ease) both .1s}
@media (max-width:899.98px){.panel-ghost{top:120px;font-size:var(--fd-ghost)}}
@keyframes pin{from{opacity:0;transform:translateY(12px)}}
@keyframes ghost{from{opacity:0;transform:translateY(16px)}}