:root{--ink:#2b1d10;--night:#090b09;--night2:#14100b;--paper:#c79a58;--paper2:#e0bd7b;--gold:#dcae55;--gold2:#ffd982;--forest:#1e3c2c;--cream:#f4e4bd;--shadow:0 28px 80px rgba(0,0,0,.55)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#070807;color:#f4e3bb;font-family:'Atkinson Hyperlegible',system-ui,sans-serif;overflow-x:hidden}.screen{min-height:100vh}.screen[hidden]{display:none!important}.adventure-shell{min-height:100vh;background:radial-gradient(circle at 50% 12%,rgba(110,72,27,.20),transparent 28%),linear-gradient(180deg,#070807,#100c08 60%,#07110d);position:relative}.ambient-stars{position:fixed;inset:0;pointer-events:none;opacity:.34;background-image:radial-gradient(circle,#f9d98b 0 1px,transparent 1.5px);background-size:86px 86px;mask-image:linear-gradient(to bottom,#000,transparent 90%)}.cinematic-screen{display:grid;place-items:center;padding:12px;position:relative;overflow:hidden}.cinematic-frame{width:calc(100vw - 24px);min-height:calc(100vh - 24px);position:relative;border:1px solid rgba(220,174,85,.35);box-shadow:var(--shadow);overflow:hidden;background:radial-gradient(circle at 50% 40%,rgba(94,61,22,.22),transparent 34%),#0a0907}.cinematic-frame:after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 120px rgba(0,0,0,.75)}.kicker{font-size:.78rem;letter-spacing:.22em;font-weight:800;text-transform:uppercase}.gold{color:var(--gold2)}.btn{border:0;cursor:pointer;min-height:50px;padding:13px 24px;border-radius:999px;font:700 1rem inherit;transition:.2s ease}.btn:focus-visible,.map-point:focus-visible,input:focus-visible{outline:3px solid #ffe3a1;outline-offset:4px}.btn-glow{color:#fff3cf;background:linear-gradient(#6e4a15,#2e1d09);border:1px solid #d7a347;box-shadow:0 0 0 1px rgba(255,213,119,.15) inset,0 0 24px rgba(216,164,69,.27),0 8px 20px rgba(0,0,0,.4)}.btn-glow:hover{transform:translateY(-2px);box-shadow:0 0 30px rgba(239,186,79,.38),0 10px 22px rgba(0,0,0,.45)}.btn-ghost{color:#e4c994;background:rgba(0,0,0,.28);border:1px solid rgba(220,174,85,.32)}.opening-stage{display:grid;place-items:center;background:radial-gradient(circle at 50% 42%,rgba(191,128,39,.14),transparent 36%),linear-gradient(135deg,#070605,#140e08)}.opening-copy{position:relative;z-index:5;text-align:center;max-width:860px;padding:28px}.opening-copy h1{font-family:'DM Serif Display',serif;font-size:clamp(3rem,7vw,6.8rem);line-height:.94;margin:18px 0;color:#f1dfb9;text-shadow:0 6px 26px #000}.opening-copy h1 em{font-style:normal;color:#ffe19a}.suspense-line{font-size:clamp(1rem,2vw,1.35rem);margin:18px auto 6px;color:#d7c49c}.whisper{opacity:.7;font-family:'DM Serif Display',serif;font-size:1.2rem;margin-bottom:25px}.magic-book{position:absolute;inset:2%;z-index:2;perspective:1800px;pointer-events:none}.book-half{position:absolute;top:0;bottom:0;width:50%;background-image:linear-gradient(rgba(30,16,6,.26),rgba(12,7,2,.46)),url('/images/cinematic/cover.png');background-size:200% 100%;background-repeat:no-repeat;border:1px solid rgba(225,170,74,.36);transition:transform 3.6s cubic-bezier(.16,.82,.26,1),opacity 2.8s ease}.book-left{left:0;background-position:left center;transform-origin:left center}.book-right{right:0;background-position:right center;transform-origin:right center}.book-seal{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:110px;height:110px;border-radius:50%;display:grid;place-items:center;font-size:2.7rem;color:#ffd56e;border:1px solid #c9953b;background:#171008;box-shadow:0 0 36px rgba(230,172,68,.35);transition:1.1s ease}.opening-stage.preparing .book-seal{animation:sealAwake 1.1s ease-in-out infinite alternate;box-shadow:0 0 58px rgba(255,202,94,.7)}.opening-stage.opening .opening-copy{opacity:0;transform:scale(.985);transition:opacity 1.35s ease .25s,transform 1.35s ease .25s}.opening-stage.opening .book-left{transform:translateX(-78%) rotateY(-72deg);opacity:.18}.opening-stage.opening .book-right{transform:translateX(78%) rotateY(72deg);opacity:.18}.opening-stage.opening .book-seal{transform:translate(-50%,-50%) scale(.08) rotate(45deg);opacity:0}.parchment-stage{display:grid;place-items:center;background:#0d0a06}.stage-art{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.62;filter:saturate(.9) contrast(1.1)}.art-name{background-image:linear-gradient(90deg,rgba(0,0,0,.28),rgba(0,0,0,.65)),url('/images/cinematic/name.png')}.story-panel{position:relative;z-index:4;width:min(720px,92%);padding:clamp(30px,5vw,68px);text-align:center}.parchment-panel{background:linear-gradient(135deg,rgba(224,184,116,.96),rgba(172,121,61,.96));color:#29180a;border:1px solid rgba(255,228,160,.55);clip-path:polygon(2% 0,98% 1%,100% 5%,99% 97%,95% 100%,4% 99%,0 95%,1% 4%);box-shadow:0 25px 60px rgba(0,0,0,.55)}.story-panel h2{font-family:'DM Serif Display',serif;font-size:clamp(2rem,4.5vw,3.8rem);line-height:1.02;margin:.25em 0}.big-question{font-family:'DM Serif Display',serif;font-size:2rem}.name-form{display:grid;gap:16px;margin-top:20px}.name-form input{width:100%;font:700 clamp(1.2rem,3vw,1.8rem) inherit;text-align:center;padding:15px 18px;border-radius:12px;border:1px solid rgba(67,39,12,.55);background:rgba(255,238,194,.55);color:#2c1c0e}.form-error{font-weight:700;color:#672d18}.scan-stage,.recognition-stage,.galletita-stage,.ready-stage,.transfer-stage{display:grid;grid-template-columns:1.08fr .92fr;align-items:stretch;background:radial-gradient(circle at 32% 45%,rgba(151,93,25,.23),transparent 28%),#080705}.scan-visual,.portrait-reveal,.galletita-hero,.duo-art,.portal-wrap{position:relative;overflow:hidden;min-height:calc(100vh - 24px)}.scan-visual img,.duo-art img,.portal-wrap img{width:100%;height:100%;object-fit:cover;filter:brightness(.78) saturate(.92)}.scanner-beam{position:absolute;left:19%;right:10%;height:3px;top:18%;background:linear-gradient(90deg,transparent,#9bf7ff,#fff,#9bf7ff,transparent);box-shadow:0 0 25px #6cefff;animation:scanMove 2.8s ease-in-out infinite}.dark-panel{align-self:center;text-align:left;color:#e9d4a4}.dark-panel h2{color:#ffe2a1}.scan-main{font-family:'DM Serif Display',serif;font-size:1.8rem}.scan-progress,.transfer-progress{height:12px;border-radius:999px;border:1px solid rgba(232,182,88,.7);background:#130f0a;overflow:hidden;margin:22px 0 12px}.scan-progress span,.transfer-progress span{display:block;width:0;height:100%;background:linear-gradient(90deg,#8a5a13,#ffd468);box-shadow:0 0 15px #ffc95f;transition:width .6s ease}.scan-status{min-height:30px;font-weight:700;color:#f5d68c}.dot-loader{display:flex;gap:9px;margin-top:15px}.dot-loader i{width:10px;height:10px;border-radius:50%;background:#d4a650;animation:pulse 1.2s infinite}.dot-loader i:nth-child(2){animation-delay:.15s}.dot-loader i:nth-child(3){animation-delay:.3s}.dot-loader i:nth-child(4){animation-delay:.45s}.dot-loader i:nth-child(5){animation-delay:.6s}.portrait-reveal{display:grid;place-items:end center;background:radial-gradient(circle at 50% 58%,rgba(227,155,45,.35),transparent 35%),#090704}.portrait-reveal img{width:100%;height:100%;object-fit:cover;object-position:center;filter:brightness(.72) saturate(.9);animation:portraitIn 1.5s ease both}.portrait-sparks{position:absolute;inset:0;background-image:radial-gradient(circle,#ffd56b 0 2px,transparent 3px);background-size:70px 70px;animation:drift 5s linear infinite}.magic-declaration{font-family:'DM Serif Display',serif;font-size:clamp(1.7rem,3vw,2.8rem);line-height:1.18;margin:24px 0;color:#fff1cb}.magic-declaration span{color:#ffd56e}.soft-copy{opacity:.8}.galletita-hero{background:linear-gradient(rgba(5,4,2,.1),rgba(5,4,2,.7));display:grid;place-items:center;padding:35px}.galletita-hero img{max-width:92%;max-height:620px;object-fit:contain;filter:drop-shadow(0 20px 35px #000)}.powers-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:22px 0}.power{display:flex;gap:12px;padding:12px;border:1px solid rgba(218,171,80,.22);background:rgba(255,228,159,.05);border-radius:14px}.power>span{font-size:1.8rem}.power strong,.power small{display:block}.power small{opacity:.72;margin-top:3px}.carrot-secret{padding:12px;border-radius:14px;border:1px solid rgba(220,174,85,.35);margin-bottom:20px}.duo-art img{object-position:center}.galletita-quote{font-family:'DM Serif Display',serif;font-size:1.25rem;color:#f5d995}.portal-wrap{display:grid;place-items:center}.portal-wrap img{position:absolute;inset:0}.portal-ring{position:absolute;width:340px;aspect-ratio:1;border:2px solid #f0b43a;border-radius:50%;box-shadow:0 0 30px #ffb72d,inset 0 0 24px #ffb72d;animation:spin 7s linear infinite}.ring-two{width:255px;border-style:dashed;animation-direction:reverse;animation-duration:5s}.portal-core{position:relative;z-index:3;font-size:4rem;color:#ffe19b;text-shadow:0 0 24px #ffc441;animation:pulseCore 1.5s ease-in-out infinite}.transfer-copy{position:relative;z-index:4;align-self:center;padding:45px}.transfer-copy h2{font-family:'DM Serif Display',serif;font-size:clamp(2rem,4vw,3.6rem);color:#ffe4a8}.map-screen{padding:28px;background:radial-gradient(circle at 50% 10%,rgba(117,77,26,.19),transparent 30%),linear-gradient(#090806,#100b07);color:#f1dca9}.map-toolbar{width:min(1180px,95vw);margin:0 auto 18px;display:flex;align-items:end;justify-content:space-between;gap:18px}.map-toolbar h2{font-family:'DM Serif Display',serif;font-size:clamp(2.2rem,5vw,4.8rem);margin:.15em 0}.progress-pill{padding:12px 18px;border:1px solid rgba(217,168,74,.4);border-radius:999px;background:#151009}.book-map{width:min(1180px,95vw);height:min(720px,72vw);min-height:560px;max-height:760px;margin:auto;position:relative;overflow:hidden;perspective:1200px;filter:drop-shadow(0 30px 35px rgba(0,0,0,.5))}.page{position:absolute;top:2%;bottom:2%;width:50%;background:radial-gradient(circle at center,rgba(255,242,196,.2),transparent 45%),linear-gradient(120deg,#c79a59,#a8763e 62%,#8f5e31);border:1px solid rgba(255,225,155,.35);box-shadow:inset 0 0 80px rgba(71,36,10,.45)}.page:before{content:"";position:absolute;inset:0;opacity:.18;background-image:repeating-radial-gradient(circle at center,transparent 0 11px,#5d3519 12px,#5d3519 13px,transparent 14px)}.page-left{left:0;border-radius:30px 2px 2px 30px;transform:rotateY(3deg);transform-origin:right}.page-right{right:0;border-radius:2px 30px 30px 2px;transform:rotateY(-3deg);transform-origin:left}.book-spine{position:absolute;left:49.5%;top:2%;bottom:2%;width:1%;background:linear-gradient(90deg,#5b3419,#d7b06b,#4b2a16);z-index:2;box-shadow:0 0 25px rgba(0,0,0,.55)}.route-lines{position:absolute;inset:8% 6%;z-index:3;width:88%;height:84%;overflow:visible}.route-lines path{fill:none;stroke:#5e3c1f;stroke-width:4;stroke-dasharray:10 14;opacity:.65}.map-point{position:absolute;z-index:6;border:0;background:transparent;color:#301d0c;text-align:center;font-family:inherit;min-width:115px;max-width:165px}.map-point .point-dot{width:48px;height:48px;margin:auto auto 6px;border-radius:50%;display:grid;place-items:center;background:#2a1a0d;color:#f4d27d;border:1px solid #d7a94a;font:700 1.3rem inherit;box-shadow:0 7px 16px rgba(0,0,0,.25)}.map-point strong,.map-point small{display:block}.map-point strong{font-family:'DM Serif Display',serif;font-size:1.15rem;line-height:1}.map-point small{margin-top:5px;opacity:.65}.map-point.current .point-dot{background:#27472c;box-shadow:0 0 0 5px rgba(239,209,115,.16),0 0 24px rgba(255,223,129,.48);animation:pulseCore 1.8s ease-in-out infinite}.hidden-place{filter:sepia(1);opacity:.7}.point-home{left:7%;top:66%}.point-forest{left:27%;top:40%}.point-mountain{left:42%;top:12%}.point-clock{left:63%;top:23%}.point-bridge{left:53%;top:56%}.point-lake{left:42%;top:76%}.point-islands{left:76%;top:45%}.point-garden{left:70%;top:76%}.fog{position:absolute;z-index:5;border-radius:50%;filter:blur(20px);background:rgba(225,214,188,.45);animation:fogMove 8s ease-in-out infinite alternate}.fog-one{width:38%;height:28%;top:7%;left:38%}.fog-two{width:33%;height:26%;top:51%;left:39%;animation-delay:-2s}.fog-three{width:31%;height:34%;top:33%;right:4%;animation-delay:-4s}.map-message{position:absolute;left:50%;bottom:5%;transform:translateX(-50%);z-index:7;color:#3a2410;background:rgba(235,206,145,.74);padding:10px 18px;border-radius:12px;font-family:'DM Serif Display',serif;text-align:center;max-width:520px}.map-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:20px}.story-screen{background:#070805;color:#ead7a7;padding:0 0 45px}.story-header{position:sticky;top:0;z-index:20;background:rgba(8,8,5,.93);backdrop-filter:blur(12px);border-bottom:1px solid rgba(211,166,75,.2);display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;padding:16px 5vw}.story-header h2{font-family:'DM Serif Display',serif;margin:0;color:#f6dfaa}.icon-btn{width:46px;height:46px;border-radius:50%;border:1px solid rgba(220,174,85,.35);background:#161008;color:#f3d898;font-size:1.35rem;cursor:pointer}.chapter-progress{font-weight:800;color:#d3ae67}.storybook{width:min(1180px,94vw);margin:38px auto;display:grid;grid-template-columns:.9fr 1.1fr;border:1px solid rgba(211,166,75,.28);background:#100c08;box-shadow:var(--shadow)}.scene-art{min-height:720px;position:relative;overflow:hidden;background:#15251b}.scene-art img{width:100%;height:100%;object-fit:cover;filter:brightness(.72) saturate(.9);transform:scale(1.04)}.scene-art:after{content:"";position:absolute;inset:0;background:linear-gradient(to right,transparent 45%,#100c08 100%),linear-gradient(to top,rgba(0,0,0,.35),transparent 45%)}.story-page{padding:clamp(28px,5vw,62px);background:linear-gradient(135deg,rgba(72,45,19,.18),transparent),#120e09}.story-text{font-family:'DM Serif Display',serif;font-size:clamp(1.15rem,2vw,1.45rem);line-height:1.72;color:#ecd8aa}.story-text p{margin:0 0 1.15em}.dialogue{font-family:'Atkinson Hyperlegible',sans-serif;border-left:3px solid #c9973d;background:rgba(255,222,151,.06);padding:14px 16px;margin:18px 0;border-radius:0 12px 12px 0}.choice-area{margin-top:24px}.choice-title{font:700 1.1rem 'Atkinson Hyperlegible',sans-serif;margin-bottom:12px;color:#ffe1a0}.choice-grid{display:grid;gap:10px}.choice-btn{padding:14px 16px;border-radius:13px;border:1px solid rgba(216,170,79,.3);background:#1b140c;color:#f0d9a5;text-align:left;cursor:pointer;font:700 1rem inherit}.choice-btn:hover{border-color:#e2b352;background:#24190c}.choice-btn:disabled{opacity:.55}.feedback{margin-top:12px;padding:15px;border-radius:12px;background:#1a2c20;border:1px solid rgba(150,185,131,.28);color:#dfeacd}.story-nav{margin-top:25px}.reward-screen{display:grid;place-items:center;padding:28px;background:radial-gradient(circle at 50% 30%,rgba(74,125,70,.3),transparent 32%),#07100b}.reward-card{width:min(720px,92vw);text-align:center;padding:55px;border:1px solid rgba(222,179,91,.4);background:linear-gradient(145deg,#182319,#0d100b);box-shadow:var(--shadow)}.reward-symbol{font-size:5rem;filter:drop-shadow(0 0 18px #c6e495)}.reward-card h2{font-family:'DM Serif Display',serif;font-size:clamp(2.3rem,5vw,4.4rem);color:#f5dfaa}.english-line{display:grid;gap:4px;margin:25px auto;padding:17px;border:1px solid rgba(219,173,81,.35);border-radius:14px;max-width:480px}.english-line strong{font-size:1.35rem;color:#ffe193}.galletita-line{color:#d3c499}.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.fade-in{animation:fadeIn .65s ease both}
@keyframes sealAwake{from{transform:translate(-50%,-50%) scale(1);filter:brightness(.95)}to{transform:translate(-50%,-50%) scale(1.08);filter:brightness(1.25)}}
@keyframes scanMove{0%,100%{top:17%}50%{top:78%}}@keyframes pulse{0%,100%{opacity:.25;transform:scale(.8)}50%{opacity:1;transform:scale(1)}}@keyframes portraitIn{from{opacity:0;filter:blur(8px) brightness(.4);transform:scale(.96)}to{opacity:1;filter:blur(0) brightness(.72);transform:scale(1)}}@keyframes drift{from{transform:translateY(0)}to{transform:translateY(-70px)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulseCore{0%,100%{transform:scale(.96);filter:brightness(.9)}50%{transform:scale(1.08);filter:brightness(1.2)}}@keyframes fogMove{from{transform:translate(-2%,0) scale(1)}to{transform:translate(5%,-4%) scale(1.08)}}@keyframes fadeIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(max-width:850px){.cinematic-frame{width:calc(100vw - 16px);min-height:calc(100vh - 16px)}.scan-stage,.recognition-stage,.galletita-stage,.ready-stage,.transfer-stage{grid-template-columns:1fr}.scan-visual,.portrait-reveal,.galletita-hero,.duo-art,.portal-wrap{min-height:390px;max-height:48vh}.dark-panel{padding:28px;width:100%}.powers-grid{grid-template-columns:1fr}.book-map{height:760px;min-height:760px}.map-point{min-width:95px;max-width:125px}.point-home{left:4%;top:67%}.point-forest{left:22%;top:40%}.point-mountain{left:38%;top:12%}.point-clock{left:62%;top:24%}.point-bridge{left:52%;top:54%}.point-lake{left:37%;top:78%}.point-islands{left:74%;top:45%}.point-garden{left:68%;top:78%}.storybook{grid-template-columns:1fr}.scene-art{min-height:390px}.opening-copy h1{font-size:clamp(2.7rem,11vw,5rem)}}
@media(max-width:560px){.cinematic-screen{padding:10px}.cinematic-frame{width:100%;min-height:720px}.opening-copy{padding:18px}.magic-book{inset:3%}.story-panel{width:94%;padding:24px}.map-screen{padding:18px 8px}.map-toolbar{align-items:start;flex-direction:column}.book-map{width:100%;height:820px;min-height:820px}.map-point strong{font-size:.95rem}.map-point{min-width:80px;max-width:105px}.map-point .point-dot{width:42px;height:42px}.point-home{left:2%;top:72%}.point-forest{left:17%;top:43%}.point-mountain{left:34%;top:13%}.point-clock{left:61%;top:26%}.point-bridge{left:50%;top:58%}.point-lake{left:30%;top:82%}.point-islands{left:73%;top:47%}.point-garden{left:65%;top:82%}.map-message{font-size:.85rem;width:86%;bottom:4%}.storybook{width:96vw;margin:18px auto}.story-page{padding:24px}.story-header{padding:12px}.story-header h2{font-size:1.25rem}.chapter-progress{font-size:.85rem}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* v5 - arte definitivo Eimy + Galletita */
.opening-stage{background-image:linear-gradient(rgba(5,3,1,.22),rgba(5,3,1,.38)),url('/images/cinematic/islas-secretas.png')!important;background-size:cover!important;background-position:center!important}
.magic-book{opacity:.12}
.book-map{background-image:linear-gradient(rgba(35,20,7,.10),rgba(35,20,7,.16)),url('/images/cinematic/islas-secretas.png')!important;background-size:cover!important;background-position:center!important}
.book-map .page{background:transparent!important}.book-map .book-spine{opacity:.35}
.scan-visual img,.portal-wrap img,.galletita-hero img,.duo-art img{filter:none!important}
.portal-wrap .portal-ring,.portal-wrap .portal-core{display:none!important}
.scene-art img{filter:brightness(.88) saturate(1.02)!important;transform:none!important;object-position:center center}
.secret-carrot{position:absolute;z-index:6;border:0;background:transparent;font-size:clamp(1.6rem,3vw,2.5rem);cursor:pointer;filter:drop-shadow(0 0 8px rgba(255,200,70,.8));animation:carrotFloat 2.2s ease-in-out infinite;transition:.25s transform,.25s opacity}
.secret-carrot:hover{transform:scale(1.25) rotate(-8deg)}.secret-carrot.found{transform:scale(1.8) rotate(15deg);opacity:0}
.carrot-toast{position:fixed;z-index:1000;right:22px;bottom:22px;max-width:min(390px,calc(100vw - 44px));padding:16px 20px;border:1px solid rgba(222,179,91,.55);border-radius:16px;background:rgba(25,17,9,.96);color:#f7dfa6;box-shadow:0 18px 55px rgba(0,0,0,.45);font-family:'Atkinson Hyperlegible',sans-serif;font-size:1rem}
@keyframes carrotFloat{50%{transform:translateY(-7px) rotate(4deg)}}

.magic-book{opacity:1!important}.book-half{background-image:linear-gradient(rgba(18,9,2,.12),rgba(8,4,1,.25)),url('/images/cinematic/islas-secretas.png')!important}.opening-stage{background:#090603!important}


/* v6 - inmersion, nombre y transicion al Bosque de los Ecos */
.art-name{background-image:linear-gradient(90deg,rgba(0,0,0,.16),rgba(0,0,0,.50)),url('/images/cinematic/name-telescope.png')!important;background-position:center!important;opacity:.82!important}
.name-stage .parchment-panel{background:linear-gradient(135deg,rgba(224,184,116,.91),rgba(172,121,61,.91));backdrop-filter:blur(2px)}

/* El cuento deja de sentirse encerrado en una tarjeta. */
.storybook{width:min(1500px,100vw)!important;margin:0 auto!important;grid-template-columns:minmax(420px,1fr) minmax(480px,.95fr)!important;border:0!important;background:transparent!important;box-shadow:none!important;overflow:hidden}
.scene-art{min-height:calc(100vh - 80px)!important;background:#090a07!important}
.scene-art img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center center!important;filter:brightness(.9) saturate(1.04)!important}
.scene-art:after{background:linear-gradient(to right,transparent 54%,rgba(18,14,9,.18) 70%,#120e09 100%),linear-gradient(to top,rgba(0,0,0,.18),transparent 38%)!important}
.story-page{position:relative;z-index:2;margin-left:-1px;padding:clamp(30px,4vw,64px)!important;background:linear-gradient(to right,#120e09 0%,rgba(18,14,9,.98) 72%,rgba(18,14,9,.96) 100%)!important}
.story-screen{overflow-x:hidden}

/* Humo mágico entre el mapa y el bosque. */
.forest-transition{position:fixed;inset:0;z-index:9999;pointer-events:none;visibility:hidden;opacity:0;overflow:hidden;background:#07100b;transition:opacity .25s ease}
.forest-transition.active{visibility:visible;opacity:1}
.forest-transition-art{position:absolute;inset:0;background-image:linear-gradient(rgba(4,8,5,.12),rgba(4,8,5,.34)),url('/images/cinematic/portal-entry.png');background-size:cover;background-position:center;transform:scale(1.06);filter:brightness(.8) saturate(.95);animation:forestZoom 2.4s ease forwards}
.forest-transition:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,rgba(255,211,105,.22),transparent 24%),radial-gradient(circle at center,transparent 20%,rgba(4,8,5,.72) 92%)}
.smoke{position:absolute;z-index:3;width:75vw;height:75vw;max-width:1050px;max-height:1050px;border-radius:50%;background:radial-gradient(circle,rgba(222,229,209,.86) 0%,rgba(179,194,169,.54) 28%,rgba(101,122,100,.25) 53%,transparent 72%);filter:blur(34px);mix-blend-mode:screen;opacity:0}
.smoke-a{left:-20vw;bottom:-34vw;animation:smokeIn 1.55s ease-out .05s forwards}.smoke-b{right:-24vw;top:-30vw;animation:smokeIn 1.7s ease-out .15s forwards}.smoke-c{left:23vw;top:20vh;animation:smokeCenter 1.5s ease-out .25s forwards}.transition-spark{position:absolute;z-index:5;left:50%;top:50%;transform:translate(-50%,-50%);font-size:4rem;color:#ffe19b;text-shadow:0 0 25px #ffc441,0 0 60px #ffc441;animation:transitionSpark 1.6s ease both}
.forest-transition.reveal{animation:transitionReveal 1.25s ease forwards}
body.transitioning{overflow:hidden}
@keyframes smokeIn{0%{opacity:0;transform:scale(.35) translateY(18%)}55%{opacity:.95}100%{opacity:.76;transform:scale(1.5) translateY(-8%)}}
@keyframes smokeCenter{0%{opacity:0;transform:scale(.25)}60%{opacity:.9}100%{opacity:.65;transform:scale(1.75)}}
@keyframes transitionSpark{0%{opacity:0;transform:translate(-50%,-50%) scale(.2) rotate(0)}45%{opacity:1}100%{opacity:.15;transform:translate(-50%,-50%) scale(2.2) rotate(70deg)}}
@keyframes forestZoom{from{transform:scale(1.12)}to{transform:scale(1)}}
@keyframes transitionReveal{0%{opacity:1}100%{opacity:0}}

@media(max-width:850px){
 .storybook{grid-template-columns:1fr!important;width:100%!important}
 .scene-art{min-height:58vh!important;max-height:none!important}
 .scene-art:after{background:linear-gradient(to bottom,transparent 58%,#120e09 100%)!important}
 .story-page{margin-top:-2px!important;padding:28px 22px 48px!important}
 .art-name{background-position:center!important}
}


/* v7 - lectura inmersiva: imagen completa, bordes difuminados y navegación siempre accesible */
html,body{min-height:100%;overflow-y:auto}
.story-screen{width:100%;min-height:100vh;overflow:visible!important;background:radial-gradient(circle at 48% 18%,rgba(70,49,24,.12),transparent 35%),#070805!important}
.storybook{
  width:100vw!important;
  max-width:none!important;
  margin:0!important;
  display:grid!important;
  grid-template-columns:minmax(0,56vw) minmax(420px,44vw)!important;
  align-items:start!important;
  overflow:visible!important;
  background:transparent!important;
}
.scene-art{
  position:sticky!important;
  top:79px!important;
  height:calc(100vh - 79px)!important;
  min-height:520px!important;
  overflow:hidden!important;
  isolation:isolate;
  background:#090a07!important;
}
.scene-art::before{
  content:"";
  position:absolute;
  inset:-7%;
  z-index:-2;
  background-image:var(--scene-image);
  background-size:cover;
  background-position:center;
  filter:blur(26px) brightness(.47) saturate(.82);
  transform:scale(1.08);
  opacity:.9;
}
.scene-art img{
  position:relative;
  z-index:1;
  display:block;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  filter:brightness(.94) saturate(1.04)!important;
  transform:none!important;
}
.scene-art:after{
  content:"";
  position:absolute;
  z-index:3;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(to right,#070805 0%,transparent 7%,transparent 78%,rgba(18,14,9,.28) 88%,#120e09 100%),
    linear-gradient(to bottom,#070805 0%,transparent 4%,transparent 95%,#070805 100%)!important;
}
.story-page{
  min-height:calc(100vh - 79px)!important;
  overflow:visible!important;
  margin:0!important;
  padding:clamp(34px,4vw,70px) clamp(34px,4.2vw,76px) 120px!important;
  background:
    linear-gradient(to right,#120e09 0%,rgba(18,14,9,.985) 74%,rgba(18,14,9,.94) 100%)!important;
  box-shadow:-34px 0 70px rgba(18,14,9,.72);
}
.story-nav{
  position:sticky;
  bottom:0;
  z-index:15;
  margin:28px -8px -72px!important;
  padding:18px 8px 24px;
  background:linear-gradient(to top,#120e09 56%,rgba(18,14,9,.92) 74%,transparent 100%);
  pointer-events:none;
}
.story-nav .btn{pointer-events:auto;box-shadow:0 10px 32px rgba(0,0,0,.48),0 0 24px rgba(216,164,69,.18)}
.choice-area{scroll-margin-bottom:120px}

@media(max-width:1000px){
 .storybook{grid-template-columns:minmax(0,52vw) minmax(400px,48vw)!important}
 .story-page{padding-left:30px!important;padding-right:30px!important}
}
@media(max-width:850px){
 .storybook{display:block!important;width:100%!important}
 .scene-art{position:relative!important;top:auto!important;width:100%!important;height:min(68vh,720px)!important;min-height:420px!important}
 .scene-art::before{filter:blur(22px) brightness(.48) saturate(.82)}
 .scene-art:after{background:linear-gradient(to bottom,#070805 0%,transparent 5%,transparent 78%,#120e09 100%)!important}
 .story-page{min-height:auto!important;margin-top:-1px!important;padding:28px 22px 110px!important;box-shadow:0 -30px 70px rgba(18,14,9,.72)}
 .story-nav{margin:24px -4px -66px!important;padding-bottom:20px}
}
@media(max-width:560px){
 .scene-art{height:56vh!important;min-height:340px!important}
 .story-page{padding:24px 18px 105px!important}
 .story-text{font-size:1.08rem!important;line-height:1.62!important}
 .story-nav .btn{width:100%}
}