#commandMenu{
    position:fixed;
    top:120px;
    left:50%;
    transform:translate(-50%, -10px) scale(.96);
    width:520px;

    background:var(--panel);

    border-radius:10px;

    box-shadow:0 10px 40px rgba(0,0,0,.6);

    display:flex;
    flex-direction:column;

    overflow:hidden;

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

    opacity:0;
    pointer-events:none;

    transition:
    opacity .18s ease,
    transform .18s ease;
}



#commandMenu.open{
    opacity:1;
    pointer-events:auto;
    transform:translate(-50%,0) scale(1);
}



#commandInput{

    background:var(--panel);

    border:none;
    outline:none;

    padding:14px 16px;

    font-size:16px;

    color:var(--text);

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

    font-family:monospace;
}



#commandInput::placeholder{
    color:var(--muted);
}



#commandList{
    max-height:400px;
    overflow-y:auto;
}



.cmd{

    padding:12px 16px;

    color:var(--text);

    cursor:pointer;

    font-size:15px;

    display:flex;
    align-items:center;
    gap:12px;

    transition:background .12s ease,color .12s ease;

}



.cmd:hover{

    background:var(--border);

    color:var(--text);

}



.cmd.active{

    background:var(--accent);

    color:var(--bg);

}



.icon{

    width:18px;

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

    opacity:.7;

    font-size:14px;

}

.menu-btn{


width:40px;
height:40px;

border-radius:8px;

background:var(--menu-bg);

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

font-size:20px;

cursor:pointer;

z-index:200;

}

