.ccard{background:var(--surface);border:1px solid var(--border);border-radius:14px;flex-direction:column;gap:12px;padding:18px;transition:box-shadow .18s,transform .18s,border-color .18s;display:flex;position:relative;overflow:hidden}.ccard:hover{border-color:var(--border2);transform:translateY(-2px);box-shadow:0 6px 20px #0d1b2a14}.ccard.is-selected{border-color:#e8c5478c}.ccard-accent{height:2px;position:absolute;top:0;left:0;right:0}.ccard-head{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.ccard-title{color:var(--text);margin:0;font-size:14px;font-weight:500;line-height:1.3}.ccard-fee{text-align:right;flex-shrink:0}.ccard-fee-amount{color:var(--text);font-size:16px;font-weight:700;font-family:var(--font-serif);white-space:nowrap}.ccard-fee-free{color:var(--green);font-size:14px;font-weight:700;font-family:var(--font-serif)}.ccard-fee-variant{color:var(--amber);max-width:130px;font-size:12px;font-weight:600;line-height:1.3}.ccard-fee-label{color:var(--text2);margin-top:2px;font-size:10px}.ccard-tags{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.issuer-badge{background:var(--surface-2);border:1px solid var(--border2);color:var(--text2);white-space:nowrap;border-radius:999px;padding:3px 10px;font-size:11px;font-weight:600;display:inline-flex}.ccard.is-discontinued{border-color:var(--red-border);background:linear-gradient(0deg, #991b1b09, #991b1b09), var(--surface)}.ccard.is-discontinued:after{content:"";background:var(--red);width:4px;position:absolute;top:0;bottom:0;left:0}.ccard.is-discontinued .ccard-mid,.ccard.is-discontinued .ccard-benefits,.ccard.is-discontinued .ccard-cashback,.ccard.is-discontinued .issuer-badge{opacity:.5;filter:grayscale(.45)}.ccard-mid{justify-content:space-between;align-items:center;gap:12px;display:flex}.ccard-descriptor{color:var(--text2);flex:1;margin:0;font-size:11px;line-height:1.5}.ccard-benefits{flex-wrap:wrap;gap:6px;display:flex}.benefit-chip{color:var(--green);background:var(--green-bg);border:1px solid var(--green-border);border-radius:999px;align-items:center;padding:3px 10px;font-size:11px;font-weight:600;display:inline-flex}.ccard-cashback{color:var(--text2);margin:0;font-size:12px;line-height:1.45}.ccard-actions{gap:8px;margin-top:auto;display:flex}.ccard-btn{cursor:pointer;border-radius:9px;flex:1;justify-content:center;align-items:center;height:38px;padding:0 14px;font-family:inherit;font-size:13px;font-weight:600;transition:background .15s,border-color .15s,color .15s;display:inline-flex}.ccard-btn--primary{background:var(--ink);color:var(--on-dark);border:1px solid var(--ink)}.ccard-btn--primary:hover{background:var(--prussian)}.ccard-btn--secondary{background:var(--surface);color:var(--text);border:1px solid var(--border2)}.ccard-btn--secondary:hover{background:var(--surface-2);border-color:var(--ink)}.ccard-btn--selected{background:var(--accent);color:var(--accent-ink);border:1px solid var(--accent)}.ccard-btn--selected:hover{background:var(--accent2)}.ccard-btn:disabled{opacity:.45;cursor:not-allowed}.ccard-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media (prefers-reduced-motion:reduce){.ccard,.ccard-btn{transition:none}.ccard:hover{transform:none}}
.discontinued-flag{background:var(--red);color:#fff;letter-spacing:.06em;text-transform:uppercase;border-radius:999px;align-items:center;gap:6px;padding:3px 10px;font-size:10px;font-weight:800;display:inline-flex}.discontinued-flag:before{content:"●";font-size:7px}.closed-flag{background:var(--amber-bg);border:1px solid var(--amber-border);color:var(--amber);letter-spacing:.01em;white-space:nowrap;border-radius:999px;align-items:center;gap:5px;padding:3px 10px;font-size:10.5px;font-weight:600;display:inline-flex}.closed-flag:before{content:"";background-color:currentColor;flex-shrink:0;width:9px;height:9px;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='11' width='16' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='11' width='16' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E");-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.status-note{color:var(--text2);margin:0;font-size:12px;line-height:1.55}.status-note--closed{background:var(--amber-bg);border:1px solid var(--amber-border);color:var(--amber);border-radius:8px;padding:10px 12px}.status-note--discontinued{background:var(--red-bg);border:1px solid var(--red-border);color:var(--red);border-radius:8px;padding:10px 12px}