/* A persistent companion to the story, placed outside document flow. Existing image
   dimensions, narrative columns and framing stay exactly as authored. */
.page-project{position:relative}
.story-spatial{position:fixed;left:0;top:0;z-index:16;background:#000;width:220px;border:1px solid #464646;box-shadow:0 12px 36px #0005;color:#fff;isolation:isolate;contain:layout style;will-change:transform}
.story-spatial[hidden],.story-spatial [hidden]{display:none!important}
.story-spatial-header{height:44px;display:flex;justify-content:space-between;align-items:center;padding-left:13px;gap:6px;border-bottom:1px solid #262626}
.story-spatial-heading{font:400 12px/1.25 var(--label);letter-spacing:.035em;color:#d6d6d6}
.story-spatial-toggle{width:44px;min-width:44px;height:44px;border:0;background:transparent;font:400 21px/1 var(--sans);cursor:pointer}
.story-spatial-toggle:hover{background:#1a1a1a}
.story-spatial-square{position:relative;aspect-ratio:1;background:#000;overflow:hidden}
.story-spatial-square canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.story-spatial-previous{opacity:0;pointer-events:none}
.story-spatial-loading{position:absolute;inset:0;display:grid;place-content:center;padding:20px;font:400 12px/1.6 var(--label);color:#aaa;text-align:center}
.story-spatial-meta{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:9px 12px 0;font:400 12px/1.4 var(--label)}
.story-spatial-meta [data-spatial-count]{font-size:12px;color:#999;white-space:nowrap;font-variant-numeric:tabular-nums}
.story-spatial-stops{display:flex;padding:0 10px;gap:5px}
.story-spatial-stops button{position:relative;flex:1;min-width:24px;min-height:34px;padding:5px 0 10px;border:0;background:transparent;font:400 0/1 var(--label);color:#bbb;cursor:pointer}
.story-spatial-stops button::after{content:'';position:absolute;left:2px;right:2px;bottom:14px;height:1px;background:#505050;transition:background .2s}
.story-spatial-stops button[aria-pressed=true]::after,.story-spatial-stops button:hover::after{background:#fff;height:2px}
.story-spatial :focus-visible{outline:1px solid #fff;outline-offset:-4px}
.story-spatial.is-collapsed{box-shadow:none}
.story-spatial.is-collapsed .story-spatial-header{border-bottom:0}
@media(max-width:759px){.story-spatial-header{padding-left:7px;gap:0}.story-spatial-meta{padding:4px 7px 6px;display:block;font-size:12px;line-height:1.2}.story-spatial-meta [data-spatial-count],.story-spatial-stops{display:none}.story-spatial-heading{font-size:12px}.story-spatial-toggle{width:38px;min-width:38px}.story-spatial{box-shadow:0 8px 24px #0006}}
@media(prefers-reduced-motion:reduce){.story-spatial,.story-spatial *{animation:none!important;transition:none!important}}
@media print{.story-spatial{display:none!important}}

.story-spatial-drag{align-self:stretch;flex:1;min-width:0;text-align:left;border:0;padding:0;background:transparent;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
.story-spatial-drag::before{content:'⠿';margin-right:7px;color:#777;font-size:15px}
.story-spatial.is-dragging .story-spatial-drag{cursor:grabbing}
.story-spatial.is-dragging{box-shadow:0 14px 40px #0009}