@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600&family=Playfair+Display:ital,wght@1,500;1,600&display=swap');
*{box-sizing:border-box}html,body{margin:0;background:#120b16;color:#fff;font-family:'DM Sans',Arial,sans-serif;overflow-x:hidden}button{font:inherit}.screen{display:none;min-height:100vh;position:relative;overflow:hidden}.screen.active{display:block}.intro-card{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;background:radial-gradient(circle at 50% 40%,#3b1830 0,#180c18 42%,#0d0910 75%)}.tiny{letter-spacing:.35em;font-size:11px;color:#dba5b8;margin-bottom:26px}.intro-card h1{font-size:clamp(48px,8vw,92px);line-height:.93;margin:0;font-weight:400}.intro-card h1 em,.game-copy em,.final em{font-family:'Playfair Display',serif;color:#f2a6bd;font-weight:500}.intro-card p{color:#c9b9c4;line-height:1.7;margin:28px 0}.intro-card button,.final-content button,.memory-text button{border:0;border-radius:999px;background:#f3b2c5;color:#24101a;padding:14px 24px;cursor:pointer;font-weight:600}.intro-card small{position:absolute;bottom:24px;color:#705d69}
#game{background:#0e0816}#game header,.gallery header{height:62px;display:flex;align-items:center;justify-content:space-between;padding:0 3vw;border-bottom:1px solid #ffffff1c;position:relative;z-index:10;background:#100918e8}#game header span{color:#ad91a1}.game-copy{position:absolute;z-index:9;top:78px;left:0;right:0;text-align:center;pointer-events:none;text-shadow:0 3px 20px #100918}.game-copy>span{font-size:10px;letter-spacing:.32em;color:#f0abc0}.game-copy h2{font-size:clamp(30px,4.4vw,60px);line-height:1;margin:8px 0}.game-copy p{color:#e1cfda;font-size:12px;margin:8px}.game-copy em{display:inline-block}
#world{height:calc(100vh - 62px);min-height:560px;position:relative;overflow:hidden;background:#130b20;isolation:isolate}#scene{position:absolute;inset:-4%;background-image:url('assets/game/camino-pixelart.png');background-size:cover;background-position:center center;image-rendering:pixelated;transform:none;transition:none;z-index:0}.scene-shade{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,#06112b22 0%,transparent 58%,#06112b55 100%);pointer-events:none}
#trail{position:absolute;inset:0;z-index:4;pointer-events:none}.heart{display:none;position:absolute;left:50%;font-size:28px;color:#ff789f;text-shadow:0 0 0 #fff,0 0 12px #ff8daf,2px 0 #fff,-2px 0 #fff,0 2px #fff,0 -2px #fff;transform:translate(-50%,-50%);animation:pulse .7s steps(2,end) infinite alternate;transition:top .12s linear,left .12s linear,transform .12s linear,opacity .2s}.heart.got{opacity:0;transform:translate(-50%,-50%) scale(2)}@keyframes pulse{to{filter:brightness(1.25)}}
#player{position:absolute;left:9%;bottom:11%;width:76px;height:82px;transform:translate(-50%,50%) scale(.78);z-index:6;filter:drop-shadow(0 9px 7px #0009);image-rendering:pixelated;transition:bottom .12s linear,transform .12s linear}.girl,.boy{position:absolute;bottom:0;width:38px;height:94px}.girl{left:3px}.boy{right:3px}.head{position:absolute;top:14px;left:9px;width:21px;height:22px;background:#bd806b;border:4px solid #21131e}.hair{position:absolute;z-index:2}.girl .hair{top:7px;left:3px;width:32px;height:42px;background:#21131e;border-radius:45% 45% 30% 30%;box-shadow:-5px 12px #21131e,5px 14px #21131e}.boy .hair{top:8px;left:8px;width:25px;height:14px;background:#171219;box-shadow:4px -4px #171219}.body{position:absolute;top:39px;left:6px;width:28px;height:34px;border:4px solid #21131e}.girl .body{background:#d77e9f}.boy .body{background:#242536}.leg{position:absolute;top:69px;width:11px;height:25px;background:#50647e;border:4px solid #21131e}.boy .leg{background:#20212b}.leg.a{left:5px}.leg.b{right:2px}.hands{position:absolute;left:38px;top:50px;width:17px;height:8px;background:#bd806b;border:3px solid #21131e}.walking .girl .leg.a,.walking .boy .leg.b{transform:translateY(-5px)}.walking .girl .leg.b,.walking .boy .leg.a{transform:translateY(3px)}.walking{animation:bob .24s steps(2,end) infinite}@keyframes bob{to{margin-bottom:3px}}
.hint{position:absolute;z-index:7;left:50%;bottom:2%;transform:translateX(-50%);font-size:22px;color:#fff9;animation:hint 1s infinite}@keyframes hint{50%{transform:translate(-50%,-7px);opacity:.45}}.mobile-controls{position:absolute;z-index:12;bottom:20px;left:50%;transform:translateX(-50%)}.mobile-controls button{border:1px solid #ffffff55;border-radius:999px;background:#160e20d9;color:#fff;padding:12px 22px;backdrop-filter:blur(10px);font-weight:600}.mobile-controls button span{margin-left:7px}
.overlay{display:none;position:fixed;inset:0;z-index:30;background:#0d0810e8;align-items:center;justify-content:center;padding:20px}.overlay.show{display:flex}.memory-card{width:min(850px,96vw);max-height:90vh;background:#f5eee9;color:#24171f;border-radius:24px;display:grid;grid-template-columns:1.05fr .95fr;overflow:hidden;position:relative}.photo-wrap{min-height:520px}.photo-wrap img{width:100%;height:100%;object-fit:cover}.memory-text{padding:55px 42px;display:flex;flex-direction:column;justify-content:center}.memory-text>span{color:#a85771;letter-spacing:.25em;font-size:11px}.memory-text h3{font-family:'Playfair Display';font-style:italic;font-size:38px;margin:14px 0}.memory-text p{line-height:1.7;color:#65545d}.memory-text button{align-self:flex-start;margin-top:16px}#closeMemory{position:absolute;right:15px;top:15px;width:38px;height:38px;border:0;border-radius:50%;background:#fff9;font-size:22px;z-index:2;cursor:pointer}
.final{background:#130b13}.final-bg{position:absolute;inset:0;background:url('assets/photos/foto-01.png') center/cover;opacity:.25}.final-bg:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#120b13 5%,#120b13dd 45%,#120b1366)}.final-content{position:relative;z-index:2;min-height:100vh;width:min(650px,90vw);display:flex;flex-direction:column;justify-content:center;margin-left:8vw}.final-content>span{letter-spacing:.4em;color:#efa9bf}.final h2{font-size:clamp(44px,6vw,78px);line-height:.98;margin:18px 0}.final p{color:#d2c1cb;line-height:1.8;max-width:560px}.signature{margin:18px 0 28px;font-family:'Playfair Display';font-size:22px;font-style:italic}.final-content button{align-self:flex-start}.gallery{background:#f2ece8;color:#25181f}.gallery header{border-color:#0001}.gallery header button{border:0;background:none;cursor:pointer}.gallery #grid{columns:4 250px;column-gap:12px;padding:12px}.gallery figure{margin:0 0 12px;break-inside:avoid;overflow:hidden;border-radius:12px}.gallery img{width:100%;display:block}.music-toggle{position:fixed;right:18px;bottom:18px;z-index:80;border:1px solid #ffffff38;background:#140b18b8;color:#fff;border-radius:999px;padding:11px 15px;cursor:pointer}.music-toggle.playing{background:#7e284bd1}
@media(max-width:700px){.game-copy{top:76px}.game-copy h2{font-size:35px}.game-copy p{font-size:11px}#world{min-height:620px}#scene{background-position:center 55%}.memory-card{grid-template-columns:1fr;overflow:auto}.photo-wrap{min-height:44vh}.memory-text{padding:30px 25px}.final-content{margin:0 auto;padding:30px}.gallery #grid{columns:2 150px}.music-toggle span{display:none}}

/* Pixel-art route: the background contains no narrative copy; UI stays separate. */
#world{background:#06112b}
#player{transform-origin:center bottom;transition:left .10s linear,bottom .10s linear,transform .10s linear}
#counter{font-variant-numeric:tabular-nums}
@media(max-width:700px){#scene{background-position:center center}.mobile-controls{bottom:14px}}