/* Flat illustrated stonework, matching the castle scenery. */
.masthead .buy-button{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;min-width:160px;min-height:58px;padding:16px 24px;border:0;border-radius:0;background:transparent;color:#fff8dc;font:400 14px/1.1 Uncial,Georgia,serif;letter-spacing:.5px;text-shadow:1px 2px 0 #20291c;box-shadow:none;transition:transform .18s,filter .18s}
.masthead .buy-button .castle-block{position:absolute;inset:0;width:100%;height:100%;z-index:-1;overflow:visible;pointer-events:none}
.masthead .buy-button:hover{background:transparent;transform:translateY(-2px);filter:brightness(1.13)}
.masthead .buy-button:active{transform:translateY(1px)}
.masthead .buy-button:focus-visible{outline:2px solid #e2f49f;outline-offset:4px}
#garden .music-credit{font-size:10px;line-height:1.5;color:#606861;max-width:580px;opacity:.48}
#garden .music-credit a:hover,#garden .music-credit a:focus-visible{color:#a0aaa0}
@media(max-width:600px){.masthead .buy-button{min-width:137px;min-height:51px;font-size:12px;padding:14px 20px}#garden .music-credit{font-size:9px;max-width:360px}}
@media(prefers-reduced-motion:reduce){.masthead .buy-button{transition:none}}

/* A clearer action label, with color reserved for the animated menu underline. */
.masthead .buy-button{min-width:180px;min-height:64px;padding:18px 27px;font-size:17px;color:#fff;text-shadow:1px 2px 0 #20291c}
.masthead nav a,.masthead nav button,.mobile-nav a,.mobile-nav button,
.masthead nav a:hover,.masthead nav button:hover,.masthead nav .active,.masthead nav a:focus-visible,.masthead nav button:focus-visible,
.mobile-nav a:hover,.mobile-nav button:hover,.mobile-nav .active,.mobile-nav a:focus-visible,.mobile-nav button:focus-visible{color:#fff;text-shadow:0 2px 3px #0009}
.scroll-stars i{width:clamp(5px,.65vw,11px);filter:drop-shadow(0 0 4px #fffbd8)}
@media(max-width:600px){.masthead .buy-button{min-width:155px;min-height:57px;padding:16px 22px;font-size:14px}}

/* A generous soundtrack target beside the purchase brick. */
.masthead #sound-toggle{display:inline-flex;align-items:center;justify-content:center;flex:none;min-width:54px;min-height:54px;padding:9px;border:1px solid #577159;border-radius:50%;background:#10271c;color:#fff4d3;font-size:30px;line-height:1;box-shadow:none}
.masthead #sound-toggle:hover{background:#23452c;color:#fff}
.masthead #sound-toggle[aria-pressed="true"]{border-color:#a7c183;color:#e4ffc4}
.masthead #sound-toggle:focus-visible{outline:3px solid #ffe6a6;outline-offset:4px}
@media(max-width:600px){.masthead #sound-toggle{min-width:50px;min-height:50px;font-size:28px}}

/* Larger blue brick and a stronger white purchase label. */
.masthead .buy-button{min-width:218px;min-height:76px;padding:20px 30px;font-size:21px}
@media(max-width:600px){.masthead .buy-button{min-width:180px;min-height:64px;padding:17px 24px;font-size:17px}}

.masthead #sound-toggle{width:66px;height:66px;min-width:66px;min-height:66px;font-size:35px}
@media(max-width:600px){.masthead #sound-toggle{width:58px;height:58px;min-width:58px;min-height:58px;font-size:32px}}

.masthead .buy-button .buy-twinkle{position:absolute;width:12px;height:12px;pointer-events:none;background:#c9efff;clip-path:polygon(50% 0,61% 38%,100% 50%,61% 62%,50% 100%,39% 62%,0 50%,39% 38%);filter:drop-shadow(0 0 3px #64c7ff);opacity:0;animation:buy-blue-twinkle 5.4s ease-in-out infinite}.buy-twinkle-one{left:9%;top:18%;animation-delay:-.4s!important}.buy-twinkle-two{right:12%;top:13%;width:9px!important;height:9px!important;animation-delay:-1.8s!important}.buy-twinkle-three{right:6%;bottom:16%;animation-delay:-3.1s!important}.buy-twinkle-four{left:24%;bottom:9%;width:8px!important;height:8px!important;animation-delay:-4.4s!important}@keyframes buy-blue-twinkle{0%,10%,38%,100%{opacity:0;transform:scale(.25) rotate(0deg)}22%{opacity:1;transform:scale(1.1) rotate(18deg)}}@media(prefers-reduced-motion:reduce){.masthead .buy-button .buy-twinkle{animation:none;opacity:.5}}
