body[data-service-theme=bubble]{color:#183f40;background:#e6f0e9}.app-wrapper[data-theme=bubble]{--app-accent:#245b52;--app-ink:#183f40;--app-muted:#536e67;--app-paper:#e6f0e9;color:var(--app-ink);background:#e6f0e9}.bubble-game{height:100svh;min-height:320px;padding-inline:clamp(12px,3vw,48px);padding-bottom:max(12px,env(safe-area-inset-bottom));background:radial-gradient(at 50% 35%,#f2f7ef 0%,#e6f0e9 60%,#d7e8e0 100%);flex-direction:column;display:flex;position:relative;overflow:hidden}.bubble-mute{right:max(18px,env(safe-area-inset-right));top:calc(12px + env(safe-area-inset-top));z-index:11;color:#44675e;min-width:88px;min-height:44px;font:600 11px var(--brand-mono);letter-spacing:.03em;background:0 0;border:0;padding:8px;position:absolute}.bubble-play{flex-direction:column;flex:1;gap:18px;min-height:0;display:flex}.bubble-hud{font-family:var(--brand-mono);font-variant-numeric:tabular-nums;justify-content:space-between;align-items:center;gap:20px;padding:0 4px 4px;display:flex}.bubble-hud>div{align-items:baseline;gap:12px;display:flex}.bubble-hud span{letter-spacing:.1em;font-size:11px}.bubble-hud strong{letter-spacing:-.04em;font-size:clamp(25px,3vw,36px);font-weight:800}.bubble-board{grid-template-columns:repeat(var(--columns,5),var(--bubble-size,48px));grid-auto-rows:var(--bubble-size,48px);gap:var(--bubble-gap,8px);touch-action:none;-webkit-user-select:none;user-select:none;overscroll-behavior:contain;flex:1;place-content:center space-evenly;min-height:0;display:grid}.bubble-cell{touch-action:none;-webkit-user-select:none;user-select:none;cursor:crosshair;background:0 0;border:0;border-radius:50%;padding:0;display:block;position:relative}.bubble-skin{pointer-events:none;background:radial-gradient(at 32% 25%,#ffffffed 0%,#ffffffa3 9%,#eefbf64a 25%,#ccdfd933 45%,#aac8bb6b 73%,#759f985c 89%,#f8fffbcc 97%);border:1px solid #8aafa85c;border-radius:50%;position:absolute;inset:0;transform:scale(.98);box-shadow:inset 1px 2px 3px #fff,inset -2px -4px 7px #739e8b4d,0 3px 5px #39635618}.bubble-skin:before{content:"";filter:blur(1px);background:#ffffff9c;border-radius:50%;width:39%;height:20%;position:absolute;top:13%;left:22%;transform:rotate(-35deg)}.bubble-skin:after{content:"";background:#fcfffc80;border-radius:50%;position:absolute;inset:44%;box-shadow:0 0 5px #fff8}.bubble-cell[data-popped] .bubble-skin{background:radial-gradient(#a5bfb724,#dbe8df55 64%,#90afa933 95%);border-color:#9ab9af66;animation:.16s ease-out bubble-pop;transform:scale(.94);box-shadow:inset 1px 2px 3px #668e8229,0 1px #ffffffb3}.bubble-cell[data-popped] .bubble-skin:before{filter:none;background:0 0;border-left:1px solid #76978c38;border-right:1px solid #76978c38;border-radius:20%;width:auto;height:auto;inset:22% 35%;transform:rotate(-24deg)}.bubble-cell[data-popped] .bubble-skin:after{display:none}.bubble-cell:focus-visible{outline-offset:2px;outline:2px solid #245b52}.bubble-hint{color:#526f65;text-align:center;min-height:16px;margin:0;font-size:12px;line-height:1.3}.bubble-game[data-state=running] .bubble-hint{visibility:hidden}.bubble-feedback-layer{pointer-events:none;z-index:12;position:absolute;inset:0;overflow:hidden}.bubble-feedback{text-align:center;color:#247653;font:800 16px var(--brand-mono);white-space:nowrap;text-shadow:0 1px #fff,1px 0 #fff,-1px 0 #fff;line-height:1.25;animation:.55s ease-out both bubble-float;position:absolute}.bubble-feedback b{font-size:.8em;display:block}.bubble-feedback[data-grade=MISS]{color:#827969;font-size:12px}@keyframes bubble-float{0%{opacity:1;transform:translate(-50%,-55%)scale(.92)}20%{transform:translate(-50%,-90%)scale(1)}to{opacity:0;transform:translate(-50%,-170%)}}@keyframes bubble-pop{0%{transform:scale(1.025)}50%{transform:scale(.88)}to{transform:scale(.94)}}.bubble-result{text-align:center;outline:none;width:100%;max-width:420px;margin:auto;padding:16px 14px 28px}.bubble-result h2,.bubble-ranking h3{font:600 13px var(--brand-mono);letter-spacing:.16em;margin:0 0 8px}.bubble-final-score{font:800 clamp(64px,12vw,100px)/1.15 var(--brand-mono);letter-spacing:-.07em;margin-bottom:30px;display:block}.bubble-counts{font:600 14px var(--brand-mono);gap:13px;max-width:300px;margin:0 auto 32px;display:grid}.bubble-counts>div{justify-content:space-between;display:flex}.bubble-counts dd{font-variant-numeric:tabular-nums;margin:0}.bubble-ranking p{color:#5b766a;margin:14px 0;font-size:12px}.bubble-ranking ol{font:14px var(--brand-mono);padding-left:24px}.bubble-ranking li{padding:6px}.bubble-result-actions{gap:12px;display:flex}.bubble-result-actions button{color:#183f40;min-height:54px;font:700 14px var(--brand-mono);background:#d0e1d7;border:0;border-radius:6px;flex:1;justify-content:space-between;align-items:center;padding:12px 18px;display:flex}.bubble-result-actions [data-bubble-share]{color:#fff;background:#245b52}.bubble-result-actions button:active{transform:translateY(2px)}@media (width<=600px){.bubble-play{gap:12px}.bubble-hud>div{gap:8px}.bubble-hud span{font-size:10px}.bubble-result{padding-top:0}.bubble-final-score{margin-bottom:22px}.bubble-counts{margin-bottom:24px}.bubble-feedback[data-grade=PERFECT]{font-size:16px}}@media (prefers-reduced-motion:reduce){.bubble-cell[data-popped] .bubble-skin{animation:none}.bubble-feedback{animation:none;transform:translate(-50%,-100%)}}.app-wrapper[data-theme=bubble]{--brand-mono:"Courier New",monospace}.bubble-final-score{letter-spacing:-.055em;font-family:Pretendard Variable,sans-serif;font-weight:850}@font-face{font-family:"Press Start 2P";src:url(/fonts/PressStart2P-Regular.ttf)format("truetype");font-weight:400;font-style:normal;font-display:swap}.app-wrapper[data-theme=bubble]{--brand-mono:"Press Start 2P",monospace;--pixel-ink:#253247}.bubble-hud>div{gap:12px;display:grid}.bubble-hud>div:last-child{text-align:right}.bubble-hud span{letter-spacing:0;color:#405867;font-size:9px;font-weight:400}.bubble-hud strong{letter-spacing:0;color:#fff6a1;-webkit-text-stroke:3px var(--pixel-ink);paint-order:stroke fill;text-shadow:3px 3px 0 var(--pixel-ink);font-size:clamp(16px,2.2vw,24px);font-weight:400}.bubble-mute{letter-spacing:0;font-size:8px;font-weight:400}.bubble-feedback{font-family:var(--brand-mono);color:#a8f5e1;-webkit-text-stroke:3px #253247;paint-order:stroke fill;text-shadow:3px 3px #253247;font-size:15px;font-weight:400;line-height:1.6;animation:.55s steps(5,end) both bubble-pixel-float}.bubble-feedback b{color:#fff;-webkit-text-stroke:2px #253247;text-shadow:2px 2px #253247;margin-top:3px;font-size:11px;font-weight:400}.bubble-feedback[data-grade=PERFECT]{color:#ffe87c;font-size:19px}.bubble-feedback[data-grade=GOOD]{color:#f5b9f2;font-size:12px}.bubble-feedback[data-grade=MISS]{color:#d7d9df;-webkit-text-stroke:2px #536174;text-shadow:2px 2px #536174;font-size:10px}.bubble-feedback[data-grade=PERFECT]:before,.bubble-feedback[data-grade=PERFECT]:after,.bubble-result h2:before,.bubble-result h2:after{content:"";clip-path:polygon(40% 0,60% 0,60% 30%,70% 30%,70% 40%,100% 40%,100% 60%,70% 60%,70% 70%,60% 70%,60% 100%,40% 100%,40% 70%,30% 70%,30% 60%,0 60%,0 40%,30% 40%,30% 30%,40% 30%);background:#fff2a0;width:20px;height:20px;position:absolute}.bubble-feedback[data-grade=PERFECT]:before{top:-8px;left:-26px}.bubble-feedback[data-grade=PERFECT]:after{background:#fff;width:14px;height:14px;top:17px;right:-24px}@keyframes bubble-pixel-float{0%{opacity:1;transform:translate(-50%,-60%)}65%{opacity:1}to{opacity:0;transform:translate(-50%,-125%)}}.bubble-result h2{letter-spacing:0;color:#bdf4ed;-webkit-text-stroke:4px #253247;paint-order:stroke fill;text-shadow:4px 4px #253247;margin-bottom:22px;font-size:24px;font-weight:400;line-height:1.6;display:inline-block;position:relative}.bubble-result h2:before{background:#ffcb54;top:4px;left:-34px}.bubble-result h2:after{background:#44b6a4;width:14px;height:14px;top:20px;right:-30px}.bubble-final-score{font-family:var(--brand-mono);letter-spacing:-.04em;color:#ffe87c;-webkit-text-stroke:5px #253247;paint-order:stroke fill;text-shadow:5px 5px #253247;overflow-wrap:anywhere;margin-bottom:36px;font-size:clamp(30px,8vw,48px);font-weight:400;line-height:1.5}.bubble-counts{color:#34475a;gap:20px;max-width:320px;font-size:11px;font-weight:400;line-height:1.4}.bubble-counts>div:first-child dt{color:#725000}.bubble-counts>div:nth-child(2) dt{color:#137060}.bubble-counts>div:nth-child(3) dt{color:#8c4983}.bubble-ranking h3{letter-spacing:0;margin-top:8px;font-size:11px;font-weight:400}.bubble-ranking li{font-size:10px;line-height:1.8}.bubble-result-actions button{color:#253247;background:#e7f5ef;border:3px solid #253247;border-radius:0;justify-content:center;gap:10px;padding:14px 8px;font-size:12px;font-weight:400;line-height:1.6;box-shadow:4px 0 #253247,0 4px #253247,4px 4px #253247,inset 3px 3px #fff9}.bubble-result-actions button span{display:none}.bubble-result-actions [data-bubble-share]{color:#fff;text-shadow:2px 2px #433363;background:#8465e8}.bubble-result-actions button:active{transform:translate(3px,3px);box-shadow:1px 0 #253247,0 1px #253247,1px 1px #253247}@media (width<=600px){.bubble-hud>div{gap:10px}.bubble-hud span{font-size:8px}.bubble-hud strong{-webkit-text-stroke:2px #253247;text-shadow:2px 2px #253247;font-size:17px}.bubble-feedback{font-size:11px}.bubble-feedback[data-grade=PERFECT]{font-size:13px}.bubble-feedback[data-grade=GOOD]{font-size:10px}.bubble-feedback[data-grade=MISS],.bubble-feedback b{font-size:9px}.bubble-feedback[data-grade=PERFECT]:before{width:12px;height:12px;left:-19px}.bubble-feedback[data-grade=PERFECT]:after{width:10px;height:10px;right:-17px}.bubble-result-actions button,.bubble-counts{font-size:10px}}@media (prefers-reduced-motion:reduce){.bubble-feedback{animation:none;transform:translate(-50%,-100%)}}.bubble-intro{z-index:15;pointer-events:none;background:#e6f0e926;place-items:center;display:grid;position:absolute;inset:0}.bubble-intro strong{font:400 clamp(34px,8vw,80px)/1.4 var(--brand-mono);color:#fff09a;-webkit-text-stroke:6px #253247;paint-order:stroke fill;text-shadow:6px 6px #253247}.bubble-game[data-state=go] .bubble-intro strong{color:#bdf4ed}.bubble-result-overlay{width:100%;max-width:none;height:100dvh;max-height:none;padding:max(20px,env(safe-area-inset-top)) 20px max(20px,env(safe-area-inset-bottom));color:#183f40;background:#0009;border:0;margin:0;position:fixed;inset:0;overflow:auto}.bubble-result-overlay::backdrop{background:0 0}.bubble-result-overlay[open]{justify-content:center;align-items:center;display:flex}.bubble-result{background:#e6f0e9;border:4px solid #253247;border-radius:0;flex-shrink:0;max-width:500px;max-height:calc(100dvh - 64px);margin:auto;padding:34px 28px 30px;position:relative;overflow:auto;box-shadow:0 -6px 0 -2px #fff,0 6px 0 -2px #fff,-6px 0 0 -2px #fff,6px 0 0 -2px #fff,8px 8px #253247}.bubble-result h2{margin-bottom:26px;font-size:32px}.bubble-final-score{font-size:clamp(36px,9vw,56px)}.bubble-hud span{font-size:12px}.bubble-hud strong{font-size:clamp(20px,2.6vw,30px)}.bubble-counts{gap:20px;font-size:13px}.bubble-ranking h3{font-size:15px}.bubble-result-actions button{font-size:14px}@media (width<=600px){.bubble-hud span{font-size:10px}.bubble-hud strong{font-size:20px}.bubble-result-overlay{padding:18px}.bubble-result{max-height:calc(100dvh - 48px);padding:28px 16px 24px}.bubble-result h2{font-size:26px}.bubble-counts{font-size:11px}.bubble-ranking h3{font-size:12px}.bubble-result-actions button{font-size:11px}.bubble-final-score{font-size:clamp(30px,9vw,44px)}}.bubble-result{color:#253247;box-shadow:none;clip-path:polygon(12px 0,calc(100% - 12px) 0,calc(100% - 12px) 6px,100% 6px,100% calc(100% - 6px),calc(100% - 12px) calc(100% - 6px),calc(100% - 12px) 100%,12px 100%,12px calc(100% - 6px),0 calc(100% - 6px),0 6px,12px 6px);background:#fffdf3;border:0;max-width:460px;padding:30px 26px 24px}.bubble-result h2{color:#b5e6db;margin-bottom:8px;font-size:26px}.bubble-final-score{color:#ffdb64;margin:0 0 24px;font-size:clamp(32px,9vw,52px)}.bubble-counts{grid-template-columns:1fr 1fr;gap:18px 24px;max-width:none;margin-bottom:26px;font-size:10px;display:grid}.bubble-counts>div{text-align:center;gap:8px;display:grid}.bubble-register{text-align:left;margin:0 0 20px;font-family:Pretendard Variable,sans-serif}.bubble-register label{margin-bottom:8px;font-size:16px;font-weight:750;display:block}.bubble-register>div{gap:8px;display:flex}.bubble-register input{color:#253247;background:#eef2eb;border:0;border-bottom:2px solid #b9c4bf;border-radius:0;width:100%;min-width:0;height:46px;padding:0 12px;font:16px Pretendard Variable,sans-serif}.bubble-register button{color:#fff;cursor:pointer;background:#253247;border:0;flex-shrink:0;padding:0 18px;font:700 15px Pretendard Variable,sans-serif}.bubble-register button:disabled{opacity:.55;cursor:default}.bubble-register p{color:#626963;margin:8px 0 0;font-size:11px;line-height:1.6}.bubble-register [data-submit-status]{color:#245b52;font-size:13px}.bubble-register a{text-decoration:underline}.bubble-ranking{text-align:left;margin:0 0 22px}.bubble-ranking summary{cursor:pointer;font:12px/1.5 var(--brand-mono);justify-content:space-between;align-items:center;padding:10px 0;list-style:none;display:flex}.bubble-ranking summary span{font:13px Pretendard Variable,sans-serif}.bubble-ranking summary span:after{content:" +"}.bubble-ranking[open] summary span:after{content:" −"}.bubble-ranking ol{max-height:210px;margin:8px 0;padding:0;list-style:none;overflow:auto}.bubble-ranking li{justify-content:space-between;gap:12px;padding:7px 0;font:14px/1.5 Pretendard Variable,sans-serif;display:flex}.bubble-ranking li span{overflow-wrap:anywhere}.bubble-ranking li[data-you]{color:#376d59;font-weight:800}.bubble-ranking li strong{font-variant-numeric:tabular-nums;white-space:nowrap}.bubble-result-actions{gap:12px;padding:0 4px 4px}.bubble-result-actions button{background:#bfe5d5;border:0;min-height:50px;font-size:12px;box-shadow:3px 3px #253247}.bubble-result-actions [data-bubble-share]{background:#8670d0}.bubble-result :focus-visible:not(input):not(textarea){outline-offset:3px;outline:3px solid #8465e8}@media (width<=600px){.bubble-result{padding:26px 20px 22px}.bubble-result h2{font-size:23px}.bubble-counts{gap:18px 12px;font-size:9px}.bubble-result-actions button{font-size:11px}}.bubble-result{clip-path:none;background-clip:padding-box;border:12px solid #0000;border-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='%23171717' d='M8 0h8v4h4v4h4v8h-4v4h-4v4H8v-4H4v-4H0V8h4V4h4z'/%3E%3C/svg%3E") 8;padding:22px 18px 20px}.bubble-counts{gap:8px;margin-bottom:22px}.bubble-counts>div{background:#e6f1e9;border:2px solid #253247;gap:10px;padding:13px 6px 12px}.bubble-counts dd{font-size:20px}.bubble-ranking{margin-bottom:18px}.bubble-ranking h3{margin:0 0 10px;font-size:13px}.bubble-ranking p{margin:4px 0 10px;font:12px Pretendard Variable,sans-serif}.bubble-ranking ol{grid-template-rows:repeat(2,auto);grid-template-columns:repeat(5,minmax(0,1fr));gap:12px 6px;max-height:none;margin:0;display:grid;overflow:visible}.bubble-ranking li{flex-direction:column;align-items:center;gap:4px;min-width:0;padding:4px 0;font-size:12px;line-height:1.35;display:flex}.bubble-ranking li small{font:9px var(--brand-mono);color:#6b756c}.bubble-ranking li span{white-space:nowrap;text-overflow:ellipsis;text-align:center;width:100%;display:block;overflow:hidden}.bubble-ranking li[data-you]{background:#e0eedf}.bubble-name-toggle{color:#253247;cursor:pointer;text-underline-offset:4px;background:0 0;border:0;width:100%;min-height:42px;margin:0 0 10px;font:750 16px Pretendard Variable,sans-serif;text-decoration:underline;display:block}.bubble-register{margin:0 0 18px}.bubble-register label.sr-only{margin:0}.bubble-register[hidden]{display:none}@media (width<=600px){.bubble-result{padding:20px 12px 18px}.bubble-counts{gap:8px;font-size:9px}.bubble-ranking li{font-size:11px}.bubble-ranking li strong{font-size:12px}.bubble-ranking ol{column-gap:4px}}.bubble-hud{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);justify-content:center;gap:20px;width:min(100%,420px);margin-inline:auto;display:grid}.bubble-hud>div,.bubble-hud>div:last-child{text-align:center;justify-items:center;min-width:0}.bubble-hud .bubble-hud-divider{color:#7f9c91;font:300 36px/1 Pretendard Variable,sans-serif}.bubble-hud [data-time]{color:#ff8585}.bubble-hud [data-score]{color:#ffe788}@media (width<=600px){.bubble-hud{gap:12px;width:min(100%,330px)}.bubble-hud .bubble-hud-divider{font-size:30px}}.bubble-hud{grid-template-rows:auto auto;gap:10px 20px}.bubble-hud>div{display:contents}.bubble-hud>div:first-child span{grid-area:1/1}.bubble-hud>div:last-child span{grid-area:1/3}.bubble-hud strong{grid-row:2;justify-self:center;line-height:1.2}.bubble-hud [data-time]{grid-column:1}.bubble-hud [data-score]{grid-column:3}.bubble-hud>div>span{text-align:center}.bubble-hud .bubble-hud-divider{background:#8da89c;grid-area:2/2;place-self:center;width:2px;height:26px;font-size:0;line-height:0}.bubble-result{filter:drop-shadow(8px 8px #171717);border-width:12px;border-image-source:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath fill='%23171717' d='M12 0h8v4h4v4h4v4h4v8h-4v4h-4v4h-4v4h-8v-4H8v-4H4v-4H0V12h4V8h4V4h4z'/%3E%3C/svg%3E");border-image-slice:12;padding:22px 20px 20px;box-shadow:inset 0 0 0 3px #b7c8b8}.bubble-final-score{margin-bottom:20px}.bubble-ranking h3{text-align:center;margin-bottom:12px;font-size:17px;line-height:1.5}.bubble-ranking ol{flex-direction:column;gap:0;display:flex}.bubble-ranking li{grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:12px;min-height:33px;padding:3px 9px;font-size:15px;display:grid}.bubble-ranking li small{color:#637166;place-items:center;min-width:28px;font-size:11px;display:grid}.bubble-ranking li small img{width:28px;height:32px;image-rendering:pixelated;display:block}.bubble-ranking li span{text-align:left;font-size:15px}.bubble-ranking li strong{font-size:16px}.bubble-ranking li:nth-child(-n+3){min-height:42px;font-weight:750}.bubble-ranking li:first-child{background:#f6edc8}.bubble-ranking li:nth-child(2){background:#eaf0f2}.bubble-ranking li:nth-child(3){background:#f2e5d9}.bubble-ranking li[data-you] span{text-underline-offset:3px;text-decoration:underline}@media (width<=600px){.bubble-hud .bubble-hud-divider{height:22px;font-size:0}.bubble-result{padding:18px 12px 16px}.bubble-ranking h3{font-size:15px}.bubble-ranking li{gap:8px;min-height:31px}.bubble-ranking li span{font-size:14px}.bubble-ranking li strong{font-size:15px}}.bubble-mute{cursor:pointer;width:44px;min-width:44px;height:44px;padding:10px}.bubble-mute svg{width:24px;height:24px;display:block}.bubble-mute .sound-slash,.bubble-mute[aria-pressed=true] .sound-waves{display:none}.bubble-mute[aria-pressed=true] .sound-slash{display:block}.bubble-ranking li[data-you]{animation:1.8s ease-in-out infinite bubble-own-record}@keyframes bubble-own-record{0%,to{box-shadow:inset 0 0 0 100px #9fcaa900}50%{box-shadow:inset 0 0 0 100px #9fcaa97a}}@media (prefers-reduced-motion:reduce){.bubble-ranking li[data-you]{animation:none;box-shadow:inset 0 0 0 100px #9fcaa945}}