.opening-page{--gold:#f7dba2;--cream:#fff6e5;min-height:100svh;background:#241c31;color:var(--cream);font-family:'Trebuchet MS',system-ui,sans-serif}.opening-page [hidden]{display:none!important}.academy-header{height:90px;max-width:1400px;margin:auto;padding:15px 36px;display:flex;justify-content:space-between;align-items:center}.academy-logo{display:flex;gap:12px;align-items:center;text-decoration:none;color:var(--gold)}.logo-star{font-size:38px}.academy-logo small{display:block;font-size:10px;letter-spacing:3px;margin-bottom:2px}.academy-logo strong{font:25px Georgia,serif}.round-control{border:1px solid #8f789770;border-radius:30px;background:#40314d;color:#e7d6e7;padding:12px 17px;font-size:12px;min-height:44px}.round-control span{margin-left:7px;font-size:19px}.opening-world{position:relative;isolation:isolate;max-width:1360px;min-height:715px;margin:0 auto;border-radius:30px;border:1px solid #a58b6e66;overflow:hidden;background:linear-gradient(90deg,#261b3ae8,#30203bb8 50%,#261b3ae3),url('assets/nook.webp') center/cover;box-shadow:0 25px 65px #10091b80}.world-light{position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 65%,#e5bd9840,transparent 60%);pointer-events:none}.journey{height:65px;display:flex;align-items:center;justify-content:center;gap:14px;padding:15px;position:relative;z-index:5}.journey>span{display:flex;align-items:center;gap:7px;font-size:12px;color:#c1abc9}.journey b{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;border:1px solid #baa0ca66;font-size:11px}.journey>i{height:1px;width:45px;background:#bea8c74d}.journey [aria-current]{color:#ffedca}.journey [aria-current] b{background:#f2d7a5;color:#503951;border-color:#f2d7a5}.journey .complete b{background:#6b9e8a;color:white;border-color:#8fc3ab}.opening-screen{position:relative;z-index:2;padding:0 35px 30px;text-align:center}.screen-heading .welcome-line,.welcome-line{font-size:10px;font-weight:bold;letter-spacing:2.5px;color:#dbc19c;margin:14px 0}.opening-page h1{font:clamp(32px,3.6vw,52px)/1.08 Georgia,serif;letter-spacing:-1px;color:var(--cream);margin:0;text-shadow:0 3px 20px #1b102f88}.opening-page h1:focus{outline:none}.screen-heading>p:last-child,.meet-copy>p:not(.welcome-line){font-size:16px;line-height:1.6;color:#e5d5e6;margin:15px 0}.egg-choices{max-width:820px;margin:15px auto 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.egg-card{position:relative;background:radial-gradient(ellipse at 50% 45%,#b994bd18,transparent 65%);border:1px solid transparent;border-radius:28px;color:var(--cream);padding:12px 14px 22px;transition:background .25s,border-color .25s,transform .25s;min-width:0}.egg-picture{display:block;height:235px;position:relative}.egg-picture:after{content:'';position:absolute;left:20%;right:20%;bottom:0;height:12px;background:#160c2c88;filter:blur(9px);border-radius:50%;z-index:-1}.egg-picture img{display:block;max-width:100%;width:auto;height:100%;object-fit:contain;margin:auto;filter:drop-shadow(0 0 20px #d1b3fc35);animation:eggFloat 4s ease-in-out infinite}.egg-card:nth-child(2) img{animation-delay:-1.3s}.egg-card:nth-child(3) img{animation-delay:-2.6s}.egg-card:hover{background:#c8a8db15;transform:translateY(-3px)}.egg-card[aria-pressed=true]{background:linear-gradient(#c7a2d925,#b395bd12);border-color:#f4d59d;box-shadow:0 0 25px #f4d59d12}.egg-label{display:block;margin-top:15px}.egg-label strong{font:23px Georgia,serif;display:block}.egg-label small{display:block;font-size:11px;color:#d1bed8;margin-top:7px}.chosen-tag{position:absolute;top:4px;right:8px;border-radius:20px;background:#f2d8a8;color:#503c53;font-size:10px;padding:5px 9px;opacity:0}.egg-card[aria-pressed=true] .chosen-tag{opacity:1}.choose-action{margin:10px auto 0}.choose-action>p:first-child{font-size:13px;min-height:19px;margin:0 0 12px;color:#e6d4e9}.magic-button{display:inline-flex;align-items:center;justify-content:center;gap:22px;min-height:58px;min-width:270px;border:1px solid #ffe5b4;border-radius:20px;padding:15px 28px;font-size:18px;font-weight:bold;color:#513650;background:linear-gradient(#fff0c9,#eac389);box-shadow:0 4px 0 #93734f,0 8px 25px #140d2370;transition:transform .16s,filter .16s}.magic-button:hover:not(:disabled){filter:brightness(1.06);transform:translateY(-2px)}.magic-button:active:not(:disabled){transform:translateY(2px);box-shadow:0 2px 0 #93734f}.magic-button:disabled{background:#635269;color:#cebdce;border-color:#89748d;box-shadow:0 3px 0 #3e3048;cursor:default}.gentle-note{font-size:10px!important;color:#c1aec8!important;margin:15px 0 0!important}.back-link{position:absolute;top:0;left:28px;background:none;border:0;color:#dec6e5;padding:12px 8px;font-size:12px;z-index:5;min-height:44px}.back-link:disabled{opacity:0;pointer-events:none}.hatching-stage{position:relative;width:390px;height:390px;max-width:100%;margin:12px auto 0;display:grid;place-items:center}.hatch-glow{position:absolute;inset:8%;border-radius:50%;background:radial-gradient(#ffe2b04d,transparent 67%);filter:blur(14px);transition:scale .5s}.tap-egg{position:relative;display:block;width:260px;height:373px;border:0;background:none;padding:0;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.tap-egg img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}.egg-whole,.shell-half{position:absolute;inset:0;display:block}.egg-whole{animation:eggFloat 4s ease-in-out infinite}.shell-half{opacity:0;pointer-events:none}.shell-left{clip-path:polygon(0 0,48% 0,55% 30%,43% 37%,55% 47%,45% 54%,58% 63%,45% 70%,54% 100%,0 100%)}.shell-right{clip-path:polygon(48% 0,100% 0,100% 100%,54% 100%,45% 70%,58% 63%,45% 54%,55% 47%,43% 37%,55% 30%)}.crack-lines{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#fff9df;stroke-width:1.6;stroke-linejoin:round;filter:drop-shadow(0 0 4px #ffe4a3)}.crack-lines path{opacity:0;transition:opacity .2s}.cracked-once .crack-one,.cracked-twice .crack-one,.cracked-twice .crack-two{opacity:1}.tap-egg.wiggle .egg-whole{animation:eggWiggle .42s ease-in-out}.tap-progress{display:flex;justify-content:center;gap:12px;margin:6px 0 16px}.tap-progress span{width:13px;height:13px;border-radius:50%;background:#ac8fbd55;border:1px solid #dfbfdb99;transition:background .3s,scale .3s}.tap-progress span.done{background:#ffe0a4;border-color:#ffe0a4;box-shadow:0 0 12px #f6c68e66;scale:1.15}.hatch-reassurance{font-size:12px;color:#d5bfdc;margin:0}.hatch-sparkles{position:absolute;inset:10%;display:flex;justify-content:space-around;align-items:center;color:#ffe2a6;font-size:30px;opacity:0;pointer-events:none}.hatch-sparkles i{font-style:normal;align-self:flex-start}.hatching-stage.revealing .egg-whole{opacity:0;animation:none}.hatching-stage.revealing .shell-half{opacity:1}.revealing .shell-left{animation:shellLeft 1.15s ease-in forwards}.revealing .shell-right{animation:shellRight 1.15s ease-in forwards}.revealing .hatch-glow{scale:1.5;background:radial-gradient(#fff8d7b0,transparent 70%)}.revealing .hatch-sparkles{animation:hatchSpark 1.3s ease-out forwards}#meet-screen{min-height:605px;display:grid;grid-template-columns:1fr 1.1fr;align-items:center;max-width:1040px;margin:auto;text-align:left;padding-top:15px;gap:30px}.meet-copy h1{font-size:48px}.meet-copy>p:not(.welcome-line){font-size:17px}#name-form{margin-top:28px;display:flex;flex-direction:column;align-items:flex-start}#name-form label{font-size:14px;color:#ffe8c5;margin-bottom:9px}#pet-name{width:100%;max-width:310px;border:1px solid #ddc2ca;border-radius:15px;min-height:52px;padding:12px 16px;background:#fff6e7;color:#4b3652;font:20px Georgia,serif}#name-help{font-size:10px;color:#cbb5d3;margin-top:9px;line-height:1.6}#name-form .magic-button{margin-top:25px;min-width:280px}.new-friend{position:relative;width:100%;text-align:center;align-self:center}.friend-glow{position:absolute;inset:10% -3% 0;background:radial-gradient(ellipse,#edcdb64d,transparent 66%);pointer-events:none}.meet-pet{position:relative;width:100%;aspect-ratio:1;border:0;background:none;padding:0;display:block;touch-action:manipulation}.meet-pet .dritten{inset:0;width:100%;height:100%}.meet-pet .fluffy-svg{overflow:visible}#petting-hint{font-size:12px;color:#e5d0df;margin:5px 0 0}.opening-footer{max-width:1360px;margin:auto;display:flex;justify-content:space-between;align-items:center;gap:15px;padding:21px 20px;color:#b39cbd;font-size:10px}.opening-footer a{color:#e9d6b4;text-decoration:none}.preview-label{opacity:.7}.floating-dust{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}.floating-dust i{font-style:normal;position:absolute;color:#f7deac66;animation:dustDrift 7s infinite alternate;left:12%;top:40%;font-size:17px}.floating-dust i:nth-child(2){left:88%;top:25%;animation-delay:-2s}.floating-dust i:nth-child(3){left:24%;top:76%;animation-delay:-4s;font-size:12px}.floating-dust i:nth-child(4){left:75%;top:65%;animation-delay:-6s}.opening-page button:focus-visible,.opening-page input:focus-visible,.opening-page a:focus-visible{outline:3px solid #a9efd3;outline-offset:5px}.entering{animation:screenEnter .5s ease-out}@keyframes eggFloat{50%{transform:translateY(-6px) rotate(1deg)}}@keyframes eggWiggle{25%{transform:rotate(-5deg)}50%{transform:rotate(5deg)}75%{transform:rotate(-2deg)}}@keyframes shellLeft{to{transform:translate(-105px,100px) rotate(-28deg);opacity:0}}@keyframes shellRight{to{transform:translate(105px,100px) rotate(28deg);opacity:0}}@keyframes hatchSpark{20%{opacity:1}100%{transform:scale(1.5);opacity:0}}@keyframes screenEnter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes dustDrift{to{translate:8px -24px;opacity:.3}}
@media(min-width:1000px) and (max-height:850px){.academy-header{height:72px}.opening-world{min-height:650px}.journey{height:55px}.opening-page h1{font-size:42px}.egg-picture{height:200px}.egg-choices{margin-top:10px}.egg-label{margin-top:10px}.opening-footer{padding-top:15px;padding-bottom:15px}.hatching-stage{height:350px}.tap-egg{height:335px;width:234px}#meet-screen{min-height:550px}.meet-copy h1{font-size:44px}}
@media(max-width:700px){.academy-header{height:76px;padding:14px 18px}.logo-star{font-size:29px}.academy-logo{gap:8px}.academy-logo strong{font-size:19px}.academy-logo small{font-size:8px}.round-control{padding:9px 12px;font-size:10px}.opening-world{border-radius:22px;margin:0 10px;min-height:640px;background-position:center}.journey{height:57px;gap:9px}.journey>i{width:25px}.journey>span{font-size:11px}.opening-screen{padding:0 12px 25px}.opening-page h1{font-size:34px}.screen-heading .welcome-line{font-size:8px;letter-spacing:1.7px;margin:13px 0}.screen-heading>p:last-child{font-size:14px;margin:12px 0}.egg-choices{gap:5px;margin-top:22px}.egg-card{border-radius:18px;padding:22px 3px 17px}.egg-picture{height:170px}.egg-label strong{font-size:17px}.egg-label small{font-size:9px;line-height:1.5;min-height:27px;max-width:80px;margin:7px auto 0}.chosen-tag{font-size:8px;padding:4px 6px;right:5px;top:2px}.choose-action{margin-top:25px}.magic-button{font-size:17px;min-width:255px;min-height:57px}.gentle-note{font-size:9px!important;max-width:260px;margin:17px auto 0!important}.back-link{position:relative;left:auto;display:block;margin:0 auto 3px;font-size:11px;padding:7px;min-height:35px}#hatch-screen .welcome-line{margin-top:2px}.hatching-stage{height:340px;margin-top:0}.tap-egg{height:320px;width:223px}.hatch-reassurance{font-size:11px}#meet-screen{display:flex;flex-direction:column;min-height:0;padding:0 20px 30px;gap:0;text-align:center}.meet-copy{display:contents}.meet-copy .welcome-line{order:0}.meet-copy h1{order:1;font-size:34px}.meet-copy>p:not(.welcome-line){order:2;font-size:13px;margin:10px 0}.new-friend{order:3;max-width:330px;margin:-4px auto 0}.meet-pet{max-width:310px;margin:auto}.new-friend #petting-hint{font-size:10px;margin-top:-8px}#name-form{order:4;align-items:center;margin-top:22px;width:100%}#name-form label{font-size:13px}#pet-name{max-width:270px;min-height:47px}#name-form .magic-button{min-width:260px;margin-top:17px}.opening-footer{font-size:9px;padding:17px 20px;flex-wrap:wrap;justify-content:center}.preview-label{display:none}}
@media(max-width:370px){.academy-logo strong{font-size:17px}.egg-picture{height:145px}.egg-label strong{font-size:15px}.opening-page h1{font-size:30px}.opening-world{min-height:610px}.magic-button{min-width:235px}.journey{gap:7px}}
@media(prefers-reduced-motion:reduce){.opening-page *, .opening-page *:before,.opening-page *:after{animation:none!important;transition:none!important}.revealing .shell-half{opacity:0}.revealing .hatch-sparkles{opacity:0}}
