@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap";:root{color:#ecf0e6;font-synthesis:none;background:#101d25;font-family:DM Sans,sans-serif}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit;background:#ffffff06;border:1px solid #ffffff18;transition:background .15s,transform .15s}button:hover{background:#ffffff12}button:focus-visible,a:focus-visible{outline-offset:4px;outline:2px solid #b4e3ab}button:disabled{cursor:default;opacity:.5}#viewport{position:fixed;inset:0}canvas{touch-action:none;display:block}header{pointer-events:none;justify-content:space-between;align-items:center;display:flex;position:absolute;top:32px;left:40px;right:40px}.brand{letter-spacing:2px;color:inherit;pointer-events:auto;align-items:center;gap:12px;font-family:Space Grotesk,sans-serif;font-size:14px;font-weight:700;text-decoration:none;display:flex}.brand-icon{color:#b4e3ab;font-size:29px}.badge{letter-spacing:1.5px;color:#a3b0b5;border:1px solid #ffffff20;border-radius:30px;padding:9px 14px;font-size:10px}.intro{pointer-events:none;position:absolute;top:130px;left:40px}.eyebrow{letter-spacing:2px;color:#b4e3ab;font-size:10px}h1{letter-spacing:-2px;margin:18px 0;font-family:Space Grotesk,sans-serif;font-size:clamp(28px,3.2vw,48px);font-weight:500;line-height:1.1}h1 span{color:#b4e3ab}.intro p{color:#96a7ad;font-size:12px;line-height:1.9}.spec{color:#a9b9bb;flex-wrap:wrap;gap:14px;margin-top:20px;font-size:9px;display:flex}.spec span+span{border-left:1px solid #ffffff25;padding-left:14px}.session{letter-spacing:1px;background:#14232ae6;border:1px solid #ffffff16;border-radius:16px;width:235px;padding:20px;font-size:10px;position:absolute;top:130px;right:40px}.live-dot{background:#b4e3ab;border-radius:50%;width:6px;height:6px;margin-right:6px;display:inline-block;box-shadow:0 0 10px #b4e3ab66}.session p{letter-spacing:0;color:#a5b6ba;min-height:60px;margin:18px 0;font-size:12px;line-height:1.65}.primary{color:#18372d;letter-spacing:0;background:#b4e3ab;border:0;border-radius:8px;width:100%;padding:14px 10px;font-size:12px;font-weight:700}.primary:hover{background:#ccf6c3}.primary:disabled{color:#e7f4e3;opacity:1;background:#446050}.session-note{color:#8ba0a7;letter-spacing:0;text-align:center;margin-top:12px;font-size:8px}.toolbar{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#192a31ed;border:1px solid #ffffff18;border-radius:18px;width:min(710px,100% - 48px);padding:18px 20px 12px;position:absolute;bottom:65px;left:50%;transform:translate(-50%);box-shadow:0 14px 50px #0002}.toolbar-heading{letter-spacing:1.8px;color:#a7b8bb;justify-content:space-between;margin-bottom:14px;font-size:9px;display:flex}#count{color:#b4e3ab}#palette{grid-template-columns:repeat(8,1fr);gap:7px;display:grid}.piece-button{color:#b4c3c5;border-radius:9px;flex-direction:column;align-items:center;gap:8px;padding:10px 2px 8px;font-size:8px;display:flex}.swatch{background:var(--piece-color);width:25px;height:25px;box-shadow:3px 3px 0 color-mix(in srgb,var(--piece-color),black 40%);color:#203238;border-radius:4px;justify-content:center;align-items:center;font-size:10px;font-weight:700;display:flex;transform:rotate(-10deg)}.piece-button.active{color:#e3f3dc;background:#b4e3ab12;border-color:#b4e3ab}.actions{border-top:1px solid #ffffff0c;gap:8px;margin-top:12px;padding-top:10px;display:flex}.actions button{color:#b8c8c8;border:0;border-radius:5px;padding:7px 10px;font-size:10px}.actions button.active{color:#ffbaac;background:#d8796833}#reset{color:#a6b3b6;margin-left:auto}kbd{opacity:.5;margin-left:5px;font-size:8px}footer{color:#7b9099;pointer-events:none;justify-content:space-between;font-size:9px;display:flex;position:absolute;bottom:24px;left:40px;right:40px}footer b{color:#b4c5c6;margin-right:6px;font-weight:500}#xr-guide,.in-xr header,.in-xr .intro,.in-xr .session,.in-xr .toolbar,.in-xr footer{display:none}@media (width<=1050px){.intro{top:100px}.intro p{max-width:200px}h1{font-size:32px}.session{width:205px;top:95px;right:24px}header{top:22px;left:24px;right:24px}.intro{left:24px}.spec{gap:8px;max-width:180px}.spec span+span{border:0;padding:0}footer{left:24px;right:24px}footer>span:last-child{display:none}}@media (width<=650px){.badge{display:none}.intro{top:78px}.eyebrow{font-size:8px}h1{margin:10px 0;font-size:28px}.intro p,.spec{display:none}.session{width:170px;padding:12px;top:78px}.session p{min-height:30px;margin:8px 0;font-size:10px}.session-note{display:none}.primary{padding:10px 4px;font-size:10px}.toolbar{width:calc(100% - 24px);padding:12px;bottom:45px}#palette{grid-template-columns:repeat(4,1fr);gap:5px}.piece-button{flex-direction:row;justify-content:center;padding:7px 3px;font-size:8px}.swatch{width:18px;height:18px;font-size:8px}.actions{gap:1px}.actions button{padding:7px;font-size:9px}footer{font-size:8px;bottom:15px;left:12px}.toolbar-heading{margin-bottom:8px}}@media (height<=650px) and (width>=651px){.intro{top:85px}h1{font-size:30px}.intro p,.spec{display:none}.session{top:82px}.toolbar{padding:10px 15px;bottom:40px}footer{bottom:14px}}
