:root{--ink:#26181e;--paper:#f4ecd0;--paper-2:#e6d8b0;--wood:#a8703e;--wood-d:#6a4428;--water:#2a8ab8;--water-l:#5ab0d8;--gas:#b4c43a;--gas-l:#d8e460;--red:#d8484a;--muted:#7a6650;--font:"Pixelify Sans", "Silkscreen", ui-monospace, monospace;--title:"Silkscreen", "Pixelify Sans", ui-monospace, monospace}*{box-sizing:border-box}html,body{height:100%;color:var(--paper);font-family:var(--font);background:#bfe0ee;margin:0;overflow:hidden}canvas#view{image-rendering:pixelated;display:block;position:fixed;inset:0}#ui{pointer-events:none;position:fixed;inset:0}#ui>*{pointer-events:auto}.hidden{display:none!important}button{font:inherit;color:var(--ink);cursor:pointer;background:var(--paper);box-shadow:0 0 0 2px var(--ink), inset 0 -3px 0 var(--paper-2);border:0;padding:8px 14px;font-size:16px;transition:transform 60ms}button:hover:not(:disabled){background:#fff8e0}button:active:not(:disabled){box-shadow:0 0 0 2px var(--ink);transform:translateY(2px)}button:disabled{opacity:.5;cursor:default}button:focus-visible,input:focus-visible{outline:2px dashed var(--gas-l);outline-offset:3px}button.primary{background:var(--gas-l);box-shadow:0 0 0 2px var(--ink), inset 0 -3px 0 var(--gas)}button.primary:hover:not(:disabled){background:#e8f080}button.danger{box-shadow:0 0 0 2px var(--ink), inset 0 -3px 0 #d8848a;background:#f0b0a8}button.big{padding:12px 22px;font-size:20px}button.small{padding:3px 8px;font-size:13px}button.back{color:var(--paper);box-shadow:none;background:0 0;padding-left:0}button.back:hover{color:var(--gas-l);background:0 0}input{font:inherit;color:var(--ink);box-shadow:0 0 0 2px var(--ink);background:#fffaf0;border:0;padding:8px 10px;font-size:16px}input[type=range]{box-shadow:none;accent-color:var(--gas);background:0 0;width:100%;padding:0}kbd{font-family:var(--title);background:var(--paper);color:var(--ink);box-shadow:0 0 0 1px var(--ink), inset 0 -2px 0 var(--paper-2);padding:1px 5px;font-size:12px}.row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.row.end{justify-content:space-between;margin-top:18px}.split{grid-template-columns:1fr 1fr;gap:18px;display:grid}@media (max-width:760px){.split{grid-template-columns:1fr}}.hint{color:#c8b890;font-size:14px}.error{color:#f0a090}.tag{font-family:var(--title);color:var(--paper);background:#00000040;padding:1px 6px;font-size:11px}.tag.ready{background:var(--gas);color:var(--ink)}.tag.away{background:#6a4040}.screen{pointer-events:none;justify-content:center;align-items:center;padding:16px;display:flex;position:absolute;inset:0;overflow-y:auto}.screen>*{pointer-events:auto}body.demo .screen{background:radial-gradient(#141e1426,#14141e8c)}body:not(.demo):not(.ingame) .screen{background:#2e4a2a}.panel{color:var(--paper);box-shadow:0 0 0 3px var(--ink), 0 0 0 6px var(--wood), 0 0 0 9px var(--ink), 0 12px 0 9px #00000059;background:#3a2414f0;width:100%;max-width:860px;margin:12px auto;padding:22px 26px}.panel h2{font-family:var(--title);color:var(--gas-l);letter-spacing:1px;margin:0 0 12px;font-size:26px}.panel h3{font-family:var(--title);color:var(--paper);margin:0 0 8px;font-size:15px}.panel p{line-height:1.45}.card{background:#00000038;padding:14px;box-shadow:inset 0 0 0 2px #00000059}.title{text-align:center;max-width:520px}.logo{font-family:var(--title);text-shadow:4px 4px 0 var(--ink);margin:4px 0 6px;line-height:.95}.logo-top{color:var(--gas-l);letter-spacing:6px;font-size:74px}.logo-bottom{color:var(--paper);letter-spacing:4px;font-size:44px}.tagline{color:#e6d8b0;margin:4px 0 16px}.foot{color:#a89070;margin-bottom:0;font-size:13px}.menu{flex-direction:column;align-items:stretch;gap:12px;margin-top:14px;display:flex}.menu .row{justify-content:center}.menu .row>button{flex:1}.profile{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;display:flex}.name-input{width:190px}.swatches{gap:6px;display:flex}.swatch{background:var(--c);width:26px;height:26px;box-shadow:0 0 0 2px var(--ink);padding:0}.swatch:hover:not(:disabled){background:var(--c);filter:brightness(1.15)}.swatch.on{box-shadow:0 0 0 2px var(--ink), 0 0 0 5px var(--paper)}.code-input{width:110px;font-family:var(--title);text-transform:uppercase;letter-spacing:4px;text-align:center;font-size:22px}.lobby{max-width:980px}.lobby-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;display:flex}.lobby-head .label{font-family:var(--title);color:#c8b890;font-size:12px}.lobby-head .code{font-family:var(--title);color:var(--gas-l);letter-spacing:8px;text-shadow:3px 3px 0 var(--ink);font-size:46px}.lobby-foot{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-top:16px;display:flex}.players{flex-direction:column;gap:6px;margin-bottom:14px;display:flex}.player{background:#0003;align-items:center;gap:8px;padding:6px 8px;display:flex}.player.me{box-shadow:inset 0 0 0 2px var(--pc)}.player.away{opacity:.55}.player.empty{color:#8a7458;font-style:italic}.pdot{background:var(--pc,#5a4a3a);width:14px;height:14px;box-shadow:0 0 0 2px var(--ink);flex:none}.pname{flex:1}.you label,.opts label,.slider label{font-family:var(--title);color:#c8b890;margin:10px 0 5px;font-size:12px;display:block}.river-body{gap:14px;display:flex}@media (max-width:520px){.river-body{flex-direction:column}}canvas.route{width:220px;height:300px;image-rendering:pixelated;box-shadow:0 0 0 2px var(--ink);flex:none;align-self:flex-start}.river-info{flex:1;min-width:0}.seed{justify-content:center;align-items:center;gap:8px;margin:6px 0;font-size:15px;display:flex}.river-info .seed{justify-content:flex-start}.seed b{font-family:var(--title);color:var(--gas-l);letter-spacing:1px}.stats{color:#e6d8b0;margin:6px 0;padding:0;font-size:14px;list-style:none}.stats li{padding:2px 0}.stats li.ok{color:var(--gas-l)}.generating{color:var(--gas-l);animation:1s steps(2,end) infinite blink}@keyframes blink{50%{opacity:.4}}.choice{flex-wrap:wrap;gap:6px;display:flex}.choice button{padding:5px 9px;font-size:14px}.choice button.on{background:var(--gas-l);box-shadow:0 0 0 2px var(--ink), inset 0 -3px 0 var(--gas)}.seed-input{width:150px;font-family:var(--title);text-transform:uppercase;font-size:14px}.loading{text-align:center;max-width:520px}.loading-stage{color:#e6d8b0;margin:10px 0}.loading-bar{height:16px;box-shadow:0 0 0 2px var(--ink);background:#00000059}.loading-fill{background:var(--gas);width:0;height:100%;transition:width .2s;box-shadow:inset 0 -4px #8a9a2a}.howto{max-width:900px}.howto ul{padding-left:18px;line-height:1.8}.settings{max-width:440px}.check{align-items:center;gap:8px;margin:16px 0;display:flex}.check input{width:18px;height:18px;accent-color:var(--gas)}.overlay{background:#14101e73;justify-content:center;align-items:center;padding:16px;display:flex;position:absolute;inset:0;overflow-y:auto}.pause{text-align:center;max-width:380px}.victory{text-align:center;max-width:520px}.victory-title{font-family:var(--title);color:var(--gas-l);text-shadow:4px 4px 0 var(--ink);font-size:46px}.victory-time{font-family:var(--title);justify-content:center;align-items:center;gap:10px;margin:6px 0;font-size:34px;display:flex}.victory-stats{justify-content:center;gap:24px;margin:12px 0;display:flex}.victory-stats div{flex-direction:column;display:flex}.victory-stats b{font-family:var(--title);color:var(--paper);font-size:26px}.victory-stats span{color:#c8b890;font-size:13px}.victory-farts{text-align:left;flex-direction:column;gap:4px;margin:10px 0;display:flex}.toasts{z-index:10;flex-direction:column;align-items:center;gap:6px;display:flex;position:absolute;top:12px;left:50%;transform:translate(-50%);pointer-events:none!important}.toast{background:var(--paper);color:var(--ink);box-shadow:0 0 0 2px var(--ink), 0 4px 0 2px #0000004d;padding:6px 14px;transition:opacity .4s,transform .4s}.toast.bad{background:#f0b0a8}.toast.out{opacity:0;transform:translateY(-8px)}.hud{font-family:var(--font);position:absolute;inset:0;pointer-events:none!important}.hud *{pointer-events:none}.hud-top{align-items:center;gap:12px;width:min(560px,100% - 32px);display:flex;position:absolute;top:14px;left:50%;transform:translate(-50%)}.hud-progress{height:12px;box-shadow:0 0 0 2px var(--ink);background:#141e2899;flex:1;position:relative}.hud-progress-fill{background:var(--water-l);width:0;height:100%}.hud-progress-raft{background:var(--wood);width:12px;height:22px;box-shadow:0 0 0 2px var(--ink);margin-left:-6px;position:absolute;top:-6px}.hud-cp{width:4px;height:18px;box-shadow:0 0 0 1px var(--ink);background:#e8b83a;margin-left:-2px;position:absolute;top:-3px}.hud-timer{font-family:var(--title);color:var(--paper);text-shadow:2px 2px 0 var(--ink);text-align:right;min-width:90px;font-size:20px}.hud-falls{font-family:var(--title);color:var(--paper);text-shadow:2px 2px 0 var(--ink);box-shadow:0 0 0 2px var(--ink);background:#26181e8c;padding:2px 10px 2px 30px;font-size:20px;position:absolute;top:12px;right:16px}.hud-falls:before{content:"";width:14px;height:14px;box-shadow:inset 0 0 0 4px #f0d0a0, 0 0 0 2px var(--ink);border-radius:50%;margin-top:-7px;position:absolute;top:50%;left:8px}@media (max-width:760px){.hud-falls{top:44px}}.hud-names{position:absolute;inset:0;overflow:hidden}.hud-name{color:var(--paper);white-space:nowrap;text-shadow:2px 0 0 var(--ink), -2px 0 0 var(--ink), 0 2px 0 var(--ink), 0 -2px 0 var(--ink);font-size:14px;position:absolute;top:0;left:0}.hud-name.me{color:var(--gas-l)}.hud-gas{flex-wrap:wrap;gap:10px;max-width:calc(100% - 32px);display:flex;position:absolute;bottom:16px;left:16px}.hud-gas-row{box-shadow:0 0 0 2px var(--ink), inset 3px 0 0 var(--pc);background:#26181ebf;min-width:140px;padding:5px 8px}.hud-gas-row.me{box-shadow:0 0 0 2px var(--paper), inset 3px 0 0 var(--pc)}.hud-gas-name{margin-bottom:4px;padding-left:4px;font-size:13px;display:block}.hud-gas-bar{height:10px;box-shadow:0 0 0 1px var(--ink);background:#00000080}.hud-gas-fill{background:var(--gas);width:100%;height:100%;box-shadow:inset 0 -3px #8a9a2a}.hud-gas-row.farting .hud-gas-fill{background:var(--gas-l)}.hud-gas-row.empty .hud-gas-bar{box-shadow:0 0 0 1px var(--red)}.hud-banner{text-align:center;opacity:0;transition:opacity .2s;position:absolute;top:34%;left:50%;transform:translate(-50%,-50%)}.hud-banner.show{opacity:1}.hud-banner-title{font-family:var(--title);color:var(--paper);text-shadow:4px 4px 0 var(--ink);font-size:50px}.hud-banner.bad .hud-banner-title{color:#f08070}.hud-banner.good .hud-banner-title{color:var(--gas-l)}.hud-banner-sub{text-shadow:2px 2px 0 var(--ink);font-size:18px}.hud-count{font-family:var(--title);color:var(--gas-l);text-shadow:6px 6px 0 var(--ink);opacity:0;font-size:110px;position:absolute;top:40%;left:50%;transform:translate(-50%,-50%)}.hud-count.show{opacity:1}.hud-count.pop{animation:.9s ease-out forwards pop}@keyframes pop{0%{transform:translate(-50%,-50%)scale(1.6)}25%{transform:translate(-50%,-50%)scale(1)}to{opacity:.2;transform:translate(-50%,-50%)scale(.9)}}.hud-conn{color:var(--ink);box-shadow:0 0 0 2px var(--ink);background:#f0b0a8;padding:4px 12px;display:none;position:absolute;top:50px;left:50%;transform:translate(-50%)}.hud-conn.show{animation:1s steps(2,end) infinite blink;display:block}.hud-keys{color:var(--paper);text-shadow:2px 2px 0 var(--ink);opacity:.85;font-size:13px;position:absolute;bottom:16px;right:16px}@media (max-width:760px){.hud-keys{display:none}}.hud.hit{animation:.3s steps(3,end) hit}@keyframes hit{0%{box-shadow:inset 0 0 0 6px #d8484ab3}to{box-shadow:none}}.touch-controls{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;position:absolute;inset:0;pointer-events:none!important}body:not(.touch) .touch-controls,body.touch .hud-keys{display:none}body.touch.ingame,body.touch.ingame canvas#view{touch-action:none}.touch-zone{pointer-events:auto;touch-action:none;width:50%;position:absolute;top:64px;bottom:0;left:0}.touch-base{opacity:.6;width:120px;height:120px;left:calc(env(safe-area-inset-left) + 100px);top:calc(100% - env(safe-area-inset-bottom) - 150px);background:#26181e47;border-radius:50%;margin:-60px 0 0 -60px;position:absolute;box-shadow:0 0 0 3px #26181e8c,inset 0 0 0 3px #f4ecd059}.touch-base.active{opacity:1;top:0;left:0}.touch-knob{background:var(--paper);width:52px;height:52px;box-shadow:0 0 0 3px var(--ink), inset 0 -5px 0 var(--paper-2);border-radius:50%;margin:-26px 0 0 -26px;position:absolute;top:50%;left:50%}.touch-fart{right:calc(env(safe-area-inset-right) + 28px);bottom:calc(env(safe-area-inset-bottom) + 76px);width:112px;height:112px;font-family:var(--title);color:var(--ink);letter-spacing:1px;background:var(--gas-l);box-shadow:0 0 0 3px var(--ink), inset 0 -7px 0 var(--gas), 0 6px 0 3px #0000004d;pointer-events:auto;touch-action:none;cursor:pointer;border-radius:50%;justify-content:center;align-items:center;font-size:20px;display:flex;position:absolute}.touch-fart.on{background:var(--gas);box-shadow:0 0 0 3px var(--ink), inset 0 4px 0 #8a9a2a, 0 2px 0 3px #0000004d;transform:translateY(4px)scale(.96)}.touch-pause{top:calc(env(safe-area-inset-top) + 10px);left:calc(env(safe-area-inset-left) + 12px);width:44px;height:44px;font-family:var(--title);pointer-events:auto;padding:0;font-size:16px;position:absolute}@media (max-height:460px){.touch-fart{width:92px;height:92px;bottom:calc(env(safe-area-inset-bottom) + 64px);right:calc(env(safe-area-inset-right) + 20px)}.touch-base{top:calc(100% - env(safe-area-inset-bottom) - 124px)}}