.meadow-pack { max-width: 620px; margin: 0 auto; color: #526e55; }
.md-hint { margin: 4px 0 18px; text-align: center; font-size: 12px; color: #74836d; line-height: 1.5; }
.md-feedback { min-height: 1.5em; font-size: 12px; text-align: center; color: #a08048; }
.md-progress { text-align: center; font-size: 12px; color: #8b9275; margin: 13px auto 20px; }
.meadow-pack button { font: inherit; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.meadow-pack button:disabled { cursor: default; }
.meadow-pack button:focus-visible { outline: 3px solid #c6a564; outline-offset: 3px; }
.meadow-pack [data-md-source] { touch-action: none; user-select: none; -webkit-user-select: none; }
.meadow-pack .is-selected { outline: 3px solid #c8a664; outline-offset: 3px; }
.md-chain { display: flex; gap: 12px; align-items: center; margin: 22px 0 30px; }
.md-chain > button { flex: 0 0 47px; display: grid; place-items: center; gap: 5px; padding: 6px; background: #e5ebd5; border: 1px dashed #a7bb93; border-radius: 12px; color: #577b4e; }
.md-chain > button > svg { width: 30px; height: 30px; }
.md-chain > button small { font-size: 8px; white-space: nowrap; }
.md-garland { min-width: 0; flex: 1; display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; padding: 15px 0; }
.md-domino { display: inline-flex; align-items: center; padding: 5px; color: #55774d; background: linear-gradient(145deg,#fffae9,#e4e8cf); border: 1px solid #c2cbae; border-radius: 7px; box-shadow: 0 3px 0 #a8b698,0 5px 8px #25412918; }
.md-domino > span { width: 30px; aspect-ratio: 1; }
.md-domino > span + span { border-left: 1px solid #b9c6a7; }
.md-domino svg { width: 100%; height: 100%; }
.md-garland .md-domino { padding: 3px; border-radius: 4px; }
.md-garland .md-domino > span { width: 17px; }
.md-domino-hand { display: flex; gap: 13px; flex-wrap: wrap; justify-content: center; margin: 25px auto; max-width: 450px; }
.md-board { display: grid; grid-template-columns: repeat(var(--md-size),minmax(0,1fr)); gap: 3px; background: #c1cfac; padding: 6px; border: 1px solid #9eb491; border-radius: 13px; width: min(100%,420px); margin: 0 auto; box-shadow: 0 7px 0 #a5b795,0 12px 17px #3b59341a; }
.md-cell { position: relative; display: grid; place-items: center; padding: 0; aspect-ratio: 1; min-width: 0; min-height: 0; border: 0; border-radius: 5px; background: #eff1dd; color: #597653; }
.md-cell.is-shaded { background: #d8e2c6; }
.md-cell > svg { width: 63%; height: 63%; }
.md-cell.is-visited { background: #d2dec0; }
.md-cell.is-visited small { font-size: 10px; color: #98ac87; }
.md-cell.is-queen { color: #a48449; background: #f2e1af; }
.md-stone { width: 73%; height: 73%; border-radius: 50%; background: radial-gradient(circle at 30% 22%,#90b27e,#53794e); box-shadow: inset 0 1px 1px #ffffff70,0 3px 0 #3f6139,0 5px 6px #354c3530; }
.md-stone.is-pale { background: radial-gradient(circle at 30% 22%,#fff8df,#e0d5ac); box-shadow: inset 0 1px 1px #ffffffb0,0 3px 0 #bdb58e,0 5px 6px #354c3520; }
.md-landing { width: 16%; height: 16%; border-radius: 50%; background: #92b176; box-shadow: 0 0 0 5px #a5bc8730; }
.md-icon-button { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid #c7d1b8; border-radius: 50%; background: #e7ecd8; color: #759067; }
.md-icon-button svg { width: 24px; height: 24px; }
.md-undo { margin: 22px auto 8px; }
.md-towers { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; min-height: 250px; padding: 0 3px; }
.md-tower { position: relative; height: 235px; border: 0; background: transparent; min-width: 0; color: #748467; }
.md-post { position: absolute; width: 7px; height: 150px; bottom: 30px; left: calc(50% - 3.5px); border-radius: 5px; background: linear-gradient(90deg,#b7a57b,#e0d2a8,#b7a57b); box-shadow: 2px 2px 3px #584d2820; }
.md-base { position: absolute; height: 14px; bottom: 20px; left: 0; width: 100%; border-radius: 6px; background: #b4c399; box-shadow: 0 4px 0 #95a67f; }
.md-disk { position: absolute; display: grid; place-items: center; bottom: calc(34px + var(--height) * 29px); left: 50%; transform: translateX(-50%); height: 25px; width: calc(24% + var(--disk) * 16%); border-radius: 13px; font-size: 11px; font-weight: 700; box-shadow: inset 0 2px 1px #fff6,0 4px 0 #68805260,0 6px 7px #40563120; color: #fff9eb; }
.md-disk-1 { background: #83a779; }.md-disk-2 { background: #d3b46f; }.md-disk-3 { background: #d89b80; }.md-disk-4 { background: #a49ac2; }
.md-tower > small { position: absolute; bottom: 0; left: 0; right: 0; font-size: 10px; }
.md-river { position: relative; height: 345px; border-radius: 25px; background: #e1e9cd; overflow: hidden; }
.md-river-water { position: absolute; inset: 0 28%; background: repeating-linear-gradient(175deg,#9bc0b8 0 25px,#a2c7bf 26px 28px,#9bc0b8 29px 48px); border-left: 7px solid #c2d6ae; border-right: 7px solid #c2d6ae; transform: rotate(7deg) scale(1.12); }
.md-bank { position: absolute; top: 15px; width: 28%; display: grid; gap: 9px; justify-items: center; }
.md-bank-0 { left: 2%; }.md-bank-1 { right: 2%; }
.md-bank > small { font-size: 9px; color: #8ca078; }
.md-bank button { display: grid; place-items: center; gap: 2px; width: 63px; padding: 7px; border: 1px solid #c0cfaa; border-radius: 12px; background: #f1f1db; color: #69855c; box-shadow: 0 3px 0 #b0c299; }
.md-bank button svg { width: 34px; height: 34px; }
.md-bank button span { font-size: 9px; text-transform: capitalize; }
.md-bank button:disabled { opacity: .85; }
.md-boat { position: absolute; top: 51%; display: grid; justify-items: center; padding: 8px; width: 90px; border: 0; border-radius: 16px; background: #f1d69f; color: #9a7c47; box-shadow: 0 5px 0 #a9976480,0 10px 12px #53766b35; transform: translateX(-50%); }
.md-boat-0 { left: 36%; }.md-boat-1 { left: 64%; }
.md-boat > svg:first-child { width: 44px; height: 44px; }
.md-boat > svg:last-child { width: 20px; height: 20px; }
.md-boat-1 > svg:last-child { transform: rotate(180deg); }
.md-boat span { font-size: 10px; text-transform: capitalize; }
.md-jugs { display: flex; gap: 45px; justify-content: center; align-items: flex-end; margin: 15px auto; }
.md-jug-column { display: grid; gap: 16px; justify-items: center; width: min(35%,135px); }
.md-jug { position: relative; display: block; width: 100%; border: 3px solid #9ab6a6; border-top: 0; border-radius: 0 0 21px 21px; color: #53776a; background: #d7e6da44; overflow: hidden; padding: 0; box-shadow: 5px 5px 0 #8aa78c22; }
.md-jug-0 { height: 150px; }.md-jug-1 { height: 225px; }
.md-jug b { position: absolute; z-index: 1; left: 0; right: 0; top: 50%; transform: translateY(-50%); font: 700 32px Georgia,serif; text-shadow: 0 1px 1px #fff7; }
.md-jug b small { display: block; font: 500 11px system-ui,sans-serif; }
.md-water { position: absolute; bottom: 0; left: 0; right: 0; background: linear-gradient(#91c3bdcc,#6baca5e6); border-top: 3px solid #c4e1d5; transition: height .45s ease; }
.md-jug > i { position: absolute; right: 0; height: 1px; width: 12px; background: #759d8b; }
.md-balance { position: relative; height: 180px; margin: 20px auto; max-width: 430px; }
.md-balance-post { position: absolute; width: 7px; height: 123px; bottom: 8px; left: calc(50% - 3.5px); background: #a5986f; border-radius: 5px; }
.md-balance-post:after { content: ''; position: absolute; bottom: 0; width: 90px; height: 13px; left: -41px; border-radius: 7px; background: #bac69e; box-shadow: 0 3px 0 #9bad84; }
.md-balance-arm { position: absolute; width: 73%; height: 6px; top: 41px; left: 13.5%; background: #b2a079; border-radius: 6px; transform: rotate(var(--tilt)); }
.md-pan { position: absolute; width: 40%; height: 92px; top: 68px; border: 1px solid #a9bb99; border-radius: 8px 8px 50% 50%; background: #e1e9d2; color: #6b8b5c; box-shadow: 0 4px 0 #a6ba91; }
.md-pan:before { content: ''; position: absolute; width: 1px; height: 25px; top: -27px; left: 50%; background: #aa9f7c; }
.md-pan-left { left: 0; transform: translateY(var(--pan-shift)); }.md-pan-right { right: 0; transform: translateY(calc(var(--pan-shift) * -1)); }
.md-pan > span { display: flex; flex-wrap: wrap; gap: 4px; justify-content: center; padding: 8px 3px; min-height: 40px; }
.md-pan i { display: grid; place-items: center; font-style: normal; border-radius: 50%; background: #cda66a; color: #fff6d7; font-size: 10px; width: 22px; height: 25px; }
.md-pan small { text-transform: capitalize; font-size: 10px; }
.md-seeds { display: grid; grid-template-columns: repeat(9,minmax(0,1fr)); gap: 8px; max-width: 450px; margin: 15px auto; }
.md-seeds button { position: relative; display: grid; place-items: center; gap: 4px; padding: 3px; min-width: 0; border: 0; border-radius: 10px; background: transparent; color: #b59762; }
.md-seeds svg { width: 100%; height: auto; fill: #ddc489; }
.md-seeds b { position: absolute; top: 35%; font-size: 11px; color: #fff9e6; }
.md-seeds .is-on-pan { opacity: .4; }
.md-seeds .is-heavy { outline: 3px solid #9eba7e; }
.md-weigh { display: flex; align-items: center; justify-content: center; gap: 9px; width: fit-content; margin: 16px auto; padding: 10px 20px; border: 1px solid #c0ceab; border-radius: 22px; background: #e4ebd2; color: #6d885b; font-size: 12px !important; }
.md-weigh svg { width: 22px; height: 22px; }
.md-drag-ghost { position: fixed !important; z-index: 25000 !important; margin: 0 !important; transform: translate(-50%,-50%) rotate(-5deg) !important; box-shadow: 0 16px 24px #36503235 !important; pointer-events: none !important; bottom: auto !important; }
@media(max-width:380px) { .md-chain { gap: 7px; }.md-chain > button { flex-basis: 39px; padding: 4px; }.md-board { gap: 2px; padding: 5px; }.md-cell { border-radius: 4px; }.md-towers { gap: 7px; }.md-jugs { gap: 33px; }.md-seeds { grid-template-columns: repeat(9,minmax(0,1fr)); gap: 3px; }.md-seeds b { font-size: 9px; }.md-bank button { width: 59px; }.md-boat { width: 76px; }.md-pan i { width: 20px; height: 23px; } }
@media(prefers-reduced-motion:reduce) { .md-water { transition: none; } }

.md-weigh-log { display:flex;flex-wrap:wrap;justify-content:center;gap:9px;margin:10px auto;font-size:12px;color:#8c946e; }.md-weigh-log span { padding:5px 10px;border:1px solid #d3dbc1;border-radius:20px;background:#f0f1df; }