:root{
  --bg:#0f1115;
  --card:#141821;
  --card-elev:#182030;
  --muted:#9aa4b2;
  --text:#e6e9ef;
  --soft:#cfd6df;
  --accent:#ff2a2a;
  --accent-20:#ff2a2a14;
  --ok:#4cd964;
  --warn:#ffcc00;
  --bad:#ff5e57;
  --chip:#1b2130;
  --border:#232b3b;
  --shadow:0 10px 24px rgba(0,0,0,.35),0 2px 8px rgba(0,0,0,.3);
  --radius:14px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:linear-gradient(180deg,#0c0e13 0%, var(--bg) 420px);
  color:var(--text);
  font-family:"Roboto Condensed",system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue","Noto Sans",Arial,"Apple Color Emoji","Segoe UI Emoji";
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}

.rk-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px clamp(16px,4vw,40px);
  position:sticky;top:0;z-index:50;
  background:linear-gradient(180deg,rgba(15,17,21,.9),rgba(15,17,21,.65));
  backdrop-filter: blur(6px);
  border-bottom:1px solid var(--border);
}

.rk-logo{
  font-size:24px;font-weight:900;letter-spacing:.6px;color:var(--text);
  text-transform:uppercase;
}
.rk-logo span{color:var(--accent)}

.rk-header__right{display:flex;gap:8px;align-items:center}
.rk-badge{
  border:1px solid var(--border);
  background:var(--chip);
  padding:6px 10px;border-radius:999px;font-size:12px;color:var(--soft)
}
.rk-badge--muted{opacity:.9}

.rk-controls{
  display:grid;gap:12px;
  grid-template-columns: 1fr auto;
  grid-template-areas:
    "search actions"
    "tabs actions";
  padding:10px clamp(16px,4vw,40px) 0;
}
.rk-search{grid-area:search;display:flex;gap:8px}
.rk-search input{
  flex:1;
  border:1px solid var(--border);background:#0d111a;color:var(--text);
  padding:12px 14px;border-radius:12px;font-size:16px;outline:none;
  box-shadow: var(--shadow);
}
.rk-tabs{grid-area:tabs;display:flex;gap:8px;flex-wrap:wrap;padding-top:6px}
.rk-tab{
  border:1px solid var(--border);background:var(--chip);color:var(--soft);
  padding:10px 12px;border-radius:12px;cursor:pointer;font-weight:800;letter-spacing:.2px;
  transition: transform .08s ease, background .15s ease, border-color .15s ease, color .15s ease;
}
.rk-tab--active,.rk-tab:hover{color:var(--text);background:var(--accent-20);border-color:#2d364d}
.rk-tab:active{transform:translateY(1px)}
.rk-actions{grid-area:actions;display:flex;gap:8px;align-items:center}
.rk-btn{
  border:1px solid var(--border);background:var(--accent-20);color:var(--text);
  padding:10px 14px;border-radius:12px;cursor:pointer;font-weight:800;letter-spacing:.2px;
}
.rk-btn--ghost{background:transparent}

.rk-main{padding:18px clamp(16px,4vw,40px) 40px}
.rk-section{display:none}
.rk-section--active{display:block}

.rk-grid{
  display:grid;gap:18px;
  grid-template-columns: repeat(auto-fill,minmax(340px,1fr));
}

.rk-card{
  background:linear-gradient(180deg,var(--card) 0%, var(--card-elev) 100%);
  border:1px solid var(--border);border-radius:var(--radius);
  box-shadow: var(--shadow);
  overflow:hidden;display:flex;flex-direction:column;
  min-height: 120px;
}
.rk-card__head{
  display:flex;gap:14px;align-items:center;
  padding:12px 14px;border-bottom:1px solid var(--border);
  background:linear-gradient(180deg,rgba(255,42,42,0.06),transparent);
}
.rk-card__icon{
  width:52px;height:52px;border-radius:12px;overflow:hidden;flex:0 0 auto;
  background:#0c0f17;border:1px solid var(--border);display:flex;align-items:center;justify-content:center
}
.rk-card__icon img{width:100%;height:100%;object-fit:contain}
.rk-card__title{font-size:18px;font-weight:900;line-height:1.1}
.rk-chiprow{display:flex;gap:8px;flex-wrap:wrap;margin-top:2px}
.rk-chip{
  background:var(--chip);border:1px solid var(--border);color:var(--soft);
  padding:4px 8px;border-radius:999px;font-size:12px
}
.rk-chip--ok{color:#d3ffd8;border-color:#233b2a;background:rgba(76,217,100,.08)}
.rk-chip--warn{color:#fff5cc;border-color:#3a3214;background:rgba(255,204,0,.08)}
.rk-chip--bad{color:#ffd7d7;border-color:#3b1e1e;background:rgba(255,94,87,.08)}
.rk-chip--muted{opacity:.85}

/* destaque sutil para o chip de Chance */
.rk-chip--chance{
  border-color:#2a354b;
  background:rgba(255,255,255,.03);
  color:var(--soft);
}

.rk-card__body{padding:12px 14px 16px}

/* Meta grid — desaparece automaticamente se vier vazio */
.rk-meta{
  display:grid;gap:8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-bottom:8px
}
.rk-meta:empty{display:none}
.rk-meta .rk-meta__item{background:#0f1420;border:1px solid var(--border);border-radius:10px;padding:8px 10px}
.rk-meta .rk-meta__label{color:var(--muted);font-size:11px}
.rk-meta .rk-meta__value{font-weight:800;margin-top:3px}

/* Slots (individual) */
.rk-slots{display:flex;flex-direction:column;gap:10px}
details.rk-slot{
  background:#0e1320;border:1px solid var(--border);border-radius:12px;padding:8px 10px
}
.rk-slot summary{cursor:pointer;font-weight:900;letter-spacing:.2px;outline:none}
.rk-slot summary:focus-visible{outline:2px solid #2d364d;outline-offset:4px;border-radius:6px}

/* espaço extra quando há o bloco de meta (Chance) antes dos itens */
.rk-slot__meta{display:flex;gap:10px;flex-wrap:wrap;margin:6px 0 8px}
.rk-slot__meta .rk-chip{font-size:11px}

/* Weighted / branches / items */
.rk-weighted{margin:10px 0 4px;border-left:2px dashed #2d364d;padding-left:10px}
.rk-weighted__head{display:flex;align-items:center;gap:8px;margin-bottom:6px;color:var(--soft);font-weight:700}
.rk-weighted__list{display:flex;flex-direction:column;gap:8px}

.rk-branch{border:1px solid var(--border);border-radius:10px;padding:8px;background:#0b101b}
.rk-branch__label{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.rk-branch__label .rk-chip{font-size:11px}

.rk-items{display:grid;gap:8px;grid-template-columns: repeat(auto-fill,minmax(220px,1fr))}
.rk-item{
  display:flex;align-items:center;gap:8px;
  border:1px solid var(--border);border-radius:10px;padding:6px 8px;background:#0c1018
}
.rk-item__icon{width:28px;height:28px;flex:0 0 auto;background:#0a0d14;border:1px solid var(--border);border-radius:6px;display:flex;align-items:center;justify-content:center}
.rk-item__icon img{width:100%;height:100%;object-fit:contain}
.rk-item__name{font-weight:800}
.rk-item__amount{color:var(--muted);font-size:12px;margin-left:auto}

.rk-hidden{display:none !important}

/* ──────────────────────────────────────────────── */
/* Slot Group (Possible Loot) – polished styling   */
/* ──────────────────────────────────────────────── */

/* Hide default disclosure marker for consistent caret */
details > summary { list-style: none; }
details > summary::-webkit-details-marker { display: none; }

/* Group container matches card tiles */
details.rk-slotgroup{
  background:#0f1420;
  border:1px solid var(--border);
  border-radius:12px;
  padding:8px 10px;
  box-shadow: var(--shadow);
  margin-top:10px;
}

/* Summary row: caret + bold label + subtle divider */
details.rk-slotgroup > summary{
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:8px;
  font-weight:900;
  letter-spacing:.2px;
  color:var(--text);
  padding:2px 0 6px;
  transition: color .15s ease;
  outline: none;
}

details.rk-slotgroup > summary:hover{ color:#ffffff; }
details.rk-slotgroup > summary:focus-visible{
  outline:2px solid #2d364d;
  outline-offset:6px;
  border-radius:8px;
}

/* Caret (rotates when open) */
details.rk-slotgroup > summary::before{
  content:"▸";
  display:inline-block;
  transform: translateY(1px) rotate(0deg);
  transition: transform .15s ease;
  color:var(--soft);
  opacity:.9;
}
details.rk-slotgroup[open] > summary::before{
  transform: translateY(1px) rotate(90deg);
}

/* Divider under summary when content is visible */
details.rk-slotgroup[open] > summary{
  margin-bottom:6px;
  border-bottom:1px solid var(--border);
  padding-bottom:8px;
}

/* Inner list spacing */
details.rk-slotgroup .rk-slots{
  margin-top:2px;
  gap:10px;
}

/* Individual possibilities inside the group */
details.rk-slotgroup .rk-slot{
  background:#0e1320;
  border:1px solid var(--border);
  border-radius:10px;
  padding:8px 10px;
}

/* Possibility summary colors/states */
details.rk-slotgroup .rk-slot summary{
  font-weight:900;
  letter-spacing:.2px;
  color:var(--soft);
}
details.rk-slotgroup .rk-slot[open] summary{
  color:var(--text);
}

/* Touch targets on small screens + tighter grids */
@media (max-width: 680px){
  .rk-grid{ grid-template-columns: repeat(auto-fill,minmax(300px,1fr)) }
  .rk-items{ grid-template-columns: repeat(auto-fill,minmax(180px,1fr)) }
  details.rk-slotgroup > summary{ padding:8px 0 }
  details.rk-slotgroup[open] > summary{ padding-bottom:10px }
}

/* Quando a carta não tem meta (JS já evita criar mas garantimos) */
.rk-card__body:has(> .rk-meta:empty){
  padding-top:12px; /* mantém ritmo visual */
}