:root{
  --csmcc-bg:#000;
  --csmcc-text:#fff;
  --csmcc-accent:#BC7E07;
}
#csmcc-banner{
  position:fixed;left:0;right:0;
  background:var(--csmcc-bg);
  color:var(--csmcc-text);
  z-index:9999999;
  padding:14px 10px;
  box-shadow:0 -2px 10px rgba(0,0,0,.35);
  font-family:system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}
#csmcc-banner.csmcc-top{top:0}
#csmcc-banner.csmcc-bottom{bottom:0}
#csmcc-banner .csmcc-inner{max-width:1200px;margin:0 auto;display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap}
#csmcc-banner .csmcc-text{flex:1;min-width:260px}
#csmcc-banner .csmcc-actions{display:flex;gap:8px}
.csmcc-btn{
  border:1px solid var(--csmcc-accent);
  background:transparent;
  color:var(--csmcc-text);
  padding:8px 12px;
  border-radius:12px;
  cursor:pointer;
  transition:.2s ease;
}
.csmcc-btn:hover{
  background:var(--csmcc-accent);
  color:#000;
}
.csmcc-modal{
  position:fixed;inset:0;background:rgba(0,0,0,.55);
  display:flex;align-items:center;justify-content:center;
  z-index:10000000;
  font-family:system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}
.csmcc-modal-content{
  background:#111;
  color:#fff;
  width:min(92vw,680px);
  border-radius:16px;
  padding:20px;
  border:1px solid var(--csmcc-accent);
  box-shadow:0 10px 30px rgba(0,0,0,.5);
}
.csmcc-modal-title{margin:0 0 10px 0}
.csmcc-categories{display:grid;gap:10px;margin:12px 0}
.csmcc-cat{display:flex;align-items:center;gap:10px}
.csmcc-modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:12px}
@media (max-width:600px){
  #csmcc-banner .csmcc-actions{width:100%;justify-content:flex-end}
}