@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');
:root{--ink:#142f33;--cream:#fff9e9;--orange:#ff764d;--green:#cfe868;--line:#203a3c26}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font:15px/1.5 'DM Sans',system-ui,sans-serif}button,input,textarea{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer;color:inherit}button:focus-visible,a:focus-visible,textarea:focus-visible{outline:3px solid #106d83;outline-offset:4px}header{display:flex;align-items:center;justify-content:space-between;padding:18px 4%;gap:16px;border-bottom:1px solid var(--line)}.logo{font:700 19px 'Space Grotesk',sans-serif;letter-spacing:.13em}.logo small{display:block;font:700 8px 'DM Sans';letter-spacing:.28em}.top-actions{display:flex;align-items:center;gap:12px}.top-actions span{font-size:10px;letter-spacing:.08em}.share{border:1px solid var(--ink);background:var(--ink);color:white;border-radius:30px;padding:11px 19px;font-weight:700}.intro{max-width:1160px;margin:35px auto 25px;padding:0 24px;display:flex;justify-content:space-between;align-items:end;gap:28px}.tag{font-size:10px;font-weight:800;letter-spacing:.18em;text-transform:uppercase}h1{font:700 clamp(43px,5.7vw,78px)/.98 'Space Grotesk',sans-serif;letter-spacing:-.065em;margin:12px 0 16px}h1 em{font-style:normal;color:#d45131}.intro p{max-width:340px;margin-bottom:20px;color:#4c6467}.scribble{display:inline-block;background:var(--green);transform:rotate(-3deg);padding:2px 10px}.app{max-width:1160px;margin:auto;padding:0 24px 40px}.game{border:2px solid var(--ink);border-radius:22px;overflow:hidden;box-shadow:7px 8px 0 var(--ink);background:#f1e8d3}.gamebar{display:flex;justify-content:space-between;align-items:center;padding:13px 22px;background:var(--ink);color:white;font-size:11px;gap:12px}.live{display:inline-flex;gap:8px;align-items:center}.live:before{content:'';width:7px;height:7px;background:#f68b68;border-radius:50%;animation:pulse 1.5s infinite}.gamebar button{background:none;border:0;color:white}.stage{height:385px;position:relative;overflow:hidden;background:#e0ebde;isolation:isolate;transition:background 1s}.stage:after{content:'';position:absolute;bottom:0;width:100%;height:92px;background:#d6b785;z-index:-1}.scene{position:absolute;width:100%;height:100%;inset:0}.office{transition:opacity .7s,transform 1s}.window{position:absolute;top:22px;left:7%;width:195px;height:183px;border:7px solid #23413f;border-radius:100px 100px 0 0;background:linear-gradient(#a7dcd6 65%,#c3d78c 65%);overflow:hidden}.window:after{content:'';position:absolute;left:50%;width:6px;height:100%;background:#23413f}.sun{position:absolute;width:60px;height:60px;border-radius:50%;background:#f9c44e;top:24px;left:22px}.clock{position:absolute;top:30px;left:51%;border:3px solid #23413f;border-radius:50%;width:52px;height:52px;background:var(--cream);display:grid;place-items:center;font-size:11px;font-weight:800;transform:rotate(-8deg)}.poster{position:absolute;right:4%;top:26px;font:700 19px/1.05 'Space Grotesk';border:2px solid var(--ink);padding:14px;background:#f3cd6a;transform:rotate(4deg);box-shadow:3px 3px var(--ink)}.plant{position:absolute;bottom:40px;left:4%;font-size:76px;transform:rotate(-8deg)}.person{position:absolute;left:43%;bottom:48px;width:155px;height:235px;transition:transform 1.4s,opacity .7s;transform-origin:bottom}.head{position:absolute;width:67px;height:78px;background:#a86743;left:44px;top:22px;border:3px solid var(--ink);border-radius:42% 42% 45% 45%;z-index:2}.hair{position:absolute;background:#243337;width:77px;height:49px;border-radius:50%;left:-8px;top:-14px}.hair:before{content:'';position:absolute;background:#243337;width:38px;height:38px;border-radius:50%;top:-21px;left:40px}.eyes{position:absolute;top:36px;left:15px;width:7px;height:5px;border-radius:50%;background:var(--ink);box-shadow:26px 0 var(--ink)}.mouth{position:absolute;left:24px;top:57px;width:19px;height:5px;border-bottom:2px solid var(--ink);border-radius:50%}.shirt{position:absolute;top:93px;left:17px;width:122px;height:109px;background:var(--orange);border:3px solid var(--ink);border-radius:45% 45% 0 0}.shirt:after{content:'';position:absolute;left:56px;top:0;height:60px;border-left:2px solid var(--ink)}.arm{position:absolute;width:53px;height:18px;background:#a86743;top:148px;left:-3px;border:2px solid var(--ink);border-radius:20px;transform:rotate(20deg);z-index:3}.arm.right{left:102px;transform:rotate(-20deg)}.desk{position:absolute;left:28%;bottom:44px;width:45%;height:12px;background:#ae7045;border:3px solid var(--ink);border-radius:7px;z-index:5}.desk:before,.desk:after{content:'';position:absolute;top:9px;width:9px;height:64px;background:var(--ink)}.desk:before{left:17px}.desk:after{right:17px}.laptop{position:absolute;bottom:52px;left:45%;height:68px;width:108px;border:3px solid var(--ink);border-radius:8px;background:#b9c5c9;z-index:6;transform:rotate(-3deg);display:grid;place-items:center;color:var(--ink);font-size:25px}.mug{position:absolute;left:34%;bottom:56px;font-size:33px;z-index:6}.float-task{position:absolute;max-width:210px;padding:13px 17px;border:2px solid var(--ink);border-radius:12px;background:#fffaf0;box-shadow:4px 4px #203a3c;z-index:8;animation:bob 3s ease-in-out infinite;text-align:left}.float-task b{font-size:11px;display:block}.float-task span{font-size:10px;display:block;color:#4c6467}.float-task .handle{display:inline;float:right;margin-left:12px;background:var(--orange);color:#142f33;font-size:12px;font-weight:900;padding:1px 7px;border-radius:12px}.t0{left:4%;top:90px;transform:rotate(-6deg)}.t1{right:4%;top:130px;animation-delay:-1s;transform:rotate(4deg)}.t2{left:15%;top:218px;animation-delay:-2s;transform:rotate(3deg)}.float-task:hover{background:#e5efae}.float-task.done{pointer-events:none;animation:handoff .65s forwards}.support{position:absolute;right:4%;bottom:17px;background:#cfe868;border:2px solid var(--ink);border-radius:13px;padding:9px 15px;font-size:11px;z-index:9;transform:rotate(-3deg)}.support b{display:block}.bubble{position:absolute;left:39%;top:95px;padding:7px 14px;background:var(--cream);border:2px solid var(--ink);border-radius:30px;font-size:11px;z-index:4;transform:rotate(-5deg);animation:bob 4s infinite}.escape-scene{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity 1s;background:linear-gradient(#a8dcd5 0 55%,#65bcb7 55% 66%,#f1d49c 66%)}.escape-scene:before{content:'';position:absolute;width:120px;height:120px;top:25px;left:15%;background:#ffc65e;border-radius:50%}.escape-scene .palm{position:absolute;right:8%;top:10px;font-size:160px;transform:rotate(12deg)}.escape-scene .chair{position:absolute;bottom:45px;left:43%;font-size:105px;transform:rotate(-9deg)}.escape-scene .escape-title{position:absolute;left:6%;bottom:28px;font:700 34px/.98 'Space Grotesk';letter-spacing:-.05em;max-width:230px}.escaped .office{opacity:0;transform:translateY(60px)}.escaped .escape-scene{opacity:1}.escaped .float-task{display:none}.escaped .support{background:#fff9e9}.escaped .person{transform:translateX(55px) rotate(-13deg);z-index:4}.escaped .arm{transform:rotate(-35deg)}.escaped .mouth{height:9px}.escaped .bubble{opacity:0}.stage.dinner .escape-scene{background:linear-gradient(#172f42 66%,#8f5b46 66%)}.stage.dinner .escape-scene:before{background:#ffe6a8;width:70px;height:70px}.stage.dinner .escape-title{color:#fff9e9}.stage.family .escape-scene{background:linear-gradient(#b7d9ca 66%,#c5d68b 66%)}.stage.off .escape-scene{background:linear-gradient(#ded2b4 66%,#bea17b 66%)}.controls{padding:22px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:18px;background:#fffcf3}.controls h2{font:700 20px 'Space Grotesk';margin:0 0 5px}.controls p{font-size:12px;color:#5a6b69;margin:0}.go{border:2px solid var(--ink);background:var(--orange);padding:16px 25px;border-radius:12px;font-weight:800;box-shadow:3px 3px var(--ink)}.go:active{transform:translate(2px,2px);box-shadow:1px 1px var(--ink)}.go:disabled{opacity:.7;cursor:wait}.below{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:34px}.customise,.ending{border:1px solid var(--line);padding:23px;border-radius:16px}.customise label{font-size:13px;font-weight:700;display:block;margin-bottom:10px}textarea{width:100%;height:78px;background:#fffdf6;border:1px solid #637b76;border-radius:9px;padding:10px;color:var(--ink);resize:vertical;font-size:12px}.customise button{border:0;background:transparent;text-decoration:underline;font-size:12px;padding:5px 0}.tiny{font-size:10px;color:#5a6b69}.choices{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}.choices button{background:#fffaf0;border:1px solid #79908b;border-radius:30px;padding:8px 12px;font-size:12px}.choices button[aria-pressed=true]{background:var(--green);border:2px solid var(--ink)}.results{margin-top:30px;background:var(--ink);color:white;padding:30px;border-radius:18px;animation:pop .6s both}.results h2{font:700 35px/1.1 'Space Grotesk';margin:10px 0}.results p{color:#cfdddd;max-width:680px;font-size:14px}.results .share{background:var(--green);color:var(--ink);border-color:var(--green);margin:10px 12px 10px 0}.results a{color:white;font-size:13px;text-underline-offset:4px}.result-tasks{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}.result-tasks span{font-size:12px;border:1px solid #ffffff40;border-radius:7px;padding:9px 12px}.reset{border:0;background:none;color:#cfe868;text-decoration:underline;margin-left:15px}footer{padding:25px 4%;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;font-size:10px}.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);max-width:90%;padding:13px 22px;border:2px solid var(--ink);border-radius:12px;background:#cfe868;z-index:30;font-size:12px;box-shadow:3px 3px var(--ink)}.confetti{position:absolute;top:-20px;width:9px;height:15px;animation:fall 2.2s linear forwards;pointer-events:none;z-index:20}[hidden]{display:none!important}@keyframes bob{0%,100%{translate:0 0}50%{translate:0 -8px}}@keyframes pulse{50%{opacity:.4}}@keyframes handoff{to{translate:500px 140px;scale:.15;opacity:0;rotate:30deg}}@keyframes pop{from{opacity:0;translate:0 15px}to{opacity:1;translate:0 0}}@keyframes fall{to{transform:translateY(450px) rotate(600deg)}}@media(max-width:700px){header{padding:15px 18px}.top-actions span{display:none}.share{font-size:11px;padding:9px 12px}.intro{display:block;margin-top:25px}.intro p{max-width:100%;font-size:13px;margin:0 0 16px}h1{font-size:53px}.app{padding:0 15px 30px}.game{box-shadow:4px 5px var(--ink)}.stage{height:365px}.poster{font-size:12px;right:4%;padding:9px}.window{width:120px;height:145px;left:6%;top:25px}.clock{left:49%;top:27px}.person{left:35%;bottom:49px;scale:.9}.desk{left:17%;width:67%}.laptop{left:43%}.mug{left:23%}.plant{left:-6%;font-size:58px}.bubble{left:31%;top:89px;font-size:9px}.float-task{max-width:150px;padding:9px 11px}.t0{left:3%;top:130px}.t1{right:3%;top:193px}.t2{left:4%;top:251px}.support{font-size:9px;right:3%;bottom:8px;padding:7px 10px}.controls{grid-template-columns:1fr;padding:18px;gap:13px}.go{width:100%}.below{grid-template-columns:1fr;gap:13px;margin-top:25px}.escape-scene .palm{font-size:115px;right:-10px;top:20px}.escape-scene .escape-title{font-size:26px;bottom:35px;left:5%;max-width:135px}.escape-scene .chair{left:45%;font-size:95px}.escaped .person{transform:translateX(30px) rotate(-13deg)}.results{padding:24px}.results h2{font-size:29px}footer{display:block}.gamebar{padding:12px 15px;font-size:10px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.float-task.done{visibility:hidden}}