:root{font-family:ui-rounded,"Nunito",system-ui,-apple-system,sans-serif;color:#234840;background:#f0f8ed}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer}.shell{width:min(850px,100%);min-height:100dvh;margin:auto;padding:12px 12px 30px}.top{display:flex;align-items:center;justify-content:space-between;gap:6px}.top a{text-decoration:none;color:#24564c;background:#fff;border-radius:999px;padding:9px 11px;box-shadow:0 4px 13px #22432b20;font-size:.73rem;font-weight:950;white-space:nowrap}.top strong{font-size:.8rem;white-space:nowrap;color:#396e55}.hero{position:relative;overflow:hidden;margin-top:15px;border-radius:30px;padding:29px;min-height:520px;background:linear-gradient(#b8e9df 0 53%,#85cba5 53%,#68ae78);box-shadow:0 20px 45px #2c704e35}.hero:before{content:"";position:absolute;left:-20%;bottom:-20%;width:145%;height:49%;border-radius:50%;background:#3d906e44}.hero-copy{position:relative;z-index:2;max-width:470px}.eyebrow{display:block;font-size:.71rem;letter-spacing:.14em;font-weight:950;text-transform:uppercase;color:#7d5a24}.hero h1{font-size:clamp(2.7rem,7vw,4.8rem);line-height:.98;letter-spacing:-.05em;margin:10px 0 15px}.hero p{font-size:1.08rem;line-height:1.5;margin-bottom:20px}.hero-art{position:absolute;right:2%;bottom:1%;width:min(50%,335px);filter:drop-shadow(0 20px 12px #205a4f4d);animation:bob 3s ease-in-out infinite}.primary,.secondary{border:0;border-radius:16px;padding:13px 19px;font-weight:950}.primary{background:#ffd166;color:#5c3f08;box-shadow:0 7px 0 #d59b38}.primary:active{transform:translateY(5px);box-shadow:0 2px 0 #d59b38}.secondary{background:#e4f3ea;color:#24614f}.mission{margin:18px 0;background:#fff;border-radius:23px;padding:20px;box-shadow:0 10px 24px #366b5130}.mission h2{margin:0 0 8px}.mission p{color:#5a766c;line-height:1.5;margin:0}.step-head{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;margin:17px 0 10px}.step-head h1{font-size:clamp(1.4rem,5vw,2.1rem);margin:3px 0}.step-head p{margin:0;color:#648174;font-size:.86rem;font-weight:800}.count{border-radius:999px;background:#fff;padding:8px 13px;font-weight:950;color:#357b5b;white-space:nowrap}.scene-frame{position:relative;overflow:hidden;border:5px solid white;border-radius:25px;background:#b7e3c8;box-shadow:0 15px 34px #235e4a45}.scene-frame canvas{display:block;width:100%;height:auto;aspect-ratio:420/500;touch-action:none}.scene-message{position:absolute;top:12px;left:50%;transform:translateX(-50%);max-width:92%;border-radius:14px;background:#fff9df;color:#554520;padding:8px 13px;text-align:center;font-size:.78rem;font-weight:900;box-shadow:0 4px 12px #315b4340;pointer-events:none}.scene-message.hidden{display:none}.controls{display:flex;gap:13px;justify-content:center;margin:13px 0}.control{width:min(39vw,150px);height:61px;border:0;border-radius:17px;background:#ffd166;box-shadow:0 6px 0 #d59b38;color:#654009;font-size:1.9rem;font-weight:900;touch-action:none}.control:active,.control.pressed{transform:translateY(4px);box-shadow:0 2px 0 #d59b38}.help{margin:8px 0;text-align:center;font-size:.84rem;color:#5c7d6c;font-weight:750}.next-wrap{text-align:center;margin:14px 0}.next-wrap button{width:100%}.progress-dots{display:flex;justify-content:center;gap:7px}.progress-dots i{width:13px;height:13px;border:2px solid #93bda7;border-radius:50%;background:white}.progress-dots i.done{border-color:#46a778;background:#46a778}.cabin-intro{border-radius:20px;background:#fff;padding:15px 18px;margin:10px 0;color:#567466;line-height:1.4}.cabin-grid,.animal-tray{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.cabin-grid{margin-top:13px}.cabin-slot{min-height:105px;border:2px dashed #b6c4a2;border-radius:15px;background:linear-gradient(#e5c59b,#ba8a5c);display:grid;place-items:center;gap:0;padding:6px;color:#3c342a;text-align:center}.cabin-slot .shadow{font-size:2rem;filter:grayscale(1);opacity:.34;line-height:1}.cabin-slot.filled{background:#e8f6df;border:2px solid #6aa973}.cabin-slot.filled .shadow{filter:none;opacity:1}.cabin-slot b{font-size:.76rem}.tray-title{margin:21px 0 9px;font-weight:950}.animal-card{min-height:77px;border:2px solid #d4e5c9;border-radius:15px;background:white;display:grid;place-items:center;padding:7px;color:#365446;touch-action:none;user-select:none}.animal-card.selected{border-color:#efaf47;background:#fff5d6;box-shadow:0 0 0 3px #ffde8d}.animal-card span{font-size:1.6rem}.animal-card b{font-size:.73rem}.animal-card.used{visibility:hidden}.drag-ghost{position:fixed;z-index:200;pointer-events:none;background:#fff8dc;border:3px solid #e9ac42;border-radius:15px;padding:8px;font-size:2rem;box-shadow:0 12px 30px #253c3c50;transform:translate(-50%,-50%)}.notice{min-height:40px;margin:13px 0;border-radius:13px;background:#e8f6e8;color:#2a6c4c;padding:10px;text-align:center;font-weight:850}.notice.bad{background:#fff0e4;color:#9a5d2e}.door-card{margin-top:12px;padding:23px;border-radius:24px;background:linear-gradient(#f7e9bf,#c9dabc);box-shadow:0 12px 30px #44664230;text-align:center}.door-scene{position:relative;width:min(320px,100%);aspect-ratio:1.1;margin:10px auto 22px;border:13px solid #8f5737;border-radius:26px;background:#33352e;overflow:hidden;box-shadow:inset 0 0 25px #111a17}.inside{position:absolute;inset:0;display:grid;place-items:center;color:white;font-size:3rem}.door-panel{position:absolute;inset:0;background:repeating-linear-gradient(#af7044 0 28px,#8a5334 29px 33px);border-left:8px solid #e0a871;box-shadow:-8px 0 12px #2e241d4a;transform:translateX(100%);transition:transform .35s}.door-panel:after{content:"●";position:absolute;top:50%;left:16%;color:#fbd580;font-size:2rem}.door-card input{width:min(420px,100%);accent-color:#ad7040;touch-action:none}.door-card label{display:block;margin:12px 0;color:#5b654c;font-weight:850}.voyage-card{margin-top:13px}.window-actions{display:flex;justify-content:center;gap:8px;margin:13px 0}.window-actions button{flex:1;border:2px solid #badcc7;border-radius:13px;padding:10px 4px;background:white;color:#3a705a;font-weight:850}.voyage-note{min-height:39px;text-align:center;font-weight:850;color:#52776a}.final-card{text-align:center;margin-top:20px;padding:23px;border-radius:27px;background:white;box-shadow:0 15px 40px #397a5a35}.final-card .rainbow{font-size:5rem}.final-card h1{font-size:2.1rem;margin:5px 0}.final-card p{line-height:1.5;color:#63776f}.final-art{width:min(100%,400px);display:block;margin:auto;border-radius:20px}.actions{display:flex;justify-content:center;flex-wrap:wrap;gap:10px}.save-note{font-size:.77rem;color:#6e8274} @keyframes bob{50%{transform:translateY(-10px)}} @media(max-width:500px){.shell{padding:9px 9px 20px}.top a{font-size:.64rem;padding:8px}.top strong{font-size:.7rem}.hero{min-height:510px;padding:24px 19px}.hero-copy{max-width:100%}.hero h1{font-size:2.75rem}.hero p{max-width:250px;font-size:.96rem}.hero-art{width:235px;right:0;bottom:4px}.scene-frame canvas{aspect-ratio:420/500}.cabin-slot{min-height:94px}.cabin-slot .shadow{font-size:1.7rem}.cabin-slot b{font-size:.67rem}.animal-card{min-height:72px}.animal-card span{font-size:1.35rem}.animal-card b{font-size:.65rem}}