:root{--ink:#4b2418;--muted:#8d7568;--cream:#fffdf4;--yellow:#ffe27d;--orange:#ff8619;--mint:#9fe89e;--aqua:#43cfe4;--coral:#ff8172;--lavender:#b58bea;--line:#f1e5cf}
.ocean-lobby.chat-open>.lobby-top,.ocean-lobby.chat-open>.hubNav{display:none}.chat-open .assistantTop{padding-top:calc(env(safe-area-inset-top) + 13px)}
html,body{background:#dff5e3;color:var(--ink)}
html,body{overscroll-behavior-x:none}
.ocean-lobby{touch-action:pan-y pinch-zoom}
button,input{font-family:inherit}.ocean-lobby{left:50%;width:min(100%,520px);transform:translateX(-50%);padding-bottom:88px;color:var(--ink);background:linear-gradient(180deg,#fff0a9 0 18%,#fffdf4 39%,#fff 100%);box-shadow:0 0 70px #58785d42}.ocean-lobby:before{content:"";position:fixed;z-index:-1;inset:0;pointer-events:none;background:radial-gradient(circle at 88% 12%,#fff9 0 9%,transparent 9.5%),radial-gradient(circle at 8% 34%,#ffc85b55 0 3%,transparent 3.5%),linear-gradient(145deg,transparent 0 22%,#fff5 22.5% 31%,transparent 31.5%);opacity:.8}
.lobby-top{position:relative;top:auto;display:block;padding:calc(env(safe-area-inset-top) + 14px) 18px 8px;background:transparent;box-shadow:none;backdrop-filter:none}.searchRow{display:flex;align-items:center;gap:9px}.gameSearch{height:48px;min-width:0;flex:1;display:flex;align-items:center;gap:9px;padding:0 15px;border:1px solid #fff;border-radius:25px;background:#fffffff2;box-shadow:0 8px 20px #b8904930}.gameSearch span{font-size:28px;line-height:1;color:#76665d;transform:rotate(-20deg)}.gameSearch input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--ink);font-size:15px}.gameSearch input::placeholder{color:#9c9188}.topAction,.avatarBtn{flex:none;width:44px;height:44px;border-radius:15px;background:#fff9e5;box-shadow:0 6px 16px #b8904936;color:var(--ink);font-size:20px}.avatarBtn{border:3px solid #fff;font-size:23px}.userStrip{display:flex;align-items:center;gap:8px;margin-top:10px;padding:0 3px}.player{min-width:0;flex:1}.player b{font-size:13px}.player small{margin-top:2px;color:#8e7566;font-size:10px}.resources{display:flex;gap:6px}.pill,.coinPill{padding:6px 9px;border:1px solid #fff8;border-radius:14px;background:#fff8dd;color:#6e421d;font-size:10px;font-weight:850;box-shadow:0 3px 10px #b8904922}
.hubScreen{display:none;padding:0 16px}.hubScreen.active{display:block}.hubTitle{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;column-gap:8px;padding:16px 0 13px;text-align:center}.hubTitle h1{margin:0;color:#572414;font-size:35px;line-height:1;letter-spacing:1px}.hubTitle>span{color:#ffb932;font-size:22px}.hubTitle>span:first-child{text-align:right}.hubTitle>span:nth-child(3){text-align:left}.hubTitle p{grid-column:1/-1;margin:8px 0 0;color:#765344;font-size:14px}
.featuredBanner{position:relative;min-height:176px;overflow:hidden;padding:20px 16px;border:7px solid #fff9e9;border-radius:30px;background:radial-gradient(circle at 80% 20%,#fff9 0 7%,transparent 7.5%),linear-gradient(145deg,#ffe681,#ffb93d 70%,#ff941c);box-shadow:0 12px 27px #c987303f,inset 0 0 0 2px #ffd365}.featureCopy{position:relative;z-index:2;width:55%}.featureCopy small{display:inline-block;padding:4px 8px;border-radius:10px;background:#fff8;color:#8a4a13;font-weight:850}.featureCopy h2{margin:8px 0 4px;font-size:21px;line-height:1.05}.featureCopy p{margin:0 0 13px;color:#704a2e;font-size:11px;line-height:1.45}.playNow,.playCurrent{min-width:112px;padding:10px 16px;border:2px solid #fff;border-radius:20px;background:#ff8619;color:#fff;font-size:13px;font-weight:900;box-shadow:0 6px 14px #c75e2340}.mascots{position:absolute;right:3px;bottom:17px;display:flex;align-items:flex-end}.mascots i{display:flex;align-items:center;justify-content:center;width:57px;height:74px;margin-left:-18px;border:5px solid #fff7;border-radius:28px 28px 20px 20px;background:linear-gradient(160deg,#5ce0c4,#159cc5);box-shadow:0 8px 14px #8c531f38;font-style:normal;font-size:33px}.mascots i:nth-child(2){height:88px;background:linear-gradient(160deg,#c4a0ff,#785fe0)}.mascots i:nth-child(3){background:linear-gradient(160deg,#ff9c55,#ff642a)}
.contentSection{padding:20px 0 12px}.sectionHead{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.sectionHead h2,.categoryPanel h2{margin:0;font-size:20px}.sectionHead button{padding:5px;background:transparent;color:#8d796f;font-size:12px}.featuredGames{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px 11px}.gameCard{min-width:0;padding:0;background:transparent;color:var(--ink);text-align:left}.gameCard[hidden]{display:none}.gameArt{position:relative;display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:1;border-radius:21px;box-shadow:0 8px 16px #6f60442b,inset 0 1px #fff8;font-size:38px}.gameArt:after{content:"";position:absolute;inset:7px;border-radius:15px;background:linear-gradient(145deg,#fff5,transparent 45%);pointer-events:none}.gameArt i{position:absolute;z-index:2;right:-4px;top:-5px;display:grid;place-items:center;width:24px;height:24px;border:2px solid #fff;border-radius:50%;background:#ff8619;color:#fff;font-style:normal;font-size:11px}.artOcean{background:linear-gradient(145deg,#5ed6ff,#238cff)}.artRace{background:linear-gradient(145deg,#ffcf66,#ff7967)}.artBlock{background:linear-gradient(145deg,#b2ed72,#54c979)}.artMaze{background:linear-gradient(145deg,#a4e9ff,#69a9ff)}.artSnake{background:linear-gradient(145deg,#8be97b,#2ab36f)}.artBubble{background:linear-gradient(145deg,#d397ff,#6a7eff)}.gameCard b,.gameCard small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gameCard b{margin:8px 2px 2px;font-size:11px}.gameCard small{margin:0 2px;color:#907d72;font-size:9px}
.categoryPanel{margin:4px -3px 12px;padding:16px 12px 18px;border:1px solid #f5ead8;border-radius:28px;background:#ffffffd9;box-shadow:0 12px 30px #917d5a1b}.categoryPanel h2{margin-bottom:13px}.categoryGrid{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}.categoryGrid button,.quickLinks button{min-width:0;background:transparent;color:var(--ink)}.categoryGrid span{display:grid;place-items:center;width:54px;max-width:100%;aspect-ratio:1;margin:auto;border-radius:50%;box-shadow:0 8px 15px #685b442d,inset 0 2px #fff8;font-size:24px}.categoryGrid b{display:block;margin-top:7px;font-size:10px}.catBlue{background:linear-gradient(145deg,#7dd7ff,#2d8fe8)}.catOrange{background:linear-gradient(145deg,#ffd866,#ff9b16)}.catGreen{background:linear-gradient(145deg,#a9ee6a,#5fc944)}.catCoral{background:linear-gradient(145deg,#ffa491,#ff7065)}.catAqua{background:linear-gradient(145deg,#72e5d9,#21bcb0)}.quickLinks{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:15px}.quickLinks button{padding:10px 5px;border-radius:15px;background:#fff8e9;box-shadow:inset 0 0 0 1px #f2e5ce;font-size:14px}.quickLinks b{display:block;margin-top:3px;font-size:9px}
.hubNav{position:fixed;z-index:9;left:50%;bottom:0;width:min(100%,520px);height:76px;display:grid;grid-template-columns:repeat(5,1fr);padding:8px 10px calc(env(safe-area-inset-bottom) + 6px);transform:translateX(-50%);border-top:1px solid #f1e7d8;background:#fffffff3;box-shadow:0 -10px 30px #7e6d4d20;backdrop-filter:blur(12px)}.hubNav button{background:transparent;color:#8e8982}.hubNav span,.hubNav b{display:block}.hubNav span{font-size:22px;line-height:1}.hubNav b{margin-top:5px;font-size:10px}.hubNav button.active{color:#ff7d12}.hubNav button.active span{transform:translateY(-2px)}
.mapHeading{display:flex;align-items:center;gap:12px;padding:12px 3px 10px}.mapHeading button{width:40px;height:40px;border-radius:14px;background:#fff;color:var(--ink);box-shadow:0 5px 14px #856c4133;font-size:28px}.mapHeading h1{margin:0;font-size:22px}.mapHeading p{margin:3px 0 0;color:var(--muted);font-size:10px}.journey{min-height:1000px;margin:0 0 16px;padding:17px 9px 45px;border:1px solid #f6dca4;border-radius:28px;background:linear-gradient(180deg,#fff4ba,#d9f7ec 62%,#c6eff3);box-shadow:0 15px 35px #927a4a25}.journey h2{color:var(--ink)}.continueBar{position:static;width:auto;display:flex;margin:0 2px 20px;padding:9px;border:1px solid #fff;border-radius:18px;background:#ffffffe8;transform:none;box-shadow:0 7px 18px #7f69462b}.continueBar .stock{color:#6e5140}.playCurrent{min-width:126px;border:0}.route{min-height:880px}.route:before{border-color:#60cbbb55}.levelNode{border-color:#fff;background:linear-gradient(145deg,#69dfd0,#25aebd);box-shadow:0 7px 14px #537e7740;color:#fff}.levelNode.locked{border-color:#fff;background:#b9c9c5;color:#718780}.levelNode.current{border-color:#fff;background:linear-gradient(145deg,#ffd85c,#ff8a1d);box-shadow:0 0 0 8px #ffb63425,0 7px 15px #b87c3138}
.miniModal{background:#4c392b7a}.miniCard{border:7px solid #fff;border-radius:29px;background:linear-gradient(180deg,#fff9d8,#fff);box-shadow:0 24px 60px #5a453a55;color:var(--ink)}.miniCard input{border:1px solid #eadac3;background:#fff;color:var(--ink)}.miniClose{background:#ffe6b6;color:#6a391f}.settingRow{border-color:#eee1cf}.settingRow button{background:#fff0cc;color:var(--ink)}.miniAction{background:linear-gradient(135deg,#ffb334,#ff7c19)}
.modal{background:#57402e88}.modal .dialog,.modal .panel{border:7px solid #fff!important;background:linear-gradient(180deg,#fff5be,#fffdf8)!important;box-shadow:0 25px 70px #513d3355!important;color:var(--ink)!important}.modal .dialog p,.modal .dialog small,.modal .dialog em,.modal .benefits{color:#7f6b60!important}.modal .dialog button,.mainBtn{background:linear-gradient(135deg,#ffb532,#ff7c18)!important}.modal input{border-color:#eadcc8!important;background:#fff!important;color:var(--ink)!important}
.oceanSplash{background:linear-gradient(160deg,#d8f7df,#fff0ac 52%,#ffd6d0);color:var(--ink)}.oceanSplash img{border:8px solid #fff;box-shadow:0 20px 50px #6d65514a}.oceanSplash p,.oceanSplash small{color:#846b59}.oceanSplash i{background:linear-gradient(90deg,#54d5e4,#ffcf4a,#ff806f)}
.app{background:radial-gradient(circle at 85% 7%,#ffd3c2,transparent 25%),linear-gradient(180deg,#fff1a8,#fffdf5 48%,#dff6f0);color:var(--ink)}.app .stars{opacity:.12}.app .brand p,.app .level span,.app .card small{color:#8d7568}.app .level,.app .card{border-color:#fff;background:#ffffffe0;box-shadow:0 7px 18px #806c4923}.app .board{border:7px solid #fff;background:linear-gradient(145deg,#bdeff4,#78d5e4);box-shadow:0 16px 34px #537f8640}.app .tile{background:#fff8!important;box-shadow:inset 0 2px 2px #fff8,0 3px 7px #42747a35}.app .tool{border-color:#fff;background:linear-gradient(145deg,#8ee6d9,#42bfc7);box-shadow:0 6px 14px #517a7630}.app .tool.memberBtn{background:linear-gradient(145deg,#ffd568,#ff9f25)}.app .tool.primary{background:linear-gradient(145deg,#ff9a8a,#ff6c68)}.hallBtn{background:#fff!important;color:var(--ink)!important;box-shadow:0 4px 12px #806b4d2c!important}.toast{border-color:#fff;background:#4d352be8}
@media(max-width:380px){.lobby-top{padding-left:12px;padding-right:12px}.hubScreen{padding-left:12px;padding-right:12px}.hubTitle h1{font-size:31px}.featuredBanner{min-height:164px;padding-left:13px}.featureCopy h2{font-size:18px}.mascots i{width:50px;height:66px;font-size:27px}.mascots i:nth-child(2){height:78px}.featuredGames{gap:7px}.gameArt{font-size:31px}.categoryGrid{gap:4px}.categoryGrid span{width:49px}.continueBar{display:block}.continueBar .stock{min-height:36px}.playCurrent{width:100%}}

/* 2.6.0: keep scrolling content inside the safe area and below solid chrome. */
.ocean-lobby{display:flex;flex-direction:column;overflow:hidden;overscroll-behavior:contain;isolation:isolate;padding-bottom:0}
.lobby-top{position:relative;z-index:30;top:auto;flex:none;background:linear-gradient(180deg,#fff0a9 0%,#fff5c9 78%,#fff5c9f5 100%);box-shadow:0 8px 18px #9a7f4d22;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.lobby-top:after{content:"";position:absolute;z-index:-1;inset:0;background:#fff3b8f2}
.hubScreen{position:relative;z-index:1;flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-bottom:24px}.hubScreen.active{display:block}.hubNav{position:relative;z-index:35;left:auto;bottom:auto;flex:none;width:100%;transform:none;background:#fff}.categoryPanel{margin-bottom:18px}

/* Expanded profile and account center. */
.profilePage{text-align:left}.profilePage.compact{padding-top:4px}.profileHero{display:grid;grid-template-columns:58px 1fr auto;gap:12px;align-items:center;margin:-4px -4px 17px;padding:13px;border:1px solid #ffe1a7;border-radius:21px;background:linear-gradient(145deg,#fff2b2,#fff9e8)}
.profileAvatar{display:grid;place-items:center;width:58px;height:58px;border:4px solid #fff;border-radius:20px;background:linear-gradient(145deg,#7fe0ed,#2cb5cf);box-shadow:0 7px 15px #6b71503b;font-size:31px}.profileHero h2{margin:0 0 4px;font-size:19px}.profileHero p{max-width:155px;margin:0!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#8e7467!important;font-size:10px!important}.profileLevel{padding:5px 8px;border-radius:11px;background:#ff921f;color:#fff;font-size:10px;font-weight:900}.profileSectionTitle{margin:17px 2px 7px;color:#795141;font-size:12px;letter-spacing:.4px}.profileField{display:block;margin:8px 0}.profileField>span{display:block;margin:0 3px 5px;color:#806b5e;font-size:10px;font-weight:800}.profileField input{margin:0!important}.profilePage .avatars{display:grid;grid-template-columns:repeat(8,1fr);gap:5px}.profilePage .avatars button{width:100%;height:auto;aspect-ratio:1;font-size:18px}.profileMenu{width:100%;display:flex;align-items:center;justify-content:space-between;margin:7px 0;padding:11px 12px;border:1px solid #f0e1cb;border-radius:15px;background:#fff;color:var(--ink);text-align:left}.profileMenu>span{display:grid;grid-template-columns:27px 1fr;align-items:center;width:100%;font-size:18px}.profileMenu b,.profileMenu small{grid-column:2;display:block}.profileMenu b{font-size:12px}.profileMenu small{margin-top:2px;color:#9a8579;font-size:9px}.profileMenu i{color:#bd9f8c;font-size:25px;font-style:normal}.profileMenu.static{cursor:default}.profileStats{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:9px 0}.profileStats div{padding:9px 3px;border-radius:13px;background:#fff2cf;text-align:center}.profileStats b,.profileStats small{display:block}.profileStats b{font-size:16px;color:#ed7c19}.profileStats small{margin-top:2px;color:#8b786d;font-size:8px}.profileTitle{display:flex;align-items:center;gap:10px;margin-bottom:14px}.profileTitle h2{margin:0}.profileTitle p{margin:3px 0 0!important}.profileBack{width:38px;height:38px;border-radius:13px;background:#fff0cc!important;color:var(--ink)!important;font-size:27px!important}.securityNote{margin:12px 0;padding:11px;border-radius:13px;background:#eaf9f6;color:#52716b;font-size:10px;line-height:1.5}.profilePage .langSwitch{display:flex;gap:5px}.profilePage .settingRow{align-items:center}.miniCard:has(.profilePage){padding:44px 18px 20px}
.assistantHero,.backpackHero{display:flex;align-items:center;gap:11px;text-align:left}.assistantHero>span,.backpackHero>span{display:grid;place-items:center;width:52px;height:52px;border-radius:17px;background:linear-gradient(145deg,#4ed9ef,#8c6cff);color:#fff;font-size:26px}.assistantHero h2,.backpackHero h2{margin:0}.assistantHero p,.backpackHero p{margin:3px 0 0!important;color:#8e7467!important;font-size:10px!important}.assistantAnswer{min-height:78px;margin:15px 0 10px;padding:14px;border-radius:16px;background:#edfaff;color:#40616b;text-align:left;font-size:12px;line-height:1.65}.assistantPrompts{display:flex;gap:6px}.assistantPrompts button{flex:1;padding:9px 4px;border-radius:11px;background:#fff0cc;color:var(--ink);font-size:9px;font-weight:800}.assistantInput{display:flex;gap:7px;margin-top:11px}.assistantInput input{margin:0!important}.assistantInput button{padding:0 14px;border-radius:13px;background:#ff8a1f;color:#fff;font-weight:800}.assistantNote{display:block;margin-top:9px;color:#9b8779}.itemGrid{display:grid;gap:8px;margin:15px 0}.itemGrid article{display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:9px;padding:12px;border:1px solid #f0e0c8;border-radius:16px;background:#fff;text-align:left}.itemGrid article>span{font-size:26px}.itemGrid b,.itemGrid small{display:block}.itemGrid small{margin-top:3px;color:#9a8579;font-size:9px}.itemGrid strong{color:#ed7c19;font-size:13px}.itemGrid .lockedItem{opacity:.58}.backpackTip{padding:10px;border-radius:12px;background:#fff5d8;color:#796858!important;font-size:10px!important;line-height:1.55!important;text-align:left}
.assistantScreen{height:100%;padding:0!important;overflow:hidden!important;background:linear-gradient(180deg,#fff9df,#fff 35%)}.assistantScreen.active{display:flex!important;flex-direction:column}.assistantTop{flex:none;display:grid;grid-template-columns:44px 1fr 52px;align-items:center;gap:9px;padding:13px 15px 11px;border-bottom:1px solid #f0e4d2;background:#fffdf8}.assistantTop button{height:38px;border-radius:13px;background:#fff0cc;color:var(--ink);font-size:12px;font-weight:800}.assistantTop button:first-child{font-size:27px}.assistantTop h1{margin:0;font-size:18px}.assistantTop p{margin:2px 0 0;color:#998376;font-size:9px}.assistantMessages{flex:1;min-height:0;overflow-y:auto;padding:18px 14px 10px;overscroll-behavior:contain}.assistantMessage{display:flex;align-items:flex-start;gap:8px;margin:0 0 16px}.assistantMessage>span{flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:11px;background:linear-gradient(145deg,#52d9e8,#846be9);color:#fff;font-size:16px}.assistantMessage>div{max-width:78%;padding:11px 13px;border-radius:5px 17px 17px;background:#fff;box-shadow:0 5px 16px #856f5520;color:#4f4038;font-size:12px;line-height:1.6;white-space:pre-wrap}.assistantMessage.user{flex-direction:row-reverse}.assistantMessage.user>span{background:linear-gradient(145deg,#ffca4b,#ff7e22)}.assistantMessage.user>div{border-radius:17px 5px 17px 17px;background:#ff9a28;color:#fff}.assistantQuick{flex:none;display:flex;gap:7px;padding:8px 13px;overflow-x:auto}.assistantQuick button{flex:none;padding:8px 11px;border:1px solid #f0dfc5;border-radius:16px;background:#fff8e8;color:#725446;font-size:10px}.assistantComposer{flex:none;display:grid;grid-template-columns:1fr 58px;gap:8px;padding:9px 13px calc(env(safe-area-inset-bottom) + 10px);border-top:1px solid #eee2d1;background:#fff}.assistantComposer textarea{min-height:42px;max-height:96px;resize:none;padding:11px 13px;border:1px solid #eadbc7;border-radius:15px;background:#fffdf8;color:var(--ink);font:inherit;font-size:12px;outline:0}.assistantComposer button{border-radius:14px;background:linear-gradient(135deg,#ffb334,#ff7c19);color:#fff;font-weight:900}
@media(max-width:360px){.profilePage .avatars{grid-template-columns:repeat(4,1fr)}.profileHero{grid-template-columns:52px 1fr}.profileLevel{display:none}.profileAvatar{width:52px;height:52px}}
