.memory-theatre{display:grid;grid-template-columns:190px minmax(0,1fr);column-gap:40px;align-items:center;max-width:1440px}
.memory-frame{grid-column:2;grid-row:1;aspect-ratio:1.95;border:0;box-shadow:none;background:transparent;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
.memory-frame .frame-corner{display:none}.memory-vignette{background:linear-gradient(0deg,#0b100b 0%,#0b100b99 18%,transparent 60%)}.memory-title{bottom:27px;left:40px}.memory-title h3{font-size:clamp(28px,3vw,46px)}.memory-title>span{font-size:12px;letter-spacing:2px;color:#dacb9f}
.memory-play-mark{width:66px;height:66px;background:linear-gradient(135deg,#ddc88c,#8c794d);color:#1e2419;border:3px double #e5d5a5;box-shadow:inset 0 0 0 3px #625536;clip-path:polygon(50% 0,94% 25%,94% 75%,50% 100%,6% 75%,6% 25%);font-size:22px}.memory-play:hover .memory-play-mark{background:#e4d29c;transform:scale(1.05)}.memory-action-label{display:none}
.memory-index{grid-column:1;grid-row:1 / span 2;display:flex;flex-direction:column;gap:25px;margin:0;padding:20px 0;position:relative;align-self:stretch;justify-content:center}
.memory-index:before{content:'';position:absolute;top:35px;bottom:35px;left:50%;width:1px;background:linear-gradient(transparent,#806c4055,transparent);z-index:-1}
.memory-index button,.memory-index button[aria-pressed=true]{display:flex;flex-direction:column;gap:12px;padding:10px 0;background:none;border:0;text-align:center;color:#a7aa99;box-shadow:none}.memory-index button:after,.memory-index button[aria-pressed=true]:after{display:none}
.memory-token{display:block;position:relative;width:88px;height:88px;padding:5px;border-radius:50%;border:3px double #80714b;background:#10180f;box-shadow:0 4px 15px #0008;transition:border-color .3s,transform .4s,box-shadow .4s}.memory-token:after{content:'';position:absolute;inset:4px;border:1px solid #c5ae6f44;border-radius:50%;pointer-events:none}.memory-token img{width:100%;height:100%;object-fit:cover;object-position:center 20%;border-radius:50%;filter:saturate(.25) brightness(.65);transition:filter .4s}.memory-index button[data-memory=film] img{object-position:center}.memory-index button[aria-pressed=true] .memory-token{border-color:#dcc58a;box-shadow:0 0 0 4px #b49b4f18,0 5px 20px #000a;transform:scale(1.08)}.memory-index button[aria-pressed=true] img,.memory-index button:hover img{filter:saturate(.8) brightness(1)}.memory-index button[aria-pressed=true]{color:#e4d5ab}.memory-index strong{font:500 19px/1.2 var(--heading);margin-bottom:5px}.memory-index small{font:13px/1.4 'Spectral',serif;color:#acae9b}
.memory-console{grid-column:2;display:flex;gap:18px;padding:17px 23px;margin:0 25px;background:linear-gradient(110deg,#171e17,#2a2e22,#101810);border:3px double #8c794c;box-shadow:inset 0 0 0 3px #0b110c,0 8px 20px #0005;color:#d9c58b}.memory-console #memory-toggle{display:grid;place-items:center;min-width:44px;width:44px;height:44px;background:linear-gradient(135deg,#decb92,#a48c52);color:#20261b;clip-path:polygon(8px 0,calc(100% - 8px) 0,100% 8px,100% calc(100% - 8px),calc(100% - 8px) 100%,8px 100%,0 calc(100% - 8px),0 8px);font-size:18px}.memory-console input{appearance:none;background:linear-gradient(90deg,#dbc48b var(--played,0%),#5c604e var(--played,0%));height:2px}.memory-console input::-webkit-slider-thumb{appearance:none;width:11px;height:11px;transform:rotate(45deg);background:#e0c88c;border:1px solid #ae9259}.memory-console input::-moz-range-thumb{border-radius:0;width:10px;height:10px;transform:rotate(45deg);background:#e0c88c;border:1px solid #ae9259}.memory-console #memory-full{font-size:11px;min-width:90px;color:#d4c395}.memory-caption{grid-column:2;text-align:center;padding:0 25px;margin-top:20px;font-size:19px;font-style:italic;color:#c6c5b2}.memory-caption:empty{display:none}
@media(max-width:900px){.memory-theatre{grid-template-columns:140px minmax(0,1fr);gap:20px}.memory-index{gap:15px}.memory-token{width:68px;height:68px}.memory-index strong{font-size:16px}.memory-frame{aspect-ratio:1.35}.memory-console{margin:0;padding:12px;gap:12px}.memory-title{left:20px;bottom:20px}.memory-title h3{font-size:29px}.memory-title>span{font-size:10px}.memory-index small{font-size:12px}}
@media(max-width:600px){.memory-theatre{display:flex;flex-direction:column;gap:0}.memory-frame{width:100%;aspect-ratio:1.15;order:1}.memory-index{order:0;flex-direction:row;width:100%;gap:10px;padding:0 0 25px;align-items:flex-start}.memory-index:before{top:35px;left:10%;right:10%;bottom:auto;width:auto;height:1px}.memory-index button{flex:1;min-width:0;padding:0;gap:12px}.memory-index strong{font-size:14px}.memory-index small{display:none}.memory-token{width:65px;height:65px}.memory-console{order:2;width:100%;flex-wrap:nowrap;gap:9px;padding:12px 9px}.memory-console #memory-toggle{min-width:35px;width:35px;height:35px;font-size:14px}.memory-console #memory-full{min-width:56px;font-size:9px}.memory-console #memory-time{font-size:10px}.memory-caption{order:3;font-size:17px;padding:0;margin-top:18px}.memory-title h3{font-size:27px}.memory-play{padding-bottom:35px}}
@media(prefers-reduced-motion:reduce){.memory-token,.memory-token img{transition:none}}

.memory-index button:last-child{border:0}.memory-title>span{line-height:1.5;display:block}.memory-art,.memory-title{view-transition-name:none}
@media(max-width:600px){.memory-title>span{font-size:9px;letter-spacing:1px}.memory-title{left:20px;right:20px}.memory-portrait{height:100%;width:85%;right:0;bottom:0}}

.memory-frame .memory-portrait{top:5%;bottom:auto;height:95%;object-fit:contain;object-position:center top}



.dialogue-scene{display:block;width:100%;height:100%;object-fit:contain;object-position:center top;mask-image:linear-gradient(#000 75%,transparent 100%)}
.memory-frame{aspect-ratio:16/9}.memory-art{background:#0b100b}.memory-title{z-index:3}.memory-title h3{font-size:clamp(26px,2.7vw,42px)}
.memory-frame.playing .dialogue-scene{animation:dialogue-camera 24s ease-in-out infinite alternate;transform-origin:50% 35%}
@keyframes dialogue-camera{to{transform:scale(1.025)}}
@media(max-width:600px){.memory-frame{aspect-ratio:1.12}.memory-title h3{font-size:25px}.memory-title{left:16px;right:16px;bottom:16px}.dialogue-scene{object-position:center top}.memory-play{padding-bottom:65px}}
@media(prefers-reduced-motion:reduce){.memory-frame.playing .dialogue-scene{animation:none}}

/* Compact dialogue roster keeps all six conversations visible. */
@media(min-width:601px){.memory-theatre{grid-template-columns:235px minmax(0,1fr);column-gap:28px}.memory-index{gap:8px;padding:0;justify-content:center}.memory-index:before{left:32px}.memory-index button,.memory-index button[aria-pressed=true]{flex-direction:row;text-align:left;gap:13px;padding:7px 0;align-items:center}.memory-token{flex:0 0 60px;width:60px;height:60px}.memory-index strong{display:block;font-size:16px;line-height:1.3}.memory-index small{font-size:12px}}
@media(max-width:900px) and (min-width:601px){.memory-theatre{grid-template-columns:180px minmax(0,1fr);column-gap:18px}.memory-token{flex-basis:46px;width:46px;height:46px}.memory-index strong{font-size:14px}.memory-index small{display:none}}
@media(max-width:600px){.memory-index{display:flex;overflow-x:auto;justify-content:flex-start;scroll-snap-type:x proximity;padding:8px 4px 20px;gap:15px}.memory-index button,.memory-index button[aria-pressed=true]{flex:0 0 112px;scroll-snap-align:start}.memory-index strong{display:block;font-size:14px}.memory-index:before{display:none}}