/* A persistent, board-anchored glass story. Text stays crisp above the optical layer. */
.story-lockup .board-preview{position:absolute;z-index:8;top:calc(var(--prompt-y, 600px) - 84px);left:50%;translate:-50% 0;width:min(760px,calc(100% - 32px));box-sizing:border-box;padding:42px 48px;display:grid;grid-template-columns:190px minmax(0,1fr);gap:30px;border:1px solid #ffffff80;border-radius:32px;background:transparent;color:var(--ink);overflow:visible;pointer-events:auto;box-shadow:none;max-height:none;isolation:isolate}
.board-preview[hidden]{display:none!important}
.board-preview-gloss{position:absolute;inset:0;z-index:-1;border-radius:inherit;background:linear-gradient(125deg,#ffffff25,transparent 45%,#ffffff28),color-mix(in srgb,var(--paper) 30%,transparent);backdrop-filter:blur(9px) saturate(1.25);-webkit-backdrop-filter:blur(9px) saturate(1.25);box-shadow:inset 1px 1px 1px #ffffff80,inset -1px -1px 1px #ffffffb0;pointer-events:none}
@supports(backdrop-filter:url(#story-glass-refraction)){.board-preview-gloss{backdrop-filter:url(#story-glass-refraction) saturate(1.25)}}
.story-lockup .board-preview h3{font:300 clamp(26px,2.2vw,38px)/1 'FAIRE Octave Trial Variable',serif;text-transform:uppercase;letter-spacing:0;font-feature-settings:'dlig' 1,'ss01' 1,'ss06' 1,'ss11' 1,'ss14' 1;margin:0;align-self:start}
.board-preview-copy{font:300 16px/1.35 'ABC Oracle',sans-serif;margin:0;text-wrap:pretty}
.board-preview-tools{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:16px 0 0}
.board-preview-tools li{font:300 11px/1.2 'ABC Oracle',sans-serif;text-transform:uppercase;font-feature-settings:normal;padding:7px 11px;border-radius:999px;background:#ffffff22;border-top:1px solid #ffffff80}
.octave-home .story-lockup .piece-prompt{left:50%;width:max-content;max-width:calc(100% - 32px);translate:-50% 0;padding:15px 36px;border:1px solid #ffffff80;border-radius:999px;background:#ffffff18;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font:300 clamp(16px,1.4vw,23px)/1 'FAIRE Octave Trial Variable',serif;text-transform:uppercase;letter-spacing:0;transition:opacity .24s;}
.story-lockup.story-showing .piece-prompt{opacity:0!important;pointer-events:none}
/* The piece is the primary control in this treatment; retain keyboard access to alternatives. */
.story-lockup .board-label-row{opacity:0;pointer-events:none}
.story-lockup .board-label-row:focus-within{opacity:1;pointer-events:auto;z-index:10}
@media(max-width:600px){.story-lockup .board-preview{top:calc(var(--prompt-y,400px) - 36px);padding:24px;grid-template-columns:1fr;gap:14px;border-radius:26px}.story-lockup .board-preview h3{font-size:26px}.board-preview-copy{font-size:15px}.board-preview-tools{gap:6px;margin-top:12px}}
@media(max-height:500px) and (min-width:601px){.story-lockup .board-preview{top:calc(var(--prompt-y,300px) - 12px);padding:24px;grid-template-columns:160px minmax(0,1fr);gap:20px}.story-lockup .board-preview h3{font-size:26px}}

/* Shared panel alignment, with a more distinct paper lens for Sketch. */
.story-lockup .board-preview h3{align-self:center;text-align:left}
.story-lockup .board-preview[data-edition=sketch]{color:#292821;border-color:#77736566}
.board-preview[data-edition=sketch] .board-preview-gloss{background:linear-gradient(125deg,#ffffff55,transparent 65%),#d5d0bfbd;box-shadow:inset 1px 1px 1px #ffffffcc,inset -1px -1px 1px #8f8a7566}
.board-preview-tools{flex-wrap:nowrap;gap:6px;align-items:center}
.board-preview-tools li{white-space:nowrap;flex:0 1 auto;min-width:0;padding:6px 8px;font-size:clamp(8px,.7vw,11px)}
.board-preview-close{position:absolute;right:12px;top:12px;width:28px;height:28px;padding:6px;display:grid;place-items:center;border:0;border-radius:0;background:transparent;color:inherit;cursor:pointer}
.board-preview-close svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}
.board-preview-close:hover{opacity:.65}.board-preview-close:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.octave-home .story-lockup .piece-prompt{font-size:clamp(9px,.65vw,11px);padding:7px 16px}
.octave-home .story-lockup.is-piece-held .piece-prompt{opacity:0!important;visibility:hidden;pointer-events:none}
@media(max-width:600px){.story-lockup .board-preview{padding:30px 20px 24px}.story-lockup .board-preview h3{width:100%}.board-preview-tools{justify-content:center;gap:4px}.board-preview-tools li{font-size:8px;padding:6px}.board-preview-close{right:8px;top:8px;width:24px;height:24px}}

/* Board details are explicitly requested, never opened by placing the piece. */
.story-lockup .board-story-info{position:absolute;top:calc(var(--prompt-y,600px) + 34px);left:50%;translate:-50% 0;z-index:10;display:grid;place-items:center;width:44px;height:44px;border:1px solid color-mix(in srgb,var(--ink) 30%,transparent);border-radius:50%;background:color-mix(in srgb,var(--paper) 80%,transparent);color:var(--ink);font:italic 22px Georgia,serif;cursor:pointer;pointer-events:auto}
.story-lockup .board-story-info[hidden]{display:none}
.story-lockup.story-showing .board-story-info{visibility:hidden}
.story-lockup .board-story-info:focus-visible{outline:2px solid var(--ink);outline-offset:4px}

.board-preview-cue{font:600 16px/1.35 'ABC Oracle',sans-serif;margin:0 0 12px;text-wrap:pretty}
/* Give the pickup instruction priority over the supplementary information. */
.octave-home .story-lockup .piece-prompt{font-size:clamp(14px,1.15vw,18px);padding:10px 22px}
.story-lockup .board-story-info{width:28px;height:28px;font-size:16px;top:calc(var(--prompt-y,600px) + 44px)}
.story-lockup .board-story-info::before{content:'';position:absolute;inset:-8px;border-radius:50%}
