@font-face{font-family:Pixter;src:url(./pixter-granular-ZnXkd1lt.ttf)format("truetype");font-display:block}@font-face{font-family:Logic Loop;src:url(./logic-loop-CaX9EdzZ.ttf)format("truetype");font-display:block}@font-face{font-family:Microtale;src:url(./microtale-B-CK6-24.ttf)format("truetype");font-display:block}:root{--bg:#e9e4dc;--paper:#fafafa;--lime:#abff42;--lime-dark:#91c859;--rim:#706b6b;--ink:#111;--deep:#031;--title-top:#e6ff9a;--title-mid:#b4f04a;--title-low:#5cb82a;--title-edge:#0b2a12;--pink:#f65fb6;--error:#d11a5b;--floor:#8f8f8f;color:var(--ink);font-family:Logic Loop,system-ui,sans-serif}html,body{background:var(--bg);height:100%;margin:0}body{place-items:center;min-height:100dvh;display:grid;overflow:hidden}#game canvas{image-rendering:pixelated;touch-action:none;display:block}#game{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}#overlay{--card-scale:1;background:#080e0ab3;place-items:center;display:grid;position:fixed;inset:0}#overlay:empty{display:none}#overlay img{image-rendering:pixelated;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.sr-only{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.body{white-space:pre-line;-webkit-font-smoothing:none;margin:0;font-family:Logic Loop,system-ui,sans-serif;font-size:13px;line-height:19px}.small{-webkit-font-smoothing:none;margin:0;font-family:Microtale,system-ui,sans-serif;font-size:12px;line-height:14px}.title{white-space:nowrap;color:var(--title-mid);background:linear-gradient(var(--title-top) 15%, var(--title-mid) 50%, var(--title-low) 95%);-webkit-text-fill-color:transparent;-webkit-text-stroke:.07em transparent;word-spacing:-.1em;filter:drop-shadow(2px 0 0 var(--title-edge)) drop-shadow(-2px 0 0 var(--title-edge)) drop-shadow(0 2px 0 var(--title-edge)) drop-shadow(0 -2px 0 var(--title-edge)) drop-shadow(0 3px 0 var(--title-edge));-webkit-background-clip:text;background-clip:text;margin:0;padding:.04em .06em .22em;font-family:Pixter,system-ui,sans-serif;font-weight:400;line-height:1}h1.title{font-size:46px}h2.title{text-align:center;font-size:26px}.dashes{flex:none;gap:5px;display:grid}.dashes i{background:var(--pink);border-radius:3px;width:18px;height:5px;display:block}.dashes.green i{background:var(--lime);width:16px;height:5px}.dashes.left i:first-child,.dashes.right i:last-child{transform:rotate(30deg)}.dashes.left i:last-child,.dashes.right i:first-child{transform:rotate(-30deg)}.dashes.left i:nth-child(2){margin-left:-4px}.dashes.right i:nth-child(2){margin-left:4px}button{cursor:pointer;font:inherit}.cta-button{background:linear-gradient(#0d4a1e, var(--deep) 55%, #002208);min-width:200px;height:34px;box-shadow:0 0 0 2px var(--lime), 0 0 0 4px var(--deep);letter-spacing:.05em;color:var(--lime);border:0;border-radius:9px;padding:0 18px;font-family:Pixter,system-ui,sans-serif;font-size:24px;line-height:1}.cta-button .label{background:linear-gradient(var(--title-top) 20%, var(--title-mid) 55%, #6fd62a 95%);-webkit-text-fill-color:transparent;-webkit-text-stroke:.07em transparent;filter:drop-shadow(1.5px 0 #001a08)drop-shadow(-1.5px 0 #001a08)drop-shadow(0 -1.5px #001a08)drop-shadow(0 2.5px #001a08);-webkit-background-clip:text;background-clip:text;padding:.12em .08em;display:inline-block}.cta-button:hover{filter:brightness(1.12)}.cta-button:focus-visible{outline:3px solid var(--pink);outline-offset:4px}.cta-button:disabled{opacity:.7;cursor:wait}.cta{justify-content:center;align-items:center;gap:12px;display:flex}.card{box-sizing:border-box;zoom:var(--card-scale);background:var(--paper);border:3px solid var(--lime);width:624px;height:467px;box-shadow:0 0 0 2px var(--lime-dark), inset 0 0 0 2px var(--rim);border-radius:18px;position:relative;overflow:hidden}.title-row{justify-content:center;align-items:center;gap:18px;display:flex;position:absolute;top:8px;left:0;right:0}.card>.cta{position:absolute;top:411px;left:0;right:0}.tile{box-sizing:border-box;border:2px solid var(--lime);background:var(--paper);border-radius:8px;position:absolute;overflow:hidden}.tile .sparkle{width:11px;position:absolute}.clog-art{position:relative;overflow:hidden}.clog-art img{height:auto;position:absolute}.title-screen{--u:min(calc(100dvh / 512), calc(100vw / 910));--ox:calc(50vw - var(--u) * 455);--oy:calc(100dvh - var(--u) * 512);background:var(--paper);position:fixed;inset:0;overflow:hidden}.title-screen>*{margin:0;position:absolute}.title-screen .cutout{width:100%;height:auto}.title-screen .game-title{left:calc(var(--ox) + var(--u) * 155.9);top:calc(var(--oy) + var(--u) * 56.4);width:calc(var(--u) * 529.1)}.title-screen .art-cta.play{left:calc(var(--ox) + var(--u) * 83);top:calc(var(--oy) + var(--u) * 299.1);width:calc(var(--u) * 249.7);height:calc(var(--u) * 106.5);border-radius:calc(var(--u) * 12);z-index:1;background-size:100% 100%}.title-screen .menu-dashes-left,.title-screen .menu-dashes-right{top:calc(var(--oy) + var(--u) * 304.8);width:calc(var(--u) * 52)}.title-screen .menu-dashes-left{left:calc(var(--ox) + var(--u) * 20.3)}.title-screen .menu-dashes-right{left:calc(var(--ox) + var(--u) * 344.1)}.title-niles{left:calc(var(--ox) + var(--u) * 421.4);width:calc(var(--u) * 446.1);image-rendering:pixelated;bottom:0}.title-screen .s-big{left:calc(var(--ox) + var(--u) * 744.6);top:calc(var(--oy) + var(--u) * 91.2);width:calc(var(--u) * 110.3)}.title-screen .s-top{left:calc(var(--ox) + var(--u) * 631.1);top:calc(var(--oy) + var(--u) * 151.4);width:calc(var(--u) * 40.6)}.title-screen .s-mid{left:calc(var(--ox) + var(--u) * 393.5);top:calc(var(--oy) + var(--u) * 204.7);width:calc(var(--u) * 69.1)}.title-screen .s-low{left:calc(var(--ox) + var(--u) * 377);top:calc(var(--oy) + var(--u) * 451.2);width:calc(var(--u) * 45)}.tutorial .intro{border-bottom:2px solid var(--lime);height:58px;position:absolute;top:62px;left:16px;right:16px}.tutorial .intro>.body{width:280px;position:absolute;top:8px;left:4px}.intro-clog{width:118px;height:66px;image-rendering:pixelated;background-position:-330px -64px;background-repeat:no-repeat;position:absolute;top:61px;left:327px}.intro-stars{grid-template-columns:minmax(0,1fr);justify-items:center;gap:4px;width:133px;display:grid;position:absolute;top:6px;right:4px}.intro-stars .stars{gap:8px;display:flex}.intro-stars>p{white-space:nowrap}.tutorial .tile{width:291px;height:134px}.tutorial .move{top:136px}.tutorial .watch-tile,.tutorial .plush-tile{top:276px}.tutorial .jump,.tutorial .watch-tile{left:16px}.tutorial .slide,.tutorial .plush-tile{left:315px}.move:after{content:"";background:var(--floor);border-top:2px solid #6e6e6e;height:10px;position:absolute;bottom:12px;left:0;right:0}.move>.body{width:92px;position:absolute;top:26px;left:12px}.gesture{justify-items:center;gap:8px;display:grid;position:absolute;top:30px;left:112px}.arrow{width:18px}.hand{width:32px}.jump:before{content:"";border-top:2px solid #0000;border-left:2px solid #c4c4c4;border-radius:40px 0 0;width:40px;height:60px;position:absolute;top:40px;left:150px}.slide:before{content:"";background:#c4c4c4;width:26px;height:2px;position:absolute;top:80px;left:150px;box-shadow:8px 8px #c4c4c4,-4px 16px #c4c4c4}.move img{position:absolute}.jump .niles{width:100px;bottom:26px;left:136px}.jump .boxes{width:76px;bottom:5px;left:206px}.slide .niles{width:104px;bottom:14px;left:150px}.slide .desk{width:120px;bottom:5px;left:196px}.watch-tile h2,.plush-tile h2{margin-top:8px}.watches{justify-content:center;gap:0;margin-top:2px;display:flex}.watches img{width:56px}.watches img:nth-child(3){margin-left:18px}.watch-tile>.body{text-align:center;margin-top:2px}.plush-tile>.body{width:118px;position:absolute;top:44px;left:14px}.plush-group{align-items:center;gap:2px;display:flex;position:absolute}.plush-group .plush{display:block}.plush-group .dashes{margin-bottom:16px}.plush-group .dashes.left{margin-right:-14px}.plush-group .dashes.right{margin-left:-14px}.clog-plush .dashes.left{margin-right:-26px}.clog-plush .dashes.right{margin-left:-26px}.plush-group .ga{top:34px;left:12px}.plush-group .gb{bottom:22px;left:8px}.plush-group .pa{top:2px;right:12px}.tutorial-plush{bottom:-6px;right:6px}.tutorial-plush .plush{width:114px}.w1{top:50px;left:26px}.gw2{top:44px;left:140px}.w3{top:58px;right:22px}.gw4{top:98px;left:268px}.results .tile{height:335px;top:66px}.results .clogs{place-items:center;width:290px;display:grid;left:16px}.results .clogs .clog-art{width:264px}.results .summary{width:291px;left:315px}.summary .face{object-fit:cover;object-position:bottom;width:98px;height:67px;position:absolute;top:22px;left:50%;transform:translate(-50%)}.stars-row{justify-content:center;align-items:center;gap:10px;display:flex;position:absolute;top:104px;left:0;right:0}.stars-row .stars{gap:8px;display:flex}.summary>.body{width:226px;position:absolute;top:190px;left:38px}.summary-plush{bottom:-6px;right:0}.summary-plush .plush{width:118px}.clog-plush{bottom:0;left:50%;transform:translate(-50%)}.clog-plush .plush{width:168px}.clog-plush .dashes{margin-bottom:40px}.summary .f1{top:30px;left:82px}.summary .gf2{top:58px;left:92px}.summary .gf3{top:22px;right:86px}.summary .gf4{top:40px;right:72px}.lead-form{position:absolute;top:198px;left:12px;right:12px}.lead-form>.body{margin-bottom:8px;padding:0 4px}.lead-form .row{gap:4px;display:grid}.lead-form label{padding-left:6px}.lead-form input[type=email],.lead-form input[type=text]{box-sizing:border-box;border:2px solid var(--ink);width:100%;height:36px;color:var(--ink);background:#fff;border-radius:7px;padding:0 12px;font-family:Logic Loop,system-ui,sans-serif;font-size:13px}.lead-form input::placeholder{color:#b6b6b6}.lead-form input:focus{box-shadow:0 0 0 2px var(--lime);outline:none}.privacy{position:absolute;top:47px;right:6px}.privacy a{color:var(--ink)}.status{min-height:14px;color:var(--error);margin-top:6px;padding-left:6px}.lead-form .captcha{z-index:2;position:absolute;top:-8px;left:50%;transform:translate(-50%)}.honeypot{width:1px;height:1px;position:absolute;left:-10000px;overflow:hidden}.thanks{text-align:center;gap:10px;display:grid;position:absolute;top:196px;left:12px;right:12px}#rotate{display:none}@media (orientation:portrait){#rotate{z-index:10;background:var(--bg);color:var(--ink);text-align:center;place-content:center;gap:16px;padding:24px;font-family:Pixter,system-ui,sans-serif;font-size:1.6rem;display:grid;position:fixed;inset:0}#rotate:before{content:"";border:6px solid var(--ink);border-radius:12px;justify-self:center;width:56px;height:92px;animation:1.8s ease-in-out infinite rotate-hint}}@keyframes rotate-hint{0%,30%{transform:rotate(0)}60%,to{transform:rotate(-90deg)}}@media (prefers-reduced-motion:reduce){#rotate:before{animation:none;transform:rotate(-90deg)}}@media (orientation:portrait) and (pointer:fine){#rotate:before{border-top-width:14px;border-radius:6px;width:96px;height:64px;animation:1.8s ease-in-out infinite widen-hint}}@media (orientation:portrait) and (pointer:fine) and (prefers-reduced-motion:reduce){#rotate:before{animation:none;transform:none}}@keyframes widen-hint{0%,30%{transform:scaleX(.55)}60%,to{transform:scaleX(1)}}.art-screen .art-full{width:100%;height:100%;position:absolute;inset:0}.art-screen{box-shadow:none;background:0 0;border:0}.art-screen .art-hotspot{width:206px;min-width:0;height:40px;box-shadow:none;cursor:pointer;background:0 0;border:0;border-radius:10px;padding:0;position:absolute;top:416px;left:208px}.art-screen .art-hotspot .label{opacity:0}.art-screen .art-hotspot:focus-visible{outline:3px solid var(--pink);outline-offset:2px}.ui-toggle{z-index:20;border:2px solid var(--ink);background:var(--paper);color:var(--ink);opacity:.8;cursor:pointer;border-radius:6px;padding:4px 8px;font:12px system-ui,sans-serif;position:fixed;bottom:8px;left:8px}.cutout{image-rendering:pixelated;display:block}.art-title{filter:none;-webkit-text-fill-color:currentColor;background:0 0;padding:0}.art-title .cutout{margin:0 auto}.intro-stars .stars{gap:14px}.intro-stars .star{width:auto}.stars-row .stars{gap:9px}.stars-row .star{width:auto}.cta-button.art-cta{width:203px;min-width:0;height:37px;box-shadow:none;image-rendering:pixelated;background-color:#0000;background-repeat:no-repeat;border-radius:9px;padding:0}.cta-button.art-cta .label{opacity:0}.cut-title-tutorial{transform:translate(3px,5px)}.cut-title-results{transform:translate(4px,5px)}.cut-title-watch{transform:translateY(-3px)}.cut-title-plush{transform:translate(-5px,-3px)}.intro-stars .stars{transform:translate(-7px,7px)}.stars-row .stars{transform:translate(2px,6px)}.card>.cta:has(.art-cta){transform:translateY(4px)}
