:root{--archive-crimson:#892629;--archive-deep:#732023;--archive-paper:#fff0d7;--archive-gold:#e6bb79;--archive-rule:rgba(255,227,187,.22)}
.story-dialog{position:fixed;inset:0 0 0 auto;margin:0;padding:0;width:clamp(390px,34vw,640px);max-width:100vw;height:100%;height:100dvh;max-height:none;border:0;border-left:1px solid var(--archive-rule);border-radius:0;color:var(--archive-paper);background:var(--archive-crimson);overflow:hidden;color-scheme:dark}
.story-dialog[open]{display:flex;flex-direction:column;animation:archive-enter .28s cubic-bezier(.2,.75,.25,1)}
.story-dialog::backdrop{background:rgba(29,15,13,.24)}
.story-handle{display:none}
.story-toolbar{display:flex;align-items:center;justify-content:space-between;flex:none;gap:12px;padding:17px 24px 15px 32px;border-bottom:1px solid var(--archive-rule);background:var(--archive-deep)}
.story-identity{display:flex;align-items:center;gap:12px;font:12px var(--font-reading);letter-spacing:.1em;min-width:0}
.story-identity>span:first-child{font:25px var(--font-exhibit);color:var(--archive-gold);line-height:1}
.story-identity small{display:block;margin-top:5px;font-size:9px;letter-spacing:.16em;color:#e3b9a2}
.story-close{width:44px;height:44px;flex:none;display:grid;place-items:center;padding:0;border:1px solid var(--archive-rule);border-radius:50%;background:transparent;color:var(--archive-paper)}
.story-close:hover{background:rgba(255,235,207,.1)}.story-close svg{width:19px;height:19px}
.story-tabs{display:flex;gap:0;flex:none;padding:0 32px;background:var(--archive-deep);border-bottom:1px solid var(--archive-rule)}
.story-tab{position:relative;flex:1;min-height:49px;border:0;background:transparent;padding:12px 5px;font:15px var(--font-exhibit);color:#d6a798;letter-spacing:.08em}
.story-tab[aria-selected=true]{color:var(--archive-paper)}
.story-tab[aria-selected=true]::after{content:"";position:absolute;bottom:-1px;left:16%;right:16%;height:2px;background:var(--archive-gold)}
.story-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#bd6a58 transparent;-webkit-overflow-scrolling:touch}
.story-article{padding:30px 32px max(28px,env(safe-area-inset-bottom));background:radial-gradient(ellipse at 100% 0,rgba(196,72,50,.2),transparent 60%)}
.story-kicker{margin:0 0 13px;color:var(--archive-gold);font-size:10px;line-height:1.8;letter-spacing:.13em}
.story-title{font:500 clamp(32px,2.5vw,44px)/1.25 var(--font-exhibit);letter-spacing:.035em;margin:0;text-wrap:balance}
.story-deck{font:13px/1.8 var(--font-reading);color:#e8bea8;margin:14px 0 24px;letter-spacing:.04em}
.story-figure{margin:0 0 25px}
.story-figure img{display:block;width:100%;height:auto;object-fit:contain;background:var(--archive-deep)}
.story-scroll:focus-visible{outline:1px solid var(--archive-gold);outline-offset:-4px}
.story-image-source{border-top:1px solid var(--archive-rule);padding-top:12px;margin-top:8px;font-size:10px;line-height:1.8}
.story-image-source p{margin:0 0 8px}
.story-facts>div:last-child:nth-child(odd){grid-column:1/-1}
.story-lead{font:18px/1.85 var(--font-exhibit);margin:0 0 26px;color:#fff2dd;text-wrap:pretty}
.story-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 20px;padding:20px 0;margin:0 0 30px;border-block:1px solid var(--archive-rule)}
.story-facts dt{font-size:10px;letter-spacing:.08em;color:#dfae98;margin-bottom:7px}.story-facts dd{font:15px/1.55 var(--font-exhibit);margin:0;color:#fff0d5}
.story-section{margin:0 0 28px}.story-section h3{display:flex;align-items:baseline;gap:12px;font:500 21px/1.5 var(--font-exhibit);margin:0 0 13px;letter-spacing:.02em}
.story-section-number{font:10px var(--font-reading);color:var(--archive-gold);letter-spacing:.06em;flex:none}
.story-section p{font-size:14px;line-height:1.95;margin:0 0 13px;color:#f3d9c5;text-align:justify;text-justify:inter-ideograph;overflow-wrap:anywhere}
.story-note{border-left:1px solid var(--archive-gold);padding:1px 0 1px 15px;margin:30px 0}.story-note>span{color:var(--archive-gold);font-size:10px;letter-spacing:.1em}.story-note p{font-size:12px;line-height:1.85;color:#eac3af;margin:8px 0 0}
.story-sources{border-top:1px solid var(--archive-rule);padding-top:17px;margin-top:34px;color:#e5b9a0;font-size:11px;line-height:1.8}
.story-sources summary{cursor:pointer;min-height:35px;padding:5px 0;letter-spacing:.04em}.story-sources ol{padding-left:18px;margin:6px 0 0}.story-sources li{padding:0 0 12px 4px}.story-sources a{color:#ffe1b8;text-decoration-color:#d79f75;text-underline-offset:3px}.story-sources small{display:block;color:#d5a18c;margin-top:3px}
.story-footer{padding-top:30px;color:#d99f89;letter-spacing:.16em;font-size:9px}
.story-dialog button:focus-visible,.story-dialog a:focus-visible,.story-dialog summary:focus-visible{outline:2px solid var(--archive-gold);outline-offset:3px}
@keyframes archive-enter{from{transform:translateX(100%)}to{transform:translateX(0)}}
@keyframes archive-rise{from{transform:translateY(100%)}to{transform:translateY(0)}}
@media(max-width:820px),(pointer:coarse){
 .story-dialog{inset:auto 0 0;margin:0;width:100%;max-width:none;height:86dvh;max-height:calc(100dvh - 24px);border:0;border-top:1px solid var(--archive-rule);border-radius:17px 17px 0 0}
 .story-dialog[open]{animation-name:archive-rise}
 .story-handle{display:block;width:35px;height:3px;border-radius:3px;flex:none;background:#d4907b;margin:10px auto 0}
 .story-toolbar{padding:5px 20px 12px 24px;background:transparent}
 .story-identity{font-size:11px}.story-identity small{font-size:8px}
 .story-tabs{padding-inline:24px}.story-tab{min-height:47px;font-size:15px}
 .story-article{padding:24px 24px max(28px,env(safe-area-inset-bottom))}
 .story-title{font-size:33px}.story-deck{font-size:12px;margin-bottom:21px}.story-lead{font-size:18px}.story-section p{font-size:14px;line-height:1.95}
 .story-facts{margin-bottom:26px}
}
@media(max-height:500px) and (orientation:landscape){.story-dialog{height:94dvh;max-height:calc(100dvh - 12px)}.story-toolbar{padding-block:4px}.story-identity small{display:none}.story-tabs{min-height:42px}.story-tab{min-height:42px;padding-block:8px}}
@media(prefers-reduced-motion:reduce){.story-dialog[open]{animation:none}}
body[data-reduced-motion=true] .story-dialog[open]{animation:none}