/* LinguaQuest art-direction v3 tokens, applied across the whole 8+ application. */
:root{--lq-plum:#211238;--lq-purple:#6336b8;--lq-cyan:#32c9f2;--lq-pink:#dd43ae;--lq-gold:#ffd54b;--lq-mint:#77e2bc;--lq-ink:#291a40;--lq-edge:#ab81d7}
body:not(.mini){--age-panel:#40246b;--age-panel-low:#281744;--age-edge:#a17ac8;--age-art:url('../img/concept-a-action-v1.webp');background:radial-gradient(ellipse at 20% 0,#7341ba88,transparent 65%),radial-gradient(ellipse at 100% 45%,#146d9155,transparent 60%),linear-gradient(#2e1b52,#170e2b 85%);background-attachment:fixed}
body:not(.mini) .panel{border:2px solid var(--lq-edge)!important;box-shadow:0 7px 0 #10091f,0 12px 25px #0a061d44;border-radius:25px}
body:not(.mini) .primary{background:linear-gradient(#ffe986,#ffca3f);border:2px solid #fff1ac;color:#30203f;box-shadow:0 5px 0 #9b600b,inset 0 2px 0 #fff8;font-weight:900}body:not(.mini) .secondary{background:linear-gradient(#65408d,#412565);border:1px solid #bd9bdc;color:#fff;box-shadow:0 3px 0 #170b29}
body:not(.mini) .chip,body:not(.mini) .top-btn{background:linear-gradient(#513076,#2f1c4b);border:1px solid #b494d1;color:#fff;box-shadow:0 4px 0 #170c2b,inset 0 1px 0 #fff3}.logo.logo-home{letter-spacing:-1.4px;text-shadow:0 4px 0 #1d0d35}.logo.logo-home span{color:#ffdf42}
body:not(.mini) .profile-row{position:relative;max-width:none;margin:10px 0 12px;padding:12px 14px;border:2px solid #9e78c5;border-radius:22px;background:linear-gradient(100deg,#422862,#28193f);box-shadow:0 5px 0 #160b2b}
body:not(.mini) .hero-scene{background-image:var(--age-art);background-position:center 45%;aspect-ratio:2.25;margin-top:-20px;border-bottom:1px solid #c797e955}.hero-scene svg{visibility:hidden}.hero-scene:after{background:linear-gradient(transparent,var(--age-panel-low))!important}
body:not(.mini) .hero-text{margin:6px 0 0}body:not(.mini) .hero-text h1{font-size:clamp(21px,2.4vw,30px)}body:not(.mini) .hero-text .pill{display:none}body:not(.mini) .hero-text p{font-size:14px;color:#ece0fb}
.world-play{font-size:30px;letter-spacing:1px;min-height:83px;border-radius:24px;margin:18px 0 16px;text-transform:uppercase;box-shadow:0 8px 0 #a06108,inset 0 3px 0 #fff9}
.world-wardrobe{flex:none;min-width:46px;min-height:46px;background:#ffffff19;border:1px solid #cfb1e8;border-radius:14px;font-size:23px;color:#fff;box-shadow:0 3px 0 #190d31}.profile-row .player-level-emblem{width:38px;height:38px}
body:not(.mini) .mode-card{border:2px solid #ffffffad;border-radius:25px;min-height:153px;box-shadow:0 7px 0 #160c2c,inset 0 3px 0 #ffffff55}body:not(.mini) .mc-learn{background:linear-gradient(145deg,#30c9f5,#1766c4)}body:not(.mini) .mc-arena{background:linear-gradient(145deg,#ef63c4,#ad207d)}body:not(.mini) .mc-clubs{background:linear-gradient(145deg,#ffd04e,#ec8117)}body:not(.mini) .mode-card strong{font-size:25px}.mode-card .mc-icon{font-size:38px}
body:not(.mini) #home .home-tabs{background:#29173f;border:1px solid #9872bb;box-shadow:0 5px 0 #150b24}body:not(.mini) #home .home-tab[aria-selected=true]{background:linear-gradient(#ffe785,#ffc535)!important;border-color:#fff0a4!important;color:#2c1b40!important;box-shadow:0 3px 0 #9e650d!important}
body:not(.mini) .footer{background:#211238ee;border-color:#a17cc4}body:not(.mini) .footer button{background:#41245f;color:#fff;border:1px solid #9971ba;min-width:0}body:not(.mini) .footer button.active{background:linear-gradient(#ffe787,#ffc83a);color:#30203f;border-color:#fff0aa}
body:not(.mini) .quick-card .primary{background:linear-gradient(#8bfdac,#32db94);border-color:#beffd5;color:#123b2b;box-shadow:0 5px 0 #147e53}body:not(.mini) .lang-chip{background:linear-gradient(#503575,#302047);border-color:#9d7bc0}body:not(.mini) .lang-chip.active{background:linear-gradient(#36677a,#284251);border-color:#7fe5e7}
body:not(.mini) .lesson,body:not(.mini) .answer{border-radius:19px}body:not(.mini) .statbox{background:#3f295d}.bean-overlay{position:fixed;inset:0;z-index:180;overflow-y:auto;background:radial-gradient(ellipse at top,#6e45aa,#211238 70%);padding:max(16px,env(safe-area-inset-top)) 16px 32px;display:flex;justify-content:center;color:#fff;overscroll-behavior:contain}.bean-box{width:100%;max-width:850px}.bean-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.bean-head h1{font-size:30px}.bean-head button{min-width:48px}.bean-preview{display:flex;flex-direction:column;align-items:center;margin:10px 0 18px;background:radial-gradient(ellipse,#b47ade44,transparent 65%);border-bottom:1px solid #b594d455;padding-bottom:15px}.bean-large{width:min(60vw,260px);height:auto;filter:drop-shadow(0 10px 10px #130c2c66)}.bean-preview strong{font-size:25px;color:#ffe887}.bean-roster{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:15px 0 25px}.bean-hero,.bean-costume{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 5px;border:2px solid #9e7aba;background:#3b265b;color:#fff;border-radius:19px;min-width:0;min-height:95px;font-weight:700}.bean-hero .avatar{width:64px;height:64px}.bean-hero[aria-pressed=true],.bean-costume[aria-pressed=true]{border-color:#ffde78;background:#654178;box-shadow:0 3px 0 #a06c25}.bean-colors{display:flex;flex-wrap:wrap;gap:12px;margin:16px 0 24px}.bean-color{width:56px;height:56px;border-radius:50%;background:var(--swatch);border:3px solid #fff9;color:#241938;font-size:24px;font-weight:900;box-shadow:0 4px 0 #120b24}.bean-color[aria-pressed=true]{outline:3px solid #fff1a8;outline-offset:3px}.bean-costumes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:16px 0 24px}.bean-costume .avatar{width:75px;height:75px}.bean-costume small{font-size:11px}.bean-missions{display:grid;grid-template-columns:1fr 1fr;gap:12px}.bean-mission{display:grid;grid-template-columns:1fr auto;gap:8px;background:#ffffff0d;border:1px solid #a885c3;border-radius:16px;padding:15px}.bean-mission span{font-size:14px}.bean-mission progress{grid-column:1/-1;width:100%;height:12px;accent-color:#6ce1d2}.bean-box>.primary{width:100%;margin:10px 0}
@media(min-width:1000px){body:not(.mini) .footer{width:172px}.world-play{min-height:76px}.hero-scene{aspect-ratio:2.2}}
@media(max-width:699px){body:not(.mini) .top{grid-template-columns:minmax(0,1fr) auto;gap:12px 7px;padding-top:5px;margin-bottom:8px}body:not(.mini) .top .stats{grid-column:1;grid-row:1;gap:5px;flex-wrap:nowrap}body:not(.mini) .top .chip{padding:7px 7px;font-size:12px;min-width:0}body:not(.mini) .top .top-ctl{grid-column:2;grid-row:1;gap:5px}body:not(.mini) .top .logo.logo-home{grid-row:2;grid-column:1/-1;justify-self:center;font-size:38px;line-height:1.2;min-height:52px;margin-top:5px}body:not(.mini) .top .logo .quest-brand-icon{width:34px;height:34px}body:not(.mini) .top-btn{padding:5px;min-width:44px;min-height:44px;font-size:13px}body:not(.mini) .top-btn .flag{width:24px;height:18px}body:not(.mini) #home .home-tabs{margin-bottom:15px}
 body:not(.mini) .hero-scene{aspect-ratio:1.48;background-position:center 50%;margin-top:-16px}body:not(.mini) .profile-row{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;gap:9px;padding:10px;margin-top:0}body:not(.mini) .profile-row .avatar{width:44px;height:44px}body:not(.mini) .profile-row .player-level-emblem{position:absolute;left:38px;top:38px;width:22px;height:22px}body:not(.mini) .profile-row .pr-text{min-width:0}body:not(.mini) .profile-row strong{font-size:16px}.world-wardrobe{min-width:44px;min-height:44px}.world-play{font-size:28px;min-height:78px;margin:15px 0 18px}.hero-game .hero-text h1{font-size:21px!important}.hero-game .hero-text p{font-size:12px!important}.hero-game>.row{font-size:12px}
 body:not(.mini) .mode-cards{grid-template-columns:1fr 1fr;gap:12px}body:not(.mini) .mode-card{min-height:130px;padding:14px 8px}body:not(.mini) .mc-learn{display:flex;grid-column:auto;align-items:center;text-align:center;gap:5px}body:not(.mini) .mc-learn .mc-icon{grid-row:auto}body:not(.mini) .mc-learn small{padding:0 0 10px}body:not(.mini) .mode-card strong{font-size:21px}.mode-card .mc-icon{font-size:32px}body:not(.mini) .footer{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;padding:8px max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))}body:not(.mini) .footer button{padding:8px 2px;min-height:56px;font-size:12px;border-radius:14px;overflow-wrap:normal}.wrap{padding-bottom:calc(110px + env(safe-area-inset-bottom))}.bean-costumes{grid-template-columns:repeat(2,minmax(0,1fr))}.bean-missions{grid-template-columns:1fr}.bean-roster{gap:5px}.bean-hero .avatar{width:46px;height:46px}.bean-hero{font-size:12px;min-height:78px}.bean-color{width:48px;height:48px}}
@media(orientation:landscape) and (max-height:540px){body:not(.mini) .hero-scene{aspect-ratio:3.2}.world-play{min-height:60px;font-size:24px}.bean-preview{flex-direction:row;justify-content:center}.bean-large{width:140px}}

.hero3d-stage{position:absolute;inset:0;z-index:2;background:radial-gradient(ellipse at center,#6336b8,#211238ee 80%)}.hero3d-canvas{width:100%;height:100%;display:block;cursor:grab;outline-offset:-4px}.hero3d-canvas:active{cursor:grabbing}.hero3d-stage:has(canvas){background:radial-gradient(ellipse at center,#663faf,#211238ee 80%)}.bean-3d-stage{position:relative;width:min(70vw,310px);height:360px}.bean-3d-stage>svg{position:absolute;inset:0;margin:auto;height:100%;width:auto}.bean-3d-stage:has(canvas)>svg{visibility:hidden}.bean-features{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:20px 0}.bean-features label{display:flex;flex-direction:column;gap:8px;font-weight:700}.bean-features select{width:100%;min-height:48px;background:#40246b;color:#fff;border:2px solid #ab81d7;border-radius:12px;padding:8px}.hero-game .hero-scene{position:relative;min-height:320px}@media(min-width:900px){.hero-game .hero-scene{min-height:390px}}@media(orientation:landscape) and (max-height:540px){.hero-game .hero-scene{min-height:240px}.bean-3d-stage{height:270px}}

.hero-scene .hero3d-fallback{visibility:visible;position:absolute;inset:0;margin:auto;width:auto;height:95%}.hero3d-stage:has(canvas)>.hero3d-fallback{visibility:hidden}.hero3d-canvas:focus:not(:focus-visible){outline:none}.hero3d-canvas:focus-visible{outline:3px solid #ffd54b}

/* The action ensemble and the interactive player are separate, visible lobby elements. */
body:not(.mini) .hero-game .hero-scene{min-height:0;aspect-ratio:1.95;background-size:cover;background-position:center;margin-top:0}
body:not(.mini) .hero-game>.hero3d-stage{position:relative;inset:auto;width:100%;height:220px;border-radius:20px;margin:8px 0;background:radial-gradient(ellipse,#65409966,transparent 70%)}
.hero3d-stage>.hero3d-fallback{visibility:visible;position:absolute;inset:0;margin:auto;width:auto;height:95%}.hero3d-stage:has(canvas)>.hero3d-fallback{visibility:hidden}
@media(min-width:1000px){body:not(.mini) .hero-game>.hero3d-stage{height:245px}}
@media(orientation:landscape) and (max-height:540px){body:not(.mini) .hero-game>.hero3d-stage{height:190px}}

@media(max-width:699px){body:not(.mini) .hero-game>.hero3d-stage{height:145px}.bean-features{gap:10px}.bean-features select{font-size:14px}.bean-head{position:sticky;top:0;z-index:3;background:#30204eee;border-radius:15px;padding:8px}}
body.in-play:not(.mini) .footer{display:none}

body .top .logo.logo-home .tima-wordmark{width:clamp(180px,55vw,260px);height:clamp(44px,13vw,64px);object-fit:cover;max-width:100%;margin:0;border-radius:0;box-shadow:none}.logo.logo-home{line-height:1}
