@font-face{font-family:Degular;src:url(/loop/fonts/DegularText-Medium.woff2)format("woff2");font-weight:400 500;font-display:swap}@font-face{font-family:Degular;src:url(/loop/fonts/DegularText-Bold.woff2)format("woff2");font-weight:700;font-display:swap}@font-face{font-family:Degular Display;src:url(/loop/fonts/DegularDisplay-Bold.woff2)format("woff2");font-weight:400 700;font-display:swap}:root{--blue:#3666f2;--black:#0f0f0f;--white:#f0f0f0;--green:#caf472;--green-base:#6ebb0c;color:#fff;background:var(--blue);font-synthesis:none;font-family:Degular,Helvetica,system-ui,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.4}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer;border:0}button:disabled{cursor:default}a{color:inherit}h4{margin:0}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;position:absolute!important}.page{--accent:var(--green);--accent-ink:var(--black);--accent-base:var(--green-base);--accent-glow:#a1ff2633;--dpad-plate:#d3ffdf4d;--link:var(--blue);--link-ink:#fff;--control-wait:#6e9cc1;--control-wait-ink:var(--black);--control-off:#ffffff73;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;min-height:100svh}.page input{-webkit-user-select:text;user-select:text}header{justify-content:space-between;align-items:center;gap:1rem;height:6rem;padding:0 clamp(16px,3vw,42px);display:flex}.loop-logo,.campaign-logo{height:4rem;display:flex}.loop-letters{gap:.1rem;height:100%;display:flex}.loop-letters img{filter:brightness(0)invert();height:100%}.campaign-logo img{object-fit:contain;width:auto;max-width:12rem;height:100%}.preview{opacity:.9;font-size:.85rem}.site-links{background:var(--white);border:2px solid var(--blue);letter-spacing:-.03em;border-radius:999px;gap:1.5rem;padding:.35rem 1.5rem;font-size:1.5rem;line-height:1.4;display:flex}.site-links a{color:var(--blue);text-decoration:none}main{--control-size:clamp(44px,6vw,64px);--control-gap:clamp(4px,.7vw,8px);--direction-pad-size:calc(3 * var(--control-size) + 2 * var(--control-gap));--player-max:min(560px,max(240px,calc(100svh - 6rem - 288px)));max-width:1280px;margin:0 auto;padding:16px clamp(16px,3vw,32px) 32px;position:relative}.game-layout{grid-template-columns:repeat(2,minmax(0,1fr));place-items:center;gap:56px clamp(8px,2vw,32px);display:grid}.game-layout .video-wrap{grid-area:1/1/1/3}.controls-arrows-outer{grid-area:2/1;justify-content:center;align-items:center;display:flex}.press-wrap{grid-area:2/2}@media (width>=900px),(width>=600px) and (height<=520px){main{--player-max:min(560px,max(240px,calc(100svh - 6rem - 64px)))}.game-layout{grid-template-columns:minmax(var(--direction-pad-size),1fr) minmax(0,var(--player-max)) minmax(var(--direction-pad-size),1fr)}.controls-arrows-outer{grid-area:1/1}.game-layout .video-wrap{grid-area:1/2}.press-wrap{grid-area:1/3}}.page:not(.embedded){flex-direction:column;display:flex}.page:not(.embedded)>main{flex-direction:column;flex:1;justify-content:center;width:100%;display:flex}@media (width<=599px){.page:not(.embedded)>main{justify-content:flex-start}.page:not(.embedded) .game-layout{flex:1;grid-template-rows:auto 1fr;align-items:end}.page:not(.embedded) .game-layout .video-wrap{align-self:start}}@media (width>=600px) and (height<=520px){main{--control-size:44px;--control-gap:4px;--player-max:max(200px,calc(100svh - 6rem - 48px))}}.push{background:var(--accent-base);touch-action:manipulation;-webkit-tap-highlight-color:transparent;border-radius:1000px;padding:0;transition:filter .36s cubic-bezier(.2,0,0,1),opacity .36s cubic-bezier(.2,0,0,1);position:relative}.push>span{border-radius:inherit;background:var(--accent);color:var(--accent-ink);box-shadow:0 0 10px 3px var(--accent-glow);pointer-events:none;justify-content:center;align-items:center;transition:all .1s;display:flex;position:absolute;inset:0;transform:translateY(-6px)}.push:active>span{opacity:.6;transform:translateY(0)}.push:disabled{opacity:.72;filter:saturate(.2)}.push:disabled>span{transform:translateY(0)}.game-layout:is([data-controls=wait],[data-controls=off]) .push:disabled{opacity:1;filter:none;background:0 0}.game-layout[data-controls=wait] .push:disabled>span{background:var(--control-wait);color:var(--control-wait-ink);box-shadow:none}.game-layout[data-controls=off] .push:disabled>span{color:var(--control-off);box-shadow:inset 0 0 0 2px var(--control-off);background:0 0}.push:focus-visible{outline-offset:4px;outline:3px solid #fff}.controls-arrows{grid-template-columns:repeat(3,var(--control-size));grid-template-rows:repeat(3,var(--control-size));place-items:center;gap:var(--control-gap);isolation:isolate;width:max-content;margin:0 auto;display:grid;position:relative}.controls-arrows:before{content:"";z-index:-1;background:var(--dpad-plate);opacity:.45;filter:saturate(.2);pointer-events:none;position:absolute;inset:0;-webkit-mask:url(/loop/joystick-rounded.svg) 50%/contain no-repeat;mask:url(/loop/joystick-rounded.svg) 50%/contain no-repeat}.controls-arrows.active:before{opacity:1;filter:saturate();transition:opacity .42s cubic-bezier(.2,0,0,1) .62s,filter .42s cubic-bezier(.2,0,0,1) .62s}.direction{width:var(--control-size);height:var(--control-size)}.direction .caret{fill:currentColor;width:75%;height:62.5%;transform:translateY(-.2rem)}.direction.up{grid-area:1/2}.direction.left{grid-area:2/1}.direction.right{grid-area:2/3}.direction.down{grid-area:3/2}.direction.left .caret{transform:rotate(-90deg)translateY(-.2rem)}.direction.right .caret{transform:rotate(90deg)translateY(-.2rem)}.direction.down .caret{transform:rotate(180deg)translateY(-.2rem)}.tooltip{z-index:3;white-space:nowrap;color:var(--black);pointer-events:none;font-size:14px;line-height:1.2;animation:.3s cubic-bezier(.2,0,0,1) 1.1s both tooltipAppear;position:absolute;top:-16px;left:50%;transform:translate(-50%,-100%)}.tooltip>div{background:var(--white);border-radius:10px;padding:8px;animation:2s ease-in-out 1.4s 3 hover}.claw-button{width:calc(var(--control-size) * 2.4);height:calc(var(--control-size) * 2.4);font-size:clamp(22px,3vw,30px);font-weight:700}.video-wrap{--player-inset:clamp(10px,3cqi,20px);--badge-size:clamp(28px,7cqi,36px);width:min(100%,var(--player-max));aspect-ratio:1;background:var(--black);border-radius:clamp(20px,3vw,30px);min-width:0;margin:0 auto;position:relative;overflow:hidden;container-type:inline-size}.video-wrap video,.video-wrap canvas{object-fit:cover;width:178%;max-width:none;height:100%;position:absolute;left:50%;transform:translate(-50%)}.video-wrap canvas[hidden]{display:none}.video-wrap.won{box-shadow:var(--accent) 0 0 0 20px;animation:.75s 3 winVideoBackground}.top-pills{top:var(--player-inset);left:var(--player-inset);right:var(--player-inset);z-index:4;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:clamp(4px,1.5cqi,8px);display:grid;position:absolute}.top-pills>*{grid-row:1}.live-pill,.name-pill,.timer-pill,.result-pill{min-width:0;height:var(--badge-size);border:2px solid var(--link);color:#fff;white-space:nowrap;background:#0f0f0fb8;border-radius:999px;align-items:center;padding:0 clamp(8px,2cqi,12px);font-size:clamp(12px,3cqi,16px);line-height:1;display:flex}.live-pill{border-color:#ef3908;justify-self:start;padding-right:clamp(22px,5cqi,28px);position:relative}.live-pill.down{border-color:#ffffff59}.live-pill.down .live-dot{background:#9a9a9a;animation:none}.live-pill.still .live-dot{animation:none}.live-dot{background:red;border-radius:1000px;width:7px;height:7px;animation:2s infinite pulse;position:absolute;top:50%;right:clamp(8px,2cqi,12px);transform:translateY(-50%)}.name-pill{grid-column:2;justify-self:start;gap:4px;max-width:100%;overflow:hidden}.timer-pill{width:var(--badge-size);font-variant-numeric:tabular-nums;border-radius:50%;grid-column:3;justify-content:center;padding:0}.result-pill{grid-column:3}.result-pill.win{border-color:var(--accent)}.result-pill.miss{border-color:#ef3908}.name-pill svg{fill:#fff;flex:none;width:1.2em;height:1.2em}.name-pill span{text-overflow:ellipsis;min-width:0;overflow:hidden}.queue-count{bottom:var(--player-inset);width:max-content;max-width:calc(100% - 2 * var(--player-inset));text-align:center;color:#fff;z-index:4;background:#0f0f0fb8;border-radius:8px;margin:0 auto;padding:6px 12px;font-size:clamp(12px,3cqi,16px);line-height:1.25;position:absolute;left:0;right:0}.video-source{text-align:center;letter-spacing:.06em;color:#fff;text-shadow:0 1px 4px #000;font-size:.68rem;font-weight:700;position:absolute;bottom:3.2rem;left:0;right:0}.video-toggle{white-space:nowrap;color:#fff;z-index:6;background:#000a;border-radius:1rem;padding:.3rem .7rem;font-size:.72rem;position:absolute;bottom:.85rem;left:50%;transform:translate(-50%)}.reconnecting{z-index:3;padding:var(--player-inset);color:#fff;text-align:center;pointer-events:none;background:#171717f0;place-items:center;font-size:clamp(16px,4.5cqi,24px);line-height:1.3;display:grid;position:absolute;inset:0}.loader{z-index:7;background:#0f0f0ff0;place-items:center;display:grid;position:absolute;inset:0}.loader-letters{align-items:center;gap:.4rem;height:5.2rem;display:flex}.loader-letters img{filter:brightness(0)invert();height:100%;animation:1.6s cubic-bezier(.2,0,0,1) infinite loopPulse}.loader-letters img:nth-child(2){animation-delay:.12s}.loader-letters img:nth-child(3){animation-delay:.24s}.loader-letters img:nth-child(4){animation-delay:.36s}.bar-wrap{inset:calc(var(--player-inset) + var(--badge-size) + 12px) var(--player-inset) var(--player-inset);z-index:5;pointer-events:none;justify-content:center;align-items:flex-end;min-height:0;display:flex;position:absolute}.bar{pointer-events:auto;overscroll-behavior:contain;width:100%;min-width:0;max-height:100%;color:var(--black);background:#f0f0f0b3;border-radius:12px;padding:clamp(12px,4cqi,20px);position:relative;overflow:auto;box-shadow:0 4px 40px #3c3c3c33}.bar h4{overflow-wrap:anywhere;font-family:Degular Display,Helvetica,system-ui,sans-serif;font-size:clamp(16px,4.5cqi,26px);font-weight:700;line-height:1.2}.bar h4.long{font-family:Degular,Helvetica,system-ui,sans-serif;font-size:clamp(15px,4cqi,22px);line-height:1.25}.bar-line{align-items:center;gap:clamp(6px,2cqi,10px);font-size:clamp(16px,4.5cqi,26px);display:flex}.bar-line h4{flex:0 auto;min-width:0}.icon{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;flex:none;width:1.15em;height:1.15em}.bar-count{font-variant-numeric:tabular-nums;margin-left:auto;padding-left:8px;font-family:Degular Display,Helvetica,system-ui,sans-serif;font-weight:700;line-height:1;transition:color .2s}.bar-count.hot{color:#c8102e}.bar-progress{background:var(--link);transform-origin:0;height:4px;transition:transform 1s linear;position:absolute;bottom:0;left:0;right:0}.leave-button{color:inherit;background:0 0;margin-top:8px;padding:6px 0;font-size:14px;text-decoration:underline}.leave-button:focus-visible,.reload-button:focus-visible,.sound-pill:focus-visible{outline:3px solid var(--black);outline-offset:2px}.bar.alert{-webkit-user-select:text;user-select:text}.bar.alert p{margin:8px 0 16px;font-size:clamp(14px,3.6cqi,16px);line-height:1.4}.bar.alert button{background:var(--accent);color:var(--accent-ink);border-radius:99px;min-height:44px;padding:12px 24px}.bar.alert button:focus-visible{outline:3px solid var(--black);outline-offset:3px}.alert-wrap{z-index:8;animation:.18s ease-out both noticeIn}.sound-pill{width:var(--badge-size);height:var(--badge-size);color:#fff;background:#0f0f0fb8;border:2px solid #ffffff59;border-radius:50%;grid-column:4;place-items:center;padding:0;display:grid}.sound-pill .icon{width:58%;height:58%}.reconnecting-inner{justify-items:center;gap:12px;display:grid}.reconnecting-reason{opacity:.7;font-size:12px}.reload-button{pointer-events:auto;background:var(--accent);color:var(--accent-ink);border-radius:99px;min-height:44px;padding:10px 22px}.bar-detail{margin:4px 0 0;font-size:clamp(14px,3.5cqi,18px);line-height:1.3}.bar form{flex-direction:column;gap:clamp(8px,2cqi,12px);display:flex}.email-form{align-items:center;gap:8px;display:flex}.email-form input{border:2px solid var(--link);width:0;min-width:0;height:44px;color:var(--black);background:var(--white);border-radius:10px;flex:1 1 0;padding:8px 10px;font-family:Degular,Helvetica,system-ui,sans-serif;font-size:16px}.email-form input:focus{outline:3px solid var(--black);outline-offset:2px}.email-form button{background:var(--link);border-radius:10px;flex:0 0 44px;place-items:center;height:44px;padding:10px;display:grid}.email-form button svg{fill:none;width:24px;height:24px;stroke:var(--link-ink);stroke-linecap:round;stroke-linejoin:round;stroke-width:48px}.email-form button:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.consent{align-items:center;gap:.5rem;font-size:14px;line-height:1.3;display:flex}.consent input{width:1rem;height:1rem;accent-color:var(--link);flex:none}.tagline{text-align:center;margin:2rem 0 0;font-size:1.3rem;font-weight:700}.test-tools{text-align:center;margin:1.5rem 0 0}.text-button{color:inherit;background:0 0;padding:.4rem;font-size:.85rem;text-decoration:underline}footer{text-align:center;opacity:.7;padding:1.5rem;font-size:.7rem}:root:has(.page.embedded){background:0 0}.page.embedded{min-height:0}@media (width<=599px){.page.embedded main{--player-max:min(560px,max(240px,calc(100svh - 224px)));padding-top:8px;padding-bottom:16px}}@media (width<=760px){header{height:auto;padding:16px}.loop-logo,.campaign-logo{height:2.7rem}.site-links{gap:1rem;padding:.3rem 1rem;font-size:1rem}}@container (width<=280px){.top-pills{grid-template-columns:minmax(0,1fr) auto auto}.sound-pill{grid-column:3}.name-pill{grid-area:2/1/auto/-1}.timer-pill,.result-pill{grid-column:2}.bar-wrap{top:calc(var(--player-inset) + 2 * var(--badge-size) + 20px)}}@keyframes tooltipAppear{0%{opacity:0;transform:translate(-50%,calc(4px - 100%))}to{opacity:1;transform:translate(-50%,-100%)}}@keyframes hover{0%{transform:translate(0)}25%{transform:translateY(5px)}75%{transform:translateY(-5px)}to{transform:translate(0)}}@keyframes pulse{0%{box-shadow:0 0 10px #ef3908}70%{box-shadow:0 0 8px 8px #ef390800}to{box-shadow:0 0 10px #ef3908}}@keyframes winVideoBackground{0%,to{box-shadow:var(--accent) 0 0 0 20px}50%{box-shadow:var(--accent) 0 0 0 25px}}@keyframes loopPulse{0%,68%,to{opacity:.42;transform:translateY(0)scale(.96)}34%{opacity:1;transform:translateY(-.2rem)scale(1)}}@keyframes noticeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
