:root{--ink:#1d1838;--paper:#fff8e7;--sun:#ffd23f;--sun-deep:#ffab1f;--grass:#5fce62;--grass-deep:#2f9e44;--sky:#38b6ff;--berry:#ff4d6d;--grape:#7c3cff;--font:ui-rounded, "SF Pro Rounded", "Hiragino Maru Gothic ProN", "Arial Rounded MT Bold", "Nunito", "Segoe UI", system-ui, -apple-system, sans-serif}*{box-sizing:border-box}html,body{height:100%;font-family:var(--font);color:var(--ink);-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none;touch-action:none;background:#102a43;margin:0;overflow:hidden}#app{position:fixed;top:0;bottom:0;left:0;right:0}canvas#game{outline:none;width:100%;height:100%;display:block;position:absolute;top:0;bottom:0;left:0;right:0}#ui{pointer-events:none;position:absolute;top:0;bottom:0;left:0;right:0}.hidden{display:none!important}.layer{pointer-events:none;position:absolute;top:0;bottom:0;left:0;right:0}.screen{pointer-events:auto;justify-content:center;align-items:center;padding:20px;display:flex}button{cursor:pointer;font-family:inherit}#loading{color:#fff;letter-spacing:.12em;text-shadow:0 2px #1d183873;z-index:50;background:linear-gradient(#38b6ff,#bfe9ff 60%,#8fdc7a 60%,#5fce62);flex-direction:column;justify-content:center;align-items:center;gap:18px;font-size:18px;font-weight:900;transition:opacity .5s;display:flex;position:absolute;top:0;bottom:0;left:0;right:0}#loading.out{opacity:0;pointer-events:none}#loading .spin-ball{border:4px solid var(--ink);background:radial-gradient(circle at 35% 30%,#fff,#e8e8f0 60%,#b9b9cc);border-radius:50%;width:46px;height:46px;animation:.7s cubic-bezier(.4,0,.6,1) infinite alternate bounce}@keyframes bounce{0%{transform:translateY(-26px)}to{transform:translateY(8px)scale(1.12,.86)}}.btn{-webkit-appearance:none;appearance:none;border:4px solid var(--ink);background:var(--paper);color:var(--ink);letter-spacing:.04em;box-shadow:0 6px 0 var(--ink);text-transform:uppercase;border-radius:999px;min-width:250px;padding:.7em 1.6em;font-size:clamp(16px,2.1vh,21px);font-weight:900;transition:transform 80ms,box-shadow 80ms,background .15s}.btn:hover{box-shadow:0 8px 0 var(--ink);background:#fff;transform:translateY(-2px)}.btn:active{box-shadow:0 2px 0 var(--ink);transform:translateY(4px)}.btn.primary{background:var(--sun)}.btn.primary:hover{background:#ffe066}.chip{-webkit-appearance:none;appearance:none;border:3px solid var(--ink);color:var(--ink);box-shadow:0 3px 0 var(--ink);background:#fff8e7eb;border-radius:999px;padding:.45em 1em;font-size:14px;font-weight:800}.chip:hover{background:#fff}.chip:active{box-shadow:0 1px 0 var(--ink);transform:translateY(2px)}.icon-btn{-webkit-appearance:none;appearance:none;border:3.5px solid var(--ink);background:var(--paper);width:52px;height:52px;box-shadow:0 4px 0 var(--ink);pointer-events:auto;border-radius:16px;place-items:center;transition:transform 80ms,box-shadow 80ms;display:grid;position:relative}.icon-btn svg{width:26px;height:26px;fill:var(--ink);display:block}.icon-btn:hover{background:#fff;transform:translateY(-1px)}.icon-btn:active{box-shadow:0 1px 0 var(--ink);transform:translateY(3px)}.icon-btn .key{letter-spacing:.04em;background:var(--ink);color:#fff;border-radius:6px;padding:1px 6px;font-size:10px;font-weight:900;position:absolute;bottom:-11px;left:50%;transform:translate(-50%)}#menu{background:linear-gradient(#102a431f,#102a4366)}.menu-inner{flex-direction:column;align-items:center;gap:clamp(16px,3.4vh,34px);width:min(720px,100%);display:flex}.logo{text-align:center;animation:.8s cubic-bezier(.2,1.4,.4,1) both logo-in}.logo-top{letter-spacing:.34em;background:var(--ink);color:var(--sun);border-radius:999px;padding:.5em 1.1em .5em 1.4em;font-size:clamp(11px,1.7vh,16px);font-weight:900;display:inline-block}.logo-main{color:#fff;-webkit-text-stroke:.07em var(--ink);paint-order:stroke fill;text-shadow:0 .075em 0 var(--ink), 0 .13em 0 #1d183859;justify-content:center;align-items:center;gap:.02em;margin:.12em 0 .08em;font-size:clamp(38px,min(13vh,14vw),128px);font-weight:900;line-height:1;display:flex}.logo-main span{animation:3.2s ease-in-out infinite wobble;display:inline-block}.logo-main span:nth-child(2n){color:var(--sun);animation-delay:-.6s}.logo-main span:nth-child(3n){animation-delay:-1.3s}.logo-main .ball-o{border:.07em solid var(--ink);width:.72em;height:.72em;box-shadow:0 .075em 0 var(--ink);background:radial-gradient(circle at 34% 30%,#fff 0 30%,#ececf4 55%,#bdbdd0 100%);border-radius:50%;margin:0 .04em;animation:1.6s cubic-bezier(.4,0,.6,1) infinite ball-hop}.logo-sub{color:#fff;text-shadow:0 2px 0 var(--ink), 0 0 12px #1d183899;font-size:clamp(14px,2.2vh,20px);font-weight:800}@keyframes wobble{0%,to{transform:translateY(0)rotate(-2deg)}50%{transform:translateY(-.05em)rotate(2deg)}}@keyframes ball-hop{0%,to{transform:translateY(0)scale(1.06,.92)}45%{transform:translateY(-.42em)scale(.96,1.05)}}@keyframes logo-in{0%{opacity:0;transform:translateY(-40px)scale(.8)}to{opacity:1;transform:none}}.menu-buttons{flex-direction:column;align-items:center;gap:16px;display:flex}.menu-foot{flex-direction:column;align-items:center;gap:12px;display:flex}.best{color:#fff;text-shadow:0 2px 0 var(--ink), 0 0 10px #1d1838b3;font-size:16px;font-weight:800}.best b{color:var(--sun);font-size:1.25em}.muted{opacity:.85}.toggles{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.panel{background:var(--paper);border:5px solid var(--ink);width:min(560px,100%);max-height:100%;box-shadow:0 10px 0 var(--ink), 0 30px 60px #10143273;border-radius:30px;padding:clamp(18px,3vh,30px) clamp(18px,3vw,34px);animation:.35s cubic-bezier(.2,1.3,.4,1) both panel-in;overflow:auto}.panel.wide{width:min(880px,100%)}.panel h2{text-align:center;letter-spacing:.03em;margin:0 0 18px;font-size:clamp(24px,4vh,36px);font-weight:900}.row{flex-wrap:wrap;justify-content:center;gap:14px;margin-top:22px;display:flex}@keyframes panel-in{0%{opacity:0;transform:translateY(30px)scale(.92)}to{opacity:1;transform:none}}#pause,#card,#select,#help{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#10143280}.help-list{gap:10px;margin:0;padding:0;font-size:16px;font-weight:600;line-height:1.4;list-style:none;display:grid}.help-list li{border:3px solid var(--ink);background:#fff;border-radius:16px;padding:10px 14px}.help-list b{text-align:center;background:var(--sun);border:2.5px solid var(--ink);border-radius:999px;min-width:74px;margin-right:8px;padding:1px 10px;font-weight:900;display:inline-block}.grid{grid-template-columns:repeat(3,1fr);gap:14px;display:grid}.hole-card{-webkit-appearance:none;appearance:none;text-align:left;border:4px solid var(--ink);box-shadow:0 5px 0 var(--ink);min-height:74px;color:var(--ink);background:#fff;border-radius:20px;padding:12px 14px 12px 64px;transition:transform 80ms,box-shadow 80ms;position:relative}.hole-card:hover{box-shadow:0 8px 0 var(--ink);transform:translateY(-3px)}.hole-card:active{box-shadow:0 2px 0 var(--ink);transform:translateY(3px)}.hc-num{background:var(--accent);border:3px solid var(--ink);border-radius:50%;place-items:center;width:42px;height:42px;font-size:20px;font-weight:900;display:grid;position:absolute;top:50%;left:12px;transform:translateY(-50%)}.hole-card.current{background:#fff3c4}.select-note{text-align:center;opacity:.75;margin:-8px 0 16px;font-size:15px;font-weight:700}.hc-name{font-size:16px;font-weight:900;line-height:1.15}.hc-meta{opacity:.7;margin-top:3px;font-size:13px;font-weight:700}#hud{padding:16px 18px}.hud-left{flex-direction:column;align-items:flex-start;gap:8px;display:flex;position:absolute;top:16px;left:18px}.pill{background:var(--ink);color:#fff;letter-spacing:.08em;border-radius:999px;align-items:center;gap:8px;padding:7px 16px 7px 10px;font-size:14px;font-weight:900;display:inline-flex}.pill .ico svg{width:18px;height:18px;fill:var(--sun);display:block}.hole-name{color:#fff;-webkit-text-stroke:5px var(--ink);paint-order:stroke fill;text-shadow:0 3px 0 var(--ink);letter-spacing:.01em;font-size:clamp(20px,3.4vh,32px);font-weight:900}.hud-mid{background:var(--paper);border:4px solid var(--ink);box-shadow:0 5px 0 var(--ink);border-radius:22px;align-items:stretch;gap:8px;padding:6px 8px;display:flex;position:absolute;top:14px;left:50%;transform:translate(-50%)}.stat{border-radius:14px;flex-direction:column;justify-content:center;align-items:center;min-width:66px;padding:2px 10px;display:flex}.stat .k{letter-spacing:.14em;opacity:.65;font-size:10px;font-weight:900}.stat .v{font-variant-numeric:tabular-nums;font-size:24px;font-weight:900;line-height:1.05}.stat.big{background:var(--sun);border:3px solid var(--ink);min-width:96px}.stat.big .v{font-size:30px}.stat .v.pop{animation:.35s cubic-bezier(.2,1.6,.4,1) pop}@keyframes pop{0%{transform:scale(1.7)}to{transform:scale(1)}}.hud-right{gap:10px;display:flex;position:absolute;top:16px;right:18px}#power{background:var(--paper);border:4px solid var(--ink);box-shadow:0 5px 0 var(--ink);border-radius:999px;align-items:center;gap:12px;padding:8px 18px;display:flex;position:absolute;bottom:9vh;left:50%;transform:translate(-50%)}.power-label{letter-spacing:.14em;font-size:12px;font-weight:900}.power-track{border:3px solid var(--ink);background:#2b2547;border-radius:999px;width:min(340px,44vw);height:20px;position:relative;overflow:hidden}.power-fill{background:linear-gradient(90deg,#5fe07a 0%,#ffe14d 55%,#ff8a1f 80%,#ff3b4f 100%) 0 0/min(340px,44vw) 100%;border-radius:999px;width:0%;height:100%}.power-ticks{background:repeating-linear-gradient(90deg,#0000 0 calc(25% - 2px),#1d18388c calc(25% - 2px) 25%);position:absolute;top:0;bottom:0;left:0;right:0}.power-val{text-align:right;font-variant-numeric:tabular-nums;min-width:62px;font-weight:900}#power.max{animation:.12s linear infinite shake}@keyframes shake{0%,to{transform:translate(-50%)rotate(0)}25%{transform:translate(calc(-50% - 2px))rotate(-.5deg)}75%{transform:translate(calc(2px - 50%))rotate(.5deg)}}#hint{color:#fff;white-space:nowrap;text-overflow:ellipsis;background:#1d1838d1;border-radius:999px;max-width:94vw;padding:8px 18px;font-size:14px;font-weight:700;position:absolute;bottom:2.4vh;left:50%;overflow:hidden;transform:translate(-50%)}#hint b{color:var(--sun)}.toast{background:var(--paper);border:4px solid var(--ink);box-shadow:0 5px 0 var(--ink);opacity:0;white-space:nowrap;border-radius:999px;padding:10px 24px;font-size:clamp(16px,2.6vh,22px);font-weight:900;transition:opacity .2s,transform .3s cubic-bezier(.2,1.5,.4,1);position:absolute;top:22vh;left:50%;transform:translate(-50%,-20px)scale(.9)}.toast.in{opacity:1;transform:translate(-50%)scale(1)}.toast.water{background:#9be7ff}.toast.lava{background:#ff8a5c}.toast.ob{background:#ffe08a}.toast.void{background:#c9b6ff}.toast.goo{background:#b6ff5c}.toast.good{background:#b8f5a0}#intro{pointer-events:none;position:absolute;top:0;bottom:0;left:0;right:0}.intro-card{flex-direction:column;align-items:flex-start;gap:6px;display:flex;position:absolute;bottom:12vh;left:5vw}#intro.in .intro-card>*{animation:.6s cubic-bezier(.2,1.2,.4,1) both slide-in}#intro.in .intro-name{animation-delay:80ms}#intro.in .intro-par{animation-delay:.16s}#intro.in .intro-hint{animation-delay:.26s}@keyframes slide-in{0%{opacity:0;transform:translate(-60px)}to{opacity:1;transform:none}}.intro-num{background:var(--sun);border:4px solid var(--ink);letter-spacing:.14em;box-shadow:0 4px 0 var(--ink);border-radius:999px;padding:4px 18px;font-size:clamp(13px,2vh,18px);font-weight:900}.intro-name{color:#fff;-webkit-text-stroke:.09em var(--ink);paint-order:stroke fill;text-shadow:0 .07em 0 var(--ink);font-size:clamp(38px,9vh,88px);font-weight:900;line-height:1}.intro-par{background:var(--ink);color:#fff;letter-spacing:.14em;border-radius:999px;padding:4px 18px;font-size:clamp(13px,2vh,18px);font-weight:900}.intro-hint{color:#fff;max-width:min(560px,80vw);text-shadow:0 2px 0 var(--ink), 0 0 10px #1d1838cc;font-size:clamp(14px,2.2vh,19px);font-weight:800}.skip{color:#fff;background:#1d1838d1;border-radius:999px;padding:8px 18px;font-size:14px;font-weight:700;animation:1.6s ease-in-out infinite pulse;position:absolute;bottom:5vh;right:4vw}.skip b{color:var(--sun)}@keyframes pulse{0%,to{opacity:.65}50%{opacity:1}}.banner{text-align:center;pointer-events:none;position:absolute;top:24vh;left:0;right:0}.banner-main{color:var(--sun);-webkit-text-stroke:.08em var(--ink);paint-order:stroke fill;text-shadow:0 .07em 0 var(--ink), 0 .14em 0 #1d18384d;font-size:clamp(44px,12vh,124px);font-weight:900;line-height:1;display:inline-block;transform:scale(0)rotate(-8deg)}.banner.in .banner-main{animation:.7s cubic-bezier(.2,1.7,.35,1) forwards banner-pop,1.4s ease-in-out .7s infinite banner-wiggle}.banner-sub{color:#fff;text-shadow:0 2px 0 var(--ink), 0 0 12px #1d1838b3;opacity:0;margin-top:10px;font-size:clamp(16px,3vh,26px);font-weight:900}.banner.in .banner-sub{animation:.5s .35s forwards fade-up}.banner.ace .banner-main{color:#fff;background:linear-gradient(90deg,#ff4d6d,#ffd23f,#7dff8a,#38f0ff,#b26bff,#ff4d6d) 0 0/200% 100%;-webkit-text-fill-color:transparent;-webkit-text-stroke:0;filter:drop-shadow(0 .05em 0 var(--ink)) drop-shadow(0 0 .02em var(--ink)) drop-shadow(.03em 0 0 var(--ink)) drop-shadow(-.03em 0 0 var(--ink));-webkit-background-clip:text;background-clip:text;animation:.7s cubic-bezier(.2,1.7,.35,1) forwards banner-pop,1.6s linear infinite rainbow,1.4s ease-in-out .7s infinite banner-wiggle!important}.banner.good .banner-main{color:#7dff8a}.banner.meh .banner-main{color:#fff}.banner.bad .banner-main{color:#ff8a5c}@keyframes banner-pop{to{transform:scale(1)rotate(-3deg)}}@keyframes banner-wiggle{0%,to{rotate:0deg}50%{rotate:5deg}}@keyframes rainbow{to{background-position:200% 0}}@keyframes fade-up{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}.card-head{text-align:center;margin-bottom:14px}.card-title{color:var(--sun-deep);-webkit-text-stroke:.08em var(--ink);paint-order:stroke fill;text-shadow:0 .06em 0 var(--ink);font-size:clamp(30px,6vh,56px);font-weight:900;line-height:1.05}.card-title.ace,.card-title.good{color:#4fd86a}.card-title.bad{color:#ff7a5c}.card-title.meh{color:#fff}.card-sub{opacity:.8;margin-top:6px;font-size:16px;font-weight:800}.card-table-wrap{border:4px solid var(--ink);background:#fff;border-radius:18px;overflow-x:auto}.card-table{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%}.card-table th,.card-table td{text-align:center;min-width:44px;padding:9px 4px;font-size:16px;font-weight:800}.card-table tr:first-child th{background:var(--grass);border-bottom:3px solid var(--ink);font-weight:900}.card-table tr:nth-child(2) td,.card-table tr:nth-child(2) th{background:#eafbe4;border-bottom:2px dashed #1d183840}.card-table .rowh{text-align:left;letter-spacing:.1em;text-transform:uppercase;min-width:70px;padding-left:14px;font-size:12px}.card-table .tot{border-left:3px solid var(--ink);font-weight:900;background:var(--sun)!important}.card-table .cur{background:#fff3c4!important}.card-table th.cur{background:var(--sun)!important}.card-table .empty{opacity:.3}.mark{border:3px solid #0000;border-radius:8px;place-items:center;width:32px;height:32px;font-size:17px;font-weight:900;display:inline-grid}.mark.birdie{color:#1f7a33;border-color:#2f9e44;border-radius:50%}.mark.eagle{color:#1f7a33;border-color:#2f9e44;border-radius:50%;box-shadow:0 0 0 3px #fff,0 0 0 6px #2f9e44}.mark.ace{background:var(--sun);border-color:var(--ink);box-shadow:0 0 0 3px #fff, 0 0 0 6px var(--sun-deep);border-radius:50%}.mark.bogey{color:#c2410c;border-color:#e8590c}.mark.double{color:#c92a2a;border-color:#e03131;box-shadow:0 0 0 3px #fff,0 0 0 6px #e03131}.card-foot{flex-wrap:wrap;justify-content:center;gap:12px;margin-top:16px;display:flex}.foot-item{border:3px solid var(--ink);background:#fff;border-radius:16px;flex-direction:column;align-items:center;min-width:120px;padding:6px 16px;display:flex}.foot-item span{letter-spacing:.12em;text-transform:uppercase;opacity:.65;font-size:11px;font-weight:900}.foot-item b{font-size:26px;font-weight:900;line-height:1.1}.foot-item.gold{background:var(--sun);animation:.5s cubic-bezier(.2,1.6,.4,1) .4s both pop}#fatal{text-align:center;color:#fff;z-index:100;background:#102a43;place-items:center;padding:30px;font-size:18px;font-weight:700;line-height:1.5;display:grid;position:absolute;top:0;bottom:0;left:0;right:0}@media (max-width:760px){.grid{grid-template-columns:repeat(2,1fr)}.hud-mid{transform-origin:top;top:92px;transform:translate(-50%)scale(.82)}.card-table th,.card-table td{min-width:27px;padding:7px 1px;font-size:14px}.card-table .rowh{min-width:50px;padding-left:8px;font-size:10px}.mark{border-width:2px;width:25px;height:25px;font-size:14px}.foot-item{min-width:96px;padding:5px 10px}.panel{border-radius:24px;padding:16px 12px}.icon-btn{width:44px;height:44px}.icon-btn .key{display:none}.btn{min-width:200px}}@media (max-height:560px){.menu-buttons{gap:10px}.btn{padding:.5em 1.4em}}@media (prefers-reduced-motion:reduce){.logo-main span,.logo-main .ball-o,.skip,#power.max{animation:none}}