#dpg-card, #dpg-dialog { box-sizing: border-box; font: 14px/1.4 Arial, sans-serif; color: #1c2924; }
#dpg-card *, #dpg-dialog * { box-sizing: border-box; }
@media (min-width: 768px) { #dpg-card { display: none !important; } }
body.woocommerce-checkout #dpg-card { display: none !important; }
#dpg-card [hidden], #dpg-dialog [hidden] { display: none !important; }
#dpg-card { position: fixed; z-index: 99990; display: grid; grid-template-columns: var(--dpg-left, 70%) minmax(0, 1fr); grid-template-rows: var(--dpg-top, 20%) minmax(0, 1fr); padding: 0; gap: 0; background: #fff; border: 1px solid #dfe7e2; border-radius: 12px; box-shadow: 0 3px 20px #0003; bottom: calc(var(--dpg-bottom, 0px) + env(safe-area-inset-bottom, 0px)); height: var(--dpg-height, 150px); isolation: isolate; overflow: hidden; }
#dpg-card button, #dpg-dialog button { appearance: none; min-width: 0; margin: 0; font: inherit; text-transform: none; letter-spacing: normal; cursor: pointer; box-shadow: none; }
#dpg-card button:focus-visible, #dpg-card a:focus-visible, #dpg-card .dpg-sentences:focus-visible, #dpg-dialog button:focus-visible { outline: 2px solid #36aa7a; outline-offset: -2px; }
#dpg-card .dpg-heading { min-width: 0; min-height: 0; padding: 0 9px; display: flex; flex-direction: column; justify-content: safe center; align-items: center; text-align: center; overflow: auto; background: #f6f9f7; border-bottom: 1px solid #dfe7e2; }
#dpg-card .dpg-heading strong, #dpg-card .dpg-faq-title { display: block; font-size: 12px; font-weight: 700; line-height: 1; color: #243f31; overflow-wrap: anywhere; }
#dpg-card .dpg-photo-heading { border-right: 1px solid #dfe7e2; }
#dpg-card .dpg-faq-title { text-decoration: none; }
#dpg-card .dpg-thumbnail { position: relative; min-height: 0; min-width: 0; padding: 4px; width: 100%; height: 100%; border: 0; border-right: 1px solid #dfe7e2; border-radius: 0; overflow: hidden; background: #fff; }
#dpg-card .dpg-thumbnail img { display: block; width: 100%; height: 100%; object-fit: contain; border-radius: 0; }
#dpg-card .dpg-sentences { min-width: 0; min-height: 0; overflow: auto; overscroll-behavior: contain; padding: 10px; scrollbar-width: thin; background: #fff; }
#dpg-card .dpg-sentence { margin: 0; padding: 0; color: #c62828; font: 13px/1.5 Arial, sans-serif; overflow-wrap: anywhere; }
#dpg-dialog { position: fixed; inset: 0; margin: auto; padding: 0; border: 0; width: 100%; max-width: 100vw; height: fit-content; max-height: 100vh; max-height: 100dvh; background: #121714; color: #fff; overflow: auto; overscroll-behavior: contain; }
#dpg-dialog::backdrop { background: rgb(0 0 0 / 78%); }
#dpg-dialog .dpg-toolbar { height: 52px; display: flex; align-items: center; justify-content: space-between; padding: 0 8px 0 16px; gap: 12px; }
#dpg-dialog .dpg-count { margin-left: auto; color: #d4ded8; font-size: 13px; }
#dpg-dialog .dpg-stage { position: relative; min-height: 100px; display: flex; align-items: center; justify-content: center; background: #090c0a; touch-action: pan-y pinch-zoom; }
#dpg-dialog .dpg-full { display: block; width: auto; height: auto; max-width: 100%; max-height: calc(100vh - 52px); max-height: calc(100dvh - 52px); object-fit: contain; margin: 0 auto; }
#dpg-dialog button { border: 1px solid #ffffff40; background: #17271de6; color: #fff; width: 44px; height: 44px; border-radius: 50%; padding: 0; font-size: 28px; line-height: 1; display: inline-flex; align-items: center; justify-content: center; }
#dpg-dialog .dpg-prev, #dpg-dialog .dpg-next { position: absolute; top: 50%; transform: translateY(-50%); z-index: 1; }
#dpg-dialog .dpg-prev { left: max(8px, env(safe-area-inset-left)); }
#dpg-dialog .dpg-next { right: max(8px, env(safe-area-inset-right)); }
#dpg-dialog .dpg-status { position: absolute; inset: 0; margin: 0; display: flex; justify-content: center; align-items: center; pointer-events: none; background: #090c0a; color: white; padding: 0 60px; text-align: center; }
@media (prefers-reduced-motion: no-preference) { #dpg-card .dpg-thumbnail img.dpg-fade { animation: dpg-appear .22s ease-out; } }
@keyframes dpg-appear { from { opacity: .4; } to { opacity: 1; } }
#dpg-card .dpg-click-hint { display: block; visibility: visible; opacity: 1; position: absolute; z-index: 2; right: 12px; bottom: 40px; width: 30px; height: 34px; pointer-events: none; filter: drop-shadow(0 1px 2px #0005); }
#dpg-card .dpg-click-hint svg { position: relative; display: block; width: 30px; height: 34px; fill: #fff; stroke: #205c40; stroke-width: 2; transform-origin: 5px 2px; }
#dpg-card .dpg-click-ring { display: block; visibility: visible; position: absolute; left: -6px; top: -9px; width: 22px; height: 22px; border: 2px solid #218254; border-radius: 50%; opacity: .65; }
@media (prefers-reduced-motion: no-preference) {
 #dpg-card .dpg-click-hint svg { animation: dpg-click 2s ease-in-out infinite; }
 #dpg-card .dpg-click-ring { animation: dpg-ripple 2s ease-out infinite; }
}
@keyframes dpg-click { 0%, 65%, 100% { transform: translate(3px, 4px); } 35%, 45% { transform: translate(0, 0) scale(.88); } }
@keyframes dpg-ripple { 0%, 30% { opacity: 0; transform: scale(.4); } 40% { opacity: .8; transform: scale(.6); } 70%, 100% { opacity: 0; transform: scale(1.5); } }

#dpg-card .dpg-click-label { display: block; visibility: visible; opacity: 1; z-index: 3; position: absolute; right: 6px; bottom: 4px; max-width: calc(100% - 12px); padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: #c62828; font: 600 11px/1.2 Arial, sans-serif; white-space: normal; text-transform: none; letter-spacing: normal; text-align: center; overflow-wrap: anywhere; pointer-events: none; }
.dpg-album { width: 100%; max-width: 768px; margin: 20px auto; font: 14px/1.5 Arial, sans-serif; }
.dpg-album .dpg-album-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.dpg-album .dpg-album-photo { appearance: none; display: block; position: relative; width: 100%; min-width: 0; height: auto; margin: 0; padding: 8px; border: 1px solid #e2e7e3; border-radius: 8px; background: #f8f9f8; cursor: zoom-in; overflow: hidden; box-sizing: border-box; box-shadow: none; }
.dpg-album .dpg-album-photo img { display: block; width: 100%; height: auto; max-width: 100%; object-fit: contain; border-radius: 0; margin: 0; }
.dpg-album .dpg-album-photo:hover { border-color: #218254; }
.dpg-album button:focus-visible { outline: 3px solid #218254; outline-offset: 2px; }
.dpg-album .dpg-album-footer { text-align: center; margin-top: 20px; }
.dpg-album .dpg-album-count { color: #536058; margin: 0 0 12px; font-size: 13px; }
.dpg-album .dpg-load-more { appearance: none; height: auto; margin: 0; padding: 10px 26px; border: 1px solid #205c40; border-radius: 6px; background: #205c40; color: #fff; font: 600 14px/1.5 Arial, sans-serif; text-transform: none; cursor: pointer; box-shadow: none; }
.dpg-album [hidden] { display: none !important; }
@media (max-width: 767px) { .dpg-album .dpg-album-grid { gap: 10px; } }