.boba-coin{display:inline-block;width:1.7em;height:1.7em;flex:none;border:2px solid #bc8a42;border-radius:50%;background:#f5ce76 url('/ui/cafe-mark.svg') center/85% no-repeat;box-shadow:inset 0 0 0 2px #fff3ba,0 2px #c5a16b;vertical-align:middle}.coin-wallet{display:flex!important;gap:.35em;align-items:center;background:#fff1cd!important;color:#8b624c!important;padding:.3em .65em!important;border:2px solid #d6b28e!important;border-radius:50% 45% 43% 48%/24% 25% 22% 27%!important;font-size:var(--type-small,14px)!important}.coin-wallet strong{font-size:inherit}.factory-progress{display:block;text-align:center;color:#93716b;font-size:var(--type-small,14px);padding:3px 12px 7px;font-weight:800;letter-spacing:.04em}.factory-progress[hidden]{display:none}
#shopDialog{padding:0;border:0;background:transparent;color:#89685e;width:min(1080px,94vw);max-height:91dvh;overflow:auto;border-radius:20px}#shopDialog::backdrop{background:#503b456b;backdrop-filter:blur(5px)}.shop-notebook{position:relative;padding:38px 34px 25px;background:#fff8e9 url('/paper-fibres.svg') 0 0/180px 180px repeat;border:3px solid #d8bba2;border-radius:28px 23px 31px 24px;box-shadow:inset 0 0 0 7px #fffdf3;line-height:1.55;font-family:Nunito,sans-serif}.shop-notebook::before{content:'';position:absolute;top:0;left:45px;width:110px;height:28px;background:repeating-linear-gradient(90deg,#ecacba66 0 9px,#fff6e888 9px 18px);transform:rotate(-5deg);pointer-events:none}.shop-notebook header{text-align:center;position:relative}.shop-kicker{text-transform:uppercase;letter-spacing:.14em;font-size:12px}.shop-notebook h2{font-size:clamp(25px,3vw,36px);color:#a16d7c;margin:5px 0}.shop-notebook p{font-size:15px;margin:8px 0}.shop-close{position:absolute;right:16px;top:12px;z-index:1;background:#fbe6e8;border:1px solid #c998a5;color:#9a6874;border-radius:50%;width:38px;height:38px;font-size:26px}.shop-purse{display:flex;justify-content:center;align-items:center;gap:9px;margin:15px auto;font-size:18px}.shop-purse strong{font-size:28px;color:#a7783e}#shopStatus{text-align:center;min-height:1.5em;font-size:14px;color:#967363}#shopSignIn,#shopRetry{display:block;text-align:center;margin:10px auto}#shopSignIn[hidden],#shopRetry[hidden]{display:none}.shop-items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:25px 0}.shop-cutout{background:#fffdf4;border:2px dashed #ddc6b5;border-radius:28px 18px 30px 17px;padding:14px 14px 18px;box-shadow:4px 6px #e9d4bd66;text-align:center;transform:rotate(-1deg);position:relative}.shop-cutout:nth-child(2){transform:rotate(1deg)}.shop-cutout:nth-child(3){transform:rotate(-.7deg);background:#fff9e6}.shop-cutout[data-equipped=true]{border-color:#86a185;box-shadow:0 0 0 3px #d3dfc6,4px 6px #e9d4bd66}.shop-stamp{display:inline-block;font-size:12px;color:#a6816a;letter-spacing:.04em;padding:3px 8px;background:#f8efdc;transform:rotate(1deg)}.shop-art{height:230px;margin:12px 0;background:#fff;border-radius:45% 50% 44% 48%/20% 18% 22% 24%;overflow:hidden;box-shadow:0 0 0 5px #fff}.shop-art img{width:100%;height:100%;object-fit:contain}.shop-cutout h3{font-size:20px;line-height:1.3;color:#9a6975;margin:15px 0 7px}.shop-cutout p{min-height:4.65em;font-size:14px}.shop-cutout button,.shop-originals button,#shopRetry{font:800 15px Nunito,sans-serif;letter-spacing:.02em;border:2px solid #c59ca5;background:#f2cfda;color:#8b5b6c;padding:12px 14px;border-radius:22px 17px 21px 18px;box-shadow:0 3px #d2acb6;cursor:pointer}.shop-cutout button{width:100%;margin-top:8px}.shop-cutout button:disabled{cursor:default;opacity:.65;background:#ece4d5;color:#8a8172;border-color:#c9bfad;box-shadow:0 3px #d8cfbc}.shop-cutout[data-equipped=true] button{background:#d8e5cd;color:#6d8b62;border-color:#9caf93;opacity:1}.shop-saving{display:block;font-size:12px;min-height:1.5em;margin-top:8px}.shop-notebook footer{text-align:center;border-top:2px dashed #d6bda4;padding-top:15px}.shop-originals{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin:15px 0}.shop-originals button{background:#fff8ec}.shop-originals button:disabled{opacity:.5}#shopThemeNote{font-size:12px;max-width:600px;margin:15px auto}.batch-heading p{font-size:14px}.batch-recipe{text-align:center;padding:16px 0;border-bottom:2px dashed #c8ac9b}.batch-recipe h3{font-size:18px}.batch-recipe p,.batch-drink p{font-size:14px;line-height:1.7}.batch-drink{padding:18px 0;border-bottom:1px dashed #c8ac9b}.batch-drink>.slip-line:first-child{color:#a4717f}.coin-payment{padding:15px 0;color:#a37d3a;border-bottom:1px dashed #bea784}
@media(max-width:700px){.shop-notebook{padding:38px 22px 22px}.shop-items{grid-template-columns:1fr;gap:28px;max-width:370px;margin:25px auto}.shop-art{height:240px}.shop-cutout p{min-height:0}.coin-wallet{gap:.25em!important}.coin-wallet>span{display:none}.coin-wallet .boba-coin{width:1.4em;height:1.4em}.factory-progress{font-size:12px}.game-topbar .world-tools{gap:7px}}
@media(prefers-reduced-motion:reduce){#shopDialog::backdrop{backdrop-filter:none}}

[data-cafe-theme=halloween] .shop-notebook h2,[data-cafe-theme=halloween] .shop-cutout h3{color:#ae794d}[data-cafe-theme=halloween] .shop-cutout button{background:#f5d3ac;border-color:#d0ab7d;color:#956c45}[data-cafe-theme=halloween] .shop-notebook::before{background:repeating-linear-gradient(90deg,#ecba8866 0 9px,#fff6e888 9px 18px)}

.shop-flower{position:absolute;right:-17px;top:-18px;width:50px;height:50px;background:url('/ui/stationery-stickers.png') 0 0/300% 200% no-repeat;transform:rotate(12deg);pointer-events:none}.shop-binding{position:absolute;left:-2px;top:160px;bottom:50px;width:28px;display:flex;flex-direction:column;justify-content:space-between;pointer-events:none}.shop-binding i{display:block;width:28px;height:32px;background:url('/ui/brass-binder-ring.png') center/contain no-repeat;clip-path:polygon(0 0,100% 0,100% 60%,52% 60%,52% 100%,0 100%)}.menu-paper .modes{flex-wrap:wrap}.shop-notebook button:focus-visible{outline:3px solid #95af85;outline-offset:4px}
.shop-art{position:relative;height:270px}.shop-art img[hidden]{display:none}
.shop-preview{height:100%;position:relative;background:radial-gradient(ellipse at 50% 65%,#f5e9e1,transparent 70%)}
.shop-preview canvas{display:block;width:100%;height:calc(100% - 42px);touch-action:pan-y;cursor:grab}.shop-preview canvas:active{cursor:grabbing}
.shop-preview-controls{height:42px;display:flex;justify-content:center;align-items:center;gap:10px;font-size:12px}
.shop-cutout .shop-preview-controls button{width:40px;min-height:36px;padding:0;margin:0;font-size:25px;background:#fff8eb;border:1px solid #d7bda6;box-shadow:none;color:#886e57}
.shop-cutout .shop-preview-toggle{padding:6px 9px;min-height:40px;font-size:13px;background:#fff8ec;color:#926f75;border:1px dashed #c59ca5;box-shadow:none;margin:0}
.shop-cutout .shop-preview-toggle[aria-pressed=true]{background:#e6eedc;border-color:#9fb390;color:#647950}
.shop-cutout .shop-preview-status{position:absolute;top:10px;left:12px;right:12px;min-height:0;margin:0;font-size:12px;padding:5px;background:#fff9e9ed;border-radius:8px;pointer-events:none}
.shop-preview-status:empty{display:none}

/* The site's generic header/footer rules must not turn notebook copy into columns. */
#shopDialog .shop-notebook>header,#shopDialog .shop-notebook>footer{display:block;width:100%;max-width:none;margin:0;padding:0;text-align:center}
#shopDialog .shop-notebook>header{border:0;padding:0 24px}
#shopDialog .shop-notebook>footer{padding-top:14px}
#shopDialog{overflow-x:hidden;overscroll-behavior:contain}
#shopDialog .shop-items,#shopDialog .shop-cutout{min-width:0}
#shopDialog .shop-cutout p{min-height:0}
#shopDialog .shop-purse{flex-wrap:wrap;margin:8px auto 12px;gap:7px}
#shopDialog .shop-purse strong{overflow-wrap:anywhere;min-width:0}
#shopDialog .shop-saving:empty{display:none}
#shopDialog .shop-originals button{min-height:44px;min-width:0;max-width:100%}
#shopDialog #shopThemeNote:empty{display:none}
@media(max-width:700px){
 #shopDialog{width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}
 #shopDialog .shop-notebook{padding:44px 18px 20px}
 #shopDialog .shop-notebook>header{padding:0}
 #shopDialog .shop-notebook h2{font-size:25px;line-height:1.2}
 #shopDialog .shop-items{gap:22px;margin:20px auto}
 #shopDialog .shop-cutout{transform:none;padding:12px 12px 16px}
 #shopDialog .shop-art{height:200px;margin:8px 0}
 #shopDialog .shop-flower{width:36px;height:36px;top:-12px;right:-7px}
 #shopDialog .shop-cutout h3{font-size:19px;margin:10px 0 5px}
 #shopDialog .shop-originals{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;margin:12px 0}
 #shopDialog .shop-close{width:44px;height:44px;right:8px;top:8px}
}
