@font-face{font-family:Nunito;font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/nunito-latin-700.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Nunito;font-style:normal;font-weight:800;font-display:swap;src:url(/fonts/nunito-latin-800.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Silkscreen;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/silkscreen-latin-400.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Silkscreen;font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/silkscreen-latin-700.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--font-display: "Nunito", ui-rounded, "SF Pro Rounded", -apple-system, "Segoe UI", sans-serif;--font-pix: "Silkscreen", "Nunito", ui-rounded, "SF Pro Rounded", -apple-system, "Segoe UI", sans-serif}*{box-sizing:border-box}html,body{overflow-x:hidden;overflow-y:auto}.back-link svg{width:13px;height:13px}a,button,summary,[role=switch]{touch-action:manipulation;-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.skip{position:absolute;left:-9999px;top:0;z-index:99;display:inline-flex;align-items:center;min-height:44px;padding:10px 16px;border-radius:0 0 10px;background:var(--card, var(--paper, #fff));color:inherit;font-weight:800;text-decoration:none}.skip:focus{left:0}.topbar{display:flex;align-items:flex-start;justify-content:space-between;flex-shrink:0}.brand{display:flex;flex-direction:column;align-items:flex-start}.top-actions{display:flex;gap:2vw}.back-link{display:flex;align-items:center;gap:4px;margin-bottom:.8svh;color:var(--ink-soft);font-size:clamp(10px,1.4svh,12px);font-weight:600;letter-spacing:.08em;text-decoration:none}.subtitle{margin:.4em 0 0;font-size:clamp(10px,1.4svh,12px);letter-spacing:.3em;color:var(--ink-soft)}.seo-info{flex-shrink:0;align-self:center;max-width:90vw;margin-top:.6svh;font-size:11px;color:var(--ink-soft);text-align:center}.icon-btn svg{width:20px;height:20px}.icon-btn{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--line);background:transparent;color:var(--ink);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s ease,transform .1s ease}:focus-visible{outline:2px solid var(--accent-dark, currentColor);outline-offset:2px}@media(forced-colors:active){:focus-visible{outline-color:Highlight}}@media(max-height:480px){.subtitle,.seo-info{display:none}.back-link{margin-bottom:.4svh}.howto-link{padding-top:.4svh}}.icon-btn .ico-sound-off,.icon-btn.is-off .ico-sound-on{display:none}.icon-btn.is-off .ico-sound-off{display:block}.icon-btn.is-off{color:var(--ink-soft)}.icon-btn [data-theme-icon=light]{display:none}.icon-btn [data-theme-icon=dark]{display:block}:root[data-theme=dark] .icon-btn [data-theme-icon=light]{display:block}:root[data-theme=dark] .icon-btn [data-theme-icon=dark]{display:none}@media(max-width:400px){.top-actions{gap:6px}}.back-link,.howto-link{position:relative}.back-link:after,.howto-link:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:max(100%,44px);height:44px}.pill-btn,.again-btn,.share-btn{min-height:44px}.seo-info summary{position:relative;min-height:44px;display:flex;align-items:center;justify-content:center;font-size:11px;cursor:pointer;letter-spacing:.06em;font-weight:600;list-style:none}.seo-info summary::-webkit-details-marker{display:none}.seo-info summary:after{content:" ▾"}.seo-info[open] summary:after{content:" ▴"}.seo-info p{margin:4px 0 0;line-height:1.5;text-align:left}.share-note{margin:0;font-size:clamp(11px,1.5svh,13px);color:var(--ink-soft);letter-spacing:.06em;opacity:0;transition:opacity .25s ease}.share-note.show{opacity:1}@media(hover:hover)and (pointer:fine){.back-link:hover{color:var(--ink)}}.howto-link{align-self:center;flex-shrink:0;border:none;background:none;color:var(--accent-dark);font-weight:600;font-size:clamp(12px,1.8svh,14px);letter-spacing:.02em;text-decoration:underline;text-underline-offset:3px;cursor:pointer;padding:1svh 4px 0}.howto-backdrop{position:fixed;inset:0;background:var(--scrim, rgba(30, 24, 16, .35));opacity:0;pointer-events:none;transition:opacity .3s ease;z-index:10}.howto-backdrop.show{opacity:1;pointer-events:auto}.howto-sheet{position:fixed;left:0;right:0;bottom:0;background:var(--bg);border-radius:20px 20px 0 0;box-shadow:0 -1svh 3svh #00000040;padding:1.6svh 6vw calc(4svh + env(safe-area-inset-bottom,0px));transform:translateY(100%);transition:transform .35s cubic-bezier(.4,0,.2,1);z-index:11}.howto-sheet.show{transform:translateY(0)}.howto-handle{width:36px;height:4px;border-radius:2px;background:var(--ink-soft);opacity:.4;margin:0 auto 2svh}.howto-title{margin:0 0 1.6svh;font-size:clamp(14px,2svh,16px);font-weight:600;letter-spacing:.1em;color:var(--ink)}.howto-list{margin:0;padding:0 0 0 1.1em;display:flex;flex-direction:column;gap:1.2svh;font-size:clamp(13px,1.9svh,15px);color:var(--ink);line-height:1.4}.howto-list li::marker{color:var(--accent);font-weight:700}.howto-list strong{color:var(--ink);font-weight:700}@media(prefers-reduced-motion:reduce){.howto-sheet{transition:opacity .12s linear;transform:none;opacity:0;pointer-events:none}.howto-sheet.show{transform:none;opacity:1;pointer-events:auto}.howto-backdrop{transition:opacity .12s linear}}.overlay-exit{position:absolute;top:max(2.4svh,env(safe-area-inset-top,0px));right:max(4vw,env(safe-area-inset-right,0px));width:44px;height:44px;display:flex;align-items:center;justify-content:center;border:1.5px solid var(--line);border-radius:50%;background:transparent;color:var(--ink);transition:transform .1s ease}.overlay-exit svg{width:20px;height:20px}.overlay-exit:active{transform:scale(.94)}.overlay-exit{pointer-events:none}.overlay.show .overlay-exit{pointer-events:auto}.overlay-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(10px,3vw,16px);row-gap:clamp(8px,1.2svh,12px);width:min(80vw,320px)}.overlay-actions>*{justify-content:center;text-align:center}.overlay-actions>:is(button,a){padding-inline:clamp(8px,2vw,16px)}.wall-btn{grid-column:1 / -1;display:flex;align-items:center;justify-content:center;gap:.5em;min-height:44px;padding:1.2svh 4vw;border:1.5px solid var(--accent);border-radius:999px;background:transparent;color:var(--accent-dark);font-family:var(--font-display, inherit);font-size:clamp(12px,1.8svh,14px);font-weight:600;letter-spacing:.06em;text-decoration:none;cursor:pointer;transition:transform .1s ease}.wall-btn svg{width:16px;height:16px;flex-shrink:0}.wall-btn:active{transform:scale(.96)}html:has(.overlay.show) .top-actions{visibility:hidden}.overlay-global{margin:0;min-height:1.35em;font-size:clamp(11px,1.6svh,13px);color:var(--accent-dark);font-weight:600;letter-spacing:.06em}.overlay-global.new-global{color:var(--record, var(--accent-dark));font-weight:800}:root{--bg: #eef3ec;--ink: #262b3d;--ink-soft: #767b8c;--line: #d7e6da;--accent: #2e93bd;--accent-dark: #14588f;--wood-hi: #f5e0ac;--wood-mid: #dbb877;--wood-lo: #b18b52;--wood-edge-lit: #f0dcae;--wood-edge-dark: #74522f;--hole-lo: #26190a;--hole-mid: #422c14;--hole-rim: #5a3e1e;--marble-blue: #1478c9;--marble-blue-light: #3ab4e6;--marble-highlight: rgba(235, 248, 255, .9);--marble-soft-highlight: rgba(170, 220, 240, .45);--marble-rim: rgba(15, 35, 50, .6);--marble-shadow: rgba(60, 40, 20, .3);--target-glow: #f2735c;color-scheme:light}html,body{margin:0;height:100%;height:100svh;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,system-ui,sans-serif;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;touch-action:manipulation}.stage{height:100%;display:flex;flex-direction:column;padding:max(2.4svh,env(safe-area-inset-top,0px)) max(4vw,env(safe-area-inset-right,0px)) max(3svh,env(safe-area-inset-bottom,0px)) max(4vw,env(safe-area-inset-left,0px))}.title{margin:0;font-family:var(--font-display);font-size:clamp(16px,2.6svh,22px);font-weight:700;letter-spacing:.02em;color:var(--ink)}.icon-btn:active{background:#2e93bd1f;border-color:var(--accent);color:var(--accent-dark);transform:scale(.94)}.tagline{margin:1.6svh 0 0;text-align:center;font-size:clamp(12px,1.7svh,14px);color:var(--ink-soft);letter-spacing:.03em;flex-shrink:0}.hint-banner{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:2vw;max-height:0;opacity:0;overflow:hidden;margin:0 auto;padding:0 4vw;border-radius:999px;background:#2e93bd1f;border:1.5px solid rgba(46,147,189,.35);color:var(--ink);font-size:clamp(11px,1.6svh,13px);letter-spacing:.02em;text-align:center;transition:max-height .35s ease,opacity .3s ease,margin .35s ease,padding .35s ease;flex-shrink:0}.hint-banner.show{max-height:8svh;opacity:1;margin:1.4svh auto 0;padding:1svh 4vw}.hint-banner-text{flex:1}.hint-banner-close{border:none;background:none;color:var(--ink-soft);font-size:18px;line-height:1;cursor:pointer;padding:0 0 0 1vw;flex-shrink:0}.board-area{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2svh;min-height:0}.board-wrap{position:relative;width:min(88vw,66svh,620px);aspect-ratio:1 / 1}.board-rim{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 200deg,var(--wood-edge-lit) 0deg,var(--wood-edge-dark) 180deg,var(--wood-edge-lit) 360deg);box-shadow:0 1svh 2.2svh #324b3c29}.board-circle{position:absolute;inset:1.6%;border-radius:50%;background:repeating-linear-gradient(94deg,rgba(255,244,220,.09) 0px,rgba(255,244,220,.09) 1px,transparent 1.5px,transparent 5px),repeating-linear-gradient(88deg,rgba(90,60,20,.07) 0px,rgba(90,60,20,.07) 1px,transparent 2px,transparent 7px),radial-gradient(circle at 34% 26%,var(--wood-hi) 0%,var(--wood-mid) 55%,var(--wood-lo) 100%);box-shadow:inset 0 0 0 1px #ffffff40,inset 0 .4svh 1svh #ffffff4d,inset 0 -.6svh 1.4svh #3c230a47}.holes-grid,.marbles-grid{position:absolute;left:50%;top:50%;width:76%;height:76%;transform:translate(-50%,-50%);display:grid;grid-template-columns:repeat(7,1fr);grid-template-rows:repeat(7,1fr)}.marbles-grid{pointer-events:none}.cell{position:relative;display:flex;align-items:center;justify-content:center}.hole{width:74%;height:74%;border-radius:50%;background:radial-gradient(circle at 42% 36%,var(--hole-lo) 0%,var(--hole-lo) 46%,var(--hole-mid) 58%,var(--hole-rim) 66%,transparent 72%);box-shadow:inset 0 .3svh .5svh #23190f73;transition:box-shadow .2s ease}.hole.valid-target{cursor:pointer;position:relative}.hole.valid-target:before,.hole.valid-target:after{content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none;animation:target-pulse 1s ease-in-out infinite}.hole.valid-target:before{box-shadow:0 0 0 .22svh var(--target-glow),0 0 1.6svh .2svh var(--target-glow)}.hole.valid-target:after{box-shadow:0 0 0 .32svh var(--target-glow),0 0 2.6svh .4svh var(--target-glow);animation-name:target-pulse-high;opacity:0}@keyframes target-pulse{0%,to{opacity:1}50%{opacity:0}}@keyframes target-pulse-high{0%,to{opacity:0}50%{opacity:1}}.marble{position:absolute;width:86%;height:86%;border-radius:50%;pointer-events:auto;cursor:pointer;overflow:hidden;background:radial-gradient(circle at 40% 34%,#3a82afeb,#1e5a82e6 55%,#10324bd9);box-shadow:inset 0 0 0 1.5px var(--marble-rim),inset -.15svh -.25svh .5svh #ffffff24,inset .25svh .45svh .9svh #0a16204d,inset 0 -.5svh .5svh #78b4dc40,0 .35svh .5svh var(--marble-shadow);transition:transform .35s cubic-bezier(.4,1.4,.6,1),box-shadow .2s ease;will-change:transform}.marble:before{content:"";position:absolute;width:78%;height:48%;top:28%;left:8%;background:linear-gradient(135deg,var(--marble-blue-light) 0%,var(--marble-blue) 50%,transparent 82%);border-radius:50% 50% 60% 40%/60% 60% 40% 40%;transform:rotate(calc(-22deg + var(--i, 0) * 8deg));opacity:.92;pointer-events:none}.marble:after{content:"";position:absolute;width:30%;height:30%;top:12%;left:20%;border-radius:50%;background:radial-gradient(circle,var(--marble-highlight) 0%,var(--marble-soft-highlight) 45%,transparent 75%);pointer-events:none}.marble.selected{transform:translateY(-14%) scale(1.08);box-shadow:inset 0 0 0 1.5px var(--marble-rim),inset -.15svh -.25svh .5svh #ffffff38,inset .25svh .45svh .9svh #0a162052,inset 0 -.5svh .5svh #78b4dc4d,0 1.4svh 1.2svh #1423324d}.marble.captured{animation:capture .3s ease forwards}@keyframes capture{to{transform:scale(.2);opacity:0}}.marble.shake{animation:shake .25s ease}.marble.hint-bounce{animation:hint-bounce 1.3s ease-in-out infinite;animation-delay:calc(var(--i, 0) * -.15s)}@keyframes hint-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-12%)}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-6%)}75%{transform:translate(6%)}}.marble.win-glow{animation:glow 1.6s ease-in-out infinite}@keyframes glow{0%,to{box-shadow:inset 0 0 0 1.5px var(--marble-rim),inset -.15svh -.25svh .5svh #ffffff24,inset .25svh .45svh .9svh #0a162059,0 0 1.5svh #2e93bd80}50%{box-shadow:inset 0 0 0 1.5px var(--marble-rim),inset -.15svh -.25svh .5svh #ffffff38,inset .25svh .45svh .9svh #0a162059,0 0 3.5svh #2e93bde6}}.counter-box{display:flex;flex-direction:column;align-items:center;gap:.4svh}.counter-label{font-size:clamp(9px,1.3svh,11px);letter-spacing:.18em;color:var(--ink-soft);text-transform:uppercase}.counter-value{font-size:clamp(16px,2.4svh,20px);font-weight:600;color:var(--ink);letter-spacing:.05em}.overlay{position:fixed;inset:0;background:#eef3ecf0;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .5s ease}.overlay.show{opacity:1}.overlay-content{display:flex;flex-direction:column;align-items:center;gap:2.2svh;pointer-events:none}.overlay.show .overlay-content{pointer-events:auto}.overlay-title{margin:0;font-family:var(--font-display);font-size:clamp(18px,3.4svh,26px);font-weight:700;letter-spacing:.12em;color:var(--ink)}.overlay-marble{width:56px;height:56px;border-radius:50%;overflow:hidden;position:relative;background:radial-gradient(circle at 40% 34%,#3a82afeb,#1e5a82e6 55%,#10324bd9);box-shadow:inset 0 0 0 1.5px var(--marble-rim),inset -.15svh -.25svh .5svh #ffffff24,inset .25svh .45svh .9svh #0a16204d,inset 0 -.5svh .5svh #78b4dc40,0 0 3svh #2e93bdb3;animation:glow 1.6s ease-in-out infinite}.overlay-marble:before{content:"";position:absolute;width:78%;height:48%;top:28%;left:8%;background:linear-gradient(135deg,var(--marble-blue-light) 0%,var(--marble-blue) 50%,transparent 82%);border-radius:50% 50% 60% 40%/60% 60% 40% 40%;transform:rotate(-22deg);opacity:.92}.overlay-marble:after{content:"";position:absolute;width:30%;height:30%;top:12%;left:20%;border-radius:50%;background:radial-gradient(circle,var(--marble-highlight) 0%,var(--marble-soft-highlight) 45%,transparent 75%)}.overlay-sub{margin:0;font-size:clamp(12px,1.8svh,14px);color:var(--ink-soft);letter-spacing:.08em}.overlay-actions{margin-top:1svh}.again-btn,.share-btn{font-family:var(--font-display);font-weight:600;padding:1.2svh 4vw;border-radius:999px;font-size:clamp(12px,1.8svh,14px);letter-spacing:.06em;cursor:pointer;transition:transform .1s ease}.again-btn:active,.share-btn:active{transform:scale(.96)}.again-btn{border:none;background:linear-gradient(135deg,var(--accent),var(--accent-dark));color:#fff;box-shadow:0 .8svh 1.8svh #2e93bd59}.share-btn{border:1.5px solid var(--accent);background:transparent;color:var(--accent-dark)}:root[data-theme=dark]{--bg: #0d0e1a;--ink: #f0eefa;--ink-soft: #9b96c4;--line: #223142;--accent: #22d3ee;--accent-dark: #0891b2;--wood-hi: #6e4d2c;--wood-mid: #4d331a;--wood-lo: #2c1c0e;--wood-edge-lit: #7c5a38;--wood-edge-dark: #150c05;--hole-lo: #0e0904;--hole-mid: #1c1108;--hole-rim: #2c1c0e;--marble-shadow: rgba(0, 0, 0, .45);--target-glow: #ff7a5c;color-scheme:dark}[data-theme=dark] .board-rim{box-shadow:0 0 0 1.5px color-mix(in srgb,var(--accent) 45%,transparent),0 0 3svh color-mix(in srgb,var(--accent) 30%,transparent),0 1.8svh 3.2svh #0009}[data-theme=dark] .board-circle{box-shadow:inset 0 0 0 1px #ffc88c1a,inset 0 .4svh 1svh #ffc88c14,inset 0 -.6svh 1.4svh #0000008c}[data-theme=dark] .marble{background:radial-gradient(circle at 40% 34%,#4696c3f2,#236491eb 55%,#0e2a3ee0)}[data-theme=dark] .icon-btn:active,[data-theme=dark] .hint-banner{background:color-mix(in srgb,var(--accent) 16%,transparent)}[data-theme=dark] .hint-banner{border-color:color-mix(in srgb,var(--accent) 45%,transparent)}[data-theme=dark] .overlay{background:#0d0e1af0}[data-theme=dark] .overlay-marble{box-shadow:inset 0 0 0 1.5px var(--marble-rim),inset -.15svh -.25svh .5svh #ffffff24,inset .25svh .45svh .9svh #0a16204d,inset 0 -.5svh .5svh #78b4dc40,0 0 3svh color-mix(in srgb,var(--accent) 75%,transparent)}[data-theme=dark] .again-btn{box-shadow:0 .8svh 1.8svh color-mix(in srgb,var(--accent) 45%,transparent)}@keyframes glow-dark{0%,to{box-shadow:inset 0 0 0 1.5px var(--marble-rim),inset -.15svh -.25svh .5svh #ffffff24,inset .25svh .45svh .9svh #0a162059,0 0 1.5svh #22d3ee99}50%{box-shadow:inset 0 0 0 1.5px var(--marble-rim),inset -.15svh -.25svh .5svh #ffffff38,inset .25svh .45svh .9svh #0a162059,0 0 4svh #22d3ee}}[data-theme=dark] .marble.win-glow,[data-theme=dark] .overlay-marble{animation-name:glow-dark}@media(prefers-reduced-motion:reduce){.hole.valid-target:before,.hole.valid-target:after{animation:none}.marble.hint-bounce{animation:none;outline:2px solid var(--target-glow, var(--accent, currentColor));outline-offset:3px}.marble.win-glow,.overlay-marble,[data-theme=dark] .overlay-marble{animation:none}.marble.captured{animation:none;opacity:0;transition:opacity .12s linear}.marble.shake{animation:none;outline:2px solid #e0788a;outline-offset:2px}.marble{transition:opacity .12s linear,box-shadow .12s linear}.hint-banner{transition:opacity .12s linear}}.hint-banner-close{position:relative}.hint-banner-close:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:44px;height:44px}