@import"https://fonts.googleapis.com/css2?family=Black+Ops+One&family=IBM+Plex+Mono:wght@500;600;700&display=swap";:root{font-family:IBM Plex Mono,monospace;color:#111116;background:#78c9ed;font-synthesis:none;--ink: #111116;--paper: #f6f1e5;--yellow: #ffdf45;--pink: #ff366d;--blue: #3b8fe5}*{box-sizing:border-box}html,body,#game{width:100%;height:100%;margin:0;overflow:hidden}body{user-select:none;overscroll-behavior:none}button,input{font:inherit}#game{display:block;outline:none;image-rendering:pixelated;touch-action:none}#hud{position:fixed;inset:0;z-index:3;pointer-events:none}.brand{position:absolute;top:max(18px,env(safe-area-inset-top));left:max(20px,env(safe-area-inset-left));display:flex;align-items:center;padding:10px 13px 10px 10px;color:#fff;background:var(--ink);border:2px solid white;font:700 17px/1 IBM Plex Mono,monospace;letter-spacing:-1.2px;box-shadow:4px 4px #ffffff8c}.brand strong{color:var(--yellow)}.brand-dot{width:10px;height:10px;margin-right:9px;background:var(--pink);box-shadow:4px 0 #35c9f4,8px 0 0 var(--yellow)}.status{position:absolute;right:max(20px,env(safe-area-inset-right));top:max(18px,env(safe-area-inset-top));display:flex;align-items:center;gap:9px;padding:10px 13px;background:#111116eb;border:2px solid white;color:#fff;font-size:10px;font-weight:700;letter-spacing:.7px;text-transform:uppercase}.status i{width:8px;height:8px;background:var(--yellow);box-shadow:0 0 0 2px #ffdf452e}.status.connected i{background:#65ec91;box-shadow:0 0 0 2px #65ec912e}.crosshair{position:absolute;left:50%;top:50%;width:34px;height:34px;transform:translate(-50%,-50%);transition:transform .08s steps(2)}.crosshair:after{content:"";position:absolute;left:15px;top:15px;width:4px;height:4px;background:var(--yellow);box-shadow:1px 1px 0 var(--ink)}.crosshair b{position:absolute;display:block;background:#fff;box-shadow:1px 1px 0 var(--ink)}.crosshair b:nth-child(1),.crosshair b:nth-child(2){width:8px;height:2px;top:16px}.crosshair b:nth-child(1){left:1px}.crosshair b:nth-child(2){right:1px}.crosshair b:nth-child(3),.crosshair b:nth-child(4){width:2px;height:8px;left:16px}.crosshair b:nth-child(3){top:1px}.crosshair b:nth-child(4){bottom:1px}.crosshair.painting{transform:translate(-50%,-50%) scale(.76) rotate(45deg)}.tool-dock{position:absolute;bottom:43px;left:50%;transform:translate(-50%);display:grid;grid-template-columns:auto auto;gap:0 12px;align-items:center;padding:9px 11px 8px;background:#111116eb;border:2px solid white;box-shadow:5px 5px #11111661;pointer-events:auto;z-index:4}.tool-label{min-width:92px;display:grid;gap:3px;color:#fff}.tool-label span{font:700 10px/1 IBM Plex Mono;letter-spacing:.6px}.tool-label small{color:#a5abb3;font-size:7px;letter-spacing:1.1px}#palette{display:flex;gap:6px}.swatch{width:29px;height:29px;padding:0;border:2px solid rgba(255,255,255,.28);position:relative;background:var(--color);cursor:pointer}.swatch:after{content:attr(data-key);position:absolute;right:2px;bottom:-1px;color:#fff;font-size:8px;font-weight:700;text-shadow:1px 1px #000}.swatch:hover{border-color:#fff}.swatch.active{outline:2px solid white;outline-offset:2px;transform:translateY(-3px)}.spray-meter{grid-column:1 / -1;height:4px;margin-top:8px;background:#37373d;overflow:hidden}.spray-meter span{display:block;width:100%;height:100%;transform-origin:left;background:var(--yellow)}.hint{position:absolute;bottom:14px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:9px;color:#fff;font-size:8px;font-weight:700;letter-spacing:.5px;text-shadow:1px 1px var(--ink);white-space:nowrap}.hint i{width:3px;height:3px;background:var(--yellow)}.mobile-hint{display:none}#feed{position:absolute;left:max(20px,env(safe-area-inset-left));bottom:max(20px,env(safe-area-inset-bottom));display:grid;gap:5px}.feed-line{background:#ffffffeb;border:2px solid var(--ink);border-left:6px solid var(--color);padding:7px 9px;font-size:9px;font-weight:700;animation:feed-in .2s steps(2)}@keyframes feed-in{0%{transform:translate(-20px);opacity:0}}#mobile-controls{display:none;position:fixed;inset:0;pointer-events:none;z-index:2}#look-zone{position:absolute;inset:0 0 112px 40%;pointer-events:auto;touch-action:none}#move-pad{position:absolute;left:max(24px,env(safe-area-inset-left));bottom:max(24px,env(safe-area-inset-bottom));width:104px;height:104px;border:2px solid rgba(255,255,255,.8);background:#11111673;border-radius:50%;pointer-events:auto;touch-action:none}#move-pad:before,#move-pad:after{content:"";position:absolute;background:#ffffff38}#move-pad:before{width:2px;height:72px;left:49px;top:14px}#move-pad:after{width:72px;height:2px;left:14px;top:49px}#move-stick{position:absolute;left:29px;top:29px;width:42px;height:42px;border-radius:50%;background:#fff;border:3px solid var(--ink);box-shadow:3px 3px #11111680}#spray-button{position:absolute;right:max(24px,env(safe-area-inset-right));bottom:max(29px,env(safe-area-inset-bottom));width:86px;height:86px;padding:0;border:3px solid white;border-radius:50%;background:var(--pink);color:#fff;box-shadow:5px 5px 0 var(--ink);font:700 10px IBM Plex Mono;pointer-events:auto;touch-action:none}#spray-button span{display:block;width:16px;height:22px;margin:0 auto 3px;border:2px solid white;border-top-width:5px}#spray-button.active{transform:translate(3px,3px) scale(.96);box-shadow:2px 2px 0 var(--ink)}#start-screen{position:fixed;inset:0;z-index:5;display:grid;place-items:center;padding:24px;background:#15223080;backdrop-filter:blur(7px)}#start-screen.hidden{display:none}.start-card{width:min(520px,calc(100vw - 32px));padding:28px 32px 30px;background:var(--paper);border:4px solid var(--ink);box-shadow:12px 12px 0 var(--ink);position:relative}.start-card:before{content:"";position:absolute;left:-4px;top:64px;width:7px;height:98px;background:var(--pink)}.card-topline{display:flex;justify-content:space-between;padding-bottom:13px;border-bottom:2px solid var(--ink);font-size:8px;font-weight:700;letter-spacing:1px}.card-topline span:last-child{color:#13874c}.card-topline span:last-child:before{content:"";display:inline-block;width:6px;height:6px;margin-right:6px;background:#43d77f}.kicker{margin:20px 0 8px;font-size:9px;font-weight:700;letter-spacing:2.2px;color:var(--pink)}.start-card h1{margin:0;font:54px/.9 Black Ops One,sans-serif;letter-spacing:-3.5px;white-space:nowrap}.start-card h1 span{color:var(--blue)}.start-card>p:not(.kicker){max-width:430px;margin:20px 0 16px;font-size:11px;line-height:1.65}.features{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:22px}.features span{padding:5px 7px;border:1px solid var(--ink);font-size:7px;font-weight:700;letter-spacing:.7px;background:#fff}.start-card label{display:block;font-size:8px;font-weight:700;letter-spacing:1.2px}.start-card input{display:block;width:100%;margin:7px 0 10px;padding:12px;border:3px solid var(--ink);border-radius:0;background:#fff;font:700 13px IBM Plex Mono;outline:0}.start-card input:focus{border-color:var(--blue);box-shadow:inset 5px 0 0 var(--blue)}.start-card button{width:100%;display:flex;justify-content:space-between;align-items:center;padding:13px 16px;border:3px solid var(--ink);background:var(--yellow);box-shadow:5px 5px 0 var(--ink);font:17px Black Ops One;cursor:pointer}.start-card button b{font:700 22px/1 IBM Plex Mono}.start-card button:hover{transform:translate(2px,2px);box-shadow:3px 3px 0 var(--ink)}.start-card small{display:block;margin-top:16px;font-size:8px;color:#62626a;text-align:center}.mobile-note{display:none!important}@media(pointer:coarse),(max-width:760px){#start-screen{padding:12px}.brand{top:max(11px,env(safe-area-inset-top));left:max(11px,env(safe-area-inset-left));padding:8px 10px 8px 8px;font-size:13px;box-shadow:3px 3px #ffffff80}.brand-dot{width:8px;height:8px;margin-right:7px}.status{top:max(11px,env(safe-area-inset-top));right:max(11px,env(safe-area-inset-right));padding:8px 9px;font-size:8px}.crosshair{top:46%}.tool-dock{top:max(58px,calc(env(safe-area-inset-top) + 48px));bottom:auto;padding:7px;grid-template-columns:1fr;gap:0}.tool-label{display:none}#palette{gap:5px}.swatch{width:27px;height:27px}.swatch:after{display:none}.spray-meter{margin-top:6px}.desktop-hint,#feed{display:none}.mobile-hint{display:flex;bottom:max(8px,env(safe-area-inset-bottom));font-size:7px;z-index:4}#mobile-controls.active{display:block}.start-card{width:min(460px,calc(100vw - 34px));max-height:calc(100dvh - 24px);overflow-y:auto;padding:22px 23px 24px;box-shadow:8px 8px 0 var(--ink)}.start-card:before{top:55px;height:72px}.card-topline{padding-bottom:10px}.kicker{margin-top:16px}.start-card h1{font-size:clamp(35px,11vw,50px);letter-spacing:-3px}.start-card>p:not(.kicker){margin:15px 0 12px;font-size:10px}.features{margin-bottom:16px}.start-card input{padding:11px}.desktop-note{display:none!important}.mobile-note{display:block!important}}@media(pointer:coarse)and (orientation:landscape),(max-height:520px)and (max-width:900px){.tool-dock{top:max(12px,env(safe-area-inset-top));left:50%}.brand{max-width:130px;overflow:hidden}.start-card{width:min(700px,calc(100vw - 34px));display:grid;grid-template-columns:1.1fr .9fr;column-gap:24px;align-items:end;padding:18px 22px}.card-topline,.start-card h1,.kicker{grid-column:1}.start-card>p:not(.kicker),.features{grid-column:1}.start-card label,.start-card button,.start-card small{grid-column:2}.card-topline{display:none}.kicker{margin:0 0 7px}.start-card h1{font-size:40px}.start-card>p:not(.kicker){margin:12px 0 9px;line-height:1.45}.features{margin:0}.start-card label{grid-row:2}.start-card button{grid-row:3}.start-card small{grid-row:4;margin-top:11px}}