@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#20262a;background:#f8f9f6;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,label.drop{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.4;cursor:not-allowed}a{color:inherit;text-decoration:none}header{height:92px;max-width:1320px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:0 40px;border-bottom:1px solid #e0e4dc}.brand{font-family:'Space Grotesk',sans-serif;display:flex;align-items:center;font-weight:700;font-size:26px;gap:10px;letter-spacing:-1px}.logo{background:#c6f463;width:35px;height:35px;display:grid;place-items:center;border-radius:9px;font-size:31px}.beta{font-size:9px;letter-spacing:1px;border:1px solid #d5d9cf;border-radius:4px;padding:4px;margin-left:5px}nav{display:flex;align-items:center;gap:32px;font-size:13px;font-weight:600}.text{border:0;background:none}main{max-width:1240px;margin:auto}.hero{padding:66px 0 58px;position:relative}.eyebrow{font-size:11px;font-weight:700;letter-spacing:1.7px;display:flex;gap:8px;align-items:center}.eyebrow span{background:#6f9851;width:7px;height:7px;border-radius:50%}h1{font-family:'Space Grotesk',sans-serif;font-size:67px;line-height:1.05;letter-spacing:-3.3px;margin:21px 0}h1>span{color:#748562}.hero p{font-size:16px;color:#757c73;line-height:1.8}.tags{display:flex;gap:22px;margin-top:27px;font-size:12px;color:#545e51}.orbit{position:absolute;right:80px;top:60px;width:280px;height:270px;border:1px solid #dee5d6;border-radius:50%;transform:rotate(-12deg);background:repeating-radial-gradient(ellipse at center,transparent 0px,transparent 49px,#e7ebdf 50px,transparent 51px)}.orbit>span{position:absolute;inset:40px;background:#d3f795;box-shadow:9px 10px 0 #28352b;border:2px solid #28352b;border-radius:25px;font-family:'Space Grotesk';font-size:28px;line-height:1.1;font-weight:700;padding:30px 20px}.star{position:absolute;bottom:12px;right:18px;font-size:60px}.pixel{position:absolute;width:22px;height:22px;background:#a995d6;z-index:1;border:2px solid #313731}.p1{top:0;right:18px}.p2{bottom:10px;left:10px;background:#f6be6b}.p3{top:25px;left:20px;width:12px;height:12px;background:#c6f463}.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:21px}h2{font-family:'Space Grotesk';font-size:22px;font-weight:500;letter-spacing:-.7px}.section-title>span{font-size:10px;letter-spacing:1px;color:#8d9587}.workspace{display:grid;grid-template-columns:345px 1fr;background:#fff;border:1px solid #dce1d6;border-radius:15px;overflow:hidden;box-shadow:0 9px 30px #2c372608}aside{padding:26px;border-right:1px solid #e1e5dc}.card-heading{display:flex;align-items:center;gap:9px;margin-bottom:19px}.number{border:1px solid #d9e0d1;border-radius:50%;width:25px;height:25px;display:grid;place-items:center;font-size:10px;color:#78866b}h3{font-family:'Space Grotesk';margin:0;font-size:16px;font-weight:500}.drop{display:flex;flex-direction:column;align-items:center;gap:9px;padding:25px 8px;background:#f7f9f2;border:1px dashed #b7c7a4;border-radius:9px;cursor:pointer;font-size:12px}.drop:hover,.drop.drag{background:#edf6dd}.drop strong{font-size:13px}.drop u{color:#617b3b}.upload{font-size:30px;line-height:1.2;color:#6c8154}.drop small{font-size:10px;color:#939a8c;margin-top:6px}.or{display:flex;align-items:center;gap:8px;font-size:8px;letter-spacing:1px;color:#9ca394;margin:17px 0}.or span{height:1px;flex:1;background:#e6e9e0}.secondary{border:1px solid #dde3d5;background:white;width:100%;border-radius:6px;padding:11px;font-size:12px;text-align:left}.secondary>span{float:right}.divider{height:1px;background:#e7eadf;margin:22px 0}.field{display:flex;flex-direction:column;font-size:11px;font-weight:600;gap:7px;margin-bottom:15px}input,select{border:1px solid #dce2d4;border-radius:5px;padding:10px;background:white;font-size:12px;min-width:0;color:#30392d}.field-row{display:grid;grid-template-columns:1.5fr 1fr;gap:12px}.hint,.small{color:#8a9381;font-size:10px;line-height:1.6;margin:0 0 18px}.primary{background:#c2ee77;border:1px solid #b1dc68;border-radius:7px;width:100%;padding:13px;text-align:left;font-size:13px;font-weight:700}.primary span{float:right}.download{width:100%;border:none;background:none;padding:13px;font-size:11px;color:#647453}.small{text-align:center;font-size:9px;margin:0}.preview{padding:24px;background:#fdfefb;min-width:0}.preview-top,.player-bar,.player-bar>div{display:flex;justify-content:space-between;align-items:center}.preview-top{margin-bottom:20px;font-size:12px}.live-dot{display:inline-block;background:#a9bc8f;width:6px;height:6px;border-radius:100%;margin-right:8px}.devices{display:flex;background:#eef1e8;border-radius:6px;padding:3px;gap:2px}.devices button{font-size:10px;border:0;background:none;color:#7e8b71;padding:7px 9px;border-radius:4px}.devices .active{background:white;color:#36442c;box-shadow:0 1px 3px #0001}#player-shell{max-width:100%;margin:auto;background:#edf1e6;border:1px solid #dce4d1;border-radius:9px;overflow:hidden;transition:max-width .2s}#player-shell.mobile{max-width:310px}#stage{width:100%;aspect-ratio:4/3;position:relative}#empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background-image:radial-gradient(#bdc8af 1px,transparent 1px);background-size:18px 18px}#empty h3{font-size:20px;margin-top:17px}#empty p{text-align:center;color:#829073;font-size:12px;line-height:1.8}.empty-icon{font-size:52px;background:#e1e9d5;color:#7d9560;width:84px;height:84px;display:grid;place-items:center;border-radius:22px;transform:rotate(-9deg)}.empty-blocks{letter-spacing:7px;color:#b8c8a2;font-size:22px;margin-top:15px}.player-bar{padding:14px 0;border-bottom:1px solid #e5eadf}.player-bar>div{gap:12px}.player-bar button{border:1px solid #e1e7d8;background:white;border-radius:5px;width:30px;height:28px;font-size:12px;color:#748a57}#state{font-size:10px;color:#8d9781}.preview-note{display:flex;justify-content:space-between;color:#8a967c;font-size:10px;padding-top:19px}.touch{padding:12px;display:flex;align-items:center;justify-content:space-between;background:#e6ecdd}.touch[hidden]{display:none}.touch button{touch-action:none;user-select:none;border:1px solid #afbd9b;background:#fff9;border-radius:10px;width:42px;height:42px;font-size:20px}.dpad{display:grid;grid-template-columns:repeat(3,42px);gap:4px}.dpad button:first-child{grid-column:2}.dpad button:nth-child(2){grid-column:1}.touch .action{border-radius:50%;background:#c2ee77;width:52px;height:52px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:65px;padding:48px 10px 54px}.steps article>span{font-size:9px;letter-spacing:1px;color:#8a967c}.steps h3{font-size:21px;line-height:1.3;margin:14px 0}.steps p{color:#87917e;font-size:12px;line-height:1.8;max-width:280px}footer{border-top:1px solid #e0e5d8;max-width:1240px;margin:auto;padding:26px 0;display:flex;justify-content:space-between;align-items:center;color:#909984;font-size:10px}footer .brand{font-size:20px;color:#485740}#message{font-size:13px;padding:12px 0;color:#637f41}#message.error{color:#ae3d3d}#shared{border:1px solid #b9cc9e;background:#edf5e1;padding:20px;border-radius:9px}#shared>div{display:flex;gap:10px;margin:10px 0}#shared input{flex:1}#shared button,#shared a{border:1px solid #aabe8e;padding:10px;border-radius:5px;background:white;font-size:12px}#shared small{color:#72835e}button:focus-visible,a:focus-visible,label:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #8da26d;outline-offset:3px}#player-shell:fullscreen{width:100vw;max-width:none;height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#182218}#player-shell:fullscreen #stage{height:calc(100dvh - 120px);width:auto;max-width:100vw}#player-shell:fullscreen .touch{width:100%;max-width:700px}@media(max-width:1300px){main,footer{margin-left:40px;margin-right:40px}}@media(max-width:850px){h1{font-size:52px}.orbit{right:10px;width:220px;height:220px;top:90px}.orbit>span{inset:35px;font-size:20px;padding:20px}.star{font-size:40px}.workspace{grid-template-columns:300px 1fr}.preview{padding:16px}.preview-top{align-items:start;gap:10px;flex-direction:column}.preview-note{gap:15px}.section-title>span{display:none}.steps{gap:20px}}@media(max-width:650px){header{padding:0 20px;height:75px}nav>a{display:none}nav{gap:0}.brand{font-size:22px}main,footer{margin-left:20px;margin-right:20px}.hero{padding:42px 0}.hero p br{display:none}h1{font-size:48px}.hero p{font-size:14px}.orbit{display:none}.tags{gap:14px;font-size:10px}.workspace{grid-template-columns:1fr}aside{border-right:0;border-bottom:1px solid #e1e5dc}.preview-top{flex-direction:row;align-items:center}.section-title h2{font-size:20px}.steps{grid-template-columns:1fr;gap:26px}.steps h3 br{display:none}.steps p{max-width:none}footer{flex-wrap:wrap;gap:18px}.preview-note{font-size:9px}#shared>div{flex-wrap:wrap}#shared input{width:100%;flex-basis:100%}}
body.shared-game .hero,body.shared-game aside,body.shared-game .steps,body.shared-game .section-title>span{display:none}body.shared-game .studio{padding-top:35px}body.shared-game .workspace{grid-template-columns:1fr;max-width:900px;margin:auto}body.shared-game .section-title{max-width:900px;margin:0 auto 15px}body.shared-game #message{max-width:900px;margin:auto}body.shared-game .preview #stage{max-height:65vh}body.shared-game #player-shell{max-width:760px}body.shared-game #player-shell.mobile{max-width:310px}body.shared-game footer{margin-top:35px}