*{
margin:0;
padding:0;
box-sizing:border-box;
}

:root{

--bg:#0d1117;
--card:#161b22;
--border:#30363d;
--cyan:#00F2FE;
--text:#c9d1d9;
--gray:#8b949e;

}

html,body{

width:100%;
height:100%;
background:var(--bg);
font-family:Segoe UI,sans-serif;
overflow:hidden;

}

#app{

display:flex;
height:100vh;
background:var(--bg);

}

#sidebar{

width:265px;
background:var(--card);
border-right:1px solid var(--border);

display:flex;
flex-direction:column;

}

#main{

flex:1;
display:flex;
flex-direction:column;

}

#topbar{

height:70px;
background:#11161d;

border-bottom:1px solid var(--border);

display:flex;
align-items:center;
justify-content:flex-end;

padding:0 30px;

}

#content{

flex:1;

padding:35px;

overflow:auto;

background:var(--bg);

}