/* A colorful school garden surrounds calm, readable play surfaces. */
:root{--ink:#203554;--cream:#f8fcff;--muted:#5f7290;--focus:#7f37d0;--purple:#8c48d5;--green:#25905f}
html{background:#77d2fa}body{position:relative;isolation:isolate;background:linear-gradient(180deg,#80d8ff,#a7e9ff 35%,#91dca2 75%,#63bd7c);padding-top:18px;min-height:100vh}.site-scenery{position:fixed;inset:0;z-index:-1;background:url('./assets/school-background.webp') center 26%/cover no-repeat;pointer-events:none}.header.wrap{max-width:1164px;height:99px;padding:14px 25px;background:#ffffffed;border:3px solid #fff;border-radius:25px;box-shadow:0 6px 0 #4c9eb536,0 14px 35px #28547110;backdrop-filter:blur(10px)}.brand{gap:11px;letter-spacing:-.4px}.brand-mark{height:59px;width:59px;flex-shrink:0;filter:drop-shadow(0 3px 2px #3b734825)}.brand-name{display:block;line-height:1.08}.brand-name>strong{display:block;font-size:25px;font-weight:900;color:#215db0}.brand-name>b{display:block;font-size:22px;font-weight:800;color:#8b46c5;margin-top:3px}.brand-caption{font-size:9px;letter-spacing:.6px;font-weight:500;color:#6994a4;margin-top:6px}.header nav{color:#4c6783;font-size:13px;gap:28px}.header nav a:hover{color:#9251ca}.parent-link{background:#e7f5ff;border-color:#b6dcf1;box-shadow:0 3px 0 #9fcde5;color:#396c92}.stars-pill{background:#fff0a9;border:1px solid #e6c966;box-shadow:0 3px 0 #d4b950;color:#866514}.hero{padding-top:35px;padding-bottom:38px;min-height:555px;gap:30px}.hero-copy{background:#ffffffeb;backdrop-filter:blur(8px);padding:31px 30px 28px;border-radius:31px;border:3px solid white;box-shadow:0 8px 0 #64b1bd35,0 15px 35px #336d5a13;position:relative}.hero-copy:before{content:"";position:absolute;height:11px;width:57px;right:28px;top:-7px;border-radius:10px;transform:rotate(-8deg);background:#ffc54e;box-shadow:64px 0 0 #ff8c6d,128px 0 0 #ac6cde}.hero h1{font-size:clamp(39px,4.25vw,57px);letter-spacing:-2.1px;line-height:1.15;color:#245db0}.hero .highlight{color:#8c4ad0}.highlight svg{stroke:#f3b933;stroke-width:5}.hero-copy>p{font-size:15px;color:#5a7390;line-height:1.9;margin-top:28px}.eyebrow{color:#3b92a2;background:#e7fbf9;border-color:#c4ece7;font-size:10px;margin-bottom:20px;padding:6px 10px}.eyebrow>span{background:#25b595}.hero-actions{gap:18px;margin-top:24px}.hero-actions .button{font-size:14px;padding:13px 21px;gap:30px}.primary{background:linear-gradient(150deg,#a866e5,#7e3fca);border-color:#9652d1;box-shadow:0 5px 0 #6530a2,0 10px 22px #7144ae28;color:white}.primary:hover{background:linear-gradient(150deg,#b578ed,#8d4ed5)}.quiet-link{color:#6d5a8d;font-size:11px}.hero-notes{color:#6b8c80;font-size:10px;gap:16px}.hero-world{min-height:462px;height:462px}.hero-scene{inset:0 0 40px;border-radius:40px 68px 38px 58px;border:4px solid white;box-shadow:0 9px 0 #7bbed136,0 19px 40px #296b5d24}.hero-scene>img{object-position:center}.scene-chip{background:#fffcf2f2;border-color:#fff;color:#7c854b}.scene-sticker{background:#ffe783;color:#8a6e24;padding:8px 14px;border-radius:10px 13px 8px 14px;box-shadow:0 4px 0 #e0c050;right:17px;bottom:-1px;transform:rotate(6deg);font-size:10px}.scene-sticker strong{font-size:15px;font-weight:bold}.scene-sticker svg{display:none}.mini-game{border:3px solid #fff;border-radius:19px;background:#fffdf8;box-shadow:0 6px 0 #a78a6029,0 15px 32px #47605225;left:-6px;bottom:-4px}.mini-index{background:#f5e6ff;color:#9b65c1}.mini-top{color:#789197}.mini-dot{background:#4bc9aa}.mini-answers button{border-color:#e8def5;background:#f6effe;box-shadow:0 3px 0 #d5c4e7}.mini-answers button:nth-child(2){background:#eff9e7;border-color:#dbe9cb;box-shadow:0 3px 0 #c1d6a8}.mini-answers button:nth-child(3){background:#fff0db;border-color:#f1dbbb;box-shadow:0 3px 0 #e5c79d}.mini-answers button.correct{background:#cef4c1;border-color:#8cce74;box-shadow:0 3px 0 #7ab462}.mini-feedback{color:#6c9368}
.stage-section.wrap{max-width:1164px;padding:26px 30px 29px;background:#ffffffed;border:3px solid white;border-radius:28px;box-shadow:0 7px 0 #63a88430,0 16px 30px #355e4811;margin-top:5px}.section-kicker{color:#8f54ba;font-weight:500}.section-top{margin-bottom:21px}.section-top h2{color:#2a629f;font-size:29px}.section-top>p{color:#7393a1;font-size:12px}.stage-picker{gap:13px}.stage-button{border-width:2px;border-radius:18px;min-height:108px;background:linear-gradient(145deg,#e6f8ff,#d8f0fc);border-color:#c2e4f2;box-shadow:0 4px 0 #a5cee1}.stage-button:nth-child(2){background:linear-gradient(145deg,#fff3d4,#ffe5b2);border-color:#f4d89f;box-shadow:0 4px 0 #dfbf7c}.stage-button:nth-child(3){background:linear-gradient(145deg,#e2f8d6,#cdefbd);border-color:#b5dea2;box-shadow:0 4px 0 #97c57f}.stage-button:nth-child(4){background:linear-gradient(145deg,#f0e1ff,#e3cafa);border-color:#d0a9ec;box-shadow:0 4px 0 #b38aca}.stage-button:nth-child(5){background:linear-gradient(145deg,#ffe4d9,#ffd2bc);border-color:#f3bca3;box-shadow:0 4px 0 #d8987d}.stage-button .stage-icon{height:62px;width:62px;transform:none}.stage-button .stage-icon .animal-sprite{background-image:url('./assets/school-friends.webp')}.stage-button strong{color:#3f657f;font-size:14px}.stage-button small{color:#7492a2;font-size:9px}.stage-button.active{outline:3px solid #8e47d2;outline-offset:3px;box-shadow:0 4px 0 #9864bf;background:linear-gradient(140deg,#f4e4ff,#e8c9ff)}.stage-button.active:after{color:white;background:#9c58d2;top:8px;left:8px}.stage-button:hover{border-color:#a45ed1;transform:translateY(-4px)}
.games-section.wrap{position:relative;max-width:1164px;margin-top:34px;margin-bottom:36px;padding:31px 30px 35px;background:linear-gradient(145deg,#f6fcffed,#e8f8f2f0);border:3px solid white;border-radius:31px;box-shadow:0 8px 0 #549a7730,0 18px 35px #1c65451a}.catalog-top h2{font-size:28px;color:#295f9d}.catalog-top p{color:#698b99;font-size:12px}.count-tag{background:#e4d2fb;color:#8954b6}.filters{gap:7px}.filters button{background:#dceffb;color:#477d9a;border:1px solid #bfddeb;padding:8px 12px;font-size:11px}.filters button:nth-child(2){background:#e6d8fb;color:#8558ae;border-color:#d1b9e8}.filters button:nth-child(3){background:#e3f6ca;color:#749344;border-color:#c8e2a6}.filters button:nth-child(4){background:#ffe1df;color:#ad6b77;border-color:#edc1c4}.filters button:nth-child(5){background:#fff0b8;color:#ad8b36;border-color:#e8d28e}.filters button.active{background:linear-gradient(145deg,#a45de0,#8246bf);border-color:#9960ce;box-shadow:0 3px 0 #7040a2;color:white}.game-grid{gap:23px 18px}.game-card{border:2px solid white;border-bottom:4px solid #c0a0df;box-shadow:0 5px 0 #a990ba33,0 8px 17px #497a6810;border-radius:21px}.game-card:nth-child(4n+2){border-bottom-color:#8acb91;box-shadow:0 5px 0 #71a97033}.game-card:nth-child(4n+3){border-bottom-color:#e7ba63;box-shadow:0 5px 0 #c59b5433}.game-card:nth-child(4n+4){border-bottom-color:#80bee2;box-shadow:0 5px 0 #689fb933}.game-card:hover{box-shadow:0 8px 0 #c6b5d560,0 17px 30px #51715e25;transform:translateY(-5px)}.card-info h3{color:#3b6595}.card-tag{color:#ab82b8}.card-bottom{color:#92a58e}.play-button{color:#8d4dc1;font-weight:bold}.cover-play{background:#fffcf3f2;color:#8b46ca;box-shadow:0 3px 0 #bd9cd4}.favorite{background:#fffaf0eb;color:#9a71ba}.favorite[aria-pressed="true"]{color:#e0769f;background:#fff0f7}
.friends.wrap{max-width:1164px;padding:28px 30px 31px;margin-bottom:36px;background:linear-gradient(120deg,#fff6d6ed,#fffaf0ed);border:3px solid white;border-radius:29px;box-shadow:0 7px 0 #bb9a3b3d,0 15px 30px #5e6f3215}.friends-top{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:19px}.friends h2{font-size:28px;color:#8d5fa8;line-height:1.3;letter-spacing:-.6px}.friends-top p{font-size:12px;color:#9a9368}.friend-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:10px}.friend-card{position:relative;text-align:center;background:#fffaf2;border:1px solid #f0e5c4;border-radius:17px;padding:11px 4px 12px;box-shadow:0 4px 0 #e4cf9638;transition:transform .2s,background .2s;min-width:0}.friend-card:nth-child(3n+1){background:#fff0e6;border-color:#f4d2b6}.friend-card:nth-child(3n+2){background:#eff5ff;border-color:#d4e0f3}.friend-card:nth-child(3n){background:#f2eafa;border-color:#e2cdef}.friend-card:hover{transform:translateY(-6px);background:#fff;border-color:#cdafe3;box-shadow:0 6px 0 #c7a7de50}.school-character{display:block;width:100%;aspect-ratio:1;background:url('./assets/school-friends.webp') var(--sx,0%) var(--sy,0%)/400% 200% no-repeat;filter:drop-shadow(0 4px 2px #785b3520)}.friend-card strong{display:block;font-size:12px;color:#8b6c92;margin-top:6px}.friend-card small{display:block;font-size:9px;color:#a59695;margin-top:3px}.friend-lead{border:2px solid #b7db9d;background:#e9f9df!important;box-shadow:0 4px 0 #9cc47e55}.friend-card .friend-badge{position:absolute;top:6px;left:6px;background:#c7e7ad;color:#6d9552;font-size:8px;padding:1px 6px;border-radius:20px}.how.wrap{max-width:1164px;padding:33px 30px 35px;margin-bottom:36px;border:3px solid #fff;border-radius:29px;background:linear-gradient(125deg,#eee0fbee,#f7edffed);box-shadow:0 7px 0 #9a70b541}.how-title h2{color:#8150a9}.how-title>p,.how-item p{color:#8b7f9f}.how-item h3{color:#77578e}.how-icon.mint{background:#a8e9b2;color:#4f936d}.how-icon.lilac{background:#ceb3f3;color:#8c56b4}.how-icon.peach{background:#ffc89c;color:#bc8655}.membership.wrap{max-width:1164px;padding:36px 41px;margin-bottom:34px;background:linear-gradient(120deg,#fff0b8,#ffe198);border:3px solid white;box-shadow:0 7px 0 #c7a24d70,0 17px 30px #52703c15;border-radius:30px}.membership h2{color:#926b27}.membership-tag{color:#aa8641}.membership>div>p,.membership ul{color:#a28b5c}.membership li:before{color:#7a9f42}.price-label{color:#a18345}.price strong{color:#86652c}.membership .dark{background:linear-gradient(140deg,#a363d5,#8245ba);box-shadow:0 4px 0 #6a3799;color:white}.price-box .demo-note{color:#a08751}.membership:after{opacity:.08}.footer.wrap{max-width:1164px;background:#ffffffed;backdrop-filter:blur(6px);border:3px solid white;border-radius:24px 24px 0 0;padding:24px 27px;color:#8199a1;gap:14px}.footer-brand{font-size:19px;color:#6b6ca4;letter-spacing:-.3px}.footer-brand span{font-size:9px;color:#87a2aa}.footer button{color:#8295ae}.game-dialog{border-color:#ffffffef;box-shadow:0 30px 100px #21487755}.game-dialog::backdrop{background:#1d4d6e99}.game-ribbon{background:linear-gradient(90deg,#e1f7f1d9,#dff2ffd9),url('./assets/school-world.webp') center 40%/cover;border-color:#c8e4ec}.ribbon-character{background-image:url('./assets/school-friends.webp');transform:rotate(-5deg)}.game-ribbon>div>span{color:#5b8aa1}.game-ribbon small{color:#7e9eb0}.game-header h2{color:#5577aa}.game-body{background:radial-gradient(ellipse at 50% 100%,#e0f5f0a0,transparent 80%)}.game-status.hint{color:#9363b2;background:#f1e6ff;border-color:#d9b9ed}.game-header{background:#f7fcff}.game-bottom{background:#f1faff}.info-dialog{background:#fffdf8}.toast{background:#8a52bd;border-color:#cca7e5;box-shadow:0 5px 0 #653a90}
@media(max-width:1225px){.header.wrap,.stage-section.wrap,.games-section.wrap,.friends.wrap,.how.wrap,.membership.wrap,.footer.wrap{margin-inline:28px}.hero{padding-inline:28px}.hero-copy{padding:27px 24px}.hero h1{font-size:49px}.header nav{gap:22px;font-size:12px}.stage-button{gap:4px;padding:12px 6px}.stage-button .stage-icon{height:48px;width:48px}.stage-button strong{font-size:12px}.stage-button small{font-size:8px}.friend-grid{gap:8px}.friend-card strong{font-size:11px}.friend-card small{font-size:8px}}
@media(max-width:1050px){.header.wrap{padding:12px 21px}.header nav{gap:17px}.brand-name>strong{font-size:23px}.brand-name>b{font-size:20px}.brand-mark{width:49px;height:49px}.hero{gap:22px;min-height:515px}.hero-copy{padding:24px 22px}.hero h1{font-size:43px}.hero-copy>p{font-size:13px}.hero-notes{gap:10px;font-size:9px}.hero-actions{gap:17px}.hero-actions .button{font-size:13px;padding:12px 17px;gap:24px}.quiet-link{font-size:10px}.hero-world{min-height:421px;height:421px}.friends-top p{font-size:11px}.friend-grid{grid-template-columns:repeat(4,1fr);gap:13px}.friend-card{padding:13px 8px}.school-character{max-width:135px;margin:auto}.friend-card strong{font-size:13px;margin-top:5px}.friend-card small{font-size:10px}}
@media(max-width:760px){body{padding-top:14px}.header.wrap{height:87px;margin-inline:20px;padding:10px 17px;border-radius:20px}.brand{gap:8px}.brand-mark{width:45px;height:45px}.brand-name>strong{font-size:21px}.brand-name>b{font-size:18px}.brand-caption{font-size:8px;margin-top:5px}.hero{padding-inline:20px;padding-top:30px;padding-bottom:32px;gap:18px;grid-template-columns:1fr 1fr;min-height:445px}.hero-copy{padding:24px 19px;border-radius:25px}.hero-copy:before{height:9px;width:42px;right:24px;box-shadow:48px 0 0 #ff8c6d,96px 0 0 #ac6cde}.hero h1{font-size:36px;letter-spacing:-1.4px}.hero-copy>p{font-size:12px;margin-top:24px}.hero-actions{gap:16px;margin-top:19px}.hero-actions .button{font-size:12px;min-height:44px;padding:10px 17px;gap:19px}.eyebrow{font-size:9px;margin-bottom:18px;gap:6px;padding:5px 8px}.hero-notes{gap:7px 10px;margin-top:20px;flex-wrap:wrap;font-size:9px}.hero-world{min-height:363px;height:363px}.hero-scene{inset:0 0 35px;border-radius:25px 45px 25px 45px;border-width:3px}.mini-game{width:190px;left:-2px;bottom:-3px;padding:9px 10px 7px;border-radius:14px}.scene-sticker{right:4px;bottom:0;padding:6px 10px;font-size:8px;line-height:1.4;border-radius:8px}.scene-sticker strong{font-size:10px}.stage-section.wrap,.games-section.wrap,.friends.wrap,.how.wrap,.membership.wrap,.footer.wrap{margin-inline:20px}.stage-section.wrap{padding:23px 21px 26px}.section-top h2{font-size:27px}.section-top>p{font-size:10px}.stage-picker{gap:9px}.stage-button{min-height:120px;flex-direction:column;padding:9px 3px;gap:5px;border-radius:14px}.stage-button .stage-icon{height:52px;width:52px}.stage-button strong{font-size:12px}.stage-button small{font-size:8px}.stage-button.active{outline-offset:2px;outline-width:2px}.stage-button.active:after{left:5px;top:5px;height:14px;width:14px;line-height:14px;font-size:10px}.games-section.wrap{padding:25px 21px 30px;margin-top:28px;margin-bottom:28px;border-radius:26px}.catalog-top h2{font-size:25px}.catalog-top p{font-size:11px}.friends.wrap{padding:24px 21px 27px;margin-bottom:28px;border-radius:25px}.friends h2{font-size:26px}.friends-top{align-items:flex-start;gap:17px}.friends-top p{font-size:10px;max-width:180px;padding-top:18px}.friend-grid{gap:11px}.friend-card{padding:11px 5px}.school-character{max-width:125px}.friend-card strong{font-size:12px}.friend-card small{font-size:9px}.how.wrap{padding:28px 23px 31px;margin-bottom:28px;border-radius:25px}.membership.wrap{padding:29px 29px;margin-bottom:28px;border-radius:25px}.footer.wrap{padding:22px 23px;border-radius:21px 21px 0 0}.footer-brand{font-size:18px}.footer-brand span{font-size:9px}}
@media(max-width:480px){.header.wrap{margin-inline:13px;padding:10px 12px;height:83px;border-width:2px;border-radius:18px;gap:10px}.brand{gap:6px}.brand-mark{height:39px;width:36px}.brand-name>strong{font-size:18px;letter-spacing:-.4px}.brand-name>b{font-size:16px;letter-spacing:-.4px;margin-top:2px}.brand-caption{font-size:7px;letter-spacing:.25px;margin-top:5px}.header-actions{gap:7px}.stars-pill{padding:5px 8px;font-size:11px;gap:5px}.stars-pill>span:first-child{font-size:16px}.parent-link{padding:7px 10px;font-size:11px;gap:6px}.hero{display:flex;flex-direction:column;padding-inline:16px;padding-top:25px;padding-bottom:31px;gap:26px}.hero-copy{width:100%;padding:25px 22px 25px;text-align:center;border-radius:27px;border-width:3px;box-shadow:0 6px 0 #579eac36,0 14px 25px #4e786514}.hero-copy:before{right:calc(50% - 75px);transform:rotate(-5deg);width:43px;box-shadow:50px 0 0 #ff8c6d,100px 0 0 #ac6cde}.hero h1{font-size:45px;letter-spacing:-1.6px;line-height:1.16}.eyebrow{font-size:10px;padding:5px 10px;margin-bottom:20px}.hero-copy>p{font-size:13px;line-height:1.8;margin-top:26px}.hero-actions{justify-content:center;gap:18px;margin-top:22px;flex-wrap:nowrap}.hero-actions .button{font-size:13px;padding:12px 20px;gap:26px;min-height:47px}.quiet-link{font-size:10px}.hero-notes{font-size:9px;justify-content:center;gap:13px;margin-top:21px}.hero-world{width:100%;height:369px;min-height:369px}.hero-scene{inset:0 0 36px;border-radius:26px 43px 25px 43px;box-shadow:0 6px 0 #65a9b63b,0 14px 25px #29745b29}.scene-chip{font-size:9px;top:11px;right:11px;padding:6px 11px}.mini-game{width:221px;left:0;bottom:0;padding:11px 13px 8px;border-radius:17px}.scene-sticker{right:10px;bottom:2px;font-size:9px;padding:7px 11px;border-radius:9px}.scene-sticker strong{font-size:12px}.stage-section.wrap,.games-section.wrap,.friends.wrap,.how.wrap,.membership.wrap,.footer.wrap{margin-inline:13px}.stage-section.wrap{padding:22px 15px 26px;border-width:2px;border-radius:24px}.section-top{margin-bottom:19px}.section-top h2{font-size:27px}.section-top>p{font-size:10px;padding-top:7px}.stage-picker{gap:6px}.stage-button{min-height:110px;border-radius:12px;padding:8px 2px 9px;gap:4px;border-width:1px}.stage-button .stage-icon{width:43px;height:43px}.stage-button strong{font-size:10px}.stage-button small{font-size:7px;line-height:1.45}.stage-button.active{outline-width:2px;outline-offset:1px}.stage-button.active:after{height:12px;width:12px;line-height:12px;font-size:9px;top:4px;left:3px}.games-section.wrap{margin-top:25px;margin-bottom:25px;padding:23px 14px 27px;border-radius:25px;border-width:2px}.catalog-top h2{font-size:26px}.catalog-top p{font-size:10px;line-height:1.7}.filters{gap:5px;margin-top:16px;padding-bottom:8px}.filters button{font-size:9px;padding:7px 9px;flex-shrink:0}.game-grid{gap:19px 11px}.game-card{border-radius:16px}.game-card .art-button{height:130px}.card-info{padding:13px 10px 10px}.card-info h3{font-size:15px;letter-spacing:-.4px}.card-info p{font-size:10px;min-height:32px}.card-tag{font-size:8px}.card-bottom{font-size:8px;gap:4px}.play-button{font-size:10px}.friends.wrap{padding:23px 15px 26px;border-width:2px;border-radius:24px;margin-bottom:25px}.friends h2{font-size:26px}.friends-top{display:block;margin-bottom:17px}.friends-top p{font-size:11px;max-width:none;padding-top:8px}.friend-grid{grid-template-columns:repeat(4,1fr);gap:11px 8px}.friend-card{padding:9px 2px 10px;border-radius:13px}.friend-card strong{font-size:10px;line-height:1.4;margin-top:4px}.friend-card small{font-size:7px;line-height:1.4;margin-top:3px}.friend-card .friend-badge{font-size:6px;top:4px;left:3px;padding:1px 4px}.how.wrap{padding:25px 21px 28px;border-width:2px;border-radius:24px;margin-bottom:25px;gap:27px 20px}.membership.wrap{padding:26px 24px 28px;border-width:2px;border-radius:25px;margin-bottom:25px}.membership h2{font-size:34px}.price-box{border-color:#e6c76d}.footer.wrap{padding:21px 20px 23px;border-width:2px;border-radius:23px 23px 0 0;gap:12px}.footer-brand{font-size:17px}.footer-brand span{display:block;margin:5px 0 0;font-size:9px}.footer>p{font-size:9px}.site-scenery{background-position:48% center}.ribbon-character{width:55px;height:55px}.game-ribbon{gap:9px}}
@media(max-width:350px){.brand-mark{height:34px;width:30px}.brand-name>strong{font-size:16px}.brand-name>b{font-size:14px}.brand-caption{font-size:6px}.parent-link{padding:7px 8px;font-size:10px}.header-actions{gap:6px}.stars-pill{padding:5px 6px}.hero-copy{padding:25px 17px}.hero h1{font-size:40px}.hero-actions{gap:12px}.hero-actions .button{font-size:12px;padding:11px 17px;gap:20px}.hero-notes{font-size:8px;gap:10px}.scene-sticker{right:6px;padding:6px 8px;font-size:8px}.scene-sticker strong{font-size:10px}.mini-game{width:203px}.stage-button strong{font-size:9px}.stage-button small{font-size:6px}.stage-button .stage-icon{height:38px;width:38px}.friend-card strong{font-size:9px}.friend-card small{font-size:6px}.card-info h3{font-size:14px}.card-info p{font-size:9px}.card-tag{font-size:7px}.card-bottom{font-size:7px}.play-button{font-size:9px}}
@media(prefers-reduced-motion:reduce){.friend-card,.stage-button,.hero-scene>img{transition:none!important;animation:none!important}}

.hero-scene{bottom:auto;aspect-ratio:3/2}.animal-sprite{background-image:url('./assets/school-friends.webp')}
@media(max-width:480px){.hero-world{height:340px;min-height:340px}.hero-scene{bottom:auto;aspect-ratio:3/2}}

.hero-copy>p{color:#486481}.card-tag{color:#805695}.card-info p{color:#5c7084}.card-bottom{color:#617e69}.stage-button small{color:#527086}.friend-card small{color:#756a81}.friend-card strong{color:#704c82}.catalog-top p,.section-top>p{color:#56798a}.friends-top p{color:#80733e}.footer.wrap{color:#607d89}.footer button{color:#62748b}

/* Selected Yuliluli identity: the elephant and friends, concept 4. */
.header.wrap{height:132px;padding-block:7px}
.brand.brand-logo{display:block;flex-shrink:0;width:164px;line-height:0;letter-spacing:0}
.brand-logo img{display:block;width:100%;height:auto}
.hero h1.hero-logo{font-size:0;line-height:0;letter-spacing:0}
.hero-logo img{display:block;width:100%;height:auto;max-width:390px;margin-inline:auto}
.hero-copy{padding-top:24px}
.hero-copy>.eyebrow{margin-bottom:14px}
.hero-copy>p{margin-top:18px}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@media(max-width:1000px){.header.wrap{height:120px}.brand.brand-logo{width:148px}}
@media(max-width:760px){.header.wrap{height:112px}.brand.brand-logo{width:136px}}
@media(max-width:480px){.header.wrap{height:102px;padding-block:7px}.brand.brand-logo{width:126px}.hero-copy{padding-top:23px}.hero-copy>.eyebrow{margin-bottom:10px}.hero-copy>p{margin-top:15px}}
@media(max-width:350px){.header.wrap{height:96px}.brand.brand-logo{width:116px}}