.device-picker{position:fixed;top:14px;left:50%;transform:translateX(-50%);display:flex;gap:4px;padding:4px;background:#ffffffa6;backdrop-filter:blur(15px);border:1px solid #ffffffc9;border-radius:15px;z-index:120;box-shadow:0 3px 12px #59467612}.device-picker button{background:transparent;padding:7px 16px;color:#9587a3;border-radius:11px;font-size:11px;font-weight:900}.device-picker button.selected{background:#8162c1;color:#fff;box-shadow:0 2px 0 #62469b}body{padding-top:51px}.phone{height:min(884px,calc(100dvh - 81px))}#toast{bottom:105px}
@media(min-width:760px){body[data-device=tablet] .phone{width:min(1060px,calc(100vw - 70px));height:min(815px,calc(100dvh - 87px));border-width:11px;border-radius:36px;box-shadow:0 25px 85px #32274c35,0 0 0 2px #81768b,0 0 0 5px #c8c0d0}body[data-device=tablet] .phone-status{height:28px;min-height:28px;padding:5px 25px 0;font-size:10px}body[data-device=tablet] .island{width:7px;height:7px;top:8px;background:#56516b}body[data-device=tablet] .workspace{padding-left:32px;padding-right:32px;padding-bottom:105px}body[data-device=tablet] header{height:82px;gap:12px}body[data-device=tablet] .app-greeting>span{font-size:11px}body[data-device=tablet] .app-greeting>strong{font-size:20px}body[data-device=tablet] header .avatar{height:48px;width:48px}body[data-device=tablet] .xp-button{font-size:14px;padding:11px 14px}body[data-device=tablet] .parent-button{margin-left:8px}body[data-device=tablet] .parent-button svg{height:22px;width:22px}body[data-device=tablet] #mobile-nav{height:82px;padding:7px max(40px,calc((100% - 650px)/2)) 17px;border-radius:23px 23px 0 0}body[data-device=tablet] #mobile-nav button{min-width:80px;font-size:10px}body[data-device=tablet] #mobile-nav .tab-icon{width:55px;height:35px}body[data-device=tablet] .home-indicator{width:180px;height:4px}body[data-device=tablet][data-page=home] main{display:grid;grid-template-columns:1.06fr 1fr;gap:0 27px;align-items:stretch}body[data-device=tablet] .adventure{grid-column:1;grid-row:1 / 3;height:auto;min-height:340px}body[data-device=tablet] .adventure-title{padding-top:23px}body[data-device=tablet] .adventure h1{font-size:clamp(34px,4vw,48px)}body[data-device=tablet] .stage-necati{right:-10px;height:213px}body[data-device=tablet] .stage-sakir{height:235px}body[data-device=tablet] .stage-mirket{height:173px;left:15px}body[data-device=tablet] .adventure-button{width:76%;font-size:16px}body[data-device=tablet] .mission-strip{grid-column:1;grid-row:3;margin-top:5px;padding-bottom:0}body[data-device=tablet] .mission-strip strong{font-size:13px}body[data-device=tablet] .mission-strip span{font-size:10px}body[data-device=tablet][data-page=home] main>.section-heading:nth-child(3){grid-column:2;grid-row:1;margin:2px 0 16px;align-self:start}body[data-device=tablet] .play-worlds{grid-column:2;grid-row:2 / 4;gap:18px 14px;align-self:stretch}body[data-device=tablet] .play-world{height:auto;min-height:152px;padding:18px}body[data-device=tablet] .play-world strong{font-size:27px}body[data-device=tablet] .play-world>span:not(.world-sticker){font-size:9px}body[data-device=tablet] .play-world img{height:145px;width:107px;right:-24px}body[data-device=tablet] .explore-world img{width:137px;right:-42px}body[data-device=tablet][data-page=home] main>.section-heading:nth-child(n+5),body[data-device=tablet] .horizontal-cards,body[data-device=tablet] .treasure-banner,body[data-device=tablet] .friend-row,body[data-device=tablet] .app-end{grid-column:1 / -1}body[data-device=tablet] .section-heading h2{font-size:21px}body[data-device=tablet] .horizontal-cards{margin:0;overflow:visible;padding:0 0 8px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}body[data-device=tablet] .horizontal-cards .card-visual{height:170px}body[data-device=tablet] .horizontal-cards .card-visual img{height:180px}body[data-device=tablet] .card-content{padding:14px 16px}body[data-device=tablet] .card-content h3{font-size:16px}body[data-device=tablet] .card-content p{font-size:10px}body[data-device=tablet] .treasure-banner{padding:20px 23px}body[data-device=tablet] .treasure-banner strong{font-size:19px}body[data-device=tablet] .treasure-banner small{font-size:11px}body[data-device=tablet] .friend-row{gap:25px;margin:0;padding:4px 0 12px}body[data-device=tablet] .friend-row button{width:81px}body[data-device=tablet] .friend-row button>span{height:81px;width:81px;border-radius:26px}body[data-device=tablet] .friend-row img{width:78px;height:104px}body[data-device=tablet] .friend-row strong{font-size:12px}body[data-device=tablet] .page-intro{min-height:210px;padding:29px}body[data-device=tablet] .page-intro h1{font-size:38px}body[data-device=tablet] .page-intro p{font-size:14px;max-width:63%}body[data-device=tablet] .page-intro img{height:236px;width:220px;right:35px;bottom:-35px}body[data-device=tablet] .card-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}body[data-device=tablet] .card-visual{height:170px}body[data-device=tablet] .card-visual img{height:178px}body[data-device=tablet] .characters{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}body[data-device=tablet] .character img{height:175px}body[data-device=tablet] .parent-grid{grid-template-columns:1fr 1fr;gap:20px}body[data-device=tablet] .chips{margin:0 0 20px;padding:4px 0 7px}body[data-device=tablet] .screen-note{font-size:12px}body[data-device=tablet] .stats{gap:17px}body[data-device=tablet] .badge-grid{gap:17px}body[data-device=tablet] .badge{font-size:14px}body[data-device=tablet] .badge small{font-size:11px}body[data-device=tablet] dialog{width:530px;padding:32px;max-width:calc(100% - 40px)}body[data-device=tablet] dialog .characters{grid-template-columns:repeat(2,minmax(0,1fr))}body[data-device=tablet] dialog .character img{height:128px}body[data-device=tablet] dialog .modal-art{height:210px}body[data-device=tablet] dialog .modal-art img{height:238px}body[data-device=tablet] .memory-card img{height:82px}body[data-device=tablet] .canvas-wrap canvas{height:310px}body[data-device=tablet] .badge-grid{margin-bottom:28px}body[data-device=tablet] .sensory{height:330px}}
@media(min-width:760px) and (max-width:950px){body[data-device=tablet] .workspace{padding-left:23px;padding-right:23px}body[data-device=tablet][data-page=home] main{gap:0 19px}body[data-device=tablet] .play-world{padding:13px;min-height:150px}body[data-device=tablet] .play-world strong{font-size:22px}body[data-device=tablet] .play-world img{height:125px;width:85px;right:-21px}body[data-device=tablet] .explore-world img{width:115px;right:-40px}body[data-device=tablet] .play-world>span:not(.world-sticker){font-size:7px}body[data-device=tablet] .adventure h1{font-size:34px}body[data-device=tablet] .stage-necati{right:-42px;height:197px}body[data-device=tablet] .stage-sakir{height:214px}body[data-device=tablet] .stage-mirket{left:0;height:143px}body[data-device=tablet] .section-heading h2{font-size:18px}body[data-device=tablet] .mission-strip strong{font-size:11px}body[data-device=tablet] .mission-strip span{font-size:8px}body[data-device=tablet] .adventure-button{font-size:13px}body[data-device=tablet] .character img{height:137px}}
@media(max-width:759px){.device-picker{display:none}body{padding-top:0}.phone{height:100dvh}body[data-device=tablet] .phone{width:100%;height:100dvh;border:0;border-radius:0;box-shadow:none}body[data-device=tablet] .phone-status{display:none}body[data-device=tablet] .home-indicator{display:none}}