.cc-graph-wrap{
padding:120px 5%;
background:#050505;
}

.cc-graph-header{
max-width:900px;
margin-bottom:50px;
}

.cc-graph-header span{
color:#00FFB2;
font-size:12px;
letter-spacing:.2em;
}

.cc-graph-header h2{
font-size:58px;
color:#fff;
margin:20px 0;
}

.cc-graph-header p{
color:#8A97A6;
line-height:1.7;
}

.cc-graph-layout{
display:grid;
grid-template-columns:2fr 1fr;
gap:30px;
margin-bottom:40px;
}

.cc-graph-canvas-box,
.cc-card{
background:#101418;
border-radius:24px;
border:1px solid rgba(255,255,255,.06);
}

.cc-graph-canvas-box{
padding:20px;
}

#ccRightsCanvas{
width:100%;
height:500px;
display:block;
background:#070B0E;
border-radius:18px;
}

.cc-card{
padding:30px;
margin-bottom:24px;
}

.cc-card h3{
color:#fff;
margin-bottom:24px;
}

.cc-row{
display:flex;
justify-content:space-between;
margin-bottom:14px;
color:#B7C3CF;
}

.cc-row strong{
color:#fff;
}

.cc-badge{
padding:14px;
border-radius:14px;
margin-bottom:12px;
color:#fff;
}

.green{background:rgba(0,255,178,.15);}
.yellow{background:rgba(255,216,77,.15);}
.red{background:rgba(255,77,109,.15);}
.blue{background:rgba(0,217,255,.15);}

.cc-terminal{
background:#070B0E;
border-radius:24px;
overflow:hidden;
border:1px solid rgba(0,255,178,.12);
}

.cc-terminal-head{
background:#0C1014;
padding:18px 24px;
color:#00FFB2;
font-weight:bold;
}

.cc-terminal-body{
height:320px;
overflow-y:auto;
padding:24px;
font-family:monospace;
color:#B7C3CF;
}

.cc-log{
margin-bottom:12px;
}

@media(max-width:980px){
.cc-graph-layout{
grid-template-columns:1fr;
}

.cc-graph-header h2{
font-size:42px;
}
}