/* 公式ストアバッジ(2026-10-22 クロ)。バッジ画像は改変しない。 */
.dlx{margin-top:18px;border-radius:22px;padding:22px 24px;background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(255,255,255,.88));border:1px solid var(--line,#d7eaf0);box-shadow:0 18px 40px -22px rgba(8,123,184,.45),inset 0 1px 0 #fff;position:relative;overflow:hidden}
.dlx:before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:linear-gradient(90deg,var(--blue,#087bb8),var(--pink,#e84e79))}
.dlx-row{display:flex;flex-wrap:wrap;align-items:center;gap:14px 18px}
.dlx .dlx-label{font-size:12px;font-weight:900;letter-spacing:.14em;color:var(--blue,#087bb8);margin:0 0 12px}
a.dlx-badge{display:inline-flex;align-items:center;border-radius:12px;transition:transform .18s ease,box-shadow .18s ease;outline-offset:3px}
a.dlx-badge:hover{transform:translateY(-2px);box-shadow:0 10px 22px -10px rgba(21,61,96,.55)}
a.dlx-badge img{display:block;height:54px;width:auto;max-width:none}
a.dlx-badge.gp{border-radius:9px}
a.dlx-badge.gp img{height:70px;margin:-8px 0;clip-path:inset(8px 0 8px 0 round 8px)}   /* JA の PNG は上下に余白(29/250)。周りの余白だけ切り抜く(絵柄は変えない) */
a.dlx-badge.gp.en img{height:80px;margin:-13px;clip-path:inset(13px round 8px)}   /* EN の PNG は四方に余白(41/250) */
.dlx-soon{display:inline-flex;align-items:center;height:54px;padding:0 18px;border-radius:12px;border:1px dashed #b9cfdb;color:var(--muted,#526d7d);font-size:13px;font-weight:800;background:#f7fbfd}
.dlx-qr{margin-left:auto}
.dlx-qr summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 16px;border-radius:99px;border:1px solid var(--line,#d7eaf0);background:#fff;color:var(--ink,#153d60);font-size:13px;font-weight:800}
.dlx-qr summary::-webkit-details-marker{display:none}
.dlx-qr summary:before{content:"";width:16px;height:16px;background:conic-gradient(from 90deg,var(--ink,#153d60) 25%,transparent 0 50%,var(--ink,#153d60) 0 75%,transparent 0) 0 0/8px 8px;border-radius:2px;opacity:.85}
.dlx-qr[open] summary{background:var(--ink,#153d60);color:#fff}
.dlx-qr[open] summary:before{background:conic-gradient(from 90deg,#fff 25%,transparent 0 50%,#fff 0 75%,transparent 0) 0 0/8px 8px}
.dlx-panel[hidden]{display:none}
.dlx-panel{display:flex;gap:16px;flex-wrap:wrap;margin-top:16px;width:100%}
.dlx-card{margin:0;flex:1 1 180px;max-width:220px;background:#fff;border:1px solid var(--line,#d7eaf0);border-radius:16px;padding:14px;text-align:center}
.dlx-card img{width:100%;max-width:170px;height:auto;display:block;margin:0 auto 8px;image-rendering:pixelated}
.dlx-card span{font-size:12px;font-weight:800;color:var(--muted,#526d7d)}
.dlx-more{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
@media (hover:none),(max-width:700px){.dlx-qr{display:none}}
@media (max-width:700px){.dlx{padding:20px 16px}.dlx-row{justify-content:center;gap:10px}a.dlx-badge img{height:44px}a.dlx-badge.gp img{height:57px;margin:-7px 0;clip-path:inset(7px 0 7px 0 round 7px)}a.dlx-badge.gp.en img{height:65px;margin:-11px;clip-path:inset(11px round 7px)}.dlx .dlx-label{text-align:center}}
@media print{.dlx-qr{display:none}.dlx-badge:hover{transform:none;box-shadow:none}}

/* もともとカードの中に置く時(光など)は枠なしの軽い形 */
.dlx.dlx--plain{background:none;border:0;box-shadow:none;padding:6px 0 0;margin-top:8px}
.dlx.dlx--plain:before{display:none}
.dlx-qr summary{border-bottom-width:1px}
.dlx-qr{border:0;padding:0;margin-top:0;background:none}