:root{font-family:Nunito,"Trebuchet MS",Arial,sans-serif;color:#123e58;background:#6ac6ef;font-synthesis:none}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px}.scene{position:relative;isolation:isolate;overflow:hidden;height:100svh;min-height:630px;background:#65c5ec}
.sky{position:absolute;inset:0 0 38%;background:linear-gradient(180deg,#57b9ec 0%,#82d8f2 60%,#b9ebee 100%);overflow:hidden}.sky:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,#fff5 58%,transparent);opacity:.25;pointer-events:none}
.sunshine{position:absolute;right:16%;top:9%;width:clamp(90px,9vw,170px);aspect-ratio:1;border-radius:50%;background:#ffdf85;box-shadow:0 0 0 16px #fff1ae3d,0 0 90px 24px #ffe9a672}
.cloud{position:absolute;width:240px;height:65px;opacity:.88;filter:drop-shadow(0 7px 0 #f2ffff30);animation:cloud-drift 66s linear infinite}.cloud i{position:absolute;bottom:0;background:#fff;border-radius:100px}.cloud i:nth-child(1){left:4%;width:45%;height:70%}.cloud i:nth-child(2){left:28%;width:42%;height:120%}.cloud i:nth-child(3){left:58%;width:42%;height:82%}.cloud--a{top:15%;left:8%;transform:scale(.75);animation-duration:80s}.cloud--b{top:30%;left:48%;transform:scale(1.05);animation-duration:103s;animation-delay:-37s}.cloud--c{top:10%;left:83%;transform:scale(.55);animation-duration:95s;animation-delay:-20s}.birds{position:absolute;width:42%;top:18%;left:34%;opacity:.95}
.ocean{position:absolute;top:39%;left:0;width:100%;height:32%;overflow:hidden;background:linear-gradient(#1486ba,#17b8cc 55%,#3ed2c8 85%,#6adbd0);box-shadow:0 -6px 13px #94eff533}.ocean__horizon{position:absolute;top:0;left:0;width:100%;height:4px;background:#d3f1ed;opacity:.8}.water{position:absolute;left:0;width:100%;overflow:hidden}.water__track{position:absolute;left:0;top:0;height:100%;width:3600px;display:flex;animation:slide-left var(--duration) linear infinite;will-change:transform}.wave-tile{height:100%;width:1800px;flex:none;background-repeat:repeat-x;background-size:1800px 100%}
.water--far{top:9%;height:31%;--duration:45s;opacity:.74}.water--far .wave-tile{background-image:url('./assets/wave-far.svg')}
.water--middle{top:24%;height:41%;--duration:26s;opacity:.92}.water--middle .wave-tile{background-image:url('./assets/wave-middle.svg')}
.water--bright{top:48%;height:40%;--duration:17s;opacity:.95}.water--bright .wave-tile{background-image:url('./assets/wave-bright.svg')}
.water--front{top:70%;height:36%;--duration:11s;opacity:1}.water--front .wave-tile{background-image:url('./assets/wave-front.svg')}
.sparkles{position:absolute;inset:0;pointer-events:none;opacity:.5;background-image:radial-gradient(ellipse 8px 2px at 19% 27%,#fff 45%,transparent 55%),radial-gradient(ellipse 13px 2px at 48% 48%,#fff 45%,transparent 55%),radial-gradient(ellipse 9px 2px at 72% 19%,#fff 45%,transparent 55%),radial-gradient(ellipse 15px 3px at 90% 65%,#fff 45%,transparent 55%);background-size:420px 115px;animation:twinkle 5s ease-in-out infinite alternate}
.shore{position:absolute;inset:68% 0 0;background:#f6d6a1}.foam{position:absolute;top:-37px;width:100%;height:67px;z-index:2;animation:foam-shift 7s ease-in-out infinite alternate}.sand{position:absolute;inset:0}.sand--upper{background:linear-gradient(180deg,#f6ddb0,#f7d4a0 55%,#f4cb91)}.sand--lower{top:52%;background:linear-gradient(180deg,#f4cb91,#eec087)}.sand-art{position:absolute;inset:0;width:100%;height:100%;z-index:2}
.masthead{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:clamp(16px,2.6vw,38px) clamp(22px,5vw,85px);z-index:5}.brand{display:flex;gap:12px;align-items:center;color:#0a4265;text-decoration:none;font-size:clamp(19px,2.2vw,34px);font-weight:1000;letter-spacing:-.07em;text-shadow:0 2px 1px #fff6}.brand em{font-style:normal;color:#028f9f}.brand__symbol{color:#ffab43;font-size:1.2em;letter-spacing:0}.edition{font-size:clamp(11px,1.05vw,15px);font-weight:800;letter-spacing:.08em;color:#19556ba8;background:#ffffffb9;border:1px solid #fff9;padding:10px 15px;border-radius:40px}
.welcome{position:absolute;left:clamp(24px,7vw,125px);top:clamp(114px,15vh,205px);width:min(590px,52vw);z-index:5;color:#064567}.eyebrow{display:flex;align-items:center;gap:10px;font-size:clamp(10px,1vw,13px);font-weight:900;letter-spacing:.22em;color:#176e87}.eyebrow__dot{width:10px;height:10px;border-radius:50%;background:#f9a24c;box-shadow:0 0 0 6px #fff5}.welcome h1{font-size:clamp(47px,6vw,100px);line-height:.98;letter-spacing:-.075em;margin:23px 0 23px;font-weight:1000;text-shadow:0 4px 1px #fff3}.welcome h1 span{color:#008e9f}.welcome p{max-width:420px;font-size:clamp(15px,1.34vw,20px);line-height:1.5;font-weight:700;color:#205972}.sea-legend{display:flex;align-items:center;gap:5px;margin-top:27px;flex-wrap:wrap}.sea-legend span{height:10px;width:24px;border-radius:20px;background:#086f9b}.sea-legend span:nth-child(2){background:#129eba}.sea-legend span:nth-child(3){background:#45c9d1}.sea-legend span:nth-child(4){background:#b7f1e5}.sea-legend small{font-size:12px;margin-left:10px;color:#246f80;font-weight:800}
.scene-note{position:absolute;bottom:3.4%;left:50%;transform:translateX(-50%);z-index:4;display:flex;align-items:center;gap:14px;white-space:nowrap;font-size:clamp(9px,.85vw,12px);font-weight:900;letter-spacing:.18em;color:#8b5c38}.scene-note__line{display:block;width:34px;height:1px;background:#bb9166}
@keyframes slide-left{from{transform:translateX(0)}to{transform:translateX(-1800px)}}@keyframes cloud-drift{from{margin-left:0}to{margin-left:-65vw}}@keyframes twinkle{from{opacity:.25;transform:translateX(0)}to{opacity:.68;transform:translateX(-22px)}}@keyframes foam-shift{from{transform:translateY(-1px) scaleY(.94)}to{transform:translateY(6px) scaleY(1.1)}}
@media(max-width:700px){.scene{min-height:620px}.sky{bottom:43%}.ocean{top:42%;height:30%}.shore{top:70%}.welcome{top:115px;width:min(90vw,460px)}.welcome h1{font-size:clamp(48px,10vw,72px)}.welcome p{max-width:300px;font-size:15px}.edition{display:none}.sunshine{right:9%;top:12%;width:85px}.cloud--b{left:65%}.birds{width:65%;left:26%}.foam{top:-33px}.sea-legend{margin-top:20px}.scene-note{bottom:3%}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}

/* V2: cada camada usa uma arte SVG que se repete sem cortes. O deslocamento
   ocorre no background de cada plano, independentemente da largura da tela. */
.water{background-repeat:repeat-x;background-size:1800px 100%;will-change:background-position;animation:wave-pan var(--duration) linear infinite}
.water--far{--duration:36s;background-image:url('./assets/wave-far.svg')}
.water--middle{--duration:23s;background-image:url('./assets/wave-middle.svg');animation-delay:-8s}
.water--bright{--duration:15s;background-image:url('./assets/wave-bright.svg');animation-delay:-4s}
.water--front{--duration:10s;background-image:url('./assets/wave-front.svg');animation-delay:-2s}
.cloud-band{position:absolute;left:0;width:100%;background-repeat:repeat-x;background-size:1800px 100%;will-change:background-position;animation:cloud-pan var(--cloud-duration) linear infinite}
.cloud-band--back{top:5%;height:45%;opacity:.55;--cloud-duration:155s;background-image:url('./assets/clouds-back.svg');animation-delay:-47s}
.cloud-band--front{top:12%;height:52%;opacity:.9;--cloud-duration:105s;background-image:url('./assets/clouds-front.svg');animation-delay:-23s}
@keyframes wave-pan{from{background-position-x:0}to{background-position-x:-1800px}}
@keyframes cloud-pan{from{background-position-x:0}to{background-position-x:-1800px}}
/* O título permanece no céu; o movimento do mar fica livre e visível. */
.welcome{top:clamp(108px,13vh,155px);left:clamp(25px,6vw,110px);width:min(540px,48vw)}
.welcome h1{font-size:clamp(40px,3.9vw,67px);line-height:1.02;margin:14px 0 11px}
.welcome p{font-size:clamp(13px,1.05vw,17px);line-height:1.4;margin:10px 0}
.sea-legend{margin-top:15px}
@media(max-width:700px){.welcome{top:115px;width:min(90vw,460px)}.welcome h1{font-size:clamp(42px,9vw,60px)}.welcome p{max-width:310px;font-size:14px}}

/* V3: a translação das imagens é atualizada em motion.js, não por CSS.
   Isso evita que configurações de animação do navegador congelem as ondas. */
.water,.cloud-band{animation:none!important}
.motion-status{position:absolute;z-index:12;right:clamp(15px,4vw,70px);bottom:clamp(24px,4vh,50px);display:flex;align-items:center;gap:9px;background:#fffdf2e8;color:#0a536d;border:1px solid #ffffff;border-radius:50px;padding:9px 10px 9px 14px;box-shadow:0 6px 24px #90734222;font-size:12px;font-weight:900;white-space:nowrap}
.motion-status__light{width:8px;height:8px;border-radius:50%;background:#25bfa1;box-shadow:0 0 0 4px #25bfa123}
.motion-status button{font:inherit;color:#fff;background:#0b9caa;border:0;border-radius:40px;padding:7px 12px;cursor:pointer}.motion-status button:hover,.motion-status button:focus-visible{background:#086f8a}
.motion-paused .motion-status__light{background:#efa24f;box-shadow:0 0 0 4px #efa24f33}
@media(max-width:700px){.motion-status{bottom:50px;right:12px;font-size:10px;padding:7px 8px 7px 10px}.motion-status button{padding:6px 9px}}

/* Praia Zen — jornada completa: arte, cartões e navegação. */
html,body{height:100%;overflow:hidden}body{user-select:none}button,a{ -webkit-tap-highlight-color:transparent }button{font-family:inherit}.scene{height:100dvh;min-height:520px;cursor:none;touch-action:pan-y}.scene button,.scene a,.scene img{cursor:none}.scene [hidden]{display:none!important}
.sky{bottom:43%}.ocean{top:41%;height:30%;z-index:1}.shore{top:68%;z-index:2}.sand-dots{position:absolute;inset:0;opacity:.36;background:radial-gradient(ellipse at 9% 43%,#be955e 0 1.8px,transparent 3px),radial-gradient(ellipse at 62% 20%,#d5a769 0 2px,transparent 3px),radial-gradient(ellipse at 83% 76%,#d5a769 0 1.8px,transparent 3px);background-size:178px 92px}
.water-decor{position:absolute;inset:0;z-index:4;pointer-events:none}.wave-vessel{position:absolute;left:0;object-fit:contain;width:auto;max-width:170px;filter:drop-shadow(0 6px 3px #064e6538);pointer-events:auto}.labomar-float{position:absolute;z-index:5;left:4%;bottom:17%;height:clamp(30px,5.3vh,58px);max-width:115px;object-fit:contain;opacity:.9;animation:float-lab 4.8s ease-in-out infinite;filter:drop-shadow(0 2px 2px #fff9);pointer-events:auto}
.world{position:absolute;top:0;left:0;height:100%;z-index:3;pointer-events:none;transition:transform 1.1s cubic-bezier(.21,.8,.24,1);will-change:transform}.world-piece{position:absolute;top:0;height:100%;pointer-events:none}.decor{position:absolute;pointer-events:auto}.decor img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 8px 3px #85501f2a);transition:transform .25s}.decor:hover img{transform:translateY(-5px) scale(1.05)}.decor--animal{bottom:12%;width:clamp(100px,12vw,178px);height:clamp(95px,16vh,166px)}.decor--trash{bottom:9.5%;width:clamp(75px,9vw,145px);height:clamp(54px,9vh,99px);transition:opacity .55s,transform .55s}.decor--trash.picked{opacity:0;transform:scale(.3) translateY(40px);pointer-events:none}.decor--iracema{right:13%;bottom:22%;width:clamp(260px,34vw,560px);height:clamp(280px,59vh,680px);z-index:1;filter:drop-shadow(0 14px 7px #244a453b)}
.decor--coco-cart{left:70%;bottom:13%;width:clamp(140px,17vw,240px);height:clamp(105px,17vh,180px)}
.masthead{z-index:12;top:0;left:0;right:0;padding:14px clamp(15px,3.3vw,54px);gap:15px;justify-content:space-between;pointer-events:none}.masthead>*{pointer-events:auto}.brand{border:2px solid white;padding:8px 19px;border-radius:80px;background:#fffdf1f0;box-shadow:0 8px 25px #086d9440;font-size:clamp(18px,2vw,29px);font-weight:1000;white-space:nowrap}.brand__symbol{font-size:1.1em}.edition{background:#fffef4ed;color:#195470;font-size:11px;box-shadow:0 4px 15px #1260831b}.slogan{display:flex;align-items:center;gap:8px;background:#fffffff5;border-radius:60px;padding:12px 20px;color:#175977;font-size:12px;font-weight:1000;box-shadow:0 7px 24px #0c779f20}.slogan::first-letter{color:#ff7366}
.chapter-panel{position:absolute;top:clamp(83px,13.5vh,125px);left:clamp(22px,7vw,130px);width:min(590px,50vw);max-height:min(64vh,690px);z-index:9;opacity:0;transform:translate3d(55px,0,0) scale(.97);transition:opacity .65s ease,transform .75s cubic-bezier(.2,.9,.2,1);pointer-events:none}.chapter-panel.is-visible{opacity:1;transform:translate3d(0,0,0);pointer-events:auto}.chapter-card{position:relative;background:linear-gradient(145deg,#fffbf0f7 0%,#fff5e4f6 70%,#fef1d3f3);border:3px solid #fffdf3;border-radius:37px 39px 43px 40px;padding:clamp(19px,2.2vw,35px);box-shadow:0 14px 45px #146b9055,0 4px 0 #fae2bf inset;color:#104568;max-height:min(64vh,690px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#45bdd1 transparent}.chapter-card:before,.chapter-card:after{content:'';position:absolute;top:18px;right:21px;width:5px;height:21px;border-radius:8px;background:#ffae47;transform:rotate(23deg)}.chapter-card:after{right:46px;top:10px;transform:rotate(-25deg);height:15px}.chapter-eyebrow{display:flex;gap:10px;align-items:center;color:#00899a;letter-spacing:.16em;font-size:clamp(9px,.9vw,12px);font-weight:1000;margin-bottom:13px}.eyebrow-dot{height:12px;width:12px;border-radius:50%;background:#ffb245;box-shadow:0 0 0 5px #ffdeaa}.chapter-card h1{font-family:"Trebuchet MS",Arial,sans-serif;font-size:clamp(31px,3.5vw,54px);line-height:.99;letter-spacing:-.055em;margin:0 30px 13px 0;font-weight:1000;color:#073e68;text-shadow:0 2px 0 #ffffffaa}.chapter-card h1 em{color:#059baa;font-style:normal}.chapter-card h2{font-size:clamp(16px,1.5vw,22px);line-height:1.25;margin:0 0 15px;font-weight:900;color:#067c93}.chapter-copy{font-size:clamp(12px,1.03vw,15px);line-height:1.52;color:#22526b;font-weight:700}.chapter-copy p{margin:11px 0}.chapter-copy strong{color:#006b83}.tip{background:#e5f7f2;padding:12px 15px;border-radius:17px;color:#166e83!important}.note{font-size:11px;color:#6f7c80}.chapter-foot{display:flex;justify-content:space-between;gap:15px;border-top:1px solid #e5dac5;margin-top:15px;padding-top:11px;color:#a08368;font-size:10px;font-weight:1000;letter-spacing:.09em}.fact-row{display:flex;gap:9px;margin:13px 0}.fact-row>div{flex:1;background:#f3ffffb8;border:1px solid #d5e9e8;border-radius:13px;padding:9px;text-align:center}.fact-row strong{display:block;color:#0694a6;font-size:clamp(15px,1.6vw,21px)}.fact-row span{font-size:10px;color:#5b7f88}.mini-categories{display:flex;gap:8px;flex-wrap:wrap;margin:13px 0}.mini-categories span{border-radius:30px;background:#e3f8f5;padding:8px 12px;color:#036e8b}.source-link{display:inline-block;background:#079ab0;color:white!important;text-decoration:none;border-radius:22px;padding:9px 14px;margin-top:5px;font-weight:1000;font-size:12px;box-shadow:0 5px 0 #00758d}.source-link:hover{background:#087991}.principles{display:grid;grid-template-columns:1fr 1fr;gap:8px}.principles p{margin:2px 0;background:#e7f7f4;border-radius:14px;padding:11px}.principles strong,.principles span{display:block}.principles strong{font-size:16px}.principles span{font-size:12px;font-weight:600}.steps{padding-left:23px}.steps li{padding:3px 0}.actions{display:grid;gap:10px}.actions span{padding:9px 12px;border-radius:13px;background:#e9f8f2}.credits{border-top:1px solid #ddd0ae;border-bottom:1px solid #ddd0ae;margin:15px 0;padding:5px 0}.credits strong{display:block;color:#008a9e}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:15px}.gallery__item{position:relative;padding:0;border:2px solid #fff;background:#fff;border-radius:15px;overflow:hidden;box-shadow:0 4px 10px #146b902e}.gallery__item img{width:100%;height:clamp(88px,13vh,135px);object-fit:cover;display:block}.gallery__item span{display:block;font-size:11px;font-weight:900;color:#087f90;padding:5px 0}.gallery__item:hover{border-color:#ffa951}
.hero{position:absolute;z-index:8;bottom:clamp(72px,14.5vh,146px);left:24%;height:clamp(145px,27vh,295px);max-width:23vw;object-fit:contain;object-position:bottom;pointer-events:none;filter:drop-shadow(2px 11px 4px #8e5d3650);transition:left 1.9s linear,transform .5s}.hero.is-working{transform:translateY(12px)}.sand-signature{position:absolute;z-index:8;bottom:clamp(102px,13.1vh,142px);left:51%;max-width:39vw;text-align:center;color:#a57542a6;text-shadow:0 1px #ffe9be75;line-height:1.5;letter-spacing:.075em;font-size:clamp(8px,.7vw,10px);font-weight:900;pointer-events:none}.ocean-message{position:absolute;right:12%;bottom:30%;z-index:7;color:#066e8a;font-weight:1000;background:#ecffffed;border:2px solid #fff;border-radius:70px;padding:13px 24px;opacity:0;transform:translateY(18px);transition:.45s;pointer-events:none}.ocean-message.show{opacity:1;transform:translateY(0)}
.journey{position:absolute;bottom:clamp(17px,3vh,35px);left:clamp(80px,10vw,170px);right:clamp(80px,10vw,170px);z-index:11;background:#fffbebdf;border:2px solid #fff9;border-radius:25px;padding:9px 20px 10px;box-shadow:0 7px 25px #9a682524;backdrop-filter:blur(6px)}.journey__caption{display:flex;justify-content:space-between;color:#134d68;font-size:10px;font-weight:1000;letter-spacing:.13em}.journey__line{height:4px;background:#9dc3bd;border-radius:10px;margin:10px 8px -11px}.journey__fill{height:100%;width:0;background:linear-gradient(90deg,#0b9fb5,#ffb456);transition:width .7s;border-radius:10px}.journey__items{display:flex;justify-content:space-between;align-items:flex-start;gap:1px}.journey-item{width:7.5%;display:flex;flex-direction:column;align-items:center;gap:5px;color:#386479;background:none;border:none;padding:0;font-size:11px;font-weight:900;min-width:0}.journey-item>span{position:relative;z-index:1;display:grid;place-items:center;width:clamp(20px,2.25vw,32px);height:clamp(20px,2.25vw,32px);font-size:13px;background:#fff7e5;border:2px solid #add9d5;border-radius:50%;transition:transform .3s,background .3s}.journey-item.active>span,.journey-item:hover>span{transform:scale(1.2);background:#34bed0;border-color:#fff}.journey-item small{font-size:clamp(7px,.65vw,10px);line-height:1.1;white-space:nowrap}.journey-item.active small{color:#007c94}.step-arrow{position:absolute;z-index:12;bottom:clamp(42px,6.5vh,80px);border:2px solid #fff;background:#ff725d;color:#fff;border-radius:60px;padding:13px 17px;box-shadow:0 7px 0 #d95148,0 12px 22px #a56b4750;font-weight:1000;font-size:18px}.step-arrow:hover{background:#ff9473;transform:translateY(-2px)}.step-arrow:disabled{opacity:.22;pointer-events:none}.step-arrow--previous{left:15px;background:#0d9bb3;box-shadow:0 7px 0 #06788d}.step-arrow--next{right:14px}.step-arrow span{font-size:11px}.instruction{position:absolute;bottom:clamp(119px,15.5vh,171px);right:clamp(12px,2.5vw,42px);z-index:9;font-size:10px;color:#75593d;font-weight:900;max-width:230px;text-align:right;pointer-events:none}.exit{position:absolute;right:20px;top:75px;z-index:14;background:#fffdf2df;color:#1c6d83;border:1px solid #fff;padding:7px 14px;border-radius:40px;font-size:11px;font-weight:1000}
.crab{position:fixed;left:0;top:0;z-index:40;width:76px;height:59px;pointer-events:none;transform:translate3d(40px,40px,0)}.crab img{width:100%;height:100%;object-fit:contain;image-rendering:auto;filter:drop-shadow(0 3px 2px #79503370)}.crab-bubble{position:fixed;z-index:39;max-width:min(280px,80vw);min-width:175px;padding:13px 16px;background:#fffae9;border:3px solid #fff;border-radius:20px;color:#124a62;font-size:13px;font-weight:850;line-height:1.35;box-shadow:0 7px 26px #17567960;opacity:0;transform:translateY(10px) scale(.9);transition:opacity .22s,transform .22s;pointer-events:none}.crab-bubble.visible{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}.crab-bubble a{display:block;margin-top:8px;font-size:12px;color:#067f9f;word-break:break-word}
.lightbox,.goodbye{position:fixed;inset:0;z-index:80;display:flex;flex-direction:column;justify-content:center;align-items:center;background:#082e48d9;backdrop-filter:blur(10px);padding:23px}.lightbox img{max-width:min(940px,92vw);max-height:79vh;object-fit:contain;border:5px solid #fff;border-radius:15px;box-shadow:0 20px 70px #001e30aa}.lightbox p{font-size:13px;color:#fff;font-weight:800}.lightbox>button{position:absolute;right:4%;top:3%;border:0;background:white;color:#075475;font-size:35px;width:52px;height:52px;border-radius:50%}.goodbye-card{max-width:560px;width:95%;text-align:center;background:#fff6e2;border:5px solid white;border-radius:36px;padding:25px;color:#0a4866;box-shadow:0 19px 65px #012c4688}.goodbye-card h2{font-size:clamp(24px,3vw,38px);margin:0}.goodbye-card p{font-size:16px;font-weight:800}.goodbye-images{display:flex;justify-content:center;height:175px;gap:13px}.goodbye-images img{height:100%;max-width:43%;object-fit:contain}.goodbye-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin:18px 0}.goodbye-actions button{border:0;background:#0a97aa;color:#fff;border-radius:30px;padding:12px 20px;font-weight:900}.goodbye-actions button:last-child{background:#ff765d}.goodbye-card small{color:#637981}
@keyframes float-lab{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-7px) rotate(3deg)}}
@media(max-width:1050px){.edition{display:none}.masthead{padding:12px 18px}.chapter-panel{left:4.5%;width:min(550px,57vw)}.hero{left:22%}.step-arrow span{display:none}.journey{left:72px;right:72px;padding-left:9px;padding-right:9px}.journey-item small{font-size:8px}.instruction{display:none}.sand-signature{right:5%;left:auto;max-width:46vw}}
@media(max-width:700px){.scene{min-height:0}.sky{bottom:49%}.ocean{top:45%;height:27%}.shore{top:71%}.chapter-panel{top:75px;left:12px;width:calc(100% - 24px);max-height:49vh}.chapter-card{max-height:49vh;padding:18px;border-radius:24px}.chapter-card h1{font-size:31px}.chapter-card h2{font-size:15px}.chapter-copy{font-size:12px}.masthead{padding:8px}.brand{padding:7px 12px;font-size:18px}.slogan{padding:9px;font-size:9px}.hero{height:20vh;max-width:33vw;bottom:13vh;left:14%!important}.decor--iracema{height:35vh;width:40vw;right:1%;bottom:22%}.decor--animal{width:20vw;height:11vh}.decor--trash{width:17vw;height:8vh}.sand-signature{font-size:6.5px;bottom:11vh;right:15%;max-width:65vw}.journey{bottom:8px;left:44px;right:44px;border-radius:15px;padding:8px 5px}.journey__caption{font-size:8px}.journey-item small{display:none}.journey-item>span{width:21px;height:21px;font-size:10px}.step-arrow{bottom:25px;padding:8px 10px;font-size:17px}.step-arrow--previous{left:4px}.step-arrow--next{right:4px}.exit{top:57px;right:8px;font-size:9px;padding:5px 9px}.labomar-float{left:1%;height:27px}.crab{width:57px;height:43px}.crab-bubble{font-size:12px}.gallery__item img{height:75px}.slogan{max-width:46vw}.world{z-index:4}}
@media(prefers-reduced-motion:reduce){.world,.chapter-panel,.hero,.journey__fill{transition-duration:.01ms!important}}

/* V1.1 — sprites em camadas, caminhada contínua e identidade oficial. */
.brand--image{padding:2px 13px 2px 7px;border-radius:70px;background:#ffffffec;min-width:150px;max-width:190px;height:76px;display:grid;place-items:center}
.brand--image img{display:block;max-height:71px;max-width:170px;width:100%;object-fit:contain;filter:drop-shadow(0 2px 2px #2588a634)}
.masthead{align-items:flex-start}
.world{transition:none!important;z-index:5}
.shore{z-index:2}.hero{z-index:4;pointer-events:auto;left:var(--hero-left,24%)!important;transform:scaleX(var(--hero-facing,1)) translateY(var(--hero-shift,0px));will-change:left,bottom;transition:left 1s linear,bottom 1s linear,transform .16s ease}
.hero.is-working{--hero-shift:12px;transform:scaleX(var(--hero-facing,1)) translateY(var(--hero-shift,0px))}
.hero:hover{filter:drop-shadow(1px 11px 5px #ae683063) drop-shadow(0 0 4px #fff9)}
.decor--animal{width:clamp(72px,8.7vw,125px);height:clamp(68px,12vh,124px)}
.decor--animal:has(img[src$="carangueijo.png"]){width:clamp(38px,4vw,65px);height:clamp(34px,6vh,65px);bottom:11%}
.decor--animal:has(img[src$="barraca.png"]){width:clamp(205px,24vw,355px);height:clamp(155px,24vh,270px);bottom:11%}
.decor--coco-cart{width:clamp(185px,23vw,315px);height:clamp(142px,22vh,245px)}
.wave-vessel{max-width:260px;filter:drop-shadow(0 5px 4px #03405b4b)}
.crab{z-index:100;width:clamp(95px,8vw,135px);height:clamp(70px,6.4vw,103px)}
.crab-bubble{z-index:101}
.goodbye{z-index:80}.lightbox{z-index:80}
.scene.is-traveling .sand-dots{filter:contrast(1.12)}
.chapter-panel:has(.chapter-card--ending){left:50%;top:clamp(70px,11vh,110px);width:min(830px,82vw);transform:translate(-50%,0) scale(.97);max-height:74vh}
.chapter-panel.is-visible:has(.chapter-card--ending){transform:translate(-50%,0) scale(1)}
.chapter-card--ending{max-height:74vh;padding:clamp(14px,1.7vw,24px) clamp(24px,2.4vw,35px);text-align:center}
.chapter-card--ending h1{font-size:clamp(28px,3vw,42px);margin:0 0 7px}.chapter-card--ending h2{font-size:clamp(15px,1.2vw,18px);margin:0 0 8px}
.chapter-card--ending .chapter-copy>p{margin:6px 0}.chapter-card--ending .credits{display:grid;grid-template-columns:1.25fr 1fr 1.3fr;text-align:left;align-items:start;gap:14px;margin:9px 0;padding:4px 0}.chapter-card--ending .credits p{margin:5px 0}
.end-logos{display:flex;justify-content:center;gap:24px;align-items:center;margin:8px auto}.end-logos img{height:clamp(39px,6vh,65px);max-width:105px;object-fit:contain}
.end-sprites{display:flex;justify-content:center;align-items:flex-end;gap:20px;height:clamp(95px,15vh,160px);margin:4px auto}.end-sprites img{height:100%;max-width:45%;object-fit:contain}
.end-brand{height:45px;max-width:95px;object-fit:contain}
@media(max-width:700px){.brand--image{height:54px;min-width:100px;max-width:131px;padding:1px 5px}.brand--image img{max-height:52px}.hero{left:24%;max-width:33vw}.crab{width:85px;height:66px}.decor--animal{width:65px;height:65px}.decor--animal:has(img[src$="carangueijo.png"]){width:37px;height:37px}.chapter-panel:has(.chapter-card--ending){width:calc(100% - 20px);top:66px;max-height:66vh}.chapter-card--ending{max-height:66vh;padding:12px}.chapter-card--ending .credits{grid-template-columns:1fr 1fr;gap:4px;font-size:10px}.chapter-card--ending .credits p:last-child{grid-column:span 2}.end-sprites{height:90px}.end-logos img{height:39px}}

/* V1.2 — caminhada real, frame a frame. O JavaScript controla a posição;
   transições CSS não podem disputar o movimento com o loop de animação. */
.hero{transition:none!important;will-change:left,bottom,transform}

/* V1.3 — acabamento visual e colaboração na limpeza da praia. */
.brand--image{width:clamp(205px,18vw,305px);max-width:305px;height:clamp(90px,11vh,120px);padding:3px 12px}
.brand--image img{max-width:280px;max-height:115px}
.edition--ufc{display:flex;align-items:center;gap:10px;cursor:none;border:1px solid #fff9;transition:background .2s,transform .2s}
.edition--ufc:hover{background:#d2fff6;transform:translateY(-2px)}
.edition--ufc img{height:clamp(26px,4.5vh,43px);max-width:45px;object-fit:contain}
.labomar-float{height:clamp(76px,12vh,140px);max-width:205px;left:2%;bottom:9%;animation:labomar-waves 3.5s ease-in-out infinite;cursor:none;filter:drop-shadow(0 8px 5px #064e654d)}
@keyframes labomar-waves{0%,100%{transform:translate3d(0,0,0) rotate(-3deg)}35%{transform:translate3d(0,-13px,0) rotate(2deg)}70%{transform:translate3d(0,-4px,0) rotate(1deg)}}
.wave-vessel--mara{width:clamp(410px,48vw,900px)!important;max-width:none!important;z-index:3;filter:drop-shadow(0 18px 10px #032a4466)}
.ocean{overflow:visible}
.chapter-foot{align-items:center}
.crab-tip{max-width:68%;display:inline-flex;align-items:center;justify-content:center;gap:4px;border:2px solid #fff;background:linear-gradient(160deg,#08afbd,#067f9f);color:white;border-radius:28px;padding:10px 13px;font-size:clamp(10px,.9vw,13px);line-height:1.22;font-weight:1000;letter-spacing:0;text-align:center;box-shadow:0 5px 0 #056a84,0 8px 13px #066b8a35;transition:background .2s,transform .2s,box-shadow .2s;cursor:none}
.crab-tip:hover,.crab-tip:focus-visible{background:linear-gradient(160deg,#ffbd56,#ff806d);transform:translateY(-3px);box-shadow:0 8px 0 #d7685d,0 10px 16px #af613b44}
.end-logos img[data-speech]{cursor:none;transition:transform .2s,filter .2s}
.end-logos img[data-speech]:hover{transform:scale(1.14);filter:drop-shadow(0 0 8px #70d9ec)}
.decor--trash{cursor:none;touch-action:none;user-select:none}
.decor--trash img{-webkit-user-drag:none;user-select:none;pointer-events:auto}
.decor--trash.is-dragging{z-index:70!important;opacity:1;transition:none!important;filter:drop-shadow(0 10px 10px #0a5a8966)}
.decor--trash.is-dragging img{transform:none!important}
.decor--trash.is-floating{z-index:8;width:clamp(60px,8vw,110px);height:clamp(45px,8vh,90px);pointer-events:none;transition:none!important}
.pollution-meter{position:fixed;right:22px;top:130px;z-index:15;min-width:180px;padding:13px 15px;border:2px solid #fff;border-radius:16px;background:#fff2d8f3;color:#8b4526;font-size:12px;font-weight:1000;box-shadow:0 6px 21px #6d45344d}
.pollution-meter span{display:flex;justify-content:space-between;gap:15px}
.pollution-meter__track{height:9px;background:#efcbb0;border-radius:10px;margin-top:7px;overflow:hidden}
.pollution-meter__track i{display:block;height:100%;width:0;background:linear-gradient(90deg,#ffc35d,#f34b4b);border-radius:10px;transition:width .3s}
.reward{position:fixed;inset:0;z-index:85;background:#062d48b8;display:grid;place-items:center;padding:20px;backdrop-filter:blur(7px)}
.reward[hidden],.pollution-meter[hidden]{display:none!important}
.reward__card{max-width:510px;background:#fef6da;border:5px solid #fff;border-radius:32px;padding:30px;text-align:center;color:#075371;box-shadow:0 20px 60px #012e4f77}
.reward__card h2{font-size:clamp(22px,4vw,35px)}.reward__card p{font-weight:800}
.reward__note{font-size:12px;color:#6d7a7e}
.reward__card button{background:#0a9eb2;color:#fff;border:0;border-radius:25px;padding:12px 18px;margin:5px;font-weight:1000;cursor:none}
.reward__card button:hover{background:#ff8b56}
@media(max-width:700px){.brand--image{width:145px;max-width:145px;height:69px;min-width:145px}.brand--image img{max-height:65px;max-width:135px}.edition--ufc{font-size:0;padding:4px 7px}.edition--ufc img{height:27px}.labomar-float{height:76px;max-width:117px}.wave-vessel--mara{width:420px!important}.chapter-foot{flex-wrap:wrap}.crab-tip{max-width:100%;font-size:10px}.pollution-meter{top:110px;right:8px;min-width:148px;padding:8px;font-size:10px}}

/* V1.4 — galeria de conquistas secretas e coleção de cocos. */
.reward__card{width:min(570px,94vw);max-width:94vw;max-height:94vh;overflow-y:auto;padding:clamp(14px,2.2vw,27px)}
.reward__label{display:block;font-weight:1000;letter-spacing:.13em;font-size:clamp(11px,1.2vw,15px);color:#d98326}
.reward__card h2{margin:9px auto 7px;color:#076782}
.reward__image{width:100%;height:clamp(190px,42vh,420px);object-fit:contain;display:block;margin:5px auto;filter:drop-shadow(0 8px 8px #0e5f7b32)}
.reward__card p{margin:8px auto;line-height:1.35;font-size:clamp(13px,1.1vw,16px)}
.reward__card .reward__note{font-size:clamp(11px,.91vw,13px);font-weight:700;line-height:1.4;background:#e3f7eb;border-radius:13px;padding:10px 12px}
.reward__actions{display:flex;gap:7px;justify-content:center;flex-wrap:wrap}
.coconut-meter{position:fixed;left:clamp(10px,3vw,42px);top:clamp(145px,21vh,200px);z-index:15;min-width:155px;border:3px solid white;border-radius:18px;padding:12px 14px;color:#38621a;background:linear-gradient(145deg,#f7ffd9,#dff6a6);font-size:13px;font-weight:1000;overflow:visible;box-shadow:0 5px 22px #649f3c56;transition:box-shadow .22s,transform .22s}
.coconut-meter[hidden]{display:none!important}
.coconut-meter span{display:flex;justify-content:space-between;gap:12px;align-items:center;position:relative;z-index:2}
.coconut-meter__shine{position:absolute;inset:-22px;border-radius:50%;opacity:0;pointer-events:none;background:radial-gradient(circle at 12% 22%,#fff8 0 3px,transparent 5px),radial-gradient(circle at 90% 42%,#ffee5b 0 4px,transparent 7px),radial-gradient(circle at 25% 90%,#fff 0 2px,transparent 5px),radial-gradient(circle at 65% 0%,#d9ff78 0 3px,transparent 6px);animation:coconut-spark 1.6s ease-in-out infinite}
.coconut-meter.is-milestone{animation:coconut-pop .65s ease-out}
.coconut-meter.is-milestone .coconut-meter__shine{animation:coconut-burst .75s ease-out}
@keyframes coconut-pop{0%,100%{transform:scale(1)}35%{transform:scale(1.14)}65%{transform:scale(.97)}}
@keyframes coconut-spark{0%,100%{transform:scale(.92) rotate(-9deg);opacity:.23}50%{transform:scale(1.08) rotate(8deg);opacity:1}}
@keyframes coconut-burst{0%{transform:scale(.75);opacity:0}45%{transform:scale(1.5);opacity:1}100%{transform:scale(1.7);opacity:0}}
@media(max-width:700px){.coconut-meter{top:120px;left:7px;padding:8px;min-width:122px;font-size:10px}.reward__image{height:min(40vh,310px)}.reward__card p{font-size:12px}}

/* V1.5 — LABOMAR na crista das ondas, fixo no lado direito. */
.labomar-float{
  left:auto!important;right:3.2%!important;top:0%!important;bottom:auto!important;
  height:clamp(115px,18vh,210px);max-width:300px;
  animation:labomar-waves-fast 2.75s ease-in-out infinite;
  filter:drop-shadow(2px 0 #e8ffff) drop-shadow(-2px 0 #e8ffff)
    drop-shadow(0 2px #e8ffff) drop-shadow(0 -2px #e8ffff)
    drop-shadow(0 8px 6px #09577188);
}
@keyframes labomar-waves-fast{
  0%,100%{transform:translate3d(0,0,0) rotate(-2deg)}
  50%{transform:translate3d(0,-9px,0) rotate(2deg)}
}
@media(max-width:700px){.labomar-float{right:2%!important;top:0!important;height:clamp(85px,13vh,125px);max-width:160px}}

/* V1.6 — ondas em profundidade, nuvem da marca e navegação confiável. */
.water--far{z-index:1}
.water--middle{z-index:2}
.labomar-float{
  z-index:3!important;left:auto!important;right:1.2%!important;
  top:5%!important;bottom:auto!important;
  animation:none!important;will-change:transform;
}
.water--bright{z-index:4}
.water--front{z-index:5}
.sparkles{z-index:6;pointer-events:none}
.water-decor{z-index:7}
.journey{bottom:70px}
.sand-signature{
  left:20px!important;right:auto!important;bottom:9px!important;
  max-width:calc(100vw - 38px)!important;text-align:left!important;
  display:flex;flex-direction:column;align-items:flex-start;gap:1px;
  font-size:clamp(8px,.65vw,10px);line-height:1.3;letter-spacing:.025em;
  color:#916c3eb8;text-shadow:0 1px #ffefd1a0;
}
.sand-signature strong{color:#87572fcf}
.brand--image{
  position:relative;isolation:isolate;
  width:clamp(165px,12vw,215px);height:clamp(165px,12vw,215px);
  min-width:clamp(165px,12vw,215px);max-width:none;
  border:none!important;border-radius:50%!important;
  background:#fffcf1f5!important;
  box-shadow:0 9px 25px #086d9430!important;
  padding:14px;display:grid;place-items:center;
}
.brand--image:before,.brand--image:after{content:none!important;display:none!important}
.brand--image img{
  position:relative;z-index:1;display:block;
  width:100%;height:100%;max-width:100%;max-height:100%;
  object-fit:contain;object-position:center center;
}
.exit{position:fixed!important;top:78px;right:22px;z-index:170!important;pointer-events:auto!important;touch-action:manipulation;padding:10px 17px;box-shadow:0 5px 15px #0b6a8a33}
.goodbye,.reward,.lightbox{z-index:180}
.crab{z-index:200}
.crab-bubble{z-index:160}
@media(max-width:700px){
  .brand--image{width:136px;min-width:136px;max-width:136px;height:136px;padding:10px}
  .brand--image img{max-height:100%;max-width:100%}
  .journey{bottom:67px}
  .sand-signature{left:10px!important;bottom:7px!important;max-width:calc(100vw - 20px)!important;font-size:6.8px;line-height:1.15}
  .exit{top:60px;right:9px;padding:8px 12px}
  .labomar-float{right:1.2%!important;top:4%!important}
}

/* V1.7 — forma circular limpa, sem os antigos lóbulos de nuvem. */
.labomar-float{top:-8%!important;filter:none!important}
@media(max-width:700px){.labomar-float{top:-6%!important}}

/* V1.8 — contorno suave no LABOMAR e marca translúcida ao passar o cursor. */
.labomar-float{
  filter:drop-shadow(1px 0 1px #ffffffa3)
    drop-shadow(-1px 0 1px #ffffffa3)
    drop-shadow(0 1px 1px #ffffffa3)
    drop-shadow(0 -1px 1px #ffffffa3)!important;
}
.brand--image{transition:opacity .25s ease,transform .25s ease}
.brand--image:hover{opacity:.4!important}
.instruction{bottom:11px}

/* V1.9 — selo UFC recolhível e emojis com cores naturais. */
.edition--ufc{
  box-sizing:border-box;max-width:365px;min-height:58px;
  white-space:nowrap;overflow:hidden;justify-content:center;
  transition:max-width .35s ease,width .35s ease,border-radius .35s ease,
    padding .35s ease,background .2s ease,transform .2s ease;
}
.edition--ufc img{flex:none}
.edition__label{display:inline-block;overflow:hidden;max-width:300px;opacity:1;
  transition:max-width .35s ease,opacity .23s ease}
.edition__label strong{color:#268a48;font-weight:1000}
.edition--ufc.edition--compact{
  width:64px;min-width:64px;max-width:64px;height:64px;min-height:64px;
  padding:6px;gap:0;border-radius:50%;
}
.edition--ufc.edition--compact .edition__label{max-width:0;opacity:0}
.slogan::first-letter{color:inherit}
.slogan__emoji{font-family:"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif;
  font-weight:normal;color:initial;white-space:nowrap}

/* V1.10 — a Iracema fica atrás da personagem; os demais sprites ficam à frente. */
.iracema-world{
  position:absolute;top:0;left:0;height:100%;z-index:3;
  pointer-events:none;will-change:transform;
}
.iracema-world .decor--iracema{pointer-events:auto}
.hero{z-index:4}
.world{z-index:5}