.lost-launch-card { position:relative; isolation:isolate; width:min(670px,calc(100vw - 40px)); margin:38px 0 26px; border-radius:26px; overflow:hidden; background:#123957; color:#fff9ed; border:1px solid #ecce9850; box-shadow:0 24px 65px #030f2840; }
.lost-launch-art { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:67% 50%; z-index:-2; }
.lost-launch-card:after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,#062840ef 0%,#062840c0 44%,#06284000 90%); z-index:-1; }
.lost-launch-copy { padding:30px 32px; width:70%; }
.lost-story-kicker { font:700 10px/1.5 Inter,sans-serif; letter-spacing:.16em; text-transform:uppercase; }
.lost-launch-copy h1 { font:500 clamp(32px,4.7vw,52px)/1.06 Fraunces,Georgia,serif; margin:12px 0 15px; letter-spacing:-.04em; color:#fff8e7; }
.lost-launch-copy p { font:400 15px/1.55 Inter,sans-serif; max-width:285px; color:#f3e9d7; margin:0 0 23px; }
.lost-story-play { min-height:52px; padding:14px 20px; border:0; border-radius:14px; color:#133e42; background:#ffdf8b; display:inline-flex; justify-content:center; align-items:center; gap:18px; font:700 14px/1.3 Inter,sans-serif; box-shadow:0 4px 0 #ba904747; cursor:pointer; }
.lost-story-play:hover { background:#ffeaae; transform:translateY(-1px); }
.lost-story-play span { font-size:21px; }
.lost-launch-copy>small { display:block; margin-top:15px; color:#efdebb; font:500 11px/1.5 Inter,sans-serif; }
.lost-story-menu-entry { background:#fff3d6; color:#214e52; border:1px solid #d9c6a0; border-radius:14px; padding:12px 16px; text-align:left; display:grid; grid-template-columns:1fr auto; gap:3px 15px; width:100%; min-height:62px; cursor:pointer; }
.lost-story-menu-entry>span { font:600 18px/1.2 Fraunces,Georgia,serif; }
.lost-story-menu-entry>small { font:500 11px/1.4 Inter,sans-serif; }
.lost-story-menu-entry>b { grid-column:2; grid-row:1/3; align-self:center; font-size:24px; }
.action-menu>.lost-story-menu-entry { margin:10px 0 16px; }
.lost-story-overlay { position:fixed; inset:0; z-index:12000; background:#143341d9; backdrop-filter:blur(10px); display:flex; align-items:center; justify-content:center; padding:24px; overflow:auto; color:#21474b; }
.lost-story-dialog { width:min(1080px,100%); max-height:calc(100dvh - 48px); overflow:auto; border-radius:25px; background:#fff9ed; box-shadow:0 24px 90px #031a3880; }
.lost-story-dialog * { box-sizing:border-box; }
.lost-story-top { display:flex; align-items:center; justify-content:space-between; padding:12px 24px; gap:12px; border-bottom:1px solid #ddcdae; }
.lost-story-top>span { font:700 10px/1.5 Inter,sans-serif; letter-spacing:.12em; }
.lost-story-top button { background:#f4ead5; color:#335855; border:1px solid #d9cdb4; border-radius:12px; min-height:44px; padding:9px 14px; cursor:pointer; font-weight:600; }
.lost-story-world { position:relative; min-height:300px; overflow:hidden; color:#fff6e6; background:#123957; }
.lost-story-art { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.lost-story-world:after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,#082940e6,#12395744 70%,transparent); }
.lost-story-world-copy { position:relative; z-index:2; padding:42px 42px 54px; max-width:600px; }
.lost-story-world h1 { font:500 clamp(34px,4.3vw,54px)/1.05 Fraunces,Georgia,serif; letter-spacing:-.04em; margin:13px 0 14px; color:#fff7e5; }
.lost-story-world p { max-width:395px; font:400 15px/1.6 Inter,sans-serif; margin:0; color:#f7eee0; }
.lost-story-progress { position:absolute; z-index:2; bottom:16px; right:22px; background:#fef6e7; color:#214e52; padding:8px 13px; border-radius:30px; font:600 11px/1.2 Inter,sans-serif; }
.lost-story-content { display:grid; grid-template-columns:340px 1fr; gap:30px; padding:28px; }
.lost-story-chapters { display:flex; flex-direction:column; gap:10px; }
.lost-story-chapters button { padding:14px 12px; min-height:74px; border:1px solid #dfd7c5; border-radius:15px; display:flex; align-items:center; gap:12px; text-align:left; background:#fffdf6; color:#254d51; cursor:pointer; }
.lost-story-chapters button[aria-pressed=true] { background:#e5f0e7; border-color:#6a9c8e; box-shadow:inset 3px 0 #367967; }
.lost-story-chapters .lost-chapter-number { display:grid; place-items:center; width:35px; height:40px; flex-shrink:0; border-radius:10px; background:var(--chapter-color,#459c86); color:white; font:500 20px Fraunces,Georgia,serif; }
.lost-story-chapters strong { display:block; font:600 17px/1.25 Fraunces,Georgia,serif; }
.lost-story-chapters small { display:block; margin-bottom:5px; font:700 8px/1.3 Inter,sans-serif; letter-spacing:.08em; }
.lost-story-chapters b { margin-left:auto; color:#408272; }
.lost-story-chapters .lost-ending-tab { min-height:48px; justify-content:center; font-weight:600; }
.lost-story-brief { padding:7px 4px; align-self:center; }
.lost-story-brief>.lost-story-kicker { color:#7b7464; }
.lost-story-brief h2 { font:500 31px/1.15 Fraunces,Georgia,serif; color:#20494a; margin:11px 0 13px; }
.lost-story-brief p { font:400 14px/1.7 Inter,sans-serif; color:#4f6462; margin:0 0 16px; max-width:570px; }
.lost-story-places { display:flex; flex-wrap:wrap; gap:6px; margin:14px 0 21px; }
.lost-story-places span { padding:6px 9px; background:#efe9d9; border-radius:8px; color:#596450; font:500 10px/1.3 Inter,sans-serif; }
.lost-story-launch { display:flex; flex-direction:column; align-items:flex-start; gap:12px; }
.lost-story-launch>small { font:400 11px/1.5 Inter,sans-serif; color:#61746a; }
.lost-name-choices { display:flex; flex-wrap:wrap; gap:8px; margin:18px 0; }
.lost-name-choices button { min-height:46px; padding:10px 12px; border-radius:12px; border:1px solid #d4ceb9; background:#f9f1dd; color:#345c56; cursor:pointer; }
.lost-name-choices button[aria-pressed=true] { background:#24584e; border-color:#24584e; color:#fff8e6; }
.lost-story-sparks { position:absolute; inset:0; pointer-events:none; z-index:1; }
.lost-story-sparks i { position:absolute; width:5px; height:5px; border-radius:50%; background:#ffdd89; box-shadow:0 0 14px 4px #ffce7fa8; animation:lost-starlight 3.8s infinite ease-in-out alternate; }
.lost-story-finish-link { margin-top:12px; width:100%; display:flex; flex-direction:column; align-items:center; gap:10px; }
.lost-story-finish-link>span { font-size:12px; color:#4b6b63; }
.lost-story-finish-link>button { min-height:48px; background:#e2f1e8; color:#1c574d; border:1px solid #89b4a5; border-radius:12px; padding:12px 16px; cursor:pointer; }
.lost-story-dialog button:focus-visible,.lost-launch-card button:focus-visible,.lost-story-menu-entry:focus-visible { outline:3px solid #ec9c39; outline-offset:3px; }
@keyframes lost-starlight { from { opacity:.25; transform:translateY(6px) scale(.7); } to { opacity:1; transform:translateY(-6px) scale(1.3); } }
.header>.lost-launch-card { position:fixed; z-index:28; pointer-events:auto; left:clamp(28px,6vw,100px); top:clamp(178px,26vh,255px); margin:0; width:min(590px,calc(100vw - 56px)); }
@media(max-width:760px) { .header>.lost-launch-card { left:20px; top:210px; width:calc(100vw - 40px); max-width:500px; } }
@media(max-height:650px) and (min-width:761px) { .header>.lost-launch-card { top:155px; width:480px; } .header .lost-launch-copy { padding:20px 25px; } .header .lost-launch-copy h1 { font-size:34px; } .header .lost-launch-copy p { font-size:13px; margin-bottom:15px; } }
@media(max-width:760px) { .lost-story-overlay { padding:12px; } .lost-story-dialog { max-height:calc(100dvh - 24px); border-radius:18px; } .lost-story-content { grid-template-columns:1fr; gap:18px; padding:18px; } .lost-story-chapters { flex-direction:row; overflow-x:auto; padding:2px; } .lost-story-chapters button { flex:1 0 145px; padding:10px; gap:8px; min-height:78px; } .lost-story-chapters strong { font-size:15px; } .lost-story-chapters b { display:none; } .lost-story-chapters .lost-chapter-number { width:27px; height:34px; font-size:17px; } .lost-story-world { min-height:245px; } .lost-story-world-copy { padding:25px 23px 52px; max-width:510px; } .lost-story-world h1 { font-size:40px; max-width:400px; } .lost-story-brief h2 { font-size:27px; } .lost-story-top { padding:8px 14px; } .lost-story-top>span { font-size:8px; max-width:150px; } .lost-story-world p { font-size:13px; max-width:310px; } }
@media(max-width:480px) { .lost-launch-card { width:100%; margin:24px 0 14px; border-radius:20px; } .lost-launch-copy { padding:24px 22px; width:86%; } .lost-launch-copy h1 { font-size:38px; } .lost-launch-copy p { max-width:235px; font-size:14px; } .lost-launch-art { object-position:70% 50%; } .lost-story-world h1 { font-size:35px; } .lost-story-chapters button { flex-basis:135px; } .lost-story-brief p { font-size:13px; } .lost-story-play { width:100%; } }
@media(prefers-reduced-motion:reduce) { .lost-story-sparks i { animation:none; } .lost-story-play:hover { transform:none; } }