/* Mirrors the hub story scene's dialogue layout and palette. */
#memory-sea{position:absolute;inset:0;z-index:140;background:#02050c;overflow:hidden;color:#edf3f4;font-family:var(--serif,serif);outline:none}
#memory-sea[hidden],#memory-sea [hidden]{display:none!important}
#memory-sea canvas.sea-world{width:100%;height:100%;display:block}
#memory-sea .sea-call{position:absolute;inset:0;background:#02050c;display:grid;place-content:center;text-align:center;padding:8%;font-size:clamp(20px,2.3vw,32px);letter-spacing:.14em;line-height:1.9;white-space:pre-line}
#memory-sea .sea-call p{animation:sea-words 1.2s ease both}
#memory-sea .sea-title{position:absolute;top:9%;left:7%;font-size:clamp(20px,2.3vw,32px);letter-spacing:.4em;text-shadow:0 2px 9px #001c36;pointer-events:none}
#memory-sea .sea-title small{display:block;font:10px sans-serif;letter-spacing:.35em;margin-top:12px;opacity:.65}
#memory-sea .sea-dialogue{position:absolute;left:4%;right:4%;bottom:3%;background:linear-gradient(120deg,#15222bf7,#17212af7);border:1px solid #7e929d;border-left:4px solid #bed0d6;padding:12px 20px 10px;box-sizing:border-box;cursor:pointer}
#memory-sea .sea-dialogue strong{font-size:22px;letter-spacing:3px;font-weight:400;color:#bed0d6}
#memory-sea .sea-dialogue p{font-size:17px;line-height:1.65;margin:7px 0 6px;white-space:pre-line}
#memory-sea .sea-dialogue small{display:block;text-align:right;font:10px sans-serif;opacity:.65;margin-top:4px}
#memory-sea .sea-portrait{position:absolute;right:4%;bottom:calc(3% + var(--sea-text-height,125px) - 2px);width:25%;height:43%;object-fit:contain;object-position:bottom;image-rendering:pixelated;filter:drop-shadow(0 4px 12px #0006);pointer-events:none}
#memory-sea .sea-interact{position:absolute;transform:translate(-50%,-100%);border:1px solid #b9ab79;border-radius:5px;background:#111d23e8;color:#f0e0b7;padding:9px 14px;font:17px var(--serif,serif);white-space:nowrap;cursor:pointer}
#memory-sea kbd{font:14px sans-serif;border:1px solid #a8b9bd;padding:3px 7px;margin-right:8px}
#memory-sea .sea-hint{position:absolute;bottom:4%;right:4%;font:12px sans-serif;color:#e6f4f9aa;pointer-events:none}
/* Match the approved centered, two-button composition. The scrim never filters
   the scene during walking/dialogue; it only dims the choice state. */
#memory-sea .sea-choices{position:absolute;inset:0;z-index:4;display:grid;place-items:center;background:#020b16a6;animation:sea-choice-reveal .3s ease both}
#memory-sea .sea-choice-actions{display:flex;align-items:center;justify-content:center;gap:clamp(12px,2.2vw,34px);width:calc(100% - 32px)}
#memory-sea .sea-choices button{position:relative;box-sizing:border-box;flex:0 1 350px;width:clamp(140px,25vw,350px);min-width:0;height:clamp(58px,6.5vw,92px);padding:12px 18px;font:clamp(16px,2vw,28px) var(--serif,serif);letter-spacing:.14em;text-indent:.14em;white-space:nowrap;color:#f0e0b7;border:0;background:transparent;cursor:pointer;isolation:isolate;transition:filter .15s,color .15s}
#memory-sea .sea-choices button::before,#memory-sea .sea-choices button::after{content:"";position:absolute;z-index:-1;clip-path:polygon(14px 0,calc(100% - 14px) 0,100% 14px,100% calc(100% - 14px),calc(100% - 14px) 100%,14px 100%,0 calc(100% - 14px),0 14px);pointer-events:none}
#memory-sea .sea-choices button::before{inset:0;background:#af9456}
#memory-sea .sea-choices button::after{inset:2px;background:linear-gradient(115deg,#10232fee,#091520fa);box-shadow:inset 0 0 0 5px #132533,inset 0 0 0 6px #8a7849}
#memory-sea .sea-choices button.selected{color:#fff0be;filter:drop-shadow(0 0 9px #e9d38a66)}
#memory-sea .sea-choices button.selected::before{background:#f2df9a}
#memory-sea .sea-choices button.selected::after{background:linear-gradient(115deg,#20424e,#10232e);box-shadow:inset 0 0 0 5px #18343e,inset 0 0 0 6px #d5c287}
#memory-sea .sea-choices button:focus-visible{outline:none}
#memory-sea .sea-close{font:16px var(--serif,serif);border:1px solid #b9ab79;background:#17212af5;color:#f0e0b7;padding:12px 20px;cursor:pointer}
@keyframes sea-choice-reveal{from{opacity:0}to{opacity:1}}
#memory-sea .sea-close{font:16px var(--serif,serif);border:1px solid #b9ab79;background:#17212af5;color:#f0e0b7;padding:12px 20px;cursor:pointer}
#memory-sea .sea-close{position:absolute;right:3%;top:3%;font-size:13px}
#memory-sea button:focus-visible{outline:2px solid #f4e5b7;outline-offset:3px}
#memory-sea .sea-fade{z-index:5;position:absolute;inset:0;background:#02050c;opacity:0;pointer-events:none}
#memory-sea .sea-touch{position:absolute;left:4%;bottom:4%;display:none;gap:8px}
#memory-sea .sea-touch button{width:42px;height:42px;background:#13222bd9;color:#fff;border:1px solid #99b3c0;touch-action:none}
@media(pointer:coarse){#memory-sea .sea-touch{display:flex}}
@media(max-height:600px),(max-width:700px){#memory-sea .sea-dialogue{padding:7px 11px;bottom:2%}#memory-sea .sea-dialogue strong{font-size:16px}#memory-sea .sea-dialogue p{font-size:13px;line-height:1.45;margin:4px 0}#memory-sea .sea-portrait{width:23%;height:38%;bottom:calc(2% + var(--sea-text-height,110px) - 2px)}}
@keyframes sea-words{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){#memory-sea .sea-call p,#memory-sea .sea-choices{animation:none}}
body.memory-sea-active #hud,body.memory-sea-active #modal,body.memory-sea-active #touch-controls,body.memory-sea-active #encounter-dialogue{visibility:hidden!important}

/* Keep the replay exit available above the transition scrim. */
#memory-sea .sea-close{z-index:7}
/* One optional character topic, using the existing dialogue palette. */
#memory-sea .sea-menu{position:absolute;left:50%;bottom:5%;transform:translateX(-50%);display:flex;gap:12px;max-width:92%;padding:14px;background:#15222bf5;border:1px solid #7e929d}
#memory-sea .sea-menu button{background:#192f38;border:1px solid #b9ab79;padding:12px 24px;color:#f0e0b7;font:clamp(14px,1.5vw,21px) var(--serif,serif);cursor:pointer}
#memory-sea .sea-menu button:hover,#memory-sea .sea-menu button:focus{background:#294852}
#memory-sea .sea-skip{position:absolute;right:3%;top:3%;z-index:7;background:#14222bda;color:#c5d1d5;border:1px solid #7e929d;padding:7px 12px;font:12px sans-serif;cursor:pointer}
#memory-sea .sea-close{top:10%}

#memory-sea .sea-burden-note{position:absolute;top:calc(50% + clamp(40px,5vw,64px));left:5%;right:5%;margin:0;text-align:center;white-space:pre-line;color:#b9b5cb;font:clamp(10px,1.1vw,15px)/1.9 var(--sans,sans-serif);letter-spacing:.04em;pointer-events:none}