@keyframes astroFadeInOut{0%{opacity:1}to{opacity:0}}@keyframes astroFadeIn{0%{opacity:0;mix-blend-mode:plus-lighter}to{opacity:1;mix-blend-mode:plus-lighter}}@keyframes astroFadeOut{0%{opacity:1;mix-blend-mode:plus-lighter}to{opacity:0;mix-blend-mode:plus-lighter}}@keyframes astroSlideFromRight{0%{transform:translate(100%)}}@keyframes astroSlideFromLeft{0%{transform:translate(-100%)}}@keyframes astroSlideToRight{to{transform:translate(100%)}}@keyframes astroSlideToLeft{to{transform:translate(-100%)}}@media (prefers-reduced-motion){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*),[data-astro-transition-scope]{animation:none!important}}.gento-stage{z-index:0;position:fixed;inset:0}.gento-canvas{width:100%;height:100%;display:block}:root{--bg:#fff;--ink:#000;--muted:#0000008c;--line:#0000001f;--gutter:20px;--chrome-bottom:0px;color-scheme:light}:root.in-x-app{--chrome-bottom:60px}*{box-sizing:border-box}html{background:var(--bg);height:100%;overflow:hidden}body{overscroll-behavior:none;background:var(--bg);height:100%;color:var(--ink);-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;margin:0;font-family:-apple-system,BlinkMacSystemFont,Hiragino Sans,Hiragino Kaku Gothic ProN,Noto Sans JP,Yu Gothic,sans-serif;font-size:16px;line-height:1.7;overflow:hidden}a{color:inherit}:focus-visible{outline:2px solid var(--ink);outline-offset:3px}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.site-header{z-index:2;padding:calc(14px + env(safe-area-inset-top)) var(--gutter) 14px;justify-content:space-between;align-items:center;gap:16px;display:flex;position:absolute;inset:0 0 auto}.wordmark{letter-spacing:.12em;font-weight:700;text-decoration:none}.header-tools{align-items:center;gap:8px;display:flex}.sound-toggle{border:1.5px solid var(--ink);width:37px;height:37px;color:var(--ink);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border-radius:999px;place-items:center;padding:0;transition:background-color .2s;display:grid}.sound-toggle:hover{background:#f0f0f0}.sound-toggle svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:18px;height:18px}.sound-toggle[aria-pressed=true] .sound-off,.sound-toggle[aria-pressed=false] .sound-on{display:none}.lang-switch{border:1.5px solid var(--ink);border-radius:999px;gap:2px;padding:2px;display:flex}.lang-switch button{min-width:40px;min-height:30px;color:var(--ink);font:inherit;letter-spacing:.06em;cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;border-radius:999px;padding:4px 10px;font-size:12px;font-weight:700;transition:background-color .2s,color .2s}.lang-switch button:hover{background:#f0f0f0}.lang-switch button[aria-pressed=true]{background:var(--ink);color:var(--bg)}.utsubot{height:100svh;padding-top:calc(56px + env(safe-area-inset-top));flex-direction:column;display:flex;position:relative}.stage{z-index:1;--mark-r:min(36cqmin, 240px);flex:auto;min-height:0;position:relative;container-type:size}@media (width<=600px){.stage{margin-bottom:clamp(-64px, (100svh - var(--chrome-bottom) - 800px) * .5, 0px)}}.mark{z-index:0;width:100%;height:100%;transition:opacity .3s;display:block;position:absolute;inset:0}:root.is-loading .mark{opacity:0}.loader{height:calc(var(--mark-r) * 1.533);aspect-ratio:673/822;transform:translate(-50%, calc(-50% - var(--mark-r) * .04));opacity:0;visibility:hidden;pointer-events:none;transition:opacity .15s .3s,visibility 0s linear .45s;position:absolute;top:50%;left:50%}:root.is-loading .loader{opacity:1;visibility:visible;transition:none}.loader-mark{width:100%;height:100%;fill:var(--ink);animation:.4s .2s both loader-in;display:block;overflow:visible}.loader-piece{transform-box:fill-box;animation:.45s ease-in-out .6s 22 alternate both loader-bob}.loader-piece.is-right{animation-delay:.75s}@keyframes loader-in{0%{opacity:0}to{opacity:1}}@keyframes loader-bob{0%{transform:translateY(0)}to{transform:translateY(-6%)}}.readout,.actions{z-index:1;position:relative}.mark-fallback{height:calc(var(--mark-r) * 1.533);transform:translate(-50%, calc(-50% - var(--mark-r) * .04));fill:var(--ink);display:none;position:absolute;top:50%;left:50%}.no-js .mark,.no-webgl .mark{display:none}.no-js:not(.is-loading) .mark-fallback,.no-webgl .mark-fallback{display:block}.north{opacity:0;width:0;height:0;transform:rotate(var(--north-angle,0deg));pointer-events:none;transition:opacity .6s;position:absolute;top:50%;left:50%}.north span{top:calc(-1 * var(--mark-radius,120px) - 30px);text-align:center;width:1em;font-size:12px;font-weight:700;line-height:1;position:absolute;left:-.5em}.is-compass .north{opacity:1}.grab{z-index:1;touch-action:none;cursor:pointer;-webkit-tap-highlight-color:transparent;position:absolute}:root.is-dragging .grab{cursor:grabbing}:root.is-pong .grab,:root.is-compass .grab{pointer-events:none}.pong-hud{z-index:0;opacity:0;pointer-events:none;transition:opacity .3s;position:absolute;inset:0}:root.is-pong .pong-hud{opacity:1;transition-delay:.3s}.pong-side{left:var(--x);top:var(--y);margin:0;line-height:1;transition:transform .6s cubic-bezier(.34,1.56,.64,1);position:absolute;transform:translate(-50%,-50%)scale(.85)}.pong-side.is-you{--x:var(--you-x,25%);--y:var(--you-y,50%)}.pong-side.is-logo{--x:var(--logo-x,75%);--y:var(--logo-y,50%)}:root.is-pong .pong-side{transition-delay:.3s;transform:translate(-50%,-50%)}.pong-name{margin-bottom:max(12px, calc(var(--score-size,120px) * .13));white-space:nowrap;font-size:clamp(11px, calc(var(--score-size,120px) * .09), 15px);letter-spacing:.1em;text-transform:uppercase;color:#00000065;padding-left:.1em;font-weight:700;position:absolute;bottom:100%;left:50%;transform:translate(-50%)}.pong-points{font-size:var(--score-size,120px);color:#0000001b;transform-origin:50%;translate:var(--ink-shift,0) 0;font-weight:700;line-height:.8;display:block}.pong-side.is-pop .pong-points{animation:.7s cubic-bezier(.34,1.56,.64,1) pong-pop}@keyframes pong-pop{0%{color:#0000001b;transform:scale(1)}25%{color:#0000003d;transform:scale(1.22)}to{color:#0000001b;transform:scale(1)}}.pong-net{top:var(--court-top,86px);bottom:var(--court-bottom,14px);background:repeating-linear-gradient(to bottom, var(--ink) 0 8px, transparent 8px 18px);opacity:0;pointer-events:none;width:2px;margin-left:-1px;transition:opacity .3s,transform .6s cubic-bezier(.22,1,.36,1);position:absolute;left:50%;transform:scaleY(0)}:root.is-pong .pong-net{opacity:.16;transition-delay:.5s;transform:none}:root.is-pong-tall .pong-net{top:var(--court-mid-y);bottom:auto;left:var(--court-left);right:var(--court-right);background:repeating-linear-gradient(to right, var(--ink) 0 8px, transparent 8px 18px);width:auto;height:2px;margin:-1px 0 0;transform:scaleX(0)}:root.is-pong.is-pong-tall .pong-net{transform:none}.sea-bubbles{z-index:0;mix-blend-mode:multiply;pointer-events:none;position:absolute;inset:0}.sea-bubble{width:var(--size);height:var(--size);margin:calc(var(--size) / -2) 0 0 calc(var(--size) / -2);pointer-events:none;animation:sea-rise var(--seconds) cubic-bezier(.3, .1, .6, 1) forwards;position:absolute}.sea-bubble:before{content:"";border:1.5px solid var(--ink);background:var(--bg);animation:sea-sway calc(var(--seconds) / 3) ease-in-out infinite alternate;border-radius:50%;position:absolute;inset:0}@keyframes sea-rise{0%{opacity:0;transform:translateY(0)scale(.3)}12%{opacity:1;transform:translateY(calc(var(--rise) * -.08)) scale(1)}75%{opacity:1}to{opacity:0;transform:translateY(calc(var(--rise) * -1)) scale(1.08)}}@keyframes sea-sway{0%{transform:translateX(calc(var(--sway) * -1))}to{transform:translateX(var(--sway))}}.dust{z-index:0;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.pong-ring{z-index:1;width:var(--size);height:var(--size);margin:calc(var(--size) / -2) 0 0 calc(var(--size) / -2);border:1.5px solid var(--ink);pointer-events:none;border-radius:50%;animation:.42s cubic-bezier(.22,1,.36,1) forwards pong-ring;position:absolute}.pong-ring.is-point{border-width:2px;animation-duration:.6s}@keyframes pong-ring{0%{opacity:.8;transform:scale(.2)}to{opacity:0;transform:scale(1)}}.utsubot.is-shaking{animation:.32s linear pong-shake}@keyframes pong-shake{0%{transform:translate(0)}15%{transform:translate(calc(var(--shake,6px) * -1), calc(var(--shake,6px) * .5))}35%{transform:translate(calc(var(--shake,6px) * .8), calc(var(--shake,6px) * -.5))}55%{transform:translate(calc(var(--shake,6px) * -.5), calc(var(--shake,6px) * .3))}75%{transform:translate(calc(var(--shake,6px) * .3), calc(var(--shake,6px) * -.15))}to{transform:translate(0)}}:root.is-pong,:root.is-pong body{overscroll-behavior:none}:root.is-pong .utsubot{touch-action:none}.hint-bubble{--bubble-bg:var(--bg);--bubble-line:1.5px;z-index:1;color:var(--ink);font:inherit;pointer-events:none;visibility:hidden;transform:translate(var(--bubble-x,0px), var(--bubble-y,0px));background:0 0;border:0;padding:0;transition:visibility 0s linear .16s;position:absolute;top:0;left:0}.hint-bubble-body{max-width:var(--bubble-max,300px);border:var(--bubble-line) solid transparent;border-radius:var(--bubble-corner,20px);isolation:isolate;letter-spacing:.02em;text-align:left;word-break:auto-phrase;text-wrap:balance;opacity:0;transform-origin:var(--bubble-origin,50% 100%);padding:11px 18px 12px;font-size:15px;font-weight:600;line-height:1.55;transition:opacity .14s ease-in,transform .14s ease-in;display:block;position:relative;transform:scale(.9)}.hint-bubble-shape{top:calc(-1 * var(--bubble-line));left:calc(-1 * var(--bubble-line));z-index:-1;pointer-events:none;width:1px;height:1px;position:absolute;overflow:visible}.hint-bubble-shape path{fill:var(--bubble-bg);stroke:var(--ink);stroke-width:var(--bubble-line);stroke-linejoin:round;stroke-linecap:round}.hint-bubble.is-visible{visibility:visible;transition-delay:0s}.hint-bubble.is-visible.is-replaced .hint-bubble-body{opacity:0;transform:scale(.96)}.hint-bubble.is-visible .hint-bubble-body{opacity:1;transition:opacity .16s ease-out,transform .26s cubic-bezier(.34,1.56,.64,1);transform:scale(1)}.hint-bubble[data-place=pile] .hint-bubble-body{padding:8px 13px 9px;font-size:13px;line-height:1.45}@media (width<=400px){.hint-bubble[data-place=pile] .hint-bubble-body{padding:6px 11px 7px;font-size:11.5px}}.hint-bubble-text{white-space:pre-line}.hint-bubble-rest{color:#0000}.readout{min-height:5em;padding:0 var(--gutter) 10px;text-align:center}.readout p{margin:0}.distance{flex-direction:column;align-items:center;line-height:1.2;display:flex}.distance .label{color:var(--muted);font-size:13px}.distance strong{font-variant-numeric:tabular-nums;letter-spacing:-.01em;font-size:clamp(34px,10vw,56px);font-weight:700}:root:not(.is-compass) .distance{visibility:hidden}.status{max-width:28em;min-height:1.7em;word-break:auto-phrase;text-wrap:balance;color:var(--muted);font-size:13px;margin:4px auto 0!important}.privacy{max-width:28em;word-break:auto-phrase;text-wrap:balance;color:var(--muted);font-size:11px;line-height:1.5;margin:0 auto!important}:root:not(.is-compass) .privacy{visibility:hidden}.dock{--dock-pad:var(--gutter);z-index:1;padding:4px var(--dock-pad) calc(16px + max(env(safe-area-inset-bottom,0px), var(--chrome-bottom)));position:relative}@media (width<=400px){.dock{--dock-pad:14px}}.replies{grid-template-columns:repeat(2,minmax(0,1fr));align-content:end;gap:8px;max-width:420px;min-height:96px;margin:0 auto;display:grid}.reply:first-child:nth-last-child(odd){grid-column:1/-1}.reply{border:1.5px solid var(--ink);background:var(--bg);min-width:0;min-height:44px;color:var(--ink);font:inherit;letter-spacing:.01em;white-space:nowrap;text-overflow:ellipsis;cursor:pointer;animation:.32s cubic-bezier(.34,1.56,.64,1) both reply-in;animation-delay:calc(var(--i,0) * 60ms);-webkit-tap-highlight-color:transparent;border-radius:999px;justify-content:center;align-items:center;gap:5px;padding:10px 12px 10px 10px;font-size:clamp(13px,3.5vw,14px);font-weight:600;line-height:1.2;text-decoration:none;transition:background-color .25s,color .25s,transform .22s cubic-bezier(.34,1.56,.64,1);display:inline-flex;overflow:hidden}.reply-icon{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;flex:none;width:16px;height:16px}.reply:hover{background:#f3f3f3}.reply:active{transform:scale(.95)}@media (width<=380px){.reply{gap:4px;padding-inline:8px 9px}}@media (width<=400px){.reply{white-space:normal;text-overflow:clip;text-align:center;word-break:auto-phrase;text-wrap:balance;line-height:1.15}}.reply.is-recommended{background:var(--ink);color:var(--bg);animation:.32s cubic-bezier(.34,1.56,.64,1) both reply-in,.55s cubic-bezier(.34,1.56,.64,1) both reply-announce;animation-delay:calc(var(--i,0) * 60ms), 0s}.reply.is-recommended:hover{background:#2a2a2a}.reply[data-reply=play].is-recommended .reply-icon,.reply[data-reply=play]:hover .reply-icon{animation:.7s cubic-bezier(.34,1.56,.64,1) .15s icon-wiggle}@keyframes icon-wiggle{0%,to{transform:none}20%{transform:rotate(-14deg)scale(1.12)}45%{transform:rotate(10deg)scale(1.12)}70%{transform:rotate(-5deg)}}@keyframes reply-announce{0%{transform:none}40%{transform:scale(1.08)}to{transform:none}}.reply:disabled{cursor:default;opacity:.35;transform:none}@keyframes reply-in{0%{opacity:0;transform:translateY(8px)scale(.96)}}.replies.is-hinted .reply{animation:.32s cubic-bezier(.34,1.56,.64,1) both reply-in,.5s cubic-bezier(.34,1.56,.64,1) both reply-nudge;animation-delay:calc(var(--i,0) * 60ms), calc(var(--i,0) * 70ms)}@keyframes reply-nudge{0%{transform:none}35%{transform:translateY(-6px)}70%{transform:translateY(1px)}to{transform:none}}.you-said{right:calc(var(--dock-pad) + max(0px, (100% - 2 * var(--dock-pad) - 420px) / 2));opacity:0;transform-origin:100% 100%;pointer-events:none;background:#f0f0f0;border-radius:18px 18px 4px;max-width:70%;margin:0;padding:8px 14px;font-size:14px;font-weight:600;line-height:1.4;transition:opacity .18s,transform .26s cubic-bezier(.34,1.56,.64,1);position:absolute;bottom:calc(100% + 10px);transform:translateY(6px)scale(.96)}.you-said.is-visible{opacity:1;transform:none}@media (prefers-reduced-motion:reduce){.dust{display:none}.loader-piece,.reply,.replies.is-hinted .reply,.reply .reply-icon,.pong-side.is-pop .pong-points,.utsubot.is-shaking{animation:none}.you-said,.north,.reply,.hint-bubble,.hint-bubble-body,.hint-bubble.is-visible .hint-bubble-body{transition:none}}.gento-stage{background:var(--bg);transition:opacity .3s}:root.is-loading .gento-stage{opacity:0}.mark{display:none}:root.uses-2d .mark{display:block}:root.uses-2d .gento-stage,:root.no-webgl .mark{display:none}.gento-stage.is-shaking{animation:.32s linear pong-shake}@media (prefers-reduced-motion:reduce){.gento-stage.is-shaking{animation:none}}