:root{ --kudo-brand:#672c86; --kudo-brand-hover:#541874; --kudo-text:#fff; --kudo-text-dim:#d6d6e0; --kudo-divider:#ffffff80; --kudo-meta-sep:#00000060; --flag-size:34px; }
.kudo-hc-grid{ display:grid; gap:12px; grid-template-columns:repeat(2, minmax(0, 1fr)); }
@media (min-width: 1024px){ .kudo-hc-grid{ grid-template-columns:repeat(4, minmax(0, 1fr)); gap:16px; } }
.kudo-hc-card{ display:flex; flex-direction:column; gap:8px; background:var(--kudo-brand); color:var(--kudo-text); border-radius:16px; padding:10px; text-decoration:none; box-shadow:0 10px 24px rgba(0,0,0,.16); transition:transform .15s, box-shadow .15s, background .2s; cursor:pointer; }
.kudo-hc-card:hover{ transform:translateY(-1px); box-shadow:0 12px 26px rgba(0,0,0,.22); background:var(--kudo-brand-hover); }
.kudo-hc-header{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.kudo-hc-name{ font-weight:800; font-size:16px; line-height:1.1; word-break:break-word; color:var(--kudo-text); }
.kudo-hc-mini-chips{ display:flex; gap:6px; flex-wrap:wrap; }
.kudo-mini-chip{ background:#ffffff10; border:1px solid #ffffff40; border-radius:999px; font-size:10px; padding:2px 7px; font-weight:700; letter-spacing:.2px; color:#fff; display:inline-flex; align-items:center; }
.kudo-mini-chip .dot{ width:8px; height:8px; border-radius:50%; background:#31c24a; display:inline-block; margin-right:6px; }
.kudo-hc-midrow{ display:grid; grid-template-columns:var(--flag-size) 1px 1fr; align-items:center; gap:8px; }
.kudo-hc-flag{ width:var(--flag-size); height:var(--flag-size); border-radius:50%; background-size:cover; background-position:center; background-repeat:no-repeat; }
.kudo-hc-divider{ width:1px; background:var(--kudo-divider); align-self:stretch; }
.kudo-hc-data{ text-align:right; white-space:nowrap; }
.kudo-hc-data-amount{ font-weight:900; font-size:20px; }
@media (min-width: 1024px){ .kudo-hc-data-amount{ font-size:40px; } }
.kudo-hc-meta{ margin-top:auto; display:grid; grid-template-columns:1fr 1px 1fr; gap:6px; align-items:center; }
.kudo-hc-meta-col{ text-align:center; }
.kudo-hc-meta-value{ font-weight:800; font-size:16px; line-height:1.1; color:var(--kudo-text); }
.kudo-hc-meta-label{ color:var(--kudo-text-dim); font-size:10px; }
.kudo-hc-meta-sep{ width:1px; height:18px; background:var(--kudo-meta-sep); }
@media (min-width: 1024px){ .kudo-hc-meta-value{ font-size:30px; } .kudo-hc-meta-label{ font-size:18px; } }
.kudo-hc-empty{ background:transparent; padding:12px; color:#333; border-radius:12px; }
/* Modal with icons */
.kudo-modal{ position:fixed; inset:0; display:none; align-items:center; justify-content:center; z-index:9999; }
.kudo-modal[aria-hidden="false"]{ display:flex; }
.kudo-modal__overlay{ position:absolute; inset:0; background:#00000066; }
.kudo-modal__content{ position:relative; background:#fff; color:#111; border-radius:14px; padding:18px; width:min(92vw, 420px); box-shadow:0 10px 30px rgba(0,0,0,.3); }
.kudo-ico{ margin-right:8px; }
.kudo-modal__title{ font-weight:800; font-size:18px; margin:0 0 12px 0; }
.kudo-modal__actions{ display:flex; gap:10px; }
.kudo-btn{ flex:1; display:inline-flex; align-items:center; justify-content:center; padding:10px 12px; border-radius:12px; text-decoration:none; font-weight:700; border:1px solid #ddd; color:#111; background:#f7f7f9; }
.kudo-btn--primary{ background:#541874; color:#fff; border-color:#541874; }
.kudo-modal__close{ position:absolute; top:6px; right:8px; background:transparent; border:0; font-size:24px; line-height:1; cursor:pointer; }
.kudo-modal__close {
  color: #541874 !important;
  font-weight: 900;
  font-size: 24px;
  background: transparent !important;
  border: none !important;
}