.amount{width:104px;height:104px;display:grid;place-items:center;border-radius:50%;font-size:31px;letter-spacing:-1px;margin-top:30px;background:#edf6ee;color:var(--accent);border:1px solid #0f654833;box-shadow:inset 0 0 0 7px #ffffff80}.amount[data-discount="5"]{background:#fff7d7;color:#967100;transform:rotate(-4deg)}.amount[data-discount="10"]{background:#e8f5ee;color:#0f6548;transform:rotate(3deg)}.amount[data-discount="15"]{background:#eaf1ff;color:#2863a9;transform:rotate(-3deg)}.amount[data-discount="20"]{background:#f2eaff;color:#7551a1;transform:rotate(4deg)}.amount[data-discount="25"],.amount[data-discount="30"],.amount[data-discount="40"],.amount[data-discount="50"],.amount[data-discount="60"],.amount[data-discount="70"]{width:116px;height:116px;background:#d9f56b;color:#0a4935;font-size:34px;box-shadow:inset 0 0 0 8px #ffffff70}.premium-badge{font-size:11px;font-weight:800;letter-spacing:.3px;color:#8c6710;background:#fff5c9;border:1px solid #e7c85b;border-radius:999px;padding:7px 10px;white-space:nowrap}.card.premium{border-color:#dfc65e;box-shadow:0 12px 30px #9d76151a}

.amount.discount-other{width:auto;max-width:100%;height:auto;min-height:72px;padding:16px;border-radius:20px;font-size:24px;letter-spacing:0;overflow-wrap:anywhere;text-align:center}

/* Shared grid tracks align every card in a row, including optional actions. */
.card{display:grid;grid-template-rows:subgrid;grid-row:span 7;row-gap:0}
.card-top{align-content:start;justify-content:flex-start;gap:10px;padding-bottom:8px}
.brand-identity{display:flex;align-items:center;gap:12px;width:100%;min-height:60px}
.brand-logo{width:100px;height:56px;object-fit:contain;flex-shrink:0;background:white;border-radius:8px}
.card .amount{width:104px;height:104px;font-size:31px;transform:none;margin-top:18px}
.card .amount.discount-other{width:100%;height:auto;min-height:104px;font-size:24px}
.card h4{margin:18px 0 10px}.card .detail{margin:0 0 20px;align-self:start}
.detail summary{cursor:pointer;text-decoration:underline;text-underline-offset:4px;min-height:44px;display:list-item;padding:8px 0}
.detail p{margin:8px 0;line-height:1.55}.coupon-slot{align-self:end}.coupon-slot:empty{min-height:50px}
.card .visit{align-self:end;margin-top:12px}.video-slot{min-height:34px;text-align:center;padding-top:12px}.video-slot .video{display:inline-block;margin:0}
@supports not (grid-template-rows:subgrid){.card{display:flex}.card-top{min-height:112px}.card h4{min-height:52px}.card .detail{flex:1}.video-slot{min-height:34px}}
@media(max-width:650px){.card{grid-row:auto;grid-template-rows:auto}.coupon-slot:empty,.video-slot:empty{display:none}.brand-identity{min-height:56px}}

/* Logo first; compact discount sits beside it without covering the artwork. */
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.card-top{min-height:34px;padding:0;align-items:center;align-content:start}
.brand-visual{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:138px;padding:18px 0 8px}
.brand-visual .brand-identity{flex:1;min-width:0;width:auto;min-height:92px;justify-content:center}
.brand-visual .brand-logo{width:100%;max-width:170px;height:92px;object-fit:contain;border-radius:0}
.card .brand-visual .amount{flex-shrink:0;width:68px;height:68px;min-height:68px;margin:0;font-size:23px;font-weight:750;letter-spacing:-1px;box-shadow:inset 0 0 0 4px #ffffff80}
.card .brand-visual .amount.discount-other{width:96px;height:auto;min-height:68px;padding:10px;border-radius:16px;font-size:16px;letter-spacing:0}
@media(max-width:360px){.brand-visual{gap:10px}.card .brand-visual .amount{width:60px;height:60px;min-height:60px;font-size:21px}}