@font-face{font-family:Jua;src:url('/public/fonts/Jua-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
:root{--ink:#263951;--mint:#61cdb7;--gold:#f7cd79;--paper:#fff8e8;color:var(--ink);background:#f3f7ec}
h1,h2,h3,.brand>span,.button,.world-heading b,.room-code b,.lesson-hud h2,.pet-card-title b,.landing-description,.continue-game{font-family:Jua,'Malgun Gothic',sans-serif;font-weight:400;letter-spacing:0}
.ui-icon{width:23px;height:23px;flex-shrink:0;vertical-align:middle}
.button{border:2px solid #263951;border-radius:13px;font-size:18px;gap:16px;box-shadow:0 4px 0 #263951;transition:transform .15s,box-shadow .15s}
.button:hover{transform:translateY(-2px);box-shadow:0 6px 0 #263951}
.button:active{transform:translateY(3px);box-shadow:0 1px 0 #263951}
.button.primary{background:linear-gradient(#83e1c6,#55c6b3);color:#1c414a;border-color:#263951}
.button.primary:hover{background:linear-gradient(#9aebd4,#65d4c1)}
.button.secondary,.button.outline{background:#fff3d9;color:#263951}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #f096a3;outline-offset:4px}
/* A little illustrated badge rather than a floating application card. */
.world-heading{position:relative;background:linear-gradient(140deg,#354765,#23334d);border:2px solid #263951;border-radius:14px 23px 23px 14px;padding:8px 20px 8px 5px;box-shadow:0 4px 0 #17263e, inset 0 2px 0 #ffffff30;min-height:74px;color:#fff2d3;gap:7px}
.world-heading:after{content:'';position:absolute;left:88px;right:18px;bottom:7px;height:2px;background:linear-gradient(90deg,#e6bd72,transparent);pointer-events:none}
.world-heading .world-badge{width:61px;height:61px;flex-shrink:0;margin:-9px 0 -9px -8px;filter:drop-shadow(0 3px 0 #16243c60)}
.world-heading>div{min-width:0;max-width:260px}
.world-heading b{font-size:23px;line-height:1.2;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-shadow:0 2px 0 #142c45}
.world-heading small{color:#b9dbde;font-size:11px;letter-spacing:0;line-height:1.7}
.world-heading .icon-button{width:38px;height:38px;border-radius:10px;color:#fff1d2;background:#ffffff09;border:1px solid #ffffff20;display:grid;place-items:center;padding:0}
.room-code{background:#14283d70;border:1px solid #ffffff50;border-radius:15px;box-shadow:0 8px 24px #0b1b2b20;padding:9px 14px;color:#f5faff}
.room-code b{font-size:23px;color:#f5faff;letter-spacing:2px}.room-code small{color:#d8e9f2;font-weight:700}.room-code>span{color:#d8e9f2}
.game-top>.icon-button,.game-top .glass{background:#14283d70;border:1px solid #ffffff50;box-shadow:0 8px 24px #0b1b2b20;color:#f5faff;border-radius:15px}
.game-top .glass{font-size:17px;gap:8px}.game-top>.icon-button{display:grid;place-items:center}
.task-bar{border:2px solid #34465d;border-radius:8px;background:#fff5d9eF;box-shadow:0 3px 0 #26395130}.task-bar>span:first-child{color:#9f6348;font-family:Jua,sans-serif;font-size:13px}.task-bar b{color:#30475c}
.hotbar-wrap{background:#14283d70;border:1px solid #ffffff50;box-shadow:0 8px 24px #0b1b2b20;border-radius:18px;padding:11px 12px 8px}
.slot{background:#edf5fac7;border:1px solid #ffffff70;box-shadow:none;border-radius:11px}.slot.selected{background:#aaf1d8;border-color:#ddfff4;box-shadow:0 0 0 2px #69dfba66;transform:translateY(-3px)}
.slot small{font-family:Jua,sans-serif;color:#314759;font-size:12px}.hotbar-extra button{color:#f0f8ff}.hotbar-extra>span{color:#d8e9f2}
.room-code:hover,.game-top .glass:hover,.game-top>.icon-button:hover{background:#14283d98;transform:none;box-shadow:0 8px 24px #0b1b2b20}
.room-code:active,.game-top .glass:active,.game-top>.icon-button:active{background:#14283db0;transform:none;box-shadow:0 4px 12px #0b1b2b20}
.touch-actions button{font-family:Jua,sans-serif;font-size:17px;border:2px solid #2e4561;border-radius:13px;box-shadow:0 4px 0 #2e4561;background:linear-gradient(#fff5dd,#f0d8a9);color:#294a62}.touch-actions .mine{background:linear-gradient(#b1e9d4,#71cdbb)}.touch-actions .place{background:linear-gradient(#ffa68b,#f18c79)}
.minimap{border:2px solid #34445d;background:linear-gradient(#fff8e7,#eee2c9);box-shadow:0 4px 0 #263951;border-radius:14px}.map-heading b{font-family:Jua,sans-serif;font-size:14px;color:#334a61}.quality-control select{width:auto;margin:0;background:#dfebdf;border:1px solid #9bbaaf;color:#365267}
.lesson-hud{border:2px solid #30435f;background:linear-gradient(#fff9ee,#efe4cd);box-shadow:0 5px 0 #263951;border-radius:18px}.lesson-hud h2{color:#263951;font-size:29px}.answer-chip{border:2px solid #fff9;box-shadow:0 3px 0 #26395125;border-radius:11px}.answer-chip span{font-family:Jua,sans-serif;font-size:22px}.lesson-controls button{font-family:Jua,sans-serif;border:1px solid #29485b;border-radius:8px}
/* Illustrated modal header; readable parchment content underneath. */
dialog{padding:0;border:3px solid #263951;border-radius:22px;background:#fff8e9;box-shadow:0 8px 0 #192d48,0 28px 80px #14213980;max-height:88dvh;color:#263951;overflow:auto}
dialog::backdrop{background:#152940a8;backdrop-filter:blur(3px)}
.dialog-scene{height:138px;background:#2b3e60 url('/public/ui/quest-scene.svg') center/cover;position:relative;border-bottom:3px solid #24374f}
.dialog-scene h2{position:absolute;left:30px;bottom:20px;max-width:66%;margin:0;font-family:Jua,sans-serif;font-size:32px;line-height:1.18;letter-spacing:0;color:#fff0ca;text-shadow:0 3px 0 #1b2c4b,2px 0 0 #1b2c4b,-2px 0 0 #1b2c4b}
.dialog-content{padding:24px 30px 28px;background-image:radial-gradient(#d6c9ab44 .6px,transparent .6px);background-size:7px 7px}.dialog-content p{color:#677483;font-size:14px;line-height:1.8}.dialog-content .eyebrow{color:#a07455;font-size:10px;letter-spacing:1px}.dialog-content form{margin-top:20px}
.dialog-content label{font-size:13px;color:#4d6375}.dialog-content input,.dialog-content textarea,.dialog-content select{border:2px solid #c5cec9;background:#fffefa;border-radius:10px;font-size:15px;padding:12px;color:#273e53}
.modal-close{z-index:2;right:15px;top:14px;width:38px;height:38px;display:grid;place-items:center;border:2px solid #142b45;background:#fb9682;box-shadow:0 3px 0 #142b45;border-radius:11px;color:#293e58;padding:0}
.palette-block{background:#fff1d6;border:2px solid #ccbd9e;border-radius:10px;padding:16px 6px;box-shadow:0 3px 0 #bdad92}.palette-block b{font-family:Jua,sans-serif;font-size:15px}.recipes button{background:#d4eddf;border:1px solid #8bb4a1;color:#345367}.roster-list>div{background:#fff9ef;border-radius:12px;margin-bottom:8px}
/* Full-bleed game key art, with the title and controls kept in the quiet sky. */
body:has(.landing-world){background:#e7f2e8}
body:has(.landing-world) header{position:absolute;top:0;left:0;right:0;z-index:5;height:78px;max-width:none;padding:0 5%;border:0;background:linear-gradient(#eef8f5a8,transparent)}
body:has(.landing-world) .brand{color:#29435b}.brand>span{font-size:25px}.brand small{font-family:system-ui,sans-serif;font-size:8px;letter-spacing:2px;color:#567781}
body:has(.landing-world) nav{gap:25px}body:has(.landing-world) .nav{color:#365b6c;font-weight:700}body:has(.landing-world) header>.button{font-size:15px;min-height:40px;padding:8px 15px}
.landing-world{position:relative;isolation:isolate;min-height:690px;height:min(850px,100dvh);overflow:hidden;background:#b9e2e6 url('/public/ui/landing-world.webp') center/cover}
.landing-world:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#e9f5ed75 0%,#e9f5ed18 34%,transparent 56%);z-index:-1;pointer-events:none}
.landing-copy{position:relative;width:52%;padding:113px 0 0 6%;z-index:1}.adventure-tag{font-size:13px;font-weight:750;color:#426a75;letter-spacing:2px;display:inline-flex;align-items:center;gap:9px}.adventure-tag:before{content:'✦';color:#d17b61;font-size:18px}
.landing-copy h1{margin:8px -20px 0 -25px;height:195px;display:flex;align-items:center}.title-art{width:100%;max-width:570px;height:100%;object-fit:contain;filter:drop-shadow(0 8px 4px #30456420)}
.landing-description{font-size:29px;line-height:1.4;margin:0 0 22px;color:#29435a;text-shadow:0 1px 0 #fff9}
.landing-actions{display:flex;flex-wrap:wrap;gap:15px}.landing-actions .button{min-height:54px;padding:12px 22px;font-size:20px}.landing-actions .secondary{font-size:18px}
.continue-game{display:block;border:0;background:transparent;color:#34586c;margin-top:17px;padding:5px 0;font-size:15px;cursor:pointer}.continue-game b{font-family:ui-monospace,monospace;font-size:12px;letter-spacing:1px;padding:4px 7px;border:1px solid #9bbbab;border-radius:5px;background:#f7fbeeb0;margin:0 8px}
.landing-modes{display:flex;gap:14px;margin-top:15px;font-size:11px;color:#45656d}.landing-modes span{display:flex;align-items:center;gap:5px}.landing-modes span:before{content:'';width:6px;height:6px;border-radius:2px;background:#67b4a5;transform:rotate(45deg)}
.world-caption{position:absolute;right:7%;top:28%;text-align:right;transform:rotate(-3deg);color:#fffde6;text-shadow:0 2px 3px #33527470}.world-caption span{font-size:12px;letter-spacing:1px;display:block}.world-caption b{font-family:Jua,sans-serif;font-weight:400;font-size:23px}
.landing-footer{max-width:none;margin:0;padding:20px 5%;background:#eaf4e8;border-top:1px solid #c9dfd0;color:#52717c}.landing-footer>span:first-child{font-family:Jua,sans-serif;color:#34536b;font-size:20px}.landing-footer>span:nth-child(2){font-size:12px}.landing-footer .text-button{padding:0;color:#52717c;font-size:12px}
/* The persistent pet is a local save, independent of classroom accounts. */
.pet-meadow{position:absolute;left:6%;bottom:24px;width:43%;height:150px;z-index:2;--pet-travel:min(26vw,330px)}
.wandering-pet{position:absolute;left:0;bottom:0;width:110px;padding:0;border:0;background:transparent;animation:pet-stroll 32s linear infinite;cursor:pointer}.wandering-pet:hover,.wandering-pet:focus-visible{animation-play-state:paused}.pet-sprite{width:110px;height:110px;display:block;overflow:visible;filter:drop-shadow(0 3px 0 #fff5)}.grown .pet-sprite{transform:scale(1.12)}
#pet-name-tag{display:inline-block;font-family:Jua,sans-serif;color:#fffce8;background:#304660e0;border:1px solid #fff7;border-radius:9px;padding:3px 12px;font-size:13px;box-shadow:0 2px 0 #21334b30}
.pet-speech{position:absolute;bottom:130px;left:0;min-width:110px;max-width:200px;background:#fff6dc;border:2px solid #36516b;border-radius:12px 12px 12px 2px;padding:7px 10px;color:#39516a;font-family:Jua,sans-serif;font-size:13px;box-shadow:0 3px 0 #36516b20}
.pet-leg-a{transform-origin:50% 85%;animation:pet-step .5s ease-in-out infinite alternate}.pet-leg-b{transform-origin:60% 85%;animation:pet-step .5s ease-in-out -.5s infinite alternate}.pet-head{animation:pet-bob 2s ease-in-out infinite}.pet-tail{transform-origin:90px 85px;animation:pet-tail 1.7s ease-in-out infinite}
.pet-home{position:absolute;right:5%;bottom:25px;width:320px;z-index:3;border:2px solid #2d4560;background:linear-gradient(#fffae9f5,#f1e7d0f5);box-shadow:0 5px 0 #2d4560,0 12px 24px #223e5120;border-radius:18px;padding:16px;color:#36546b}
.pet-card-title{display:flex;align-items:center;gap:10px}.pet-spark{font-size:26px;color:#e8a654}.pet-card-title b{font-size:23px;display:block}.pet-card-title small{font-size:10px;color:#7a8b8c;display:block;margin-top:3px}.pet-card-title>button{margin-left:auto;font-size:10px;background:none;border:0;border-bottom:1px dashed #97ada8;padding:5px 0;color:#6b7f86}
.pet-meters{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:14px 0}.pet-meters label{font-size:10px;margin:0;color:#637c7d}.pet-meters meter{display:block;width:100%;height:9px;margin-top:5px;accent-color:#60bda5}.pet-meters meter::-webkit-meter-bar{background:#d9ddcf;border:0;border-radius:8px}.pet-meters meter::-webkit-meter-optimum-value{background:linear-gradient(90deg,#62bfab,#9cdfad);border-radius:8px}
.pet-actions{display:flex;gap:7px}.pet-actions button{flex:1;padding:9px 3px;border:1.5px solid #48697a;background:#d8f0e0;color:#365469;box-shadow:0 3px 0 #48697a;border-radius:9px;font-family:Jua,sans-serif;font-size:14px}.pet-actions button:nth-child(2){background:#ffe2b0}.pet-actions button:nth-child(3){background:#d8e4ff}.pet-actions button:active{transform:translateY(2px);box-shadow:0 1px 0 #48697a}
#pet-message{font-size:11px;line-height:1.5;margin:12px 0 5px;min-height:17px}.pet-save-note{color:#7d8f93;font-size:9px}
@keyframes pet-stroll{0%,100%{transform:translateX(0)}45%,55%{transform:translateX(var(--pet-travel))}}
@keyframes pet-step{from{transform:translateY(0)}to{transform:translateY(-3px)}}@keyframes pet-bob{50%{transform:translateY(-2px)}}@keyframes pet-tail{50%{transform:rotate(-7deg)}}
@media(max-width:1000px){.landing-copy{width:62%;padding-top:104px}.landing-copy h1{height:166px}.landing-description{font-size:25px}.landing-actions .button{font-size:18px;padding:12px 16px}.pet-home{width:290px}.world-caption{top:22%;right:4%;max-width:200px}.world-caption b{font-size:19px}.landing-modes{gap:8px;font-size:10px}}
@media(max-width:750px){.world-heading{padding:7px 12px 7px 4px;min-height:59px;gap:2px}.world-heading .world-badge{width:43px;height:43px;margin-left:-5px}.world-heading b{font-size:18px}.world-heading small{font-size:8px}.world-heading .icon-button{width:30px;height:30px}.world-heading>div{max-width:150px}.world-heading:after{left:66px;bottom:4px}.room-code b{font-size:18px}.game-top .glass{font-size:13px;padding:8px;gap:4px}.game-top .glass .ui-icon{display:none}.game-top .icon-button .ui-icon{width:20px;height:20px}.dialog-scene{height:115px}.dialog-scene h2{font-size:26px;left:22px;bottom:20px}.dialog-content{padding:20px 22px}.lesson-hud h2{font-size:24px}
body:has(.landing-world) header{height:65px;padding:0 20px}body:has(.landing-world) nav{display:none}.brand>span{font-size:21px}.brand svg{width:30px;height:30px}.brand small{display:none}body:has(.landing-world) header>.button{font-size:13px;padding:7px 10px;min-height:34px}
.landing-world{height:auto;min-height:930px;background-position:65% top;background-size:auto 640px;background-repeat:no-repeat;background-color:#d8ead9}.landing-world:before{background:linear-gradient(90deg,#e8f4eb65,transparent 85%)}.landing-copy{width:100%;padding:95px 24px 0}.adventure-tag{font-size:11px}.landing-copy h1{height:170px;max-width:480px;margin:0 -18px}.landing-description{font-size:25px;line-height:1.3;margin:8px 0 20px}.landing-actions{gap:12px;max-width:380px}.landing-actions .button{font-size:19px;min-height:50px;width:100%;justify-content:space-between}.landing-actions .secondary{font-size:17px}.continue-game{margin-top:18px;font-size:14px}.landing-modes{font-size:9px;flex-wrap:wrap}.world-caption{display:none}.pet-meadow{bottom:260px;left:30px;width:calc(100% - 60px);--pet-travel:calc(100vw - 170px)}.pet-home{bottom:30px;right:24px;left:24px;width:auto;padding:17px}.pet-speech{font-size:12px;min-width:100px}.landing-footer{gap:12px;flex-wrap:wrap;padding:20px 24px}.landing-footer>span:nth-child(2){display:none}}
@media(max-height:620px) and (min-width:751px){.landing-world{height:740px;min-height:740px}.world-heading b{font-size:20px}.game-top .world-heading{min-height:60px}.world-heading .world-badge{width:48px;height:48px}.world-heading small{font-size:10px}}
@media(prefers-reduced-motion:reduce){.wandering-pet,.pet-head,.pet-leg-a,.pet-leg-b,.pet-tail{animation:none}.button{transition:none}}

.pet-speech{display:none;bottom:108px;max-width:175px}.wandering-pet.speaking .pet-speech{display:block}.landing-world .wandering-pet{animation-duration:38s}

.pet-editor-preview{display:flex;align-items:center;gap:20px;background:#e9f3e7;border-radius:16px;padding:5px 12px}.pet-editor-preview canvas{width:150px;height:150px;flex-shrink:0}.pet-editor-preview p{font-size:12px}.pet-editor-fields{display:grid;grid-template-columns:1.5fr 1fr;gap:14px}.pet-follow{display:flex;align-items:center;gap:10px}.pet-follow input{width:18px;height:18px;margin:0;accent-color:#4aa88f}.pet-open{pointer-events:auto;width:100%;margin-top:8px;padding:8px;background:#d7e7d7;border:1px solid #9db6aa;border-radius:8px;color:#32566b;font-family:Jua,sans-serif;font-size:13px}@media(max-width:750px){.pet-editor-preview{gap:8px}.pet-editor-preview canvas{width:105px;height:105px}.pet-editor-fields{grid-template-columns:1fr}.pet-open{font-size:10px;padding:6px}}

.landing-world:after{content:"";position:absolute;inset:0;background:inherit;filter:saturate(1.20) contrast(1.035);z-index:-2;pointer-events:none}.button.primary{background:linear-gradient(#65e5be,#37bfaa)}.button.primary:hover{background:linear-gradient(#7befcc,#47ceb7)}

.pet-meadow{pointer-events:none}.wandering-pet{pointer-events:auto}@media(min-width:751px){.pet-meadow{bottom:8px}}

.title-art{min-width:0}.landing-copy h1{display:block}.landing-description{text-shadow:0 2px 0 #fff7,0 0 12px #ffffff60}@media(max-width:750px){.pet-meadow{bottom:280px}}

.launch-options{position:fixed;right:22px;top:18px;z-index:25;background:#122a45e8;border:1px solid #ffffff55;border-radius:14px;padding:12px 22px;color:#fff;font:18px Jua,sans-serif;box-shadow:0 6px 24px #0d203844}.mode-hall+.launch-options{top:auto;bottom:18px}.character-slots{display:flex;gap:10px;margin-bottom:16px}.character-slots button{flex:1;background:#e3edf5;border:2px solid transparent;border-radius:12px;padding:12px;font:18px Jua,sans-serif;color:#24455c}.character-slots button.active{background:#b9f0d9;border-color:#22ad8d}.character-workshop{display:grid;grid-template-columns:1fr 1fr;gap:20px}.character-stage{background:radial-gradient(ellipse at 50% 60%,#427994,#142744 80%);border-radius:20px;display:flex;flex-direction:column;align-items:center;overflow:hidden}.character-stage canvas{width:100%;max-width:280px;height:auto}.character-stage button{margin:0 0 16px;background:#ffffff26;border:1px solid #ffffff66;color:white;border-radius:12px;padding:9px 16px;font:15px Jua,sans-serif}.character-colors{display:grid;grid-template-columns:1fr 1fr;gap:8px}.character-colors input{height:42px;padding:4px}.character-workshop p,.graphics-explanation{font-size:13px;line-height:1.65;color:#536b7c}.dialog-content>.button{margin:8px 0;width:100%}.bucket-actions{margin-top:18px}.bucket-actions button{padding:10px;border:1px solid #72aeab;border-radius:10px;margin:4px;background:#d9f2ed;font:15px Jua,sans-serif}button:disabled{cursor:default;opacity:.55}@media(max-width:580px){.character-workshop{grid-template-columns:1fr}.character-stage canvas{max-width:180px}.launch-options{right:12px;top:12px;padding:9px 15px;font-size:15px}}
