:root{
  --cl99d-gold:#ffc107;
  --cl99d-green:#6ee7a2;
  --cl99d-blue:#69b7ff;
  --cl99d-panel:rgba(255,255,255,.035);
  --cl99d-border:rgba(255,255,255,.13);
}
.cl99d-panel{
  margin-top:16px;
  padding:16px;
  border:1px solid rgba(255,193,7,.28);
  border-radius:18px;
  background:linear-gradient(145deg,rgba(255,193,7,.07),rgba(255,255,255,.028));
}
.cl99d-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;margin-bottom:14px}
.cl99d-title{font-weight:900;color:#fff;font-size:1.05rem}
.cl99d-sub{margin-top:4px;color:rgba(255,255,255,.7);line-height:1.45}



.cl99d-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:14px}
.cl99d-card{min-width:0;padding:14px;border:1px solid var(--cl99d-border);border-radius:15px;background:rgba(7,10,15,.30)}
.cl99d-card h3{margin:0 0 12px;font-size:.98rem}
.cl99d-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:14px}
.cl99d-kpi{padding:12px;border:1px solid var(--cl99d-border);border-radius:13px;background:rgba(255,255,255,.026)}
.cl99d-kpi b{display:block;color:#fff;font-size:1.15rem}
.cl99d-kpi span{display:block;margin-top:3px;color:rgba(255,255,255,.62);font-size:.78rem}
.cl99d-heatmap{display:grid;grid-template-columns:repeat(7,minmax(18px,1fr));gap:6px}
.cl99d-day{
  aspect-ratio:1;border-radius:6px;border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.045);position:relative
}
.cl99d-day[data-level="1"]{background:rgba(255,193,7,.16)}
.cl99d-day[data-level="2"]{background:rgba(255,193,7,.34)}
.cl99d-day[data-level="3"]{background:rgba(255,193,7,.58)}
.cl99d-day[data-level="4"]{background:rgba(255,193,7,.88)}
.cl99d-day:hover::after{
  content:attr(data-tip);position:absolute;left:50%;bottom:110%;transform:translateX(-50%);
  white-space:nowrap;background:#111722;color:#fff;border:1px solid var(--cl99d-border);padding:6px 8px;border-radius:8px;font-size:.72rem;z-index:5
}
.cl99d-chart{display:flex;align-items:flex-end;gap:6px;height:120px;padding-top:12px}
.cl99d-bar{flex:1;min-width:8px;border-radius:7px 7px 3px 3px;background:linear-gradient(180deg,#ffe082,#ffc107,#b67800);height:var(--h,10%)}
.cl99d-topic{display:grid;grid-template-columns:minmax(90px,.7fr) minmax(0,1.3fr) auto;gap:10px;align-items:center;margin:10px 0}
.cl99d-topic-bar{height:8px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}
.cl99d-topic-bar i{display:block;height:100%;width:var(--w,0%);background:linear-gradient(90deg,#3fa7ff,#69b7ff,#b9ddff);border-radius:inherit}
.cl99d-topic em{font-style:normal;color:rgba(255,255,255,.65);font-size:.8rem}
.cl99d-streak{
  margin-top:12px;padding:12px;border-radius:13px;border:1px solid rgba(255,193,7,.25);
  background:rgba(255,193,7,.06);display:flex;justify-content:space-between;gap:12px;align-items:center
}
.cl99d-streak strong{color:#fff}
.cl99d-note{margin-top:10px;color:rgba(255,255,255,.62);font-size:.78rem;line-height:1.4}
@media(max-width:860px){.cl99d-grid{grid-template-columns:1fr}.cl99d-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.cl99d-head{display:block}.cl99d-kpis{grid-template-columns:1fr 1fr}.cl99d-topic{grid-template-columns:1fr}.cl99d-chart{height:90px}}