/* Generated raster background; blue bear extracted from the supplied reference. */
:root{color:#123c78;background:#5299e6}
body{margin:0;min-height:100vh;background-color:#eefcff;isolation:isolate}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:url('assets/maozi-fixed-background.png') center center / cover no-repeat}
header{position:sticky;top:0;z-index:3;background:#f8fdffed;border-bottom:3px solid #236dcc}
.admin-link{margin-left:auto;margin-right:190px;color:#18549a;font-size:12px;text-decoration:none;border:1px solid #7db9e8;background:#eaf7ff;padding:6px 10px;border-radius:999px}
.admin-link:hover{background:#fff}
.brand{display:flex;gap:10px;align-items:center;color:#164c91}
.brand-bear{width:42px;height:42px;object-fit:contain;transform-origin:50% 85%}
.brand:hover .brand-bear{animation:bear-wiggle .65s ease both}
.intro{margin:30px auto 18px;padding:30px 20px 18px;border:3px solid #2774ce;border-radius:34px;background:#fff;box-shadow:0 7px 0 #2165ae55;max-width:780px}
.ribbon{background:#e7f3ff;border:1px solid #559ce9;color:#1554a0}
.intro h1{color:#176bcc;text-shadow:2px 3px 0 #bedfff;letter-spacing:2px}
.intro h1 span{color:#3e91e5}.intro p{color:#366da6}.divider{color:#2580d8}
.section-title{margin-top:26px}.section-title h2{background:white;border:2px solid #2976cb;border-radius:16px;padding:8px 14px;color:#124989}
.section-title h2 span{color:#3b6da2}.section-title>span{background:white;color:#2c6096;padding:8px 14px;border:1px solid #7cb5eb}
.card{border:2px solid #2679d5;box-shadow:0 6px 0 #1b5d9d66;background:white}
.card h3{color:#143b73}.price{color:#1a65bd;font-weight:800}.number{color:#154a86}.meta-tags{display:flex;gap:5px;flex-wrap:wrap;margin:6px 0 2px}.meta-tags span{font-size:11px;color:#2872b5;background:#e7f5ff;border:1px solid #a9d4f4;border-radius:999px;padding:2px 7px}
.add,.cart-trigger{background:#58a5f4;border:2px solid #1767b9;color:#072f63;box-shadow:0 4px 0 #1b62a9}
.cart-trigger{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:30;min-width:180px;padding:12px 24px;border-radius:28px;box-shadow:0 5px 0 #1b62a9,0 10px 22px #174e9440}
.cart-trigger:hover{transform:translateX(-50%) translateY(-2px)}
.add:hover,.cart-trigger:hover{background:#78baff}.add.selected{background:#ffd3e4;border-color:#c66592;color:#7c244e;box-shadow:0 4px 0 #cc7d9f}
.cart-trigger span{background:white;color:#155291}.primary{background:#398feb;border-color:#14599f;color:white;box-shadow:0 4px 0 #104c8c}.primary:hover{background:#207cd8}
dialog{border:3px solid #2874c6;background:#fff;box-shadow:0 14px 70px #06386650;color:#163f78}dialog::backdrop{background:#092e665e}
.close{background:#d9edff;border-color:#5999d8;color:#145ca5}.cart-bottom p,.detail-note,#thanks small{color:#546f89}
.eyebrow,.detail-id{color:#3576b6}.text-button{color:#2469b0}
main{padding-bottom:110px}
#toast{display:flex;align-items:center;gap:10px;background:#fff;color:#144583;border:2px solid #2b78cc;box-shadow:0 5px 0 #174e9466;padding:8px 21px 8px 9px}
#toast img{width:48px;height:48px;object-fit:contain;transform-origin:50% 85%}
#toast.show img{animation:bear-wiggle .7s ease 2}
.thank-bear{display:block;width:128px;height:128px;object-fit:contain;margin:0 auto;transform-origin:50% 85%}
#thanks[open] .thank-bear{animation:bear-wiggle .7s ease 3}
.flying-bear{position:fixed;width:76px;height:76px;object-fit:contain;pointer-events:none;z-index:20;filter:drop-shadow(0 4px 3px #25558533)}
.cart-bounce{animation:cart-pop .45s ease}
@keyframes bear-wiggle{0%,100%{transform:rotate(0) translateY(0)}25%{transform:rotate(-13deg) translateY(-8px)}55%{transform:rotate(10deg) translateY(-13px)}80%{transform:rotate(-5deg) translateY(-4px)}}
@keyframes cart-pop{0%,100%{transform:translateX(-50%) scale(1)}45%{transform:translateX(-50%) scale(1.06)}}
@media(max-width:650px){.intro{margin-top:22px;padding:26px 12px 10px;border-radius:26px}.intro h1{font-size:clamp(25px,7.3vw,36px);letter-spacing:0}.brand-bear{width:34px;height:34px}.section-title h2{font-size:17px;padding:7px 10px}.section-title h2 span{font-size:12px}.card{border-width:2px}.thank-bear{width:110px;height:110px}.cart-trigger{bottom:12px;min-width:168px;padding:11px 20px}}
@media(max-width:650px){.admin-link{margin-right:0;margin-left:auto;font-size:11px;padding:5px 7px}.brand{font-size:14px}.cart-trigger{bottom:12px;min-width:168px;padding:11px 20px}.intro{margin-top:22px;padding:26px 12px 10px;border-radius:26px}.intro h1{font-size:clamp(25px,7.3vw,36px);letter-spacing:0}.brand-bear{width:34px;height:34px}.section-title h2{font-size:17px;padding:7px 10px}.section-title h2 span{font-size:12px}.card{border-width:2px}.thank-bear{width:110px;height:110px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.flying-bear{display:none}}
/* Keep purchase feedback above the fixed bag, including mobile safe areas. */
.cart-trigger{bottom:calc(18px + env(safe-area-inset-bottom,0px));background:#78d9e9;border-color:#269bb9;color:#145269;box-shadow:0 5px 0 #258aa6,0 10px 22px #17657730}
.cart-trigger:hover,.cart-trigger:active{background:#9be8f2;transform:translateX(-50%)}
.cart-trigger span{color:#17647b;background:#f4fdff}
.add{background:#91dfea;border-color:#369fb9;color:#174f64;box-shadow:0 4px 0 #3898ae}
.add:hover{background:#b6edf3}
#toast{bottom:calc(104px + env(safe-area-inset-bottom,0px));z-index:40;max-width:calc(100vw - 24px);white-space:normal;border-color:#49afc5;color:#165970;box-shadow:0 4px 0 #258aa640}
.grid{display:block;columns:4;column-gap:22px}
.card{display:inline-block;width:100%;margin:0 0 22px;break-inside:avoid;vertical-align:top}
.photo-button{aspect-ratio:auto}
.photo-button img{width:100%;height:auto;aspect-ratio:auto}
.stock{font-size:11px;color:#2872b5;background:#e7f8fb;border:1px solid #8dd6e2;border-radius:999px;padding:2px 7px}
.stock.soldout{color:#9b4463;background:#fff0f4;border-color:#e4a8bc}
@media(max-width:1000px){.grid{columns:3}}
@media(max-width:650px){.grid{columns:2;column-gap:12px}.card{margin-bottom:14px}}
/* Let the supplied transparent lettering sit directly on the shop background. */
.intro.intro-art{max-width:780px;margin:22px auto 0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}
.intro.intro-art h1{margin:0;line-height:0;text-shadow:none}
.title-art{display:block;width:100%;height:auto;filter:drop-shadow(0 2px 0 #ffffffa6)}
@media(max-width:650px){.intro.intro-art{margin:20px auto 4px}}